From bd18d747175491ecd65d134ced65654a9ceecd8a Mon Sep 17 00:00:00 2001
From: Alessandro Casazza <acasazza@commercelayer.io>
Date: Fri, 22 May 2026 15:57:09 +0200
Subject: [PATCH 01/10] =?UTF-8?q?=E2=9C=A8=20feat(stories):=20add=20Hosted?=
 =?UTF-8?q?Cart=20stories=20in=20document=20package?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Add DocsPage with ArgTypes, Source and 4 Canvas stories:
- Default (inline cart iframe)
- MiniCart (slide-in panel with open control)
- MiniCartOpenAdd (auto-opens on AddToCartButton)
- CustomDomain

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
---
 .../src/stories/cart/HostedCart.stories.tsx   | 227 ++++++++++++++++++
 1 file changed, 227 insertions(+)
 create mode 100644 packages/document/src/stories/cart/HostedCart.stories.tsx

diff --git a/packages/document/src/stories/cart/HostedCart.stories.tsx b/packages/document/src/stories/cart/HostedCart.stories.tsx
new file mode 100644
index 00000000..996cab60
--- /dev/null
+++ b/packages/document/src/stories/cart/HostedCart.stories.tsx
@@ -0,0 +1,227 @@
+import { HostedCart, Order } from "@commercelayer/react-components"
+import { ArgTypes, Canvas, Source } from "@storybook/addon-docs/blocks"
+import type { Meta, StoryObj } from "@storybook/react-vite"
+import CommerceLayer from "../_internals/CommerceLayer"
+import {
+  AddSampleItems,
+  OrderStorage as OrderStorageHelper,
+} from "../_internals/OrderStorage"
+
+function HostedCartDocsPage(): JSX.Element {
+  return (
+    <>
+      <h1>HostedCart</h1>
+      <p>
+        <code>{"<HostedCart>"}</code> embeds the Commerce Layer hosted cart
+        micro-frontend as an <code>{"<iframe>"}</code> inside your page. It
+        automatically resolves the cart URL from the access token and the current
+        order.
+      </p>
+      <p>
+        By default it renders as an <strong>inline cart</strong> — the iframe
+        fills the available container width while the height adjusts to its
+        content. Set <code>type="mini"</code> to switch to a{" "}
+        <strong>slide-in mini cart</strong> panel.
+      </p>
+      <span title="Usage" type="info">
+        <p>
+          Must be a child of <code>{"<Order>"}</code> (wrapped in{" "}
+          <code>{"<OrderStorage>"}</code>). Requires a parent{" "}
+          <code>{"<CommerceLayer>"}</code> context for the access token.
+        </p>
+      </span>
+      <ArgTypes />
+      <Source
+        language="jsx"
+        dark
+        code={`
+import {
+  CommerceLayer,
+  OrderStorage,
+  Order,
+  HostedCart,
+} from '@commercelayer/react-components'
+
+// Inline cart
+<CommerceLayer accessToken="...">
+  <OrderStorage persistKey="my-cart">
+    <Order>
+      <HostedCart />
+    </Order>
+  </OrderStorage>
+</CommerceLayer>
+
+// Mini cart (slide-in panel)
+<CommerceLayer accessToken="...">
+  <OrderStorage persistKey="my-cart">
+    <Order>
+      <HostedCart type="mini" open={isOpen} handleOpen={() => setIsOpen(o => !o)} />
+    </Order>
+  </OrderStorage>
+</CommerceLayer>
+`}
+      />
+      <hr />
+      <h2>Default — inline cart</h2>
+      <p>
+        Renders as an inline <code>{"<iframe>"}</code> that fills the container
+        width. The height adjusts automatically to the cart content via{" "}
+        <code>iframe-resizer</code>.
+      </p>
+      <Canvas of={Default} />
+      <hr />
+      <h2>Mini cart</h2>
+      <p>
+        Set <code>type="mini"</code> to render a fixed slide-in panel. Use the{" "}
+        <code>open</code> prop to control visibility and{" "}
+        <code>handleOpen</code> to toggle it from outside. Toggle{" "}
+        <code>open</code> in the Controls panel below to preview.
+      </p>
+      <Canvas of={MiniCart} />
+      <hr />
+      <h2>Mini cart — auto-open on add to cart</h2>
+      <p>
+        Set <code>openAdd</code> to <code>true</code> (requires{" "}
+        <code>type="mini"</code>) so the panel opens automatically whenever an
+        item is added via <code>{"<AddToCartButton>"}</code>.
+      </p>
+      <Canvas of={MiniCartOpenAdd} />
+      <hr />
+      <h2>Custom domain</h2>
+      <p>
+        Use <code>customDomain</code> to point to a forked cart application
+        instead of the default Commerce Layer hosted micro-frontend.
+      </p>
+      <Canvas of={CustomDomain} />
+    </>
+  )
+}
+
+const meta = {
+  title: "Components/Cart/HostedCart",
+  component: HostedCart,
+  parameters: {
+    docs: {
+      page: HostedCartDocsPage,
+    },
+  },
+  argTypes: {
+    type: {
+      control: "select",
+      options: [undefined, "mini"],
+      description:
+        'Rendering mode. Leave `undefined` for an inline cart iframe, or set to `"mini"` for a fixed slide-in panel.',
+    },
+    open: {
+      control: "boolean",
+      description:
+        "Controls whether the mini cart panel is open. Only applies when `type=\"mini\"`.",
+    },
+    openAdd: {
+      control: "boolean",
+      description:
+        'Automatically opens the mini cart when an item is added via `<AddToCartButton>`. Only applies when `type="mini"`.',
+    },
+    handleOpen: {
+      control: false,
+      description:
+        'Callback fired when the background overlay or close icon is clicked. Use this to sync `open` state from outside. Only applies when `type="mini"`.',
+    },
+    customDomain: {
+      control: "text",
+      description:
+        "Domain of a forked cart application. Overrides the default `<slug>.commercelayer.app` hostname.",
+    },
+    style: {
+      control: "object",
+      description:
+        "Style overrides for each part of the component. Accepts an object with keys `cart`, `container`, `background`, `icon`, and `iconContainer` — each a `CSSProperties` object.",
+    },
+  },
+} satisfies Meta<typeof HostedCart>
+
+export default meta
+type Story = StoryObj<typeof meta>
+
+function Wrapper({ children }: { children: React.ReactNode }) {
+  return (
+    <CommerceLayer accessToken="my-access-token">
+      <OrderStorageHelper persistKey="cl-examples-hostedCart">
+        <Order>{children}</Order>
+      </OrderStorageHelper>
+    </CommerceLayer>
+  )
+}
+
+/**
+ * The default inline cart renders an `<iframe>` that fills the container width.
+ * The iframe height is managed automatically by `iframe-resizer`.
+ */
+export const Default: Story = {
+  name: "Default — inline cart",
+  args: {},
+  render: (args) => (
+    <Wrapper>
+      <HostedCart {...args} />
+    </Wrapper>
+  ),
+}
+
+/**
+ * Set `type="mini"` to render a fixed slide-in panel. Toggle the `open` control
+ * to preview the open and closed states. In a real app, bind `open` and
+ * `handleOpen` to local state:
+ *
+ * ```tsx
+ * const [isOpen, setIsOpen] = useState(false)
+ * <HostedCart type="mini" open={isOpen} handleOpen={() => setIsOpen(o => !o)} />
+ * ```
+ */
+export const MiniCart: Story = {
+  name: "Mini cart",
+  args: {
+    type: "mini",
+    open: false,
+  },
+  render: (args) => (
+    <Wrapper>
+      <HostedCart {...args} />
+    </Wrapper>
+  ),
+}
+
+/**
+ * When `openAdd` is `true` the mini cart panel opens automatically after an
+ * item is successfully added to the order via `<AddToCartButton>`. Click the
+ * button below to trigger the flow.
+ */
+export const MiniCartOpenAdd: Story = {
+  name: "Mini cart — auto-open on add",
+  args: {
+    type: "mini",
+    openAdd: true,
+    open: false,
+  },
+  render: (args) => (
+    <Wrapper>
+      <AddSampleItems />
+      <HostedCart {...args} />
+    </Wrapper>
+  ),
+}
+
+/**
+ * Pass `customDomain` to load a self-hosted or forked cart application
+ * instead of the default Commerce Layer hosted micro-frontend.
+ */
+export const CustomDomain: Story = {
+  name: "Custom domain",
+  args: {
+    customDomain: "cart.my-store.com",
+  },
+  render: (args) => (
+    <Wrapper>
+      <HostedCart {...args} />
+    </Wrapper>
+  ),
+}

From c3c24cbe8ecbc4c13fcc5b122b82dbac8da3067c Mon Sep 17 00:00:00 2001
From: Alessandro Casazza <acasazza@commercelayer.io>
Date: Fri, 22 May 2026 16:05:20 +0200
Subject: [PATCH 02/10] =?UTF-8?q?=F0=9F=90=9B=20fix(HostedCart):=20export?=
 =?UTF-8?q?=20from=20index,=20fix=20accessToken=20closure=20narrowing,=20r?=
 =?UTF-8?q?emove=20stale=20ts-expect-error?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Add HostedCart to packages/react-components/src/index.ts exports
- Capture accessToken as const token: string after null guard so closures see the narrowed type
- Remove unused @ts-expect-error on iframeResizer onMessage (type now resolves correctly)

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
---
 .../src/components/orders/HostedCart.tsx           | 14 ++++++--------
 packages/react-components/src/index.ts             |  1 +
 2 files changed, 7 insertions(+), 8 deletions(-)

diff --git a/packages/react-components/src/components/orders/HostedCart.tsx b/packages/react-components/src/components/orders/HostedCart.tsx
index 58715bba..ecaa2126 100644
--- a/packages/react-components/src/components/orders/HostedCart.tsx
+++ b/packages/react-components/src/components/orders/HostedCart.tsx
@@ -170,19 +170,20 @@ export function HostedCart({
 
   if (accessToken == null) return null
 
-  const slug = jwt(accessToken).organization.slug
+  const token: string = accessToken
+  const slug = jwt(token).organization.slug ?? ""
 
   async function resolveCartUrl(orderId: string): Promise<string> {
     const config = await getOrganizationConfig({
-      accessToken,
-      params: { orderId, accessToken, slug },
+      accessToken: token,
+      params: { orderId, accessToken: token, slug },
     })
     return (
       config?.links?.cart ??
       getApplicationLink({
         slug,
         orderId,
-        accessToken,
+        accessToken: token,
         domain: DEFAULT_DOMAIN,
         applicationType: "cart",
         customDomain,
@@ -192,7 +193,7 @@ export function HostedCart({
 
   async function setOrder(openCart?: boolean): Promise<void> {
     const orderId = localStorage.getItem(persistKey) ?? (await createOrder({}))
-    if (orderId != null && accessToken) {
+    if (orderId != null) {
       loadedOrderIdRef.current = orderId
       setSrc(await resolveCartUrl(order?.id ?? orderId))
       if (openCart) {
@@ -255,14 +256,12 @@ export function HostedCart({
     if (
       src == null &&
       resolvedOrderId == null &&
-      accessToken != null &&
       !ignore &&
       isOpen
     ) {
       setOrder()
     } else if (
       resolvedOrderId != null &&
-      accessToken &&
       (src == null || loadedOrderIdRef.current !== resolvedOrderId)
     ) {
       resolveCartUrl(resolvedOrderId).then((url) => {
@@ -288,7 +287,6 @@ export function HostedCart({
     iframeResizer(
       {
         checkOrigin: false,
-        // @ts-expect-error No types available
         onMessage,
       },
       ref.current,
diff --git a/packages/react-components/src/index.ts b/packages/react-components/src/index.ts
index 56f4159d..806e0579 100644
--- a/packages/react-components/src/index.ts
+++ b/packages/react-components/src/index.ts
@@ -49,6 +49,7 @@ export * from "#components/orders/AddToCartButton"
 export * from "#components/orders/AdjustmentAmount"
 export * from "#components/orders/CartLink"
 export * from "#components/orders/CheckoutLink"
+export * from "#components/orders/HostedCart"
 export * from "#components/orders/DiscountAmount"
 export * from "#components/orders/GiftCardAmount"
 export * from "#components/orders/Order"

From 00b109e3b3c5b589c085c18a69e1d9a14cf33e67 Mon Sep 17 00:00:00 2001
From: Alessandro Casazza <acasazza@commercelayer.io>
Date: Fri, 22 May 2026 16:12:46 +0200
Subject: [PATCH 03/10] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20refactor(stories):?=
 =?UTF-8?q?=20extract=20MiniCart=20into=20its=20own=20story=20file?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Remove MiniCart and MiniCartOpenAdd stories from HostedCart.stories.tsx
- Create MiniCart.stories.tsx under Components/Cart/MiniCart with its own DocsPage
  - Default story (open toggle via Controls)
  - OpenOnAdd story (auto-open with AddSampleItems trigger)

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
---
 .../src/stories/cart/HostedCart.stories.tsx   | 100 +---------
 .../src/stories/cart/MiniCart.stories.tsx     | 172 ++++++++++++++++++
 2 files changed, 175 insertions(+), 97 deletions(-)
 create mode 100644 packages/document/src/stories/cart/MiniCart.stories.tsx

diff --git a/packages/document/src/stories/cart/HostedCart.stories.tsx b/packages/document/src/stories/cart/HostedCart.stories.tsx
index 996cab60..a17263ac 100644
--- a/packages/document/src/stories/cart/HostedCart.stories.tsx
+++ b/packages/document/src/stories/cart/HostedCart.stories.tsx
@@ -2,10 +2,7 @@ import { HostedCart, Order } from "@commercelayer/react-components"
 import { ArgTypes, Canvas, Source } from "@storybook/addon-docs/blocks"
 import type { Meta, StoryObj } from "@storybook/react-vite"
 import CommerceLayer from "../_internals/CommerceLayer"
-import {
-  AddSampleItems,
-  OrderStorage as OrderStorageHelper,
-} from "../_internals/OrderStorage"
+import { OrderStorage as OrderStorageHelper } from "../_internals/OrderStorage"
 
 function HostedCartDocsPage(): JSX.Element {
   return (
@@ -20,8 +17,8 @@ function HostedCartDocsPage(): JSX.Element {
       <p>
         By default it renders as an <strong>inline cart</strong> — the iframe
         fills the available container width while the height adjusts to its
-        content. Set <code>type="mini"</code> to switch to a{" "}
-        <strong>slide-in mini cart</strong> panel.
+        content. For the slide-in panel variant, see{" "}
+        <strong>Components/Cart/MiniCart</strong>.
       </p>
       <span title="Usage" type="info">
         <p>
@@ -42,7 +39,6 @@ import {
   HostedCart,
 } from '@commercelayer/react-components'
 
-// Inline cart
 <CommerceLayer accessToken="...">
   <OrderStorage persistKey="my-cart">
     <Order>
@@ -50,15 +46,6 @@ import {
     </Order>
   </OrderStorage>
 </CommerceLayer>
-
-// Mini cart (slide-in panel)
-<CommerceLayer accessToken="...">
-  <OrderStorage persistKey="my-cart">
-    <Order>
-      <HostedCart type="mini" open={isOpen} handleOpen={() => setIsOpen(o => !o)} />
-    </Order>
-  </OrderStorage>
-</CommerceLayer>
 `}
       />
       <hr />
@@ -70,23 +57,6 @@ import {
       </p>
       <Canvas of={Default} />
       <hr />
-      <h2>Mini cart</h2>
-      <p>
-        Set <code>type="mini"</code> to render a fixed slide-in panel. Use the{" "}
-        <code>open</code> prop to control visibility and{" "}
-        <code>handleOpen</code> to toggle it from outside. Toggle{" "}
-        <code>open</code> in the Controls panel below to preview.
-      </p>
-      <Canvas of={MiniCart} />
-      <hr />
-      <h2>Mini cart — auto-open on add to cart</h2>
-      <p>
-        Set <code>openAdd</code> to <code>true</code> (requires{" "}
-        <code>type="mini"</code>) so the panel opens automatically whenever an
-        item is added via <code>{"<AddToCartButton>"}</code>.
-      </p>
-      <Canvas of={MiniCartOpenAdd} />
-      <hr />
       <h2>Custom domain</h2>
       <p>
         Use <code>customDomain</code> to point to a forked cart application
@@ -106,27 +76,6 @@ const meta = {
     },
   },
   argTypes: {
-    type: {
-      control: "select",
-      options: [undefined, "mini"],
-      description:
-        'Rendering mode. Leave `undefined` for an inline cart iframe, or set to `"mini"` for a fixed slide-in panel.',
-    },
-    open: {
-      control: "boolean",
-      description:
-        "Controls whether the mini cart panel is open. Only applies when `type=\"mini\"`.",
-    },
-    openAdd: {
-      control: "boolean",
-      description:
-        'Automatically opens the mini cart when an item is added via `<AddToCartButton>`. Only applies when `type="mini"`.',
-    },
-    handleOpen: {
-      control: false,
-      description:
-        'Callback fired when the background overlay or close icon is clicked. Use this to sync `open` state from outside. Only applies when `type="mini"`.',
-    },
     customDomain: {
       control: "text",
       description:
@@ -167,49 +116,6 @@ export const Default: Story = {
   ),
 }
 
-/**
- * Set `type="mini"` to render a fixed slide-in panel. Toggle the `open` control
- * to preview the open and closed states. In a real app, bind `open` and
- * `handleOpen` to local state:
- *
- * ```tsx
- * const [isOpen, setIsOpen] = useState(false)
- * <HostedCart type="mini" open={isOpen} handleOpen={() => setIsOpen(o => !o)} />
- * ```
- */
-export const MiniCart: Story = {
-  name: "Mini cart",
-  args: {
-    type: "mini",
-    open: false,
-  },
-  render: (args) => (
-    <Wrapper>
-      <HostedCart {...args} />
-    </Wrapper>
-  ),
-}
-
-/**
- * When `openAdd` is `true` the mini cart panel opens automatically after an
- * item is successfully added to the order via `<AddToCartButton>`. Click the
- * button below to trigger the flow.
- */
-export const MiniCartOpenAdd: Story = {
-  name: "Mini cart — auto-open on add",
-  args: {
-    type: "mini",
-    openAdd: true,
-    open: false,
-  },
-  render: (args) => (
-    <Wrapper>
-      <AddSampleItems />
-      <HostedCart {...args} />
-    </Wrapper>
-  ),
-}
-
 /**
  * Pass `customDomain` to load a self-hosted or forked cart application
  * instead of the default Commerce Layer hosted micro-frontend.
diff --git a/packages/document/src/stories/cart/MiniCart.stories.tsx b/packages/document/src/stories/cart/MiniCart.stories.tsx
new file mode 100644
index 00000000..55cb232f
--- /dev/null
+++ b/packages/document/src/stories/cart/MiniCart.stories.tsx
@@ -0,0 +1,172 @@
+import { HostedCart, Order } from "@commercelayer/react-components"
+import { ArgTypes, Canvas, Source } from "@storybook/addon-docs/blocks"
+import type { Meta, StoryObj } from "@storybook/react-vite"
+import CommerceLayer from "../_internals/CommerceLayer"
+import {
+  AddSampleItems,
+  OrderStorage as OrderStorageHelper,
+} from "../_internals/OrderStorage"
+
+function MiniCartDocsPage(): JSX.Element {
+  return (
+    <>
+      <h1>MiniCart</h1>
+      <p>
+        The mini cart is <code>{"<HostedCart type=\"mini\">"}</code> — a fixed
+        slide-in panel that overlays the page from the right side. It loads the
+        same Commerce Layer hosted cart micro-frontend as the inline variant, but
+        in a drawer controlled by the <code>open</code> prop.
+      </p>
+      <span title="Usage" type="info">
+        <p>
+          Must be a child of <code>{"<Order>"}</code> (wrapped in{" "}
+          <code>{"<OrderStorage>"}</code>). Pair it with a{" "}
+          <code>{"<CartLink type=\"mini\" />"}</code> or your own trigger button
+          to manage the <code>open</code> state.
+        </p>
+      </span>
+      <ArgTypes />
+      <Source
+        language="jsx"
+        dark
+        code={`
+import { useState } from 'react'
+import {
+  CommerceLayer,
+  OrderStorage,
+  Order,
+  CartLink,
+  HostedCart,
+} from '@commercelayer/react-components'
+
+function App() {
+  const [isOpen, setIsOpen] = useState(false)
+  return (
+    <CommerceLayer accessToken="...">
+      <OrderStorage persistKey="my-cart">
+        <Order>
+          <CartLink type="mini" label="Open cart" />
+          <HostedCart
+            type="mini"
+            open={isOpen}
+            handleOpen={() => setIsOpen(o => !o)}
+          />
+        </Order>
+      </OrderStorage>
+    </CommerceLayer>
+  )
+}
+`}
+      />
+      <hr />
+      <h2>Mini cart</h2>
+      <p>
+        Toggle the <code>open</code> control in the Controls panel to preview
+        the open and closed states. In a real app bind <code>open</code> and{" "}
+        <code>handleOpen</code> to local state.
+      </p>
+      <Canvas of={Default} />
+      <hr />
+      <h2>Auto-open on add to cart</h2>
+      <p>
+        Set <code>openAdd</code> to <code>true</code> so the panel opens
+        automatically whenever an item is added via{" "}
+        <code>{"<AddToCartButton>"}</code>. Click the button below to trigger
+        the flow.
+      </p>
+      <Canvas of={OpenOnAdd} />
+    </>
+  )
+}
+
+const meta = {
+  title: "Components/Cart/MiniCart",
+  component: HostedCart,
+  parameters: {
+    docs: {
+      page: MiniCartDocsPage,
+    },
+  },
+  argTypes: {
+    open: {
+      control: "boolean",
+      description: "Controls whether the mini cart panel is open.",
+    },
+    openAdd: {
+      control: "boolean",
+      description:
+        'Automatically opens the panel when an item is added via `<AddToCartButton>`.',
+    },
+    handleOpen: {
+      control: false,
+      description:
+        "Callback fired when the background overlay or close icon is clicked. Use this to toggle `open` from outside.",
+    },
+    customDomain: {
+      control: "text",
+      description:
+        "Domain of a forked cart application. Overrides the default `<slug>.commercelayer.app` hostname.",
+    },
+    style: {
+      control: "object",
+      description:
+        "Style overrides for the panel parts: `cart`, `container`, `background`, `icon`, `iconContainer` — each a `CSSProperties` object.",
+    },
+  },
+} satisfies Meta<typeof HostedCart>
+
+export default meta
+type Story = StoryObj<typeof meta>
+
+function Wrapper({ children }: { children: React.ReactNode }) {
+  return (
+    <CommerceLayer accessToken="my-access-token">
+      <OrderStorageHelper persistKey="cl-examples-miniCart">
+        <Order>{children}</Order>
+      </OrderStorageHelper>
+    </CommerceLayer>
+  )
+}
+
+/**
+ * Set `type="mini"` to render a fixed slide-in panel. Toggle the `open` control
+ * to preview the open and closed states. In a real app, bind `open` and
+ * `handleOpen` to local state:
+ *
+ * ```tsx
+ * const [isOpen, setIsOpen] = useState(false)
+ * <HostedCart type="mini" open={isOpen} handleOpen={() => setIsOpen(o => !o)} />
+ * ```
+ */
+export const Default: Story = {
+  name: "Mini cart",
+  args: {
+    type: "mini",
+    open: false,
+  },
+  render: (args) => (
+    <Wrapper>
+      <HostedCart {...args} />
+    </Wrapper>
+  ),
+}
+
+/**
+ * When `openAdd` is `true` the mini cart panel opens automatically after an
+ * item is successfully added to the order via `<AddToCartButton>`. Click the
+ * button below to trigger the flow.
+ */
+export const OpenOnAdd: Story = {
+  name: "Auto-open on add to cart",
+  args: {
+    type: "mini",
+    openAdd: true,
+    open: false,
+  },
+  render: (args) => (
+    <Wrapper>
+      <AddSampleItems />
+      <HostedCart {...args} />
+    </Wrapper>
+  ),
+}

From 54f3173dafeba331e4473f5d5ac3e358e487202a Mon Sep 17 00:00:00 2001
From: Alessandro Casazza <acasazza@commercelayer.io>
Date: Fri, 22 May 2026 16:35:51 +0200
Subject: [PATCH 04/10] =?UTF-8?q?=F0=9F=90=9B=20fix(stories):=20fix=20Mini?=
 =?UTF-8?q?Cart=20stories=20=E2=80=94=20wire=20open=20state,=20use=20CartL?=
 =?UTF-8?q?ink=20+=20AddToCartButton?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Default story: use local useState + CartLink type='mini' as trigger,
  wire handleOpen to toggle state so overlay/close button work correctly
- OpenOnAdd story: replace AddSampleItems (SDK only) with AddToCartButton
  which publishes the 'open-cart' event that HostedCart openAdd listens for
- Fix DocsPage: add Canvas for both stories, mark open argType as control:false

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
---
 .../src/stories/cart/MiniCart.stories.tsx     | 94 ++++++++++---------
 1 file changed, 51 insertions(+), 43 deletions(-)

diff --git a/packages/document/src/stories/cart/MiniCart.stories.tsx b/packages/document/src/stories/cart/MiniCart.stories.tsx
index 55cb232f..a053faa4 100644
--- a/packages/document/src/stories/cart/MiniCart.stories.tsx
+++ b/packages/document/src/stories/cart/MiniCart.stories.tsx
@@ -1,28 +1,30 @@
-import { HostedCart, Order } from "@commercelayer/react-components"
+import {
+  AddToCartButton,
+  CartLink,
+  HostedCart,
+  Order,
+} from "@commercelayer/react-components"
 import { ArgTypes, Canvas, Source } from "@storybook/addon-docs/blocks"
 import type { Meta, StoryObj } from "@storybook/react-vite"
+import { useState, type JSX } from "react"
 import CommerceLayer from "../_internals/CommerceLayer"
-import {
-  AddSampleItems,
-  OrderStorage as OrderStorageHelper,
-} from "../_internals/OrderStorage"
+import { OrderStorage as OrderStorageHelper } from "../_internals/OrderStorage"
 
 function MiniCartDocsPage(): JSX.Element {
   return (
     <>
       <h1>MiniCart</h1>
       <p>
-        The mini cart is <code>{"<HostedCart type=\"mini\">"}</code> — a fixed
-        slide-in panel that overlays the page from the right side. It loads the
-        same Commerce Layer hosted cart micro-frontend as the inline variant, but
-        in a drawer controlled by the <code>open</code> prop.
+        The mini cart is <code>{'<HostedCart type="mini">'}</code> — a fixed slide-in panel that
+        overlays the page from the right side. It loads the same Commerce Layer hosted cart
+        micro-frontend as the inline variant, but in a drawer controlled by the <code>open</code>{" "}
+        prop.
       </p>
       <span title="Usage" type="info">
         <p>
-          Must be a child of <code>{"<Order>"}</code> (wrapped in{" "}
-          <code>{"<OrderStorage>"}</code>). Pair it with a{" "}
-          <code>{"<CartLink type=\"mini\" />"}</code> or your own trigger button
-          to manage the <code>open</code> state.
+          Must be a child of <code>{"<Order>"}</code> (wrapped in <code>{"<OrderStorage>"}</code>).
+          Pair it with a <code>{'<CartLink type="mini" />'}</code> or your own trigger button to
+          manage the <code>open</code> state.
         </p>
       </span>
       <ArgTypes />
@@ -61,18 +63,18 @@ function App() {
       <hr />
       <h2>Mini cart</h2>
       <p>
-        Toggle the <code>open</code> control in the Controls panel to preview
-        the open and closed states. In a real app bind <code>open</code> and{" "}
-        <code>handleOpen</code> to local state.
+        Click the button to open the slide-in panel. The{" "}
+        <code>handleOpen</code> callback keeps external state in sync when the
+        overlay or close icon is clicked inside the cart.
       </p>
       <Canvas of={Default} />
       <hr />
       <h2>Auto-open on add to cart</h2>
       <p>
         Set <code>openAdd</code> to <code>true</code> so the panel opens
-        automatically whenever an item is added via{" "}
-        <code>{"<AddToCartButton>"}</code>. Click the button below to trigger
-        the flow.
+        automatically after <code>{"<AddToCartButton>"}</code> successfully adds
+        an item to the order. Click <strong>Add to cart</strong> below to
+        trigger the flow.
       </p>
       <Canvas of={OpenOnAdd} />
     </>
@@ -89,13 +91,12 @@ const meta = {
   },
   argTypes: {
     open: {
-      control: "boolean",
+      control: false,
       description: "Controls whether the mini cart panel is open.",
     },
     openAdd: {
       control: "boolean",
-      description:
-        'Automatically opens the panel when an item is added via `<AddToCartButton>`.',
+      description: "Automatically opens the panel when an item is added via `<AddToCartButton>`.",
     },
     handleOpen: {
       control: false,
@@ -129,43 +130,50 @@ function Wrapper({ children }: { children: React.ReactNode }) {
 }
 
 /**
- * Set `type="mini"` to render a fixed slide-in panel. Toggle the `open` control
- * to preview the open and closed states. In a real app, bind `open` and
- * `handleOpen` to local state:
- *
- * ```tsx
- * const [isOpen, setIsOpen] = useState(false)
- * <HostedCart type="mini" open={isOpen} handleOpen={() => setIsOpen(o => !o)} />
- * ```
+ * Controlled mini cart: `open` and `handleOpen` are wired to local state so the
+ * panel can be opened with the button and closed by clicking the overlay or the
+ * close icon inside the cart iframe.
  */
 export const Default: Story = {
   name: "Mini cart",
-  args: {
-    type: "mini",
-    open: false,
+  render: () => {
+    const [isOpen, setIsOpen] = useState(false)
+    return (
+      <Wrapper>
+        <CartLink
+          type="mini"
+          label="Open mini cart"
+          className="px-4 py-2 bg-black text-white rounded text-sm"
+        />
+        <HostedCart
+          type="mini"
+          open={isOpen}
+          handleOpen={() => setIsOpen((o) => !o)}
+        />
+      </Wrapper>
+    )
   },
-  render: (args) => (
-    <Wrapper>
-      <HostedCart {...args} />
-    </Wrapper>
-  ),
 }
 
 /**
- * When `openAdd` is `true` the mini cart panel opens automatically after an
- * item is successfully added to the order via `<AddToCartButton>`. Click the
- * button below to trigger the flow.
+ * When `openAdd` is `true` the panel opens automatically after
+ * `<AddToCartButton>` successfully adds an item. The `"open-cart"` event is
+ * published internally by `AddToCartButton` on success.
  */
 export const OpenOnAdd: Story = {
   name: "Auto-open on add to cart",
   args: {
     type: "mini",
     openAdd: true,
-    open: false,
   },
   render: (args) => (
     <Wrapper>
-      <AddSampleItems />
+      <AddToCartButton
+        skuCode="SWEATWCX000000FFFFFFXSXX"
+        label="Add to cart"
+        quantity="1"
+        className="px-4 py-2 bg-black text-white rounded text-sm disabled:opacity-50"
+      />
       <HostedCart {...args} />
     </Wrapper>
   ),

From 4cf455cce2e919d5483e0b772515938be0a803e1 Mon Sep 17 00:00:00 2001
From: Alessandro Casazza <acasazza@commercelayer.io>
Date: Fri, 22 May 2026 16:37:47 +0200
Subject: [PATCH 05/10] =?UTF-8?q?=E2=9C=A8=20feat(stories):=20add=20min-he?=
 =?UTF-8?q?ight=20decorator=20to=20MiniCart=20stories=20canvas?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

The mini cart panel is position:fixed so it doesn't affect document flow.
A 500px min-height decorator ensures the canvas always has visible space
regardless of whether the panel is open or closed.

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
---
 packages/document/src/stories/cart/MiniCart.stories.tsx | 7 +++++++
 1 file changed, 7 insertions(+)

diff --git a/packages/document/src/stories/cart/MiniCart.stories.tsx b/packages/document/src/stories/cart/MiniCart.stories.tsx
index a053faa4..f366a26b 100644
--- a/packages/document/src/stories/cart/MiniCart.stories.tsx
+++ b/packages/document/src/stories/cart/MiniCart.stories.tsx
@@ -84,6 +84,13 @@ function App() {
 const meta = {
   title: "Components/Cart/MiniCart",
   component: HostedCart,
+  decorators: [
+    (Story) => (
+      <div style={{ minHeight: "500px" }}>
+        <Story />
+      </div>
+    ),
+  ],
   parameters: {
     docs: {
       page: MiniCartDocsPage,

From 1f271c90a8372db2c0c20f8c5da4208b8b553683 Mon Sep 17 00:00:00 2001
From: Alessandro Casazza <acasazza@commercelayer.io>
Date: Fri, 22 May 2026 16:44:14 +0200
Subject: [PATCH 06/10] =?UTF-8?q?=E2=9C=A8=20feat(stories):=20add=20CartLi?=
 =?UTF-8?q?nk=20story=20in=20document=20cart=20folder?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

DocsPage with ArgTypes, Source and 3 Canvas stories:
- Default (link to hosted cart)
- MiniCartTrigger (type='mini' + HostedCart integration with open state)
- ChildrenProps (render prop with custom trigger)

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
---
 .../src/stories/cart/CartLink.stories.tsx     | 190 ++++++++++++++++++
 1 file changed, 190 insertions(+)
 create mode 100644 packages/document/src/stories/cart/CartLink.stories.tsx

diff --git a/packages/document/src/stories/cart/CartLink.stories.tsx b/packages/document/src/stories/cart/CartLink.stories.tsx
new file mode 100644
index 00000000..840c1f17
--- /dev/null
+++ b/packages/document/src/stories/cart/CartLink.stories.tsx
@@ -0,0 +1,190 @@
+import { CartLink, HostedCart, Order } from "@commercelayer/react-components"
+import { ArgTypes, Canvas, Source } from "@storybook/addon-docs/blocks"
+import type { Meta, StoryObj } from "@storybook/react-vite"
+import { useState, type JSX } from "react"
+import CommerceLayer from "../_internals/CommerceLayer"
+import { OrderStorage as OrderStorageHelper } from "../_internals/OrderStorage"
+
+function CartLinkDocsPage(): JSX.Element {
+  return (
+    <>
+      <h1>CartLink</h1>
+      <p>
+        <code>{"<CartLink>"}</code> generates a link to the Commerce Layer hosted cart
+        micro-frontend. Clicking it navigates the customer to their cart, or — when{" "}
+        <code>type="mini"</code> is set — opens the{" "}
+        <code>{"<HostedCart type=\"mini\">"}</code> slide-in panel instead.
+      </p>
+      <span title="Usage" type="info">
+        <p>
+          Must be a child of <code>{"<Order>"}</code> (wrapped in{" "}
+          <code>{"<OrderStorage>"}</code>). Requires a parent{" "}
+          <code>{"<CommerceLayer>"}</code> context for the access token.
+        </p>
+      </span>
+      <ArgTypes />
+      <Source
+        language="jsx"
+        dark
+        code={`
+import {
+  CommerceLayer,
+  OrderStorage,
+  Order,
+  CartLink,
+} from '@commercelayer/react-components'
+
+<CommerceLayer accessToken="...">
+  <OrderStorage persistKey="my-cart">
+    <Order>
+      <CartLink label="View cart" />
+    </Order>
+  </OrderStorage>
+</CommerceLayer>
+`}
+      />
+      <hr />
+      <h2>Default — link to hosted cart</h2>
+      <p>
+        Renders an <code>{"<a>"}</code> tag that navigates to the Commerce Layer hosted cart
+        application when clicked.
+      </p>
+      <Canvas of={Default} />
+      <hr />
+      <h2>Mini cart trigger</h2>
+      <p>
+        Set <code>type="mini"</code> to publish the <code>"open-cart"</code> event on click
+        instead of navigating. Place a <code>{'<HostedCart type="mini">'}</code> on the same page
+        to receive the event and open the slide-in panel.
+      </p>
+      <Canvas of={MiniCartTrigger} />
+      <hr />
+      <h2>Children render prop</h2>
+      <p>
+        Pass a function as <code>children</code> to take full control of the rendered trigger. The
+        render prop receives <code>href</code>, <code>handleClick</code>, <code>orderId</code>, and{" "}
+        <code>accessToken</code>.
+      </p>
+      <Canvas of={ChildrenProps} />
+    </>
+  )
+}
+
+const meta = {
+  title: "Components/Cart/CartLink",
+  component: CartLink,
+  parameters: {
+    docs: {
+      page: CartLinkDocsPage,
+    },
+  },
+  argTypes: {
+    label: {
+      control: "text",
+      description: "Label text or element rendered inside the link.",
+    },
+    type: {
+      control: "select",
+      options: [undefined, "mini"],
+      description:
+        'When set to `"mini"` the link publishes the `"open-cart"` event on click instead of navigating, triggering a `<HostedCart type="mini">` panel on the same page.',
+    },
+    customDomain: {
+      control: "text",
+      description:
+        "Domain of a forked cart application. Overrides the default `<slug>.commercelayer.app` hostname.",
+    },
+    children: {
+      control: false,
+      description:
+        "Render prop receiving `{ href, handleClick, orderId, accessToken }` for a fully custom trigger element.",
+    },
+  },
+} satisfies Meta<typeof CartLink>
+
+export default meta
+type Story = StoryObj<typeof meta>
+
+function Wrapper({ children }: { children: React.ReactNode }) {
+  return (
+    <CommerceLayer accessToken="my-access-token">
+      <OrderStorageHelper persistKey="cl-examples-cartLink">
+        <Order>{children}</Order>
+      </OrderStorageHelper>
+    </CommerceLayer>
+  )
+}
+
+/**
+ * The default `<CartLink>` renders an `<a>` tag that navigates to the Commerce
+ * Layer hosted cart application when clicked.
+ */
+export const Default: Story = {
+  name: "Default — link to hosted cart",
+  args: {
+    label: "View cart",
+    className: "text-blue-600 underline hover:text-blue-800",
+  },
+  render: (args) => (
+    <Wrapper>
+      <CartLink {...args} />
+    </Wrapper>
+  ),
+}
+
+/**
+ * Set `type="mini"` so clicking the link publishes the `"open-cart"` event
+ * instead of navigating. A `<HostedCart type="mini">` on the same page
+ * listens for this event and opens the slide-in panel.
+ */
+export const MiniCartTrigger: Story = {
+  name: "Mini cart trigger",
+  decorators: [
+    (Story) => (
+      <div style={{ minHeight: "500px" }}>
+        <Story />
+      </div>
+    ),
+  ],
+  render: () => {
+    const [isOpen, setIsOpen] = useState(false)
+    return (
+      <Wrapper>
+        <CartLink
+          type="mini"
+          label="Open mini cart"
+          className="px-4 py-2 bg-black text-white rounded text-sm"
+        />
+        <HostedCart
+          type="mini"
+          open={isOpen}
+          handleOpen={() => setIsOpen((o) => !o)}
+        />
+      </Wrapper>
+    )
+  },
+}
+
+/**
+ * Use the `children` render prop to fully control the trigger element.
+ * The `href` and `handleClick` props are provided by `CartLink` and wire
+ * up navigation automatically.
+ */
+export const ChildrenProps: Story = {
+  name: "Children props (render prop)",
+  render: () => (
+    <Wrapper>
+      <CartLink>
+        {({ href, handleClick, orderId }) => (
+          <a
+            href={href}
+            onClick={handleClick}
+            className="inline-flex items-center gap-2 rounded bg-black px-4 py-2 text-sm text-white hover:bg-gray-800"
+          >
+            🛒 Cart{orderId != null ? ` — order ${orderId}` : ""}
+          </a>
+        )}
+      </CartLink>
+    </Wrapper>
+  ),
+}

From 527217c95495f176ce66bc73a97ba6164bf34711 Mon Sep 17 00:00:00 2001
From: Alessandro Casazza <acasazza@commercelayer.io>
Date: Fri, 22 May 2026 16:54:53 +0200
Subject: [PATCH 07/10] =?UTF-8?q?=E2=99=BB=EF=B8=8F=20refactor(CartLink):?=
 =?UTF-8?q?=20add=20target=20prop,=20window.open,=20extract=20DEFAULT=5FDO?=
 =?UTF-8?q?MAIN,=20fix=20JSDoc?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- Destructure `target` from props (no longer swallowed by `...p`)
- Replace `location.href =` with `window.open(url, target ?? '_self')`
- Extract `resolveCartUrl` helper to deduplicate getOrganizationConfig calls
- Add `const token: string = accessToken` narrowing (same pattern as CheckoutLink/HostedCart)
- Extract `DEFAULT_DOMAIN` constant
- Make `handleClick` non-optional in ChildrenProps (always provided)
- Add `event.stopPropagation()` to handleClick
- Fix JSDoc: `<OrderContainer>` → `<Order>`
- Add `target` to parentProps and `<a target={target}>`
- Update CartLink story: add `target` argType

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
---
 .../src/stories/cart/CartLink.stories.tsx     |   6 +
 .../src/components/orders/CartLink.tsx        | 140 ++++++++----------
 2 files changed, 69 insertions(+), 77 deletions(-)

diff --git a/packages/document/src/stories/cart/CartLink.stories.tsx b/packages/document/src/stories/cart/CartLink.stories.tsx
index 840c1f17..295ce8f0 100644
--- a/packages/document/src/stories/cart/CartLink.stories.tsx
+++ b/packages/document/src/stories/cart/CartLink.stories.tsx
@@ -94,6 +94,12 @@ const meta = {
       description:
         "Domain of a forked cart application. Overrides the default `<slug>.commercelayer.app` hostname.",
     },
+    target: {
+      control: "select",
+      options: ["_self", "_blank", "_parent", "_top"],
+      description:
+        "Specifies where to open the linked URL. Defaults to `_self`. Only applies when navigating (not when `type=\"mini\"`).",
+    },
     children: {
       control: false,
       description:
diff --git a/packages/react-components/src/components/orders/CartLink.tsx b/packages/react-components/src/components/orders/CartLink.tsx
index 83274dbe..e3cb6e56 100644
--- a/packages/react-components/src/components/orders/CartLink.tsx
+++ b/packages/react-components/src/components/orders/CartLink.tsx
@@ -1,24 +1,24 @@
-import { type MouseEvent, type ReactNode, useContext, type JSX } from 'react';
-import OrderContext from '#context/OrderContext'
-import Parent from '../utils/Parent'
-import type { ChildrenFunction } from '#typings/index'
-import CommerceLayerContext from '#context/CommerceLayerContext'
-import { getApplicationLink } from '#utils/getApplicationLink'
-import { jwt } from '#utils/jwt'
-import { publish } from '#utils/events'
-import { getOrganizationConfig } from '#utils/organization'
+import { type MouseEvent, type ReactNode, useContext, type JSX } from "react"
+import OrderContext from "#context/OrderContext"
+import Parent from "../utils/Parent"
+import type { ChildrenFunction } from "#typings/index"
+import CommerceLayerContext from "#context/CommerceLayerContext"
+import { getApplicationLink } from "#utils/getApplicationLink"
+import { jwt } from "#utils/jwt"
+import { publish } from "#utils/events"
+import { getOrganizationConfig } from "#utils/organization"
 
-interface ChildrenProps extends Omit<Props, 'children'> {
+const DEFAULT_DOMAIN = "commercelayer.io"
+
+interface ChildrenProps extends Omit<Props, "children"> {
   /**
-   * The url of the cart
+   * The resolved href for the cart link
    */
-  href: string
+  href: string | undefined
   /**
    * Callback to dispatch the click event
-   * @param e: MouseEvent<HTMLAnchorElement>
-   * @returns Promise<void>
    */
-  handleClick?: (e: MouseEvent<HTMLAnchorElement>) => Promise<void>
+  handleClick: (e: MouseEvent<HTMLAnchorElement>) => Promise<void>
   /**
    * The order id
    */
@@ -29,7 +29,7 @@ interface ChildrenProps extends Omit<Props, 'children'> {
   accessToken?: string
 }
 
-interface Props extends Omit<JSX.IntrinsicElements['a'], 'children'> {
+interface Props extends Omit<JSX.IntrinsicElements["a"], "children"> {
   children?: ChildrenFunction<ChildrenProps>
   /**
    * Label to display
@@ -38,7 +38,7 @@ interface Props extends Omit<JSX.IntrinsicElements['a'], 'children'> {
   /**
    * The type of the cart. Defaults to undefined. If set to 'mini', the cart will open in a modal.
    */
-  type?: 'mini'
+  type?: "mini"
   /**
    * The domain of your forked application
    */
@@ -50,90 +50,76 @@ interface Props extends Omit<JSX.IntrinsicElements['a'], 'children'> {
  * In this way you can connect your shop application with our hosted micro-frontend.
  *
  * <span title="Requirement" type="warning">
- * Must be a child of the `<OrderContainer>` component. <br />
+ * Must be a child of the `<Order>` component. <br />
  * </span>
  */
 export function CartLink(props: Props): JSX.Element | null {
-  const { label, children, type, customDomain, ...p } = props
+  const { label, children, type, customDomain, target, ...p } = props
   const { order, createOrder } = useContext(OrderContext)
   const { accessToken } = useContext(CommerceLayerContext)
-  if (accessToken == null)
-    throw new Error('Cannot use `CartLink` outside of `CommerceLayer`')
-  const { organization } = jwt(accessToken)
+  if (accessToken == null) throw new Error("Cannot use `CartLink` outside of `CommerceLayer`")
+  const token: string = accessToken
+  const { organization } = jwt(token)
   const slug = organization.slug
-  const domain = 'commercelayer.io'
   const href =
     slug && order?.id
       ? getApplicationLink({
           slug,
-          orderId: order?.id,
-          accessToken,
-          domain,
-          applicationType: 'cart',
-          customDomain
+          orderId: order.id,
+          accessToken: token,
+          domain: DEFAULT_DOMAIN,
+          applicationType: "cart",
+          customDomain,
         })
       : undefined
-  const handleClick = async (
-    event: MouseEvent<HTMLAnchorElement>
-  ): Promise<void> => {
+
+  async function resolveCartUrl(orderId: string): Promise<string> {
+    const config = await getOrganizationConfig({
+      accessToken: token,
+      params: { orderId, accessToken: token, slug },
+    })
+    return (
+      config?.links?.cart ??
+      getApplicationLink({
+        slug,
+        orderId,
+        accessToken: token,
+        domain: DEFAULT_DOMAIN,
+        applicationType: "cart",
+        customDomain,
+      })
+    )
+  }
+
+  const handleClick = async (event: MouseEvent<HTMLAnchorElement>): Promise<void> => {
     event.preventDefault()
-    if (type !== 'mini') {
-      if (order?.id) {
-        const config = await getOrganizationConfig({
-          accessToken,
-          params: {
-            orderId: order?.id,
-            accessToken,
-            slug
-          }
-        })
-        location.href = config?.links?.cart ?? href ?? ''
-      } else {
-        const orderId = await createOrder({})
-        const config = await getOrganizationConfig({
-          accessToken,
-          params: {
-            orderId: order?.id,
-            accessToken,
-            slug
-          }
-        })
-        if (slug) {
-          location.href =
-            config?.links?.cart ??
-            getApplicationLink({
-              slug,
-              orderId,
-              accessToken,
-              domain,
-              applicationType: 'cart',
-              customDomain
-            })
-        }
-      }
-    } else {
-      publish('open-cart')
+    event.stopPropagation()
+    if (type === "mini") {
+      publish("open-cart")
+      return
+    }
+    const orderId = order?.id ?? (await createOrder({}))
+    if (orderId) {
+      window.open(await resolveCartUrl(orderId), target ?? "_self")
     }
   }
+
   const parentProps = {
     handleClick,
     label,
     href,
     orderId: order?.id,
-    accessToken,
-    ...p
+    accessToken: token,
+    type,
+    customDomain,
+    target,
+    ...p,
   }
-  if (!accessToken) return null
+
   return children ? (
     <Parent {...parentProps}>{children}</Parent>
   ) : (
-    <a
-      href={href}
-      onClick={(e) => {
-        handleClick(e)
-      }}
-      {...p}
-    >
+    <a href={href} onClick={handleClick} target={target} {...p}>
       {label}
     </a>
   )

From 33e20e30966475bf15dc75e2bd967c87b878d551 Mon Sep 17 00:00:00 2001
From: Alessandro Casazza <acasazza@commercelayer.io>
Date: Mon, 25 May 2026 10:40:43 +0200
Subject: [PATCH 08/10] =?UTF-8?q?=F0=9F=94=A7=20chore:=20upgrade=20@biomej?=
 =?UTF-8?q?s/biome=20to=202.4.15=20to=20match=20schema=20version?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
---
 AGENTS.md                    | 13 +++++++
 docs/agents/domain.md        | 39 +++++++++++++++++++
 docs/agents/issue-tracker.md | 22 +++++++++++
 docs/agents/triage-labels.md | 15 ++++++++
 package.json                 |  2 +-
 pnpm-lock.yaml               | 74 ++++++++++++++++++------------------
 6 files changed, 127 insertions(+), 38 deletions(-)
 create mode 100644 AGENTS.md
 create mode 100644 docs/agents/domain.md
 create mode 100644 docs/agents/issue-tracker.md
 create mode 100644 docs/agents/triage-labels.md

diff --git a/AGENTS.md b/AGENTS.md
new file mode 100644
index 00000000..0a878814
--- /dev/null
+++ b/AGENTS.md
@@ -0,0 +1,13 @@
+## Agent skills
+
+### Issue tracker
+
+Issues live in GitHub Issues at `commercelayer/commercelayer-react-components`. See `docs/agents/issue-tracker.md`.
+
+### Triage labels
+
+Default five-role vocabulary (`needs-triage`, `needs-info`, `ready-for-agent`, `ready-for-human`, `wontfix`). See `docs/agents/triage-labels.md`.
+
+### Domain docs
+
+Single-context repo: one `CONTEXT.md` + `docs/adr/` at the root. See `docs/agents/domain.md`.
diff --git a/docs/agents/domain.md b/docs/agents/domain.md
new file mode 100644
index 00000000..b6b56b66
--- /dev/null
+++ b/docs/agents/domain.md
@@ -0,0 +1,39 @@
+# Domain Docs
+
+How the engineering skills should consume this repo's domain documentation when exploring the codebase.
+
+## Before exploring, read these
+
+- **`CONTEXT.md`** at the repo root
+- **`docs/adr/`** — read ADRs that touch the area you're about to work in
+
+If any of these files don't exist, **proceed silently**. Don't flag their absence; don't suggest creating them upfront. The producer skill (`/grill-with-docs`) creates them lazily when terms or decisions actually get resolved.
+
+## File structure
+
+Single-context repo:
+
+```
+/
+├── CONTEXT.md
+├── docs/adr/
+│   ├── 0001-*.md
+│   └── ...
+└── packages/
+    ├── core/
+    ├── hooks/
+    ├── react-components/
+    └── document/
+```
+
+## Use the glossary's vocabulary
+
+When your output names a domain concept (in an issue title, a refactor proposal, a hypothesis, a test name), use the term as defined in `CONTEXT.md`. Don't drift to synonyms the glossary explicitly avoids.
+
+If the concept you need isn't in the glossary yet, that's a signal — either you're inventing language the project doesn't use (reconsider) or there's a real gap (note it for `/grill-with-docs`).
+
+## Flag ADR conflicts
+
+If your output contradicts an existing ADR, surface it explicitly rather than silently overriding:
+
+> _Contradicts ADR-0007 (…) — but worth reopening because…_
diff --git a/docs/agents/issue-tracker.md b/docs/agents/issue-tracker.md
new file mode 100644
index 00000000..cce77ecb
--- /dev/null
+++ b/docs/agents/issue-tracker.md
@@ -0,0 +1,22 @@
+# Issue tracker: GitHub
+
+Issues and PRDs for this repo live as GitHub issues. Use the `gh` CLI for all operations.
+
+## Conventions
+
+- **Create an issue**: `gh issue create --title "..." --body "..."`. Use a heredoc for multi-line bodies.
+- **Read an issue**: `gh issue view <number> --comments`, filtering comments by `jq` and also fetching labels.
+- **List issues**: `gh issue list --state open --json number,title,body,labels,comments --jq '[.[] | {number, title, body, labels: [.labels[].name], comments: [.comments[].body]}]'` with appropriate `--label` and `--state` filters.
+- **Comment on an issue**: `gh issue comment <number> --body "..."`
+- **Apply / remove labels**: `gh issue edit <number> --add-label "..."` / `--remove-label "..."`
+- **Close**: `gh issue close <number> --comment "..."`
+
+Infer the repo from `git remote -v` — `gh` does this automatically when run inside a clone.
+
+## When a skill says "publish to the issue tracker"
+
+Create a GitHub issue.
+
+## When a skill says "fetch the relevant ticket"
+
+Run `gh issue view <number> --comments`.
diff --git a/docs/agents/triage-labels.md b/docs/agents/triage-labels.md
new file mode 100644
index 00000000..b716855d
--- /dev/null
+++ b/docs/agents/triage-labels.md
@@ -0,0 +1,15 @@
+# Triage Labels
+
+The skills speak in terms of five canonical triage roles. This file maps those roles to the actual label strings used in this repo's issue tracker.
+
+| Label in mattpocock/skills | Label in our tracker | Meaning                                  |
+| -------------------------- | -------------------- | ---------------------------------------- |
+| `needs-triage`             | `needs-triage`       | Maintainer needs to evaluate this issue  |
+| `needs-info`               | `needs-info`         | Waiting on reporter for more information |
+| `ready-for-agent`          | `ready-for-agent`    | Fully specified, ready for an AFK agent  |
+| `ready-for-human`          | `ready-for-human`    | Requires human implementation            |
+| `wontfix`                  | `wontfix`            | Will not be actioned                     |
+
+When a skill mentions a role (e.g. "apply the AFK-ready triage label"), use the corresponding label string from this table.
+
+Edit the right-hand column to match whatever vocabulary you actually use.
diff --git a/package.json b/package.json
index 5a70bab4..4903cc6f 100644
--- a/package.json
+++ b/package.json
@@ -23,7 +23,7 @@
     "clean": "pnpm dlx rimraf --glob **/node_modules **/pnpm-lock.yaml"
   },
   "devDependencies": {
-    "@biomejs/biome": "^2.4.14",
+    "@biomejs/biome": "^2.4.15",
     "husky": "^9.1.7",
     "lerna": "^9.0.7",
     "typescript": "^6.0.3"
diff --git a/pnpm-lock.yaml b/pnpm-lock.yaml
index 0375e1e2..a6eb24fd 100644
--- a/pnpm-lock.yaml
+++ b/pnpm-lock.yaml
@@ -26,8 +26,8 @@ importers:
   .:
     devDependencies:
       '@biomejs/biome':
-        specifier: ^2.4.14
-        version: 2.4.14
+        specifier: ^2.4.15
+        version: 2.4.15
       husky:
         specifier: ^9.1.7
         version: 9.1.7
@@ -1031,59 +1031,59 @@ packages:
     resolution: {integrity: sha512-6zABk/ECA/QYSCQ1NGiVwwbQerUCZ+TQbp64Q3AgmfNvurHH0j8TtXa1qbShXA6qqkpAj4V5W8pP6mLe1mcMqA==}
     engines: {node: '>=18'}
 
-  '@biomejs/biome@2.4.14':
-    resolution: {integrity: sha512-TmAvxOEgrpLypzVGJ8FulIZnlyA9TxrO1hyqYrCz9r+bwma9xXxuLA5IuYnj55XQneFx460KjRbx6SWGLkg3bQ==}
+  '@biomejs/biome@2.4.15':
+    resolution: {integrity: sha512-j5VH3a/h/HXTKBM50MDMxRCzkeLv9S2XJcW2WgnZT1+xyisi+0bISrXR82gCX+8S9lvK0skEvHJRN+3Ktr2hlw==}
     engines: {node: '>=14.21.3'}
     hasBin: true
 
-  '@biomejs/cli-darwin-arm64@2.4.14':
-    resolution: {integrity: sha512-XvgoE9XOawUOQPdmvs4J7wPhi/DLwSCGks3AlPJDmh34O0awRTqCED1HRcRDdpf1Zrp4us4MGOOdIxNpbqNF5Q==}
+  '@biomejs/cli-darwin-arm64@2.4.15':
+    resolution: {integrity: sha512-rF3PPqLq1yoST79zaQbDjVJwsuIeci/O+9bgNmC5QpgOqz6aqYuzA4abyAGx+mgyiDXn4A049xAN8gijbuR1Qg==}
     engines: {node: '>=14.21.3'}
     cpu: [arm64]
     os: [darwin]
 
-  '@biomejs/cli-darwin-x64@2.4.14':
-    resolution: {integrity: sha512-jE7hKBCFhOx3uUh+ZkWBfOHxAcILPfhFplNkuID/eZeSTLHzfZzoZxW8fbqY9xXRnPi7jGNAf1iPVR+0yWsM/Q==}
+  '@biomejs/cli-darwin-x64@2.4.15':
+    resolution: {integrity: sha512-/5KHXYMfSJs1fNXiX30xFtI8JcCFV6zaVVLxOa0M2sfqBKHkpQhRTv94yxQWxeTY2lzo2OuTlNvPC+hDQt2wcQ==}
     engines: {node: '>=14.21.3'}
     cpu: [x64]
     os: [darwin]
 
-  '@biomejs/cli-linux-arm64-musl@2.4.14':
-    resolution: {integrity: sha512-/z+6gqAqqUQTHazwStxSXKHg9b8UvqBmDFRp+c4wYbq2KXhELQDon9EoC9RpmQ8JWkqQx/lIUy/cs+MhzDZp6A==}
+  '@biomejs/cli-linux-arm64-musl@2.4.15':
+    resolution: {integrity: sha512-ZPcxznxm0pogHBLZhYntyR3sR+MrZjqJIKEr7ZqVen0Rl+P/4upVmfYXjftizi9RoqZntg33fv/1fbdhbYXpEQ==}
     engines: {node: '>=14.21.3'}
     cpu: [arm64]
     os: [linux]
     libc: [musl]
 
-  '@biomejs/cli-linux-arm64@2.4.14':
-    resolution: {integrity: sha512-2TELhZnW5RSLL063l9rc5xLpA0ZIw0Ccwy/0q384rvNAgFw3yI76bd59547yxowdQr5MNPET/xDLrLuvgSeeWQ==}
+  '@biomejs/cli-linux-arm64@2.4.15':
+    resolution: {integrity: sha512-owaAMZD/T4LrD0ELNCk0Km3qrRHuM0X6EAyVE1FSqGY0rbLoiDLrO4Us2tllm6cAeB2Ioa9C2C08NZPdr8+0Ug==}
     engines: {node: '>=14.21.3'}
     cpu: [arm64]
     os: [linux]
     libc: [glibc]
 
-  '@biomejs/cli-linux-x64-musl@2.4.14':
-    resolution: {integrity: sha512-R6BWgJdQOwW9ulJatuTVrQkjnODjqHZkKNOqb1sz++3Noe5LYd0i3PchnOBUCYAPHoPWHhjJqbdZlHEu0hpjdA==}
+  '@biomejs/cli-linux-x64-musl@2.4.15':
+    resolution: {integrity: sha512-CNq/9W38SYSH023lfcQ4KKU8K0YX8T//FZUhcgtMMRABDojx5XsMV7jlweAvGSl389wJQB29Qo6Zb/a+jdvt+w==}
     engines: {node: '>=14.21.3'}
     cpu: [x64]
     os: [linux]
     libc: [musl]
 
-  '@biomejs/cli-linux-x64@2.4.14':
-    resolution: {integrity: sha512-zHrlQZDBDUz4OLAraYpWKcnLS6HOewBFWYOzY91d1ZjdqZwibOyb6BEu6WuWLugyo0P3riCmsbV9UqV1cSXwQg==}
+  '@biomejs/cli-linux-x64@2.4.15':
+    resolution: {integrity: sha512-0jj7THz12GbUOLmMibktK6DZjqz2zV64KFxyBtcFTKPiiOIY0a7vns1elpO1dERvxpsZ5ik0oFfz0oGwFde1+g==}
     engines: {node: '>=14.21.3'}
     cpu: [x64]
     os: [linux]
     libc: [glibc]
 
-  '@biomejs/cli-win32-arm64@2.4.14':
-    resolution: {integrity: sha512-M3EH5hqOI/F/FUA2u4xcLoUgmxd218mvuj/6JL7Hv2toQvr2/AdOvKSpGkoRuWFCtQPVa+ZqkEV3Q5xBA9+XSA==}
+  '@biomejs/cli-win32-arm64@2.4.15':
+    resolution: {integrity: sha512-ouhkYdlhp/1GghEJPdWwD/Vi3gQ1nFxuSpMolWsbq3Lsq3QUR4jl6UdhhscdCugKU5vOEuMiJhvKj66O0OCq+w==}
     engines: {node: '>=14.21.3'}
     cpu: [arm64]
     os: [win32]
 
-  '@biomejs/cli-win32-x64@2.4.14':
-    resolution: {integrity: sha512-WL0EG5qE+EAKomGXbf2g6VnSKJhTL3tXC0QRzWRwA5VpjxNYa6H4P7ZWfymbGE4IhZZQi1KXQ2R0YjwInmz2fA==}
+  '@biomejs/cli-win32-x64@2.4.15':
+    resolution: {integrity: sha512-zBrGq5mx5wwpnow4+2BxUvleDM+GNd4sLbPaMapsSLQLD0NGRCquqPBTgN+7XkUteHvj7M+BstuI8tmnV7+HgQ==}
     engines: {node: '>=14.21.3'}
     cpu: [x64]
     os: [win32]
@@ -6988,39 +6988,39 @@ snapshots:
 
   '@bcoe/v8-coverage@1.0.2': {}
 
-  '@biomejs/biome@2.4.14':
+  '@biomejs/biome@2.4.15':
     optionalDependencies:
-      '@biomejs/cli-darwin-arm64': 2.4.14
-      '@biomejs/cli-darwin-x64': 2.4.14
-      '@biomejs/cli-linux-arm64': 2.4.14
-      '@biomejs/cli-linux-arm64-musl': 2.4.14
-      '@biomejs/cli-linux-x64': 2.4.14
-      '@biomejs/cli-linux-x64-musl': 2.4.14
-      '@biomejs/cli-win32-arm64': 2.4.14
-      '@biomejs/cli-win32-x64': 2.4.14
+      '@biomejs/cli-darwin-arm64': 2.4.15
+      '@biomejs/cli-darwin-x64': 2.4.15
+      '@biomejs/cli-linux-arm64': 2.4.15
+      '@biomejs/cli-linux-arm64-musl': 2.4.15
+      '@biomejs/cli-linux-x64': 2.4.15
+      '@biomejs/cli-linux-x64-musl': 2.4.15
+      '@biomejs/cli-win32-arm64': 2.4.15
+      '@biomejs/cli-win32-x64': 2.4.15
 
-  '@biomejs/cli-darwin-arm64@2.4.14':
+  '@biomejs/cli-darwin-arm64@2.4.15':
     optional: true
 
-  '@biomejs/cli-darwin-x64@2.4.14':
+  '@biomejs/cli-darwin-x64@2.4.15':
     optional: true
 
-  '@biomejs/cli-linux-arm64-musl@2.4.14':
+  '@biomejs/cli-linux-arm64-musl@2.4.15':
     optional: true
 
-  '@biomejs/cli-linux-arm64@2.4.14':
+  '@biomejs/cli-linux-arm64@2.4.15':
     optional: true
 
-  '@biomejs/cli-linux-x64-musl@2.4.14':
+  '@biomejs/cli-linux-x64-musl@2.4.15':
     optional: true
 
-  '@biomejs/cli-linux-x64@2.4.14':
+  '@biomejs/cli-linux-x64@2.4.15':
     optional: true
 
-  '@biomejs/cli-win32-arm64@2.4.14':
+  '@biomejs/cli-win32-arm64@2.4.15':
     optional: true
 
-  '@biomejs/cli-win32-x64@2.4.14':
+  '@biomejs/cli-win32-x64@2.4.15':
     optional: true
 
   '@braidai/lang@1.1.2': {}

From 211459dfc9b400d5ede35e885e77cd9e957ffcba Mon Sep 17 00:00:00 2001
From: Alessandro Casazza <acasazza@commercelayer.io>
Date: Mon, 25 May 2026 10:49:06 +0200
Subject: [PATCH 09/10] =?UTF-8?q?=F0=9F=94=A7=20chore:=20apply=20biome=20f?=
 =?UTF-8?q?ormatting=20across=20codebase?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Apply biome format --write to align all source files with the configured
formatter settings (double quotes, no semicolons, ES5 trailing commas).

Also:
- Exclude large mock file from biome (3.5 MiB exceeds 1 MiB limit)
- Fix invalid syntax in _vitest.config.mts (orphaned lines at top of file)

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
---
 .gitignore                                    |    5 +-
 .ncurc.cjs                                    |    7 +-
 biome.json                                    |    8 +-
 examples/_app.tsx                             |    4 +-
 examples/cart.tsx                             |   94 +-
 examples/categoryOrder.tsx                    |   73 +-
 examples/checkout/addresses.tsx               |   77 +-
 .../customer/addresses-country-lock.tsx       |  101 +-
 examples/checkout/customer/addresses.tsx      |  135 +-
 examples/checkout/customer/index.tsx          |  236 +-
 examples/checkout/customer/payments.tsx       |   59 +-
 examples/checkout/giftcard-or-coupon-code.tsx |   75 +-
 examples/checkout/index.tsx                   |  147 +-
 examples/checkout/payments.tsx                |  185 +-
 examples/checkout/shipments.tsx               |   39 +-
 examples/gift-cards.tsx                       |   78 +-
 examples/handleError.tsx                      |  109 +-
 examples/index.tsx                            |   70 +-
 examples/multiApp.tsx                         |  107 +-
 examples/multiOrder.tsx                       |   98 +-
 examples/my-account/customer-addresses.tsx    |   50 +-
 examples/my-account/customer-info.tsx         |    8 +-
 .../orders-list-infinite-scroll.tsx           |   37 +-
 examples/my-account/orders-list.tsx           |   53 +-
 examples/my-account/parcels.tsx               |   54 +-
 examples/order-by-add-to-cart-button.tsx      |  272 +-
 examples/order-summary.tsx                    |   68 +-
 examples/order-with-custom-components.tsx     |  127 +-
 examples/order-with-sku-options.tsx           |  245 +-
 examples/order.tsx                            |  302 +-
 examples/order/add-item-to-hosted-cart.tsx    |   36 +-
 examples/order/buy-now-mode.tsx               |  104 +-
 .../order/order-with-cart-link-button.tsx     |  121 +-
 examples/order/order.tsx                      |  280 +-
 examples/prices.tsx                           |  136 +-
 examples/radio-variants.tsx                   |  101 +-
 examples/sku-lists.tsx                        |   74 +-
 lerna.json                                    |    2 +-
 packages/core/src/auth/getAccessToken.spec.ts |    6 +-
 .../getSkuAvailability.interceptors.spec.ts   |    9 +-
 .../availability/getSkuAvailability.spec.ts   |   50 +-
 .../src/prices/getPrices.interceptors.spec.ts |    9 +-
 .../prices/retrievePrice.interceptors.spec.ts |    9 +-
 packages/core/src/prices/retrievePrice.ts     |    6 +-
 .../prices/updatePrice.interceptors.spec.ts   |    9 +-
 packages/core/src/prices/updatePrice.spec.ts  |   63 +-
 packages/core/src/prices/updatePrice.ts       |    7 +-
 packages/core/src/sdk/getSdk.spec.ts          |   10 +-
 packages/core/src/sdk/index.ts                |   23 +-
 .../getSkuLists.interceptors.spec.ts          |    9 +-
 .../core/src/sku_lists/getSkuLists.spec.ts    |   15 +-
 .../retrieveSkuList.interceptors.spec.ts      |    9 +-
 .../src/sku_lists/retrieveSkuList.spec.ts     |    2 +-
 .../core/src/sku_lists/retrieveSkuList.ts     |    6 +-
 .../src/skus/getSkus.interceptors.spec.ts     |    9 +-
 .../src/skus/retrieveSku.interceptors.spec.ts |    9 +-
 .../src/skus/updateSku.interceptors.spec.ts   |    9 +-
 packages/core/src/skus/updateSku.ts           |    7 +-
 .../.storybook/addon-gh-repository/Tool.tsx   |   10 +-
 .../addon-gh-repository/constants.ts          |    7 +-
 .../addon-gh-repository/manager.tsx           |    8 +-
 .../docs/.storybook/commercelayer.theme.ts    |   12 +-
 packages/docs/.storybook/main.ts              |   54 +-
 packages/docs/.storybook/manager.ts           |    6 +-
 packages/docs/.storybook/preview.tsx          |  101 +-
 packages/docs/mocks/browser.js                |    4 +-
 packages/docs/mocks/data/adjustments.js       |   67 +-
 packages/docs/mocks/data/bundles.js           |  381 +-
 packages/docs/mocks/data/line_items.js        |  126 +-
 packages/docs/mocks/data/markets.js           |  438 +-
 packages/docs/mocks/data/orders.js            | 5035 ++++++++---------
 packages/docs/mocks/data/tags.js              |   52 +-
 packages/docs/mocks/handlers.js               |   21 +-
 packages/docs/public/mockServiceWorker.js     |   67 +-
 packages/docs/public/storybook-preview.css    |   76 +-
 packages/docs/stories/_internals/Code.tsx     |    2 +-
 .../docs/stories/_internals/CommerceLayer.tsx |   21 +-
 .../docs/stories/_internals/OrderStorage.tsx  |  147 +-
 .../docs/stories/_internals/useGetToken.ts    |  110 +-
 .../AvailabilityContainer.stories.tsx         |   27 +-
 .../AvailabilityTemplate.stories.tsx          |   79 +-
 .../stories/cart/AddToCartButton.stories.tsx  |  304 +-
 .../docs/stories/cart/CartLink.stories.tsx    |   22 +-
 .../docs/stories/cart/HostedCart.stories.tsx  |   29 +-
 .../docs/stories/cart/MiniCart.stories.tsx    |   98 +-
 .../stories/customers/Address.stories.tsx     |   46 +-
 .../customers/AddressField.stories.tsx        |   57 +-
 .../customers/AddressesContainer.stories.tsx  |   34 +-
 .../customers/AddressesEmpty.stories.tsx      |   24 +-
 .../customers/BillingAddressForm.stories.tsx  |   28 +-
 .../customers/CustomerContainer.stories.tsx   |   22 +-
 .../customers/CustomerField.stories.tsx       |   34 +-
 .../customers/MyAccountLink.stories.tsx       |   20 +-
 .../customers/MyIdentityLink.stories.tsx      |   55 +-
 .../examples/cart/001.cart.stories.tsx        |  118 +-
 .../examples/checkout/001.items.stories.tsx   |   97 +-
 .../checkout/002.addresses.stories.tsx        |  789 ++-
 .../checkout/003.shipping.stories.tsx         |   80 +-
 .../examples/checkout/004.payment.stories.tsx |  118 +-
 .../docs/stories/examples/checkout/utils.ts   |   58 +-
 .../examples/customer/001.orders.stories.tsx  |  116 +-
 .../customer/002.address-form.stories.tsx     |  209 +-
 .../customer/003.address-book.stories.tsx     |  218 +-
 .../customer/004.subscriptions.stories.tsx    |  121 +-
 .../listing-page/000.ListingPage.stories.tsx  |  139 +-
 .../listing-page/001.MiniCart.stories.tsx     |   71 +-
 .../stories/orders/CheckoutLink.stories.tsx   |   32 +-
 .../stories/orders/OrderContainer.stories.tsx |   28 +-
 .../stories/orders/OrderStorage.stories.tsx   |   20 +-
 .../docs/stories/prices/Price.stories.tsx     |   50 +-
 .../prices/PricesContainer.stories.tsx        |   16 +-
 packages/docs/stories/skus/Skus.stories.tsx   |   20 +-
 .../stories/skus/SkusContainer.stories.tsx    |   31 +-
 .../docs/stories/skus/SkusField.stories.tsx   |   62 +-
 packages/docs/tsconfig.json                   |   49 +-
 .../.storybook/addon-gh-repository/Tool.tsx   |   10 +-
 .../addon-gh-repository/constants.ts          |    7 +-
 .../.storybook/commercelayer.theme.ts         |   12 +-
 packages/document/.storybook/main.ts          |    9 +-
 packages/document/.storybook/manager.ts       |    6 +-
 packages/document/.storybook/preview.tsx      |   28 +-
 packages/document/package.json                |    2 +-
 .../document/public/storybook-manager.css     |   16 +-
 .../document/public/storybook-preview.css     |  102 +-
 packages/document/src/App.tsx                 |   16 +-
 packages/document/src/main.tsx                |    2 +-
 .../document/src/stories/_internals/Code.tsx  |    2 +-
 .../src/stories/_internals/CommerceLayer.tsx  |   19 +-
 .../src/stories/_internals/OrderStorage.tsx   |  151 +-
 .../src/stories/_internals/useGetToken.ts     |  110 +-
 .../AvailabilityTemplate.stories.tsx          |   11 +-
 .../availability/availability.stories.tsx     |   40 +-
 .../stories/cart/AddToCartButton.stories.tsx  |   41 +-
 .../src/stories/cart/CartLink.stories.tsx     |   23 +-
 .../src/stories/cart/HostedCart.stories.tsx   |   26 +-
 .../src/stories/cart/MiniCart.stories.tsx     |   25 +-
 .../src/stories/orders/Order.stories.tsx      |   33 +-
 .../stories/orders/OrderContainer.stories.tsx |    7 +-
 .../prices/PricesContainer.stories.tsx        |    4 +-
 .../src/stories/prices/prices.stories.tsx     |   46 +-
 .../src/stories/skus/SkuList.stories.tsx      |    2 +-
 .../skus/SkuListsContainer.stories.tsx        |    2 +-
 .../src/stories/skus/SkusField.stories.tsx    |   55 +-
 .../src/stories/skus/skus.stories.tsx         |    4 +-
 packages/document/src/vite-env.d.ts           |    2 +-
 packages/document/tsconfig.app.json           |    4 +-
 packages/document/tsconfig.json               |    5 +-
 packages/document/vite.config.ts              |    4 +-
 .../useAvailability.interceptors.test.ts      |   15 +-
 .../src/availability/useAvailability.test.ts  |    6 +-
 .../hooks/src/availability/useAvailability.ts |   44 +-
 packages/hooks/src/orders/useOrder.ts         |   25 +-
 .../hooks/src/prices/pricesBatchStore.test.ts |    8 +-
 .../src/prices/usePrices.interceptors.test.ts |   20 +-
 packages/hooks/src/prices/usePrices.test.ts   |  175 +-
 packages/hooks/src/prices/usePrices.ts        |   57 +-
 packages/hooks/src/sku_lists/useSkuList.ts    |    8 +-
 .../useSkuLists.interceptors.test.ts          |   42 +-
 packages/hooks/src/sku_lists/useSkuLists.ts   |   17 +-
 .../hooks/src/skus/skusBatchStore.test.ts     |    8 +-
 .../src/skus/useSkus.interceptors.test.ts     |   25 +-
 packages/hooks/src/skus/useSkus.test.ts       |  104 +-
 packages/hooks/src/skus/useSkus.ts            |   50 +-
 .../.nx/workspace-data/file-map.json          |   42 +-
 .../.nx/workspace-data/project-graph.json     |    2 +-
 .../.nx/workspace-data/source-maps.json       |    2 +-
 packages/react-components/_vitest.config.mts  |  127 +-
 .../react-components/mocks/getAccessToken.ts  |   30 +-
 packages/react-components/mocks/handlers.ts   |    8 +-
 .../resources/orders/customer-addresses.ts    |   40 +-
 .../resources/orders/customer-orders-empty.ts |  302 +-
 .../mocks/resources/orders/customer-orders.ts | 3147 +++++------
 packages/react-components/mocks/server.ts     |    4 +-
 packages/react-components/mocks/setup.ts      |    2 +-
 .../specs/auth/commerce-layer.spec.tsx        |   20 +-
 .../specs/orders/add-to-cart-button.spec.tsx  |   74 +-
 .../specs/orders/checkout-link.spec.tsx       |  125 +-
 .../specs/orders/hosted-cart.spec.tsx         |   18 +-
 .../specs/orders/order.spec.tsx               |   34 +-
 .../specs/prices/price.spec.tsx               |   22 +-
 .../specs/prices/prices-container.spec.tsx    |   48 +-
 .../skus/availability-container.spec.tsx      |   23 +-
 .../skus/sku-lists-container-unit.spec.tsx    |   55 +-
 .../specs/skus/sku-lists-container.spec.tsx   |   24 +-
 .../specs/skus/skus-container.spec.tsx        |   36 +-
 .../specs/skus/skus-unit.spec.tsx             |  223 +-
 .../react-components/specs/utils/getToken.ts  |   46 +-
 .../react-components/specs/utils/toJSON.ts    |    2 +-
 .../specs/utils/use-custom-context.spec.tsx   |    8 +-
 .../src/components/ExternalFunction.tsx       |    6 +-
 .../src/components/MetadataInput.tsx          |   10 +-
 .../src/components/SubmitButton.tsx           |   18 +-
 .../src/components/addresses/Address.tsx      |   59 +-
 .../addresses/AddressCountrySelector.tsx      |   36 +-
 .../src/components/addresses/AddressInput.tsx |   14 +-
 .../addresses/AddressInputSelect.tsx          |   23 +-
 .../addresses/AddressStateSelector.tsx        |   39 +-
 .../addresses/AddressesContainer.tsx          |   35 +-
 .../components/addresses/AddressesEmpty.tsx   |   16 +-
 .../addresses/BillingAddressContainer.tsx     |   46 +-
 .../addresses/BillingAddressForm.tsx          |   30 +-
 .../addresses/SaveAddressesButton.tsx         |   46 +-
 .../addresses/ShippingAddressContainer.tsx    |   38 +-
 .../addresses/ShippingAddressForm.tsx         |   45 +-
 .../src/components/auth/CommerceLayer.tsx     |    6 +-
 .../customers/CustomerAddressForm.tsx         |   73 +-
 .../customers/CustomerContainer.tsx           |  100 +-
 .../components/customers/CustomerField.tsx    |   24 +-
 .../components/customers/CustomerInput.tsx    |   55 +-
 .../customers/CustomerPaymentSource.tsx       |    7 +-
 .../customers/CustomerPaymentSourceEmpty.tsx  |   22 +-
 .../components/customers/MyAccountLink.tsx    |   51 +-
 .../components/customers/MyIdentityLink.tsx   |   11 +-
 .../customers/SaveCustomerButton.tsx          |   23 +-
 .../src/components/errors/Errors.tsx          |   24 +-
 .../src/components/gift_cards/GiftCard.tsx    |   24 +-
 .../gift_cards/GiftCardContainer.tsx          |   25 +-
 .../gift_cards/GiftCardCurrencySelector.tsx   |   14 +-
 .../components/gift_cards/GiftCardInput.tsx   |   14 +-
 .../gift_cards/GiftCardOrCouponCode.tsx       |    9 +-
 .../gift_cards/GiftCardOrCouponForm.tsx       |   66 +-
 .../gift_cards/GiftCardOrCouponInput.tsx      |   33 +-
 .../GiftCardOrCouponRemoveButton.tsx          |    9 +-
 .../InStockSubscriptionButton.tsx             |   39 +-
 .../InStockSubscriptionsContainer.tsx         |   35 +-
 .../src/components/line_items/LineItem.tsx    |   37 +-
 .../components/line_items/LineItemAmount.tsx  |   22 +-
 .../components/line_items/LineItemCode.tsx    |   30 +-
 .../components/line_items/LineItemField.tsx   |   22 +-
 .../components/line_items/LineItemImage.tsx   |   26 +-
 .../components/line_items/LineItemName.tsx    |   18 +-
 .../components/line_items/LineItemOption.tsx  |   28 +-
 .../components/line_items/LineItemOptions.tsx |   21 +-
 .../line_items/LineItemQuantity.tsx           |   22 +-
 .../line_items/LineItemRemoveLink.tsx         |   36 +-
 .../line_items/LineItemsContainer.tsx         |   62 +-
 .../components/line_items/LineItemsCount.tsx  |   32 +-
 .../components/line_items/LineItemsEmpty.tsx  |   18 +-
 .../src/components/orders/AddToCartButton.tsx |   12 +-
 .../components/orders/AdjustmentAmount.tsx    |    8 +-
 .../src/components/orders/CheckoutLink.tsx    |   33 +-
 .../src/components/orders/DiscountAmount.tsx  |    8 +-
 .../src/components/orders/HostedCart.tsx      |   28 +-
 .../src/components/orders/Order.tsx           |    4 +-
 .../src/components/orders/OrderContainer.tsx  |    2 +-
 .../src/components/orders/OrderList.tsx       |  200 +-
 .../src/components/orders/OrderListEmpty.tsx  |   16 +-
 .../orders/OrderListPaginationButtons.tsx     |   62 +-
 .../orders/OrderListPaginationInfo.tsx        |   32 +-
 .../src/components/orders/OrderListRow.tsx    |   46 +-
 .../src/components/orders/OrderNumber.tsx     |    8 +-
 .../src/components/orders/OrderStorage.tsx    |   12 +-
 .../components/orders/PaymentMethodAmount.tsx |    8 +-
 .../components/orders/PlaceOrderButton.tsx    |   81 +-
 .../components/orders/PlaceOrderContainer.tsx |   44 +-
 .../orders/PrivacyAndTermsCheckbox.tsx        |    8 +-
 .../src/components/orders/ShippingAmount.tsx  |    8 +-
 .../src/components/orders/SubTotalAmount.tsx  |    8 +-
 .../src/components/orders/TaxesAmount.tsx     |    8 +-
 .../src/components/orders/TotalAmount.tsx     |    3 +-
 .../src/components/parcels/ParcelField.tsx    |   20 +-
 .../src/components/parcels/ParcelLineItem.tsx |   13 +-
 .../parcels/ParcelLineItemField.tsx           |   24 +-
 .../parcels/ParcelLineItemsCount.tsx          |   30 +-
 .../src/components/parcels/Parcels.tsx        |    6 +-
 .../src/components/parcels/ParcelsCount.tsx   |   30 +-
 .../payment_gateways/AdyenGateway.tsx         |    7 +-
 .../payment_gateways/BraintreeGateway.tsx     |   53 +-
 .../payment_gateways/CheckoutComGateway.tsx   |   21 +-
 .../payment_gateways/ExternalGateway.tsx      |   16 +-
 .../payment_gateways/KlarnaGateway.tsx        |   58 +-
 .../payment_gateways/PaymentGateway.tsx       |   21 +-
 .../payment_gateways/PaypalGateway.tsx        |   37 +-
 .../payment_gateways/StripeGateway.tsx        |   12 +-
 .../payment_gateways/WireTransferGateway.tsx  |   40 +-
 .../payment_methods/PaymentMethod.tsx         |   51 +-
 .../payment_methods/PaymentMethodName.tsx     |   22 +-
 .../payment_methods/PaymentMethodPrice.tsx    |   41 +-
 .../PaymentMethodRadioButton.tsx              |   53 +-
 .../PaymentMethodsContainer.tsx               |   32 +-
 .../payment_source/AdyenPayment.tsx           |   87 +-
 .../payment_source/BraintreePayment.tsx       |  178 +-
 .../payment_source/CheckoutComPayment.tsx     |   17 +-
 .../payment_source/KlarnaPayment.tsx          |   22 +-
 .../payment_source/PaymentSource.tsx          |   25 +-
 .../payment_source/PaymentSourceBrandIcon.tsx |   37 +-
 .../payment_source/PaymentSourceBrandName.tsx |   28 +-
 .../PaymentSourceDeleteButton.tsx             |    2 +-
 .../payment_source/PaymentSourceDetail.tsx    |   36 +-
 .../PaymentSourceEditButton.tsx               |   19 +-
 .../payment_source/PaypalPayment.tsx          |   34 +-
 .../payment_source/StripeExpressPayment.tsx   |   27 +-
 .../payment_source/StripePayment.tsx          |   16 +-
 .../payment_source/WireTransferPayment.tsx    |   33 +-
 .../src/components/prices/Price.tsx           |    8 +-
 .../src/components/prices/PricesContainer.tsx |   47 +-
 .../src/components/shipments/Shipment.tsx     |   42 +-
 .../components/shipments/ShipmentField.tsx    |   30 +-
 .../shipments/ShipmentsContainer.tsx          |   84 +-
 .../components/shipments/ShipmentsCount.tsx   |   30 +-
 .../shipping_methods/ShippingMethod.tsx       |   24 +-
 .../shipping_methods/ShippingMethodName.tsx   |   22 +-
 .../shipping_methods/ShippingMethodPrice.tsx  |   46 +-
 .../ShippingMethodRadioButton.tsx             |   24 +-
 .../components/skus/AvailabilityContainer.tsx |   21 +-
 .../components/skus/AvailabilityTemplate.tsx  |   23 +-
 .../src/components/skus/DeliveryLeadTime.tsx  |   13 +-
 .../src/components/skus/Sku.tsx               |   11 +-
 .../src/components/skus/SkuList.tsx           |   21 +-
 .../src/components/skus/SkuListsContainer.tsx |   21 +-
 .../src/components/skus/SkusContainer.tsx     |    6 +-
 .../stock_transfers/StockTransfer.tsx         |   24 +-
 .../stock_transfers/StockTransferField.tsx    |   24 +-
 .../components/utils/AddressCardsTemplate.tsx |   34 +-
 .../src/components/utils/BaseField.tsx        |   29 +-
 .../src/components/utils/BaseInput.tsx        |   11 +-
 .../src/components/utils/BaseOrderPrice.tsx   |   41 +-
 .../src/components/utils/BaseSelect.tsx       |   17 +-
 .../src/components/utils/ErrorBoundary.tsx    |    8 +-
 .../utils/GenericFieldComponent.tsx           |   85 +-
 .../src/components/utils/Parent.tsx           |    7 +-
 .../components/utils/PaymentCardsTemplate.tsx |   33 +-
 .../src/components/utils/PriceTemplate.tsx    |   14 +-
 .../src/components/utils/getAllErrors.tsx     |   17 +-
 .../react-components/src/config/currency.ts   |  376 +-
 .../src/context/AddressChildrenContext.ts     |    6 +-
 .../src/context/AddressContext.ts             |   10 +-
 .../src/context/BillingAddressContext.ts      |    8 +-
 .../src/context/BillingAddressFormContext.ts  |    5 +-
 .../context/CouponAndGiftCardFormContext.ts   |    6 +-
 .../src/context/CustomerAddressFormContext.ts |   13 +-
 .../src/context/CustomerContext.ts            |   14 +-
 .../context/CustomerPaymentSourceContext.ts   |    4 +-
 .../src/context/ExternalFunctionContext.ts    |   17 +-
 .../src/context/GiftCardContext.ts            |    8 +-
 .../src/context/InStockSubscriptionContext.ts |   12 +-
 .../src/context/LineItemChildrenContext.ts    |    7 +-
 .../src/context/LineItemContext.ts            |    6 +-
 .../context/LineItemOptionChildrenContext.ts  |    9 +-
 .../src/context/OrderListChildrenContext.ts   |   20 +-
 .../src/context/OrderListPaginationContext.ts |    2 +-
 .../src/context/OrderStorageContext.ts        |   18 +-
 .../src/context/ParcelChildrenContext.ts      |    4 +-
 .../context/ParcelLineItemChildrenContext.ts  |    4 +-
 .../context/PaymentMethodChildrenContext.ts   |    7 +-
 .../src/context/PaymentMethodContext.ts       |   12 +-
 .../src/context/PaymentSourceContext.ts       |   24 +-
 .../src/context/PlaceOrderContext.ts          |   12 +-
 .../src/context/ShipmentChildrenContext.ts    |    8 +-
 .../src/context/ShipmentContext.ts            |    8 +-
 .../src/context/ShippingAddressContext.ts     |    8 +-
 .../src/context/ShippingAddressFormContext.ts |    4 +-
 .../context/ShippingMethodChildrenContext.ts  |    7 +-
 .../src/context/SkuChildrenContext.ts         |    4 +-
 .../src/context/SkuListsContext.ts            |    3 +-
 .../context/StockTransferChildrenContext.ts   |    7 +-
 .../src/hooks/useCommerceLayer.ts             |   14 +-
 .../src/hooks/useCustomerContainer.ts         |   25 +-
 .../src/hooks/useOrderContainer.ts            |   42 +-
 .../src/hooks/useOrderState.ts                |   32 +-
 .../src/reducers/AddressReducer.ts            |   69 +-
 .../src/reducers/BillingAddressReducer.ts     |   61 +-
 .../src/reducers/CustomerReducer.ts           |  227 +-
 .../src/reducers/GiftCardReducer.ts           |  102 +-
 .../reducers/InStockSubscriptionReducer.ts    |   45 +-
 .../src/reducers/LineItemReducer.ts           |  117 +-
 .../src/reducers/OrderReducer.ts              |   96 +-
 .../src/reducers/PaymentMethodReducer.ts      |   48 +-
 .../src/reducers/PlaceOrderReducer.ts         |   41 +-
 .../src/reducers/ShipmentReducer.ts           |   71 +-
 .../src/reducers/ShippingAddressReducer.ts    |   61 +-
 .../src/typings/environment.d.ts              |    2 +-
 .../react-components/src/typings/globals.ts   |   14 +-
 .../react-components/src/typings/index.ts     |   44 +-
 .../react-components/src/utils/PropsType.ts   |    2 +-
 .../src/utils/addressesManager.ts             |   60 +-
 .../src/utils/adyen/manageGiftCard.ts         |   17 +-
 .../react-components/src/utils/baseReducer.ts |    2 +-
 .../react-components/src/utils/browserInfo.ts |   16 +-
 .../src/utils/canPlaceOrder.ts                |    4 +-
 .../src/utils/checkIncludeResource.ts         |   13 +-
 .../src/utils/compareObjAttribute.ts          |    6 +-
 .../src/utils/countryStateCity.ts             |   12 +-
 .../react-components/src/utils/currencies.ts  |   13 +-
 .../src/utils/customMessages.ts               |    6 +-
 .../src/utils/customerOrderOptions.ts         |    4 +-
 packages/react-components/src/utils/events.ts |   12 +-
 .../src/utils/expressPaymentHelper.ts         |   38 +-
 .../src/utils/filterChildren.ts               |   14 +-
 .../react-components/src/utils/formCleaner.ts |   11 +-
 .../src/utils/getApplicationLink.ts           |   67 +-
 .../src/utils/getCardDetails.ts               |   32 +-
 .../src/utils/getCustomerIdByToken.ts         |    2 +-
 .../react-components/src/utils/getDomain.ts   |    6 +-
 .../react-components/src/utils/getErrors.ts   |   26 +-
 .../src/utils/getLineItemsCount.ts            |   11 +-
 .../src/utils/getLoaderComponent.tsx          |    4 +-
 .../src/utils/getPaymentAttributes.ts         |   25 +-
 .../react-components/src/utils/getPrices.tsx  |   25 +-
 .../react-components/src/utils/getPublicIp.ts |    8 +-
 .../src/utils/hasSubscriptions.ts             |    2 +-
 .../src/utils/hooks/useCustomContext.ts       |    6 +-
 packages/react-components/src/utils/icons.tsx |   28 +-
 .../react-components/src/utils/isEmpty.ts     |    4 +-
 .../src/utils/isGuestToken.ts                 |    2 +-
 packages/react-components/src/utils/jwt.ts    |    6 +-
 .../src/utils/localStorage.ts                 |   25 +-
 packages/react-components/src/utils/omit.ts   |   15 +-
 .../src/utils/organization.ts                 |   10 +-
 .../payment-methods/sortPaymentMethods.ts     |    4 +-
 .../src/utils/placeholderImages.ts            |    4 +-
 .../react-components/src/utils/promisify.ts   |    2 +-
 .../react-components/src/utils/replace.ts     |    8 +-
 .../src/utils/scrollbarWidth.ts               |    8 +-
 .../react-components/src/utils/shipments.ts   |    6 +-
 .../src/utils/snakeToCamelCase.ts             |   15 +-
 .../src/utils/stripe/retrievePaymentIntent.ts |   11 +-
 .../src/utils/triggerAttributeHelper.ts       |   20 +-
 ...eOrderSubscriptionCustomerPaymentSource.ts |   31 +-
 .../src/utils/validateFormFields.ts           |   38 +-
 .../react-components/tsconfig.prod.esm.json   |   62 +-
 packages/react-components/vitest.config.mts   |  133 +-
 playwright.config.ts                          |   16 +-
 423 files changed, 11732 insertions(+), 15040 deletions(-)

diff --git a/.gitignore b/.gitignore
index d412007f..fe210fbc 100644
--- a/.gitignore
+++ b/.gitignore
@@ -136,4 +136,7 @@ dist
 .DS_Store
 
 # Storybook
-storybook-static
\ No newline at end of file
+storybook-static
+
+# Blog articles
+episode-*
diff --git a/.ncurc.cjs b/.ncurc.cjs
index 02031b6e..dc2a84d8 100644
--- a/.ncurc.cjs
+++ b/.ncurc.cjs
@@ -1,6 +1,3 @@
 module.exports = {
-  reject: [
-    'pnpm',
-    'iframe-resizer'
-  ]
-}
\ No newline at end of file
+  reject: ["pnpm", "iframe-resizer"],
+}
diff --git a/biome.json b/biome.json
index 61998fd4..db23a36d 100644
--- a/biome.json
+++ b/biome.json
@@ -7,7 +7,13 @@
   },
   "files": {
     "ignoreUnknown": true,
-    "includes": ["**", "!dist", "!coverage", "!*.min.js"]
+    "includes": [
+      "**",
+      "!dist",
+      "!coverage",
+      "!*.min.js",
+      "!**/mocks/resources/orders/customer-orders-full.ts"
+    ]
   },
   "formatter": {
     "enabled": true,
diff --git a/examples/_app.tsx b/examples/_app.tsx
index d6c0b77c..8898894f 100644
--- a/examples/_app.tsx
+++ b/examples/_app.tsx
@@ -1,5 +1,5 @@
-import '../styles/styles.css'
-import { AppProps } from 'next/app'
+import "../styles/styles.css"
+import { AppProps } from "next/app"
 
 function MyApp({ Component, pageProps }: AppProps) {
   return <Component {...pageProps} />
diff --git a/examples/cart.tsx b/examples/cart.tsx
index f8f06b6a..66aacc53 100644
--- a/examples/cart.tsx
+++ b/examples/cart.tsx
@@ -1,5 +1,5 @@
-import { useState, useEffect, Fragment } from 'react'
-import { getSalesChannelToken } from '@commercelayer/js-auth'
+import { useState, useEffect, Fragment } from "react"
+import { getSalesChannelToken } from "@commercelayer/js-auth"
 import {
   CommerceLayer,
   OrderContainer,
@@ -31,20 +31,16 @@ import {
   SkusContainer,
   SkuField,
   Skus,
-} from 'packages/react-components/src'
+} from "packages/react-components/src"
 
 const clientId = process.env.NEXT_PUBLIC_CLIENT_ID as string
 const endpoint = process.env.NEXT_PUBLIC_ENDPOINT as string
 const scope = process.env.NEXT_PUBLIC_MARKET_ID as string
 
-const skus = [
-  'BABYONBU000000E63E7412MX',
-  'CANVASAU000000FFFFFF1824',
-  'BABYONBU000000E63E746MXX',
-]
+const skus = ["BABYONBU000000E63E7412MX", "CANVASAU000000FFFFFF1824", "BABYONBU000000E63E746MXX"]
 
 export default function Cart() {
-  const [token, setToken] = useState('')
+  const [token, setToken] = useState("")
   useEffect(() => {
     const getToken = async () => {
       const token = await getSalesChannelToken({
@@ -61,17 +57,13 @@ export default function Cart() {
       <CommerceLayer accessToken={token} endpoint={endpoint}>
         <div className="container mx-auto mt-5 px-5">
           <OrderStorage persistKey="orderUS">
-            <OrderContainer attributes={{ return_url: 'https://test.co' }}>
+            <OrderContainer attributes={{ return_url: "https://test.co" }}>
               <SkusContainer skus={skus}>
                 <ItemContainer>
                   <PricesContainer>
                     <AvailabilityContainer>
                       <Skus>
-                        <SkuField
-                          attribute="image_url"
-                          tagElement="img"
-                          width={100}
-                        />
+                        <SkuField attribute="image_url" tagElement="img" width={100} />
                         <SkuField attribute="code" tagElement="p" />
                         <div className="text-center p-3">
                           <div className="flex flex-row flex-wrap justify-center">
@@ -106,36 +98,18 @@ export default function Cart() {
               <h1 className="text-4xl border-b-2 my-5">Shopping Bag</h1>
               <LineItemsContainer>
                 <p className="text-sm m-2">
-                  Your shopping bag contains{' '}
-                  <LineItemsCount
-                    data-test="items-count"
-                    className="font-bold"
-                  />{' '}
-                  items
+                  Your shopping bag contains{" "}
+                  <LineItemsCount data-test="items-count" className="font-bold" /> items
                 </p>
                 <div className="flex flex-col p-2">
                   <LineItemsEmpty data-test="line-items-empty" />
                   <LineItem>
                     <div className="flex justify-around items-center border-b p-5">
                       <LineItemImage className="p-2" width={80} />
-                      <LineItemName
-                        data-test="line-item-name"
-                        className="p-2"
-                      />
-                      <LineItemQuantity
-                        data-test="line-item-quantity"
-                        max={100}
-                        className="p-2"
-                      />
-                      <Errors
-                        className="text-red-700 p-2"
-                        resource="line_items"
-                        field="quantity"
-                      />
-                      <LineItemAmount
-                        data-test="line-item-total"
-                        className="p-2"
-                      />
+                      <LineItemName data-test="line-item-name" className="p-2" />
+                      <LineItemQuantity data-test="line-item-quantity" max={100} className="p-2" />
+                      <Errors className="text-red-700 p-2" resource="line_items" field="quantity" />
+                      <LineItemAmount data-test="line-item-total" className="p-2" />
                       <LineItemRemoveLink
                         data-test="line-item-remove"
                         className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
@@ -145,20 +119,14 @@ export default function Cart() {
                   <LineItem type="gift_cards">
                     <div className="flex justify-between items-center border-b p-5">
                       <LineItemImage className="p-2" width={40} />
-                      <LineItemName
-                        data-test="line-item-name"
-                        className="p-2"
-                      />
+                      <LineItemName data-test="line-item-name" className="p-2" />
                       <LineItemQuantity
                         data-test="line-item-quantity"
                         max={10}
                         className="p-2"
                         disabled
                       />
-                      <LineItemAmount
-                        data-test="line-item-total"
-                        className="p-2"
-                      />
+                      <LineItemAmount data-test="line-item-total" className="p-2" />
                       <LineItemRemoveLink
                         data-test="line-item-remove"
                         className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
@@ -168,19 +136,9 @@ export default function Cart() {
                   <LineItem type="bundles">
                     <div className="flex justify-between items-center border-b p-5">
                       <LineItemImage className="p-2" width={40} />
-                      <LineItemName
-                        data-test="line-item-name"
-                        className="p-2"
-                      />
-                      <LineItemQuantity
-                        data-test="line-item-quantity"
-                        max={10}
-                        className="p-2"
-                      />
-                      <LineItemAmount
-                        data-test="line-item-total"
-                        className="p-2"
-                      />
+                      <LineItemName data-test="line-item-name" className="p-2" />
+                      <LineItemQuantity data-test="line-item-quantity" max={10} className="p-2" />
+                      <LineItemAmount data-test="line-item-total" className="p-2" />
                       <LineItemRemoveLink
                         data-test="line-item-remove"
                         className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
@@ -190,19 +148,9 @@ export default function Cart() {
                   <LineItem type="adjustments">
                     <div className="flex justify-between items-center border-b p-5">
                       <LineItemImage className="p-2" width={40} />
-                      <LineItemName
-                        data-test="line-item-name"
-                        className="p-2"
-                      />
-                      <LineItemQuantity
-                        data-test="line-item-quantity"
-                        max={10}
-                        className="p-2"
-                      />
-                      <LineItemAmount
-                        data-test="line-item-total"
-                        className="p-2"
-                      />
+                      <LineItemName data-test="line-item-name" className="p-2" />
+                      <LineItemQuantity data-test="line-item-quantity" max={10} className="p-2" />
+                      <LineItemAmount data-test="line-item-total" className="p-2" />
                       <LineItemRemoveLink
                         data-test="line-item-remove"
                         className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
diff --git a/examples/categoryOrder.tsx b/examples/categoryOrder.tsx
index 0f49bc17..d8a0c3c5 100644
--- a/examples/categoryOrder.tsx
+++ b/examples/categoryOrder.tsx
@@ -1,29 +1,29 @@
-import React, { useState, useEffect, Fragment } from 'react'
-import { getSalesChannelToken } from '@commercelayer/js-auth'
-import CommerceLayer from '../#components/auth/CommerceLayer'
-import OrderContainer from '../#components/OrderContainer'
-import PriceContainer from '../#components/prices/PricesContainer'
-import Price from '../#components/Price'
-import AddToCart from '../#components/orders/AddToCartButton'
-import LineItemsContainer from '../#components/LineItemsContainer'
-import LineItem from '../#components/line_items/LineItem'
-import LineItemImage from '../#components/LineItemImage'
-import LineItemName from '../#components/LineItemName'
-import LineItemQuantity from '../#components/LineItemQuantity'
-import LineItemAmount from '../#components/LineItemAmount'
-import LineItemRemoveLink from '../#components/LineItemRemoveLink'
-import CheckoutLink from '../#components/orders/CheckoutLink'
-import SubTotalAmount from '../#components/SubTotalAmount'
-import QuantitySelector from '../#components/skus/QuantitySelector'
-import LineItemsCount from '../#components/LineItemsCount'
-import TotalAmount from '../#components/orders/TotalAmount'
-import DiscountAmount from '../#components/orders/DiscountAmount'
-import ShippingAmount from '../#components/orders/ShippingAmount'
-import TaxesAmount from '../#components/TaxesAmount'
-import GiftCardAmount from '../#components/orders/GiftCardAmount'
-import AvailabilityContainer from '../#components/AvailabilityContainer'
-import AvailabilityTemplate from '../#components/skus/AvailabilityTemplate'
-import ItemContainer from '../#components/orders/ItemContainer'
+import React, { useState, useEffect, Fragment } from "react"
+import { getSalesChannelToken } from "@commercelayer/js-auth"
+import CommerceLayer from "../#components/auth/CommerceLayer"
+import OrderContainer from "../#components/OrderContainer"
+import PriceContainer from "../#components/prices/PricesContainer"
+import Price from "../#components/Price"
+import AddToCart from "../#components/orders/AddToCartButton"
+import LineItemsContainer from "../#components/LineItemsContainer"
+import LineItem from "../#components/line_items/LineItem"
+import LineItemImage from "../#components/LineItemImage"
+import LineItemName from "../#components/LineItemName"
+import LineItemQuantity from "../#components/LineItemQuantity"
+import LineItemAmount from "../#components/LineItemAmount"
+import LineItemRemoveLink from "../#components/LineItemRemoveLink"
+import CheckoutLink from "../#components/orders/CheckoutLink"
+import SubTotalAmount from "../#components/SubTotalAmount"
+import QuantitySelector from "../#components/skus/QuantitySelector"
+import LineItemsCount from "../#components/LineItemsCount"
+import TotalAmount from "../#components/orders/TotalAmount"
+import DiscountAmount from "../#components/orders/DiscountAmount"
+import ShippingAmount from "../#components/orders/ShippingAmount"
+import TaxesAmount from "../#components/TaxesAmount"
+import GiftCardAmount from "../#components/orders/GiftCardAmount"
+import AvailabilityContainer from "../#components/AvailabilityContainer"
+import AvailabilityTemplate from "../#components/skus/AvailabilityTemplate"
+import ItemContainer from "../#components/orders/ItemContainer"
 
 const clientId = process.env.NEXT_PUBLIC_CLIENT_ID as string
 const endpoint = process.env.NEXT_PUBLIC_ENDPOINT as string
@@ -32,7 +32,7 @@ const scope = process.env.NEXT_PUBLIC_MARKET_ID as string
 // const password = process.env.NEXT_PUBLIC_CUSTOMER_PASSWORD as string
 
 export default function Order() {
-  const [token, setToken] = useState('')
+  const [token, setToken] = useState("")
   useEffect(() => {
     const getToken = async () => {
       const auth = await getSalesChannelToken({
@@ -69,10 +69,7 @@ export default function Order() {
                         BABYONBU000000E63E746MXX
                       </p>
                     </div>
-                    <div
-                      data-cy="price-BABYONBU000000E63E746MXX"
-                      className="pt-2 text-center"
-                    >
+                    <div data-cy="price-BABYONBU000000E63E746MXX" className="pt-2 text-center">
                       <Price
                         skuCode="BABYONBU000000E63E746MXX"
                         className="text-green-600 text-xl m-1"
@@ -137,9 +134,9 @@ export default function Order() {
                         skuCode="LSLEEVMMFFFFFF000000LXXX"
                         className="w-2/3 bg-green-500 hover:bg-green-700 text-white font-bold py-2 px-4 rounded"
                         lineItem={{
-                          name: 'Darth Vader Sleeve',
+                          name: "Darth Vader Sleeve",
                           imageUrl:
-                            'https://i.pinimg.com/736x/a5/32/de/a532de337eff9b1c1c4bfb8df73acea4--darth-vader-stencil-darth-vader-head.jpg?b=t',
+                            "https://i.pinimg.com/736x/a5/32/de/a532de337eff9b1c1c4bfb8df73acea4--darth-vader-stencil-darth-vader-head.jpg?b=t",
                         }}
                       />
                     </div>
@@ -197,18 +194,14 @@ export default function Order() {
             <h1 className="text-4xl border-b-2 my-5">Shopping Bag</h1>
             <LineItemsContainer>
               <p className="text-sm m-2">
-                Your shopping bag contains{' '}
-                <LineItemsCount id="items-count" className="font-bold" /> items
+                Your shopping bag contains <LineItemsCount id="items-count" className="font-bold" />{" "}
+                items
               </p>
               <LineItem type="skus">
                 <div className="flex justify-around items-center border-b">
                   <LineItemImage className="p-2" width={80} />
                   <LineItemName id="line-item-name" className="p-2" />
-                  <LineItemQuantity
-                    id="line-item-quantity"
-                    max={10}
-                    className="p-2"
-                  />
+                  <LineItemQuantity id="line-item-quantity" max={10} className="p-2" />
                   <LineItemAmount id="line-item-total" className="p-2" />
                   <LineItemRemoveLink
                     id="line-item-remove"
diff --git a/examples/checkout/addresses.tsx b/examples/checkout/addresses.tsx
index e6e33b44..ff074b29 100644
--- a/examples/checkout/addresses.tsx
+++ b/examples/checkout/addresses.tsx
@@ -1,7 +1,7 @@
-import React, { useState, useEffect, Fragment } from 'react'
-import { getSalesChannelToken } from '@commercelayer/js-auth'
-import { Nav } from '..'
-import Head from 'next/head'
+import React, { useState, useEffect, Fragment } from "react"
+import { getSalesChannelToken } from "@commercelayer/js-auth"
+import { Nav } from ".."
+import Head from "next/head"
 import {
   CommerceLayer,
   OrderContainer,
@@ -16,19 +16,19 @@ import {
   CustomerInput,
   SaveCustomerButton,
   AddressStateSelector,
-} from 'packages/react-components/src'
-import { useRouter } from 'next/router'
-import getSdk from '#utils/getSdk'
+} from "packages/react-components/src"
+import { useRouter } from "next/router"
+import getSdk from "#utils/getSdk"
 
 const clientId = process.env.NEXT_PUBLIC_CLIENT_ID as string
 const endpoint = process.env.NEXT_PUBLIC_ENDPOINT as string
 const scope = process.env.NEXT_PUBLIC_MARKET_ID as string
 
-let orderId = ''
+let orderId = ""
 
 export default function Main() {
-  const [token, setToken] = useState('')
-  const [customerEmail, setCustomerEmail] = useState('')
+  const [token, setToken] = useState("")
+  const [customerEmail, setCustomerEmail] = useState("")
   const [shipToDifferentAddress, setShipToDifferentAddress] = useState(false)
   const [saveOnBlur, setSaveOnBlur] = useState(false)
   const [isBusiness, setIsBusiness] = useState(false)
@@ -45,7 +45,7 @@ export default function Main() {
       const sdk = getSdk(config)
       try {
         const order = await sdk.orders.retrieve(orderId, {
-          include: ['billing_address', 'shipping_address'],
+          include: ["billing_address", "shipping_address"],
         })
         if (order?.billing_address) {
           setBillingAddress(order.billing_address)
@@ -79,15 +79,15 @@ export default function Main() {
   }, [token])
   const messages: any = [
     {
-      code: 'EMPTY_ERROR',
-      resource: 'billingAddress',
-      field: 'firstName',
+      code: "EMPTY_ERROR",
+      resource: "billingAddress",
+      field: "firstName",
       message: `Can't be blank`,
     },
     {
-      code: 'VALIDATION_ERROR',
-      resource: 'billingAddress',
-      field: 'email',
+      code: "VALIDATION_ERROR",
+      resource: "billingAddress",
+      field: "email",
       message: `Must be valid email`,
     },
   ]
@@ -108,7 +108,7 @@ export default function Main() {
       <Head>
         <script src="http://localhost:8097"></script>
       </Head>
-      <Nav links={['/multiOrder', '/multiApp', '/giftCard']} />
+      <Nav links={["/multiOrder", "/multiApp", "/giftCard"]} />
       <CommerceLayer accessToken={token} endpoint={endpoint}>
         <div className="container mx-auto mt-5 px-5">
           <OrderContainer orderId={orderId}>
@@ -119,7 +119,7 @@ export default function Main() {
                 type="button"
                 aria-pressed="false"
                 className={`${
-                  saveOnBlur ? 'bg-blue-500' : 'bg-gray-200'
+                  saveOnBlur ? "bg-blue-500" : "bg-gray-200"
                 } relative inline-flex flex-shrink-0 h-6 w-11 border-2 border-transparent rounded-full cursor-pointer transition-colors ease-in-out duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500`}
                 onClick={() => setSaveOnBlur(!saveOnBlur)}
               >
@@ -127,7 +127,7 @@ export default function Main() {
                 <span
                   aria-hidden="true"
                   className={`${
-                    saveOnBlur ? 'translate-x-5' : 'translate-x-0'
+                    saveOnBlur ? "translate-x-5" : "translate-x-0"
                   } inline-block h-5 w-5 rounded-full bg-white shadow transform ring-0 transition ease-in-out duration-200`}
                 ></span>
               </button>
@@ -135,10 +135,7 @@ export default function Main() {
             </div>
             <CustomerContainer isGuest>
               <div>
-                <label
-                  htmlFor="customer_email"
-                  className="block text-sm font-medium text-gray-700"
-                >
+                <label htmlFor="customer_email" className="block text-sm font-medium text-gray-700">
                   Customer email
                 </label>
                 <div className="mt-1">
@@ -160,7 +157,7 @@ export default function Main() {
                   />
                 </p>
               </div>
-              <div className={saveOnBlur ? 'hidden' : ''}>
+              <div className={saveOnBlur ? "hidden" : ""}>
                 <div className="mt-1">
                   <SaveCustomerButton
                     data-cy="save-customer-button"
@@ -194,7 +191,7 @@ export default function Main() {
                     type="button"
                     aria-pressed="false"
                     className={`${
-                      isBusiness ? 'bg-blue-500' : 'bg-gray-200'
+                      isBusiness ? "bg-blue-500" : "bg-gray-200"
                     } relative inline-flex flex-shrink-0 h-6 w-11 border-2 border-transparent rounded-full cursor-pointer transition-colors ease-in-out duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500`}
                     onClick={() => setIsBusiness(!isBusiness)}
                   >
@@ -202,7 +199,7 @@ export default function Main() {
                     <span
                       aria-hidden="true"
                       className={`${
-                        isBusiness ? 'translate-x-5' : 'translate-x-0'
+                        isBusiness ? "translate-x-5" : "translate-x-0"
                       } inline-block h-5 w-5 rounded-full bg-white shadow transform ring-0 transition ease-in-out duration-200`}
                     ></span>
                   </button>
@@ -384,8 +381,8 @@ export default function Main() {
                         name="billing_address_country_code"
                         className="mt-1 block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded-md"
                         placeholder={{
-                          value: '',
-                          label: 'Country',
+                          value: "",
+                          label: "Country",
                           disabled: true,
                         }}
                       />
@@ -413,8 +410,8 @@ export default function Main() {
                         className="mt-1 block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded-md"
                         inputClassName="mt-1 block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded-md"
                         placeholder={{
-                          value: '',
-                          label: 'Select a state',
+                          value: "",
+                          label: "Select a state",
                           disabled: true,
                         }}
                       />
@@ -528,19 +525,15 @@ export default function Main() {
                     type="button"
                     aria-pressed="false"
                     className={`${
-                      shipToDifferentAddress ? 'bg-blue-500' : 'bg-gray-200'
+                      shipToDifferentAddress ? "bg-blue-500" : "bg-gray-200"
                     } relative inline-flex flex-shrink-0 h-6 w-11 border-2 border-transparent rounded-full cursor-pointer transition-colors ease-in-out duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500`}
-                    onClick={() =>
-                      setShipToDifferentAddress(!shipToDifferentAddress)
-                    }
+                    onClick={() => setShipToDifferentAddress(!shipToDifferentAddress)}
                   >
                     <span className="sr-only">Use setting</span>
                     <span
                       aria-hidden="true"
                       className={`${
-                        shipToDifferentAddress
-                          ? 'translate-x-5'
-                          : 'translate-x-0'
+                        shipToDifferentAddress ? "translate-x-5" : "translate-x-0"
                       } inline-block h-5 w-5 rounded-full bg-white shadow transform ring-0 transition ease-in-out duration-200`}
                     ></span>
                   </button>
@@ -664,8 +657,8 @@ export default function Main() {
                         name="shipping_address_country_code"
                         className="mt-1 block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded-md"
                         placeholder={{
-                          value: '',
-                          label: 'Country',
+                          value: "",
+                          label: "Country",
                           disabled: true,
                         }}
                       />
@@ -692,8 +685,8 @@ export default function Main() {
                         name="shipping_address_state_code"
                         className="shadow-sm focus:ring-blue-500 focus:border-blue-500 block w-full sm:text-sm border-gray-300 rounded-md"
                         placeholder={{
-                          value: '',
-                          label: 'Select a state',
+                          value: "",
+                          label: "Select a state",
                           disabled: true,
                         }}
                       />
diff --git a/examples/checkout/customer/addresses-country-lock.tsx b/examples/checkout/customer/addresses-country-lock.tsx
index 8bdd5aba..605da87f 100644
--- a/examples/checkout/customer/addresses-country-lock.tsx
+++ b/examples/checkout/customer/addresses-country-lock.tsx
@@ -1,6 +1,6 @@
-import React, { useState, useEffect, Fragment } from 'react'
-import { getCustomerToken } from '@commercelayer/js-auth'
-import Head from 'next/head'
+import React, { useState, useEffect, Fragment } from "react"
+import { getCustomerToken } from "@commercelayer/js-auth"
+import Head from "next/head"
 import {
   CommerceLayer,
   OrderContainer,
@@ -16,9 +16,9 @@ import {
   Address,
   AddressField,
   ShippingAddressContainer,
-} from 'packages/react-components/src'
-import { useRouter } from 'next/router'
-import getSdk from '#utils/getSdk'
+} from "packages/react-components/src"
+import { useRouter } from "next/router"
+import getSdk from "#utils/getSdk"
 
 const clientId = process.env.NEXT_PUBLIC_CLIENT_ID as string
 const endpoint = process.env.NEXT_PUBLIC_ENDPOINT as string
@@ -26,7 +26,7 @@ const scope = process.env.NEXT_PUBLIC_MARKET_ID as string
 const username = process.env.NEXT_PUBLIC_CUSTOMER_USERNAME as string
 const password = process.env.NEXT_PUBLIC_CUSTOMER_PASSWORD as string
 
-const orderId = 'JwXQehvvyP'
+const orderId = "JwXQehvvyP"
 
 const NestedInput = ({ value }: any) => {
   return (
@@ -42,11 +42,11 @@ const NestedInput = ({ value }: any) => {
 }
 
 export default function Main() {
-  const [token, setToken] = useState('')
+  const [token, setToken] = useState("")
   const [shipToDifferentAddress, setShipToDifferentAddress] = useState(false)
   const [showBillingAddressForm, setShowBillingAddressForm] = useState(false)
   const [showShippingAddressForm, setShowShippingAddressForm] = useState(false)
-  const [billingFirstName, setBillingFirstName] = useState('')
+  const [billingFirstName, setBillingFirstName] = useState("")
   const [billingAddress, setBillingAddress] = useState({})
   const [shippingAddress, setShippingAddress] = useState({})
   const { query, pathname, push } = useRouter()
@@ -71,15 +71,15 @@ export default function Main() {
       const sdk = getSdk(config)
       try {
         const order = await sdk.orders.retrieve(orderId, {
-          include: ['billing_address', 'shipping_address'],
+          include: ["billing_address", "shipping_address"],
         })
         const billingAddress = order.billing_address
         const shippingAddress = order.shipping_address
         if (billingAddress) {
-          await sdk.addresses.update({ id: billingAddress.id, reference: '' })
+          await sdk.addresses.update({ id: billingAddress.id, reference: "" })
         }
         if (shippingAddress) {
-          await sdk.addresses.update({ id: shippingAddress.id, reference: '' })
+          await sdk.addresses.update({ id: shippingAddress.id, reference: "" })
         }
         push(pathname)
       } catch (error) {
@@ -98,15 +98,15 @@ export default function Main() {
   }, [token])
   const messages: any = [
     {
-      code: 'EMPTY_ERROR',
-      resource: 'billingAddress',
-      field: 'firstName',
+      code: "EMPTY_ERROR",
+      resource: "billingAddress",
+      field: "firstName",
       message: `Can't be blank`,
     },
     {
-      code: 'VALIDATION_ERROR',
-      resource: 'billingAddress',
-      field: 'email',
+      code: "VALIDATION_ERROR",
+      resource: "billingAddress",
+      field: "email",
       message: `Must be valid email`,
     },
   ]
@@ -116,7 +116,7 @@ export default function Main() {
       const sdk = getSdk(config)
       try {
         const order = await sdk.orders.retrieve(orderId, {
-          include: ['billing_address', 'shipping_address'],
+          include: ["billing_address", "shipping_address"],
         })
         const billing = order.billing_address
         const shipping = order.shipping_address
@@ -151,10 +151,9 @@ export default function Main() {
   }
   const handleShowBillingForm = () => {
     setShowBillingAddressForm(!showBillingAddressForm)
-    setBillingFirstName('')
+    setBillingFirstName("")
   }
-  const handleShowShippingForm = () =>
-    setShowShippingAddressForm(!showShippingAddressForm)
+  const handleShowShippingForm = () => setShowShippingAddressForm(!showShippingAddressForm)
   return (
     <Fragment>
       <Head>
@@ -164,9 +163,7 @@ export default function Main() {
         <div className="container mx-auto mt-5 px-5">
           <OrderContainer orderId={orderId}>
             <CustomerContainer>
-              <AddressesContainer
-                shipToDifferentAddress={shipToDifferentAddress}
-              >
+              <AddressesContainer shipToDifferentAddress={shipToDifferentAddress}>
                 <h2 className="p-2 font-semibold text-2xl">Billing Address</h2>
                 <div className="flex">
                   <BillingAddressContainer>
@@ -175,10 +172,7 @@ export default function Main() {
                       selectedClassName="border-blue-500"
                       data-cy="customer-billing-address"
                       deselect={showBillingAddressForm}
-                      onSelect={() =>
-                        showBillingAddressForm &&
-                        setShowBillingAddressForm(false)
-                      }
+                      onSelect={() => showBillingAddressForm && setShowBillingAddressForm(false)}
                     >
                       <div className="flex font-bold">
                         <AddressField name="first_name" />
@@ -210,7 +204,7 @@ export default function Main() {
                     </svg>
                   </button>
                 </div>
-                <div className={`${showBillingAddressForm ? '' : 'hidden'}`}>
+                <div className={`${showBillingAddressForm ? "" : "hidden"}`}>
                   <BillingAddressForm
                     autoComplete="on"
                     className="p-2"
@@ -331,8 +325,8 @@ export default function Main() {
                           name="billing_address_country_code"
                           className="mt-1 block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded-md"
                           placeholder={{
-                            value: '',
-                            label: 'Country',
+                            value: "",
+                            label: "Country",
                             disabled: true,
                           }}
                         />
@@ -447,39 +441,32 @@ export default function Main() {
                     type="button"
                     aria-pressed="false"
                     className={`${
-                      shipToDifferentAddress ? 'bg-blue-500' : 'bg-gray-200'
+                      shipToDifferentAddress ? "bg-blue-500" : "bg-gray-200"
                     } relative inline-flex flex-shrink-0 h-6 w-11 border-2 border-transparent rounded-full cursor-pointer transition-colors ease-in-out duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500`}
-                    onClick={() =>
-                      setShipToDifferentAddress(!shipToDifferentAddress)
-                    }
+                    onClick={() => setShipToDifferentAddress(!shipToDifferentAddress)}
                   >
                     <span className="sr-only">Use setting</span>
                     <span
                       aria-hidden="true"
                       className={`${
-                        shipToDifferentAddress
-                          ? 'translate-x-5'
-                          : 'translate-x-0'
+                        shipToDifferentAddress ? "translate-x-5" : "translate-x-0"
                       } inline-block h-5 w-5 rounded-full bg-white shadow transform ring-0 transition ease-in-out duration-200`}
                     ></span>
                   </button>
                   <p className="ml-5">Ship to different address</p>
                 </div>
-                <div className={`${!shipToDifferentAddress ? 'hidden' : ''}`}>
-                  <h2 className="p-2 font-semibold text-2xl">
-                    Shipping Address
-                  </h2>
+                <div className={`${!shipToDifferentAddress ? "hidden" : ""}`}>
+                  <h2 className="p-2 font-semibold text-2xl">Shipping Address</h2>
                   <div className="flex">
                     <ShippingAddressContainer>
                       <Address
                         data-test="customer-shipping-address"
                         className="w-1/2 p-2 border cursor-pointer rounded hover:border-blue-500 m-2 shadow-sm"
-                        selectedClassName={'border-blue-500'}
-                        disabledClassName={'opacity-50 cursor-not-allowed'}
+                        selectedClassName={"border-blue-500"}
+                        disabledClassName={"opacity-50 cursor-not-allowed"}
                         deselect={showShippingAddressForm}
                         onSelect={() =>
-                          showShippingAddressForm &&
-                          setShowShippingAddressForm(false)
+                          showShippingAddressForm && setShowShippingAddressForm(false)
                         }
                       >
                         <div className="flex font-bold">
@@ -512,14 +499,10 @@ export default function Main() {
                       </svg>
                     </button>
                   </div>
-                  <div
-                    className={`${!showShippingAddressForm ? 'hidden' : ''}`}
-                  >
+                  <div className={`${!showShippingAddressForm ? "hidden" : ""}`}>
                     <ShippingAddressForm
                       autoComplete="on"
-                      className={
-                        shipToDifferentAddress ? `block p-2` : `hidden`
-                      }
+                      className={shipToDifferentAddress ? `block p-2` : `hidden`}
                       reset={!showShippingAddressForm}
                     >
                       <div>
@@ -635,8 +618,8 @@ export default function Main() {
                             name="shipping_address_country_code"
                             className="mt-1 block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded-md"
                             placeholder={{
-                              value: '',
-                              label: 'Country',
+                              value: "",
+                              label: "Country",
                               disabled: true,
                             }}
                           />
@@ -767,9 +750,7 @@ export default function Main() {
               )}`}</pre>
             </div>
             <div className="mt-5">
-              <h2 className="font-semibold text-2xl">
-                Current Billing Address
-              </h2>
+              <h2 className="font-semibold text-2xl">Current Billing Address</h2>
               <Address addresses={[billingAddress as any]}>
                 <div className="flex font-bold">
                   <AddressField name="first_name" />
@@ -784,9 +765,7 @@ export default function Main() {
               </Address>
             </div>
             <div className="mt-5">
-              <h2 className="font-semibold text-2xl">
-                Current Shipping Address
-              </h2>
+              <h2 className="font-semibold text-2xl">Current Shipping Address</h2>
               <Address addresses={[shippingAddress as any]}>
                 <div className="flex font-bold">
                   <AddressField name="first_name" />
diff --git a/examples/checkout/customer/addresses.tsx b/examples/checkout/customer/addresses.tsx
index 591d23d2..1c501644 100644
--- a/examples/checkout/customer/addresses.tsx
+++ b/examples/checkout/customer/addresses.tsx
@@ -1,6 +1,6 @@
-import React, { useState, useEffect, Fragment } from 'react'
-import { getCustomerToken } from '@commercelayer/js-auth'
-import Head from 'next/head'
+import React, { useState, useEffect, Fragment } from "react"
+import { getCustomerToken } from "@commercelayer/js-auth"
+import Head from "next/head"
 import {
   CommerceLayer,
   OrderContainer,
@@ -17,16 +17,16 @@ import {
   AddressField,
   ShippingAddressContainer,
   // AddressCardsTemplate,
-} from 'packages/react-components/src'
-import { useRouter } from 'next/router'
-import getSdk from '#utils/getSdk'
+} from "packages/react-components/src"
+import { useRouter } from "next/router"
+import getSdk from "#utils/getSdk"
 
 const clientId = process.env.NEXT_PUBLIC_CLIENT_ID as string
 const endpoint = process.env.NEXT_PUBLIC_ENDPOINT as string
 const scope = process.env.NEXT_PUBLIC_MARKET_ID as string
 const username = process.env.NEXT_PUBLIC_USERNAME as string
 const password = process.env.NEXT_PUBLIC_PASSWORD as string
-let orderId = 'PDerhJplRp'
+let orderId = "PDerhJplRp"
 
 const NestedInput = ({ value }: any) => {
   return (
@@ -61,11 +61,11 @@ const NestedInput = ({ value }: any) => {
 // }
 
 export default function Main() {
-  const [token, setToken] = useState('')
+  const [token, setToken] = useState("")
   const [shipToDifferentAddress, setShipToDifferentAddress] = useState(false)
   const [showBillingAddressForm, setShowBillingAddressForm] = useState(false)
   const [showShippingAddressForm, setShowShippingAddressForm] = useState(false)
-  const [billingFirstName, setBillingFirstName] = useState('')
+  const [billingFirstName, setBillingFirstName] = useState("")
   const [billingAddress, setBillingAddress] = useState({})
   const [shippingAddress, setShippingAddress] = useState({})
   const { query, pathname, push } = useRouter()
@@ -78,7 +78,7 @@ export default function Main() {
       const sdk = getSdk(config)
       try {
         const order = await sdk.orders.retrieve(orderId, {
-          include: ['billing_address', 'shipping_address'],
+          include: ["billing_address", "shipping_address"],
         })
         if (order?.billing_address) {
           setBillingAddress(order.billing_address)
@@ -115,15 +115,15 @@ export default function Main() {
   }, [token])
   const messages: any = [
     {
-      code: 'EMPTY_ERROR',
-      resource: 'billingAddress',
-      field: 'firstName',
+      code: "EMPTY_ERROR",
+      resource: "billingAddress",
+      field: "firstName",
       message: `Can't be blank`,
     },
     {
-      code: 'VALIDATION_ERROR',
-      resource: 'billingAddress',
-      field: 'email',
+      code: "VALIDATION_ERROR",
+      resource: "billingAddress",
+      field: "email",
       message: `Must be valid email`,
     },
   ]
@@ -132,10 +132,9 @@ export default function Main() {
   }
   const handleShowBillingForm = () => {
     setShowBillingAddressForm(!showBillingAddressForm)
-    setBillingFirstName('')
+    setBillingFirstName("")
   }
-  const handleShowShippingForm = () =>
-    setShowShippingAddressForm(!showShippingAddressForm)
+  const handleShowShippingForm = () => setShowShippingAddressForm(!showShippingAddressForm)
   return (
     <Fragment>
       <Head>
@@ -145,9 +144,7 @@ export default function Main() {
         <div className="container mx-auto mt-5 px-5">
           <OrderContainer orderId={orderId}>
             <CustomerContainer>
-              <AddressesContainer
-                shipToDifferentAddress={shipToDifferentAddress}
-              >
+              <AddressesContainer shipToDifferentAddress={shipToDifferentAddress}>
                 <h2 className="p-2 font-semibold text-2xl">Billing Address</h2>
                 <div>
                   <BillingAddressContainer>
@@ -156,10 +153,7 @@ export default function Main() {
                       selectedClassName="border-blue-500"
                       data-cy="customer-billing-address"
                       deselect={showBillingAddressForm}
-                      onSelect={() =>
-                        showBillingAddressForm &&
-                        setShowBillingAddressForm(false)
-                      }
+                      onSelect={() => showBillingAddressForm && setShowBillingAddressForm(false)}
                     >
                       {/* {(props) => <CustomAddressCards {...props} />} */}
                       <AddressField name="first_name" />
@@ -192,7 +186,7 @@ export default function Main() {
                     </svg>
                   </button>
                 </div>
-                <div className={`${showBillingAddressForm ? '' : 'hidden'}`}>
+                <div className={`${showBillingAddressForm ? "" : "hidden"}`}>
                   <BillingAddressForm
                     autoComplete="on"
                     className="p-2"
@@ -313,8 +307,8 @@ export default function Main() {
                           name="billing_address_country_code"
                           className="mt-1 block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded-md"
                           placeholder={{
-                            value: '',
-                            label: 'Country',
+                            value: "",
+                            label: "Country",
                             disabled: true,
                           }}
                         />
@@ -454,39 +448,32 @@ export default function Main() {
                     type="button"
                     aria-pressed="false"
                     className={`${
-                      shipToDifferentAddress ? 'bg-blue-500' : 'bg-gray-200'
+                      shipToDifferentAddress ? "bg-blue-500" : "bg-gray-200"
                     } relative inline-flex flex-shrink-0 h-6 w-11 border-2 border-transparent rounded-full cursor-pointer transition-colors ease-in-out duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500`}
-                    onClick={() =>
-                      setShipToDifferentAddress(!shipToDifferentAddress)
-                    }
+                    onClick={() => setShipToDifferentAddress(!shipToDifferentAddress)}
                   >
                     <span className="sr-only">Use setting</span>
                     <span
                       aria-hidden="true"
                       className={`${
-                        shipToDifferentAddress
-                          ? 'translate-x-5'
-                          : 'translate-x-0'
+                        shipToDifferentAddress ? "translate-x-5" : "translate-x-0"
                       } inline-block h-5 w-5 rounded-full bg-white shadow transform ring-0 transition ease-in-out duration-200`}
                     ></span>
                   </button>
                   <p className="ml-5">Ship to different address</p>
                 </div>
-                <div className={`${!shipToDifferentAddress ? 'hidden' : ''}`}>
-                  <h2 className="p-2 font-semibold text-2xl">
-                    Shipping Address
-                  </h2>
+                <div className={`${!shipToDifferentAddress ? "hidden" : ""}`}>
+                  <h2 className="p-2 font-semibold text-2xl">Shipping Address</h2>
                   <div className="flex">
                     <ShippingAddressContainer>
                       <Address
                         data-cy="customer-shipping-address"
                         className="w-1/2 p-2 border cursor-pointer rounded hover:border-blue-500 m-2 shadow-sm"
-                        selectedClassName={'border-blue-500'}
-                        disabledClassName={'opacity-50 cursor-not-allowed'}
+                        selectedClassName={"border-blue-500"}
+                        disabledClassName={"opacity-50 cursor-not-allowed"}
                         deselect={showShippingAddressForm}
                         onSelect={() =>
-                          showShippingAddressForm &&
-                          setShowShippingAddressForm(false)
+                          showShippingAddressForm && setShowShippingAddressForm(false)
                         }
                       >
                         <div className="flex font-bold">
@@ -519,14 +506,10 @@ export default function Main() {
                       </svg>
                     </button>
                   </div>
-                  <div
-                    className={`${!showShippingAddressForm ? 'hidden' : ''}`}
-                  >
+                  <div className={`${!showShippingAddressForm ? "hidden" : ""}`}>
                     <ShippingAddressForm
                       autoComplete="on"
-                      className={
-                        shipToDifferentAddress ? `block p-2` : `hidden`
-                      }
+                      className={shipToDifferentAddress ? `block p-2` : `hidden`}
                       reset={!showShippingAddressForm}
                     >
                       <div>
@@ -545,10 +528,7 @@ export default function Main() {
                             placeholder="First name"
                           />
                         </div>
-                        <p
-                          className="mt-2 text-sm text-red-600"
-                          id="email-error"
-                        >
+                        <p className="mt-2 text-sm text-red-600" id="email-error">
                           <Errors
                             data-cy="shipping_address_first_name_error"
                             resource="shipping_address"
@@ -573,10 +553,7 @@ export default function Main() {
                             placeholder="Last name"
                           />
                         </div>
-                        <p
-                          className="mt-2 text-sm text-red-600"
-                          id="email-error"
-                        >
+                        <p className="mt-2 text-sm text-red-600" id="email-error">
                           <Errors
                             data-cy="shipping_address_last_name_error"
                             resource="shipping_address"
@@ -601,10 +578,7 @@ export default function Main() {
                             placeholder="Address"
                           />
                         </div>
-                        <p
-                          className="mt-2 text-sm text-red-600"
-                          id="email-error"
-                        >
+                        <p className="mt-2 text-sm text-red-600" id="email-error">
                           <Errors
                             data-cy="shipping_address_line_1_error"
                             resource="shipping_address"
@@ -629,10 +603,7 @@ export default function Main() {
                             placeholder="City"
                           />
                         </div>
-                        <p
-                          className="mt-2 text-sm text-red-600"
-                          id="email-error"
-                        >
+                        <p className="mt-2 text-sm text-red-600" id="email-error">
                           <Errors
                             data-cy="shipping_address_city_error"
                             resource="shipping_address"
@@ -654,16 +625,13 @@ export default function Main() {
                             name="shipping_address_country_code"
                             className="mt-1 block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded-md"
                             placeholder={{
-                              value: '',
-                              label: 'Country',
+                              value: "",
+                              label: "Country",
                               disabled: true,
                             }}
                           />
                         </div>
-                        <p
-                          className="mt-2 text-sm text-red-600"
-                          id="email-error"
-                        >
+                        <p className="mt-2 text-sm text-red-600" id="email-error">
                           <Errors
                             data-cy="shipping_address_country_code_error"
                             resource="shipping_address"
@@ -688,10 +656,7 @@ export default function Main() {
                             placeholder="State"
                           />
                         </div>
-                        <p
-                          className="mt-2 text-sm text-red-600"
-                          id="email-error"
-                        >
+                        <p className="mt-2 text-sm text-red-600" id="email-error">
                           <Errors
                             data-cy="shipping_address_state_code_error"
                             resource="shipping_address"
@@ -716,10 +681,7 @@ export default function Main() {
                             placeholder="Zip code"
                           />
                         </div>
-                        <p
-                          className="mt-2 text-sm text-red-600"
-                          id="email-error"
-                        >
+                        <p className="mt-2 text-sm text-red-600" id="email-error">
                           <Errors
                             data-cy="shipping_address_zip_code_error"
                             resource="shipping_address"
@@ -744,10 +706,7 @@ export default function Main() {
                             placeholder="Phone"
                           />
                         </div>
-                        <p
-                          className="mt-2 text-sm text-red-600"
-                          id="email-error"
-                        >
+                        <p className="mt-2 text-sm text-red-600" id="email-error">
                           <Errors
                             data-cy="shipping_address_phone_error"
                             resource="shipping_address"
@@ -798,9 +757,7 @@ export default function Main() {
               )}`}</pre>
             </div>
             <div className="mt-5">
-              <h2 className="font-semibold text-2xl">
-                Current Billing Address
-              </h2>
+              <h2 className="font-semibold text-2xl">Current Billing Address</h2>
               <Address addresses={[billingAddress as any]}>
                 <div className="flex font-bold">
                   <AddressField name="first_name" />
@@ -815,9 +772,7 @@ export default function Main() {
               </Address>
             </div>
             <div className="mt-5">
-              <h2 className="font-semibold text-2xl">
-                Current Shipping Address
-              </h2>
+              <h2 className="font-semibold text-2xl">Current Shipping Address</h2>
               <Address addresses={[shippingAddress as any]}>
                 <div className="flex font-bold">
                   <AddressField name="first_name" />
diff --git a/examples/checkout/customer/index.tsx b/examples/checkout/customer/index.tsx
index 3b52ce7d..9a37aa5b 100644
--- a/examples/checkout/customer/index.tsx
+++ b/examples/checkout/customer/index.tsx
@@ -1,6 +1,6 @@
-import React, { useState, useEffect, Fragment } from 'react'
-import { getCustomerToken } from '@commercelayer/js-auth'
-import Head from 'next/head'
+import React, { useState, useEffect, Fragment } from "react"
+import { getCustomerToken } from "@commercelayer/js-auth"
+import Head from "next/head"
 import {
   CommerceLayer,
   OrderContainer,
@@ -53,9 +53,9 @@ import {
   PrivacyAndTermsCheckbox,
   PaymentMethodAmount,
   CustomerCardsType,
-} from 'packages/react-components/src'
-import { useRouter } from 'next/router'
-import { Address, AddressField } from 'packages/react-components/src'
+} from "packages/react-components/src"
+import { useRouter } from "next/router"
+import { Address, AddressField } from "packages/react-components/src"
 
 const clientId = process.env.NEXT_PUBLIC_CLIENT_ID as string
 const endpoint = process.env.NEXT_PUBLIC_ENDPOINT as string
@@ -63,11 +63,11 @@ const scope = process.env.NEXT_PUBLIC_MARKET_ID as string
 const username = process.env.NEXT_PUBLIC_CUSTOMER_USERNAME as string
 const password = process.env.NEXT_PUBLIC_CUSTOMER_PASSWORD as string
 
-let orderId = ''
-let paypalPayerId = ''
-let paypalReturnUrl = ''
+let orderId = ""
+let paypalPayerId = ""
+let paypalReturnUrl = ""
 
-const adyen = { MD: '', PaRes: '' }
+const adyen = { MD: "", PaRes: "" }
 
 const NestedInput = ({ value }: any) => {
   return (
@@ -82,10 +82,7 @@ const NestedInput = ({ value }: any) => {
   )
 }
 
-const TemplateCustomerCards = ({
-  customerPayments,
-  PaymentSourceProvider,
-}: CustomerCardsType) => {
+const TemplateCustomerCards = ({ customerPayments, PaymentSourceProvider }: CustomerCardsType) => {
   const components = customerPayments.map((p, k) => {
     return (
       <div
@@ -133,11 +130,11 @@ const TemplateSaveToWalletCheckbox = ({ name }: any) => (
 )
 
 export default function Main() {
-  const [token, setToken] = useState('')
+  const [token, setToken] = useState("")
   const [shipToDifferentAddress, setShipToDifferentAddress] = useState(false)
   const [showBillingAddressForm, setShowBillingAddressForm] = useState(false)
   const [showShippingAddressForm, setShowShippingAddressForm] = useState(false)
-  const [billingFirstName, setBillingFirstName] = useState('')
+  const [billingFirstName, setBillingFirstName] = useState("")
   const [saveOnBlur, setSaveOnBlur] = useState(false)
   const { query } = useRouter()
   if (query.orderId) {
@@ -152,7 +149,7 @@ export default function Main() {
   if (query.PaRes) {
     adyen.PaRes = query.PaRes as string
   }
-  if (typeof window !== 'undefined') {
+  if (typeof window !== "undefined") {
     paypalReturnUrl = window.location.href
   }
   useEffect(() => {
@@ -176,24 +173,23 @@ export default function Main() {
   }, [token])
   const messages: any = [
     {
-      code: 'EMPTY_ERROR',
-      resource: 'billingAddress',
-      field: 'firstName',
+      code: "EMPTY_ERROR",
+      resource: "billingAddress",
+      field: "firstName",
       message: `Can't be blank`,
     },
     {
-      code: 'VALIDATION_ERROR',
-      resource: 'billingAddress',
-      field: 'email',
+      code: "VALIDATION_ERROR",
+      resource: "billingAddress",
+      field: "email",
       message: `Must be valid email`,
     },
   ]
   const handleShowBillingForm = () => {
     setShowBillingAddressForm(!showBillingAddressForm)
-    setBillingFirstName('')
+    setBillingFirstName("")
   }
-  const handleShowShippingForm = () =>
-    setShowShippingAddressForm(!showShippingAddressForm)
+  const handleShowShippingForm = () => setShowShippingAddressForm(!showShippingAddressForm)
   const handleOnSave = async () => {
     // if (token) {
     //   const config = { accessToken: token, endpoint }
@@ -255,9 +251,7 @@ export default function Main() {
         <div className="container mx-auto mt-5 px-5">
           <OrderContainer orderId={orderId}>
             <CustomerContainer>
-              <AddressesContainer
-                shipToDifferentAddress={shipToDifferentAddress}
-              >
+              <AddressesContainer shipToDifferentAddress={shipToDifferentAddress}>
                 <h2 className="p-2 font-semibold text-2xl">Billing Address</h2>
                 <div>
                   <BillingAddressContainer>
@@ -266,10 +260,7 @@ export default function Main() {
                       selectedClassName="border-blue-500"
                       data-cy="customer-billing-address"
                       deselect={showBillingAddressForm}
-                      onSelect={() =>
-                        showBillingAddressForm &&
-                        setShowBillingAddressForm(false)
-                      }
+                      onSelect={() => showBillingAddressForm && setShowBillingAddressForm(false)}
                     >
                       {/* {(props) => <CustomAddressCards {...props} />} */}
                       <AddressField name="first_name" />
@@ -302,7 +293,7 @@ export default function Main() {
                     </svg>
                   </button>
                 </div>
-                <div className={`${showBillingAddressForm ? '' : 'hidden'}`}>
+                <div className={`${showBillingAddressForm ? "" : "hidden"}`}>
                   <BillingAddressForm
                     autoComplete="off"
                     className="p-2"
@@ -423,8 +414,8 @@ export default function Main() {
                           name="billing_address_country_code"
                           className="mt-1 block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded-md"
                           placeholder={{
-                            value: '',
-                            label: 'Country',
+                            value: "",
+                            label: "Country",
                             disabled: true,
                           }}
                         />
@@ -564,39 +555,32 @@ export default function Main() {
                     type="button"
                     aria-pressed="false"
                     className={`${
-                      shipToDifferentAddress ? 'bg-blue-500' : 'bg-gray-200'
+                      shipToDifferentAddress ? "bg-blue-500" : "bg-gray-200"
                     } relative inline-flex flex-shrink-0 h-6 w-11 border-2 border-transparent rounded-full cursor-pointer transition-colors ease-in-out duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500`}
-                    onClick={() =>
-                      setShipToDifferentAddress(!shipToDifferentAddress)
-                    }
+                    onClick={() => setShipToDifferentAddress(!shipToDifferentAddress)}
                   >
                     <span className="sr-only">Use setting</span>
                     <span
                       aria-hidden="true"
                       className={`${
-                        shipToDifferentAddress
-                          ? 'translate-x-5'
-                          : 'translate-x-0'
+                        shipToDifferentAddress ? "translate-x-5" : "translate-x-0"
                       } inline-block h-5 w-5 rounded-full bg-white shadow transform ring-0 transition ease-in-out duration-200`}
                     ></span>
                   </button>
                   <p className="ml-5">Ship to different address</p>
                 </div>
-                <div className={`${!shipToDifferentAddress ? 'hidden' : ''}`}>
-                  <h2 className="p-2 font-semibold text-2xl">
-                    Shipping Address
-                  </h2>
+                <div className={`${!shipToDifferentAddress ? "hidden" : ""}`}>
+                  <h2 className="p-2 font-semibold text-2xl">Shipping Address</h2>
                   <div className="flex">
                     <ShippingAddressContainer>
                       <Address
                         data-cy="customer-shipping-address"
                         className="w-1/2 p-2 border cursor-pointer rounded hover:border-blue-500 m-2 shadow-sm"
-                        selectedClassName={'border-blue-500'}
-                        disabledClassName={'opacity-50 cursor-not-allowed'}
+                        selectedClassName={"border-blue-500"}
+                        disabledClassName={"opacity-50 cursor-not-allowed"}
                         deselect={showShippingAddressForm}
                         onSelect={() =>
-                          showShippingAddressForm &&
-                          setShowShippingAddressForm(false)
+                          showShippingAddressForm && setShowShippingAddressForm(false)
                         }
                       >
                         <div className="flex font-bold">
@@ -629,14 +613,10 @@ export default function Main() {
                       </svg>
                     </button>
                   </div>
-                  <div
-                    className={`${!showShippingAddressForm ? 'hidden' : ''}`}
-                  >
+                  <div className={`${!showShippingAddressForm ? "hidden" : ""}`}>
                     <ShippingAddressForm
                       autoComplete="off"
-                      className={
-                        shipToDifferentAddress ? `block p-2` : `hidden`
-                      }
+                      className={shipToDifferentAddress ? `block p-2` : `hidden`}
                       reset={!showShippingAddressForm}
                     >
                       <div>
@@ -655,10 +635,7 @@ export default function Main() {
                             placeholder="First name"
                           />
                         </div>
-                        <p
-                          className="mt-2 text-sm text-red-600"
-                          id="email-error"
-                        >
+                        <p className="mt-2 text-sm text-red-600" id="email-error">
                           <Errors
                             data-cy="shipping_address_first_name_error"
                             resource="shipping_address"
@@ -683,10 +660,7 @@ export default function Main() {
                             placeholder="Last name"
                           />
                         </div>
-                        <p
-                          className="mt-2 text-sm text-red-600"
-                          id="email-error"
-                        >
+                        <p className="mt-2 text-sm text-red-600" id="email-error">
                           <Errors
                             data-cy="shipping_address_last_name_error"
                             resource="shipping_address"
@@ -711,10 +685,7 @@ export default function Main() {
                             placeholder="Address"
                           />
                         </div>
-                        <p
-                          className="mt-2 text-sm text-red-600"
-                          id="email-error"
-                        >
+                        <p className="mt-2 text-sm text-red-600" id="email-error">
                           <Errors
                             data-cy="shipping_address_line_1_error"
                             resource="shipping_address"
@@ -739,10 +710,7 @@ export default function Main() {
                             placeholder="City"
                           />
                         </div>
-                        <p
-                          className="mt-2 text-sm text-red-600"
-                          id="email-error"
-                        >
+                        <p className="mt-2 text-sm text-red-600" id="email-error">
                           <Errors
                             data-cy="shipping_address_city_error"
                             resource="shipping_address"
@@ -764,16 +732,13 @@ export default function Main() {
                             name="shipping_address_country_code"
                             className="mt-1 block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded-md"
                             placeholder={{
-                              value: '',
-                              label: 'Country',
+                              value: "",
+                              label: "Country",
                               disabled: true,
                             }}
                           />
                         </div>
-                        <p
-                          className="mt-2 text-sm text-red-600"
-                          id="email-error"
-                        >
+                        <p className="mt-2 text-sm text-red-600" id="email-error">
                           <Errors
                             data-cy="shipping_address_country_code_error"
                             resource="shipping_address"
@@ -798,10 +763,7 @@ export default function Main() {
                             placeholder="State"
                           />
                         </div>
-                        <p
-                          className="mt-2 text-sm text-red-600"
-                          id="email-error"
-                        >
+                        <p className="mt-2 text-sm text-red-600" id="email-error">
                           <Errors
                             data-cy="shipping_address_state_code_error"
                             resource="shipping_address"
@@ -826,10 +788,7 @@ export default function Main() {
                             placeholder="Zip code"
                           />
                         </div>
-                        <p
-                          className="mt-2 text-sm text-red-600"
-                          id="email-error"
-                        >
+                        <p className="mt-2 text-sm text-red-600" id="email-error">
                           <Errors
                             data-cy="shipping_address_zip_code_error"
                             resource="shipping_address"
@@ -854,10 +813,7 @@ export default function Main() {
                             placeholder="Phone"
                           />
                         </div>
-                        <p
-                          className="mt-2 text-sm text-red-600"
-                          id="email-error"
-                        >
+                        <p className="mt-2 text-sm text-red-600" id="email-error">
                           <Errors
                             data-cy="shipping_address_phone_error"
                             resource="shipping_address"
@@ -899,19 +855,13 @@ export default function Main() {
                 <Shipment loader={<>Caricamento...</>}>
                   <div className="flex">
                     Shipments N:
-                    <ShipmentField
-                      className="font-bold pl-1"
-                      name="key_number"
-                    />
+                    <ShipmentField className="font-bold pl-1" name="key_number" />
                   </div>
                   <LineItemsContainer>
                     <LineItem>
                       <div className="flex justify-between items-center border-b p-5">
                         <LineItemImage className="p-2" width={80} />
-                        <LineItemName
-                          data-cy="line-item-name"
-                          className="p-2"
-                        />
+                        <LineItemName data-cy="line-item-name" className="p-2" />
                         <LineItemQuantity
                           readonly
                           data-cy="line-item-quantity"
@@ -921,15 +871,9 @@ export default function Main() {
                       </div>
                       <div>
                         <StockTransfer>
-                          <div
-                            className="flex flex-row"
-                            data-cy="stock-transfer"
-                          >
-                            <StockTransferField
-                              className="px-1"
-                              type="quantity"
-                            />{' '}
-                            of <LineItemQuantity readonly className="px-1" />
+                          <div className="flex flex-row" data-cy="stock-transfer">
+                            <StockTransferField className="px-1" type="quantity" /> of{" "}
+                            <LineItemQuantity readonly className="px-1" />
                             items will undergo a transfer
                           </div>
                         </StockTransfer>
@@ -938,10 +882,7 @@ export default function Main() {
                     <LineItem type="bundles">
                       <div className="flex justify-between items-center border-b p-5">
                         <LineItemImage className="p-2" width={80} />
-                        <LineItemName
-                          data-cy="line-item-name"
-                          className="p-2"
-                        />
+                        <LineItemName data-cy="line-item-name" className="p-2" />
                         <LineItemQuantity
                           readonly
                           data-cy="line-item-quantity"
@@ -951,15 +892,9 @@ export default function Main() {
                       </div>
                       <div>
                         <StockTransfer>
-                          <div
-                            className="flex flex-row"
-                            data-cy="stock-transfer"
-                          >
-                            <StockTransferField
-                              className="px-1"
-                              type="quantity"
-                            />{' '}
-                            of <LineItemQuantity readonly className="px-1" />
+                          <div className="flex flex-row" data-cy="stock-transfer">
+                            <StockTransferField className="px-1" type="quantity" /> of{" "}
+                            <LineItemQuantity readonly className="px-1" />
                             items will undergo a transfer
                           </div>
                         </StockTransfer>
@@ -975,11 +910,7 @@ export default function Main() {
                       <ShippingMethodName data-cy="shipping-method-name" />
                       <ShippingMethodPrice data-cy="shipping-method-price" />
                       <div className="flex">
-                        <DeliveryLeadTime
-                          type="min_days"
-                          data-cy="delivery-lead-time-min-days"
-                        />{' '}
-                        -{' '}
+                        <DeliveryLeadTime type="min_days" data-cy="delivery-lead-time-min-days" /> -{" "}
                         <DeliveryLeadTime
                           type="max_days"
                           data-cy="delivery-lead-time-max-days"
@@ -995,7 +926,7 @@ export default function Main() {
               <PaymentMethodsContainer
                 config={{
                   stripePayment: {
-                    containerClassName: 'p-5 my-2',
+                    containerClassName: "p-5 my-2",
                   },
                   paypalPayment: {
                     cancel_url: paypalReturnUrl,
@@ -1009,7 +940,7 @@ export default function Main() {
                       className="p-2 my-1 flex flex-wrap w-1/2 items-center justify-items-center bg-gray-300"
                       activeClass="bg-opacity-25"
                       onClick={() => {
-                        console.log('custom click payment method')
+                        console.log("custom click payment method")
                       }}
                       clickableContainer
                     >
@@ -1018,23 +949,18 @@ export default function Main() {
                       <PaymentMethodPrice className="pl-3 text-xs text-gray-500" />
                       <PaymentSource
                         className="py-2 my-2 flex flex-row"
-                        templateCustomerCards={(props) => (
-                          <TemplateCustomerCards {...props} />
-                        )}
+                        templateCustomerCards={(props) => <TemplateCustomerCards {...props} />}
                         templateCustomerSaveToWallet={(props) => (
                           <TemplateSaveToWalletCheckbox {...props} />
                         )}
-                        onClickCustomerCards={() => console.log('clicked')}
+                        onClickCustomerCards={() => console.log("clicked")}
                       >
                         <div className="flex flex-row items-center justify-start bg-gray-100 p-3 text-sm border">
                           <div className="flex flex-row items-center">
                             <PaymentSourceBrandIcon className="mr-2" />
                             <PaymentSourceBrandName className="mr-1" />
                             ending in
-                            <PaymentSourceDetail
-                              className="ml-1"
-                              type="last4"
-                            />
+                            <PaymentSourceDetail className="ml-1" type="last4" />
                           </div>
                           <div className="text-gray-500 ml-3">
                             <PaymentSourceDetail type="exp_month" />
@@ -1046,17 +972,14 @@ export default function Main() {
                           </div>
                         </div>
                       </PaymentSource>
-                      <Errors
-                        className="text-red-600"
-                        resource="payment_methods"
-                      />
+                      <Errors className="text-red-600" resource="payment_methods" />
                     </PaymentMethod>
                   </div>
 
                   <div>
                     <PlaceOrderButton
                       onClick={(res: any) => {
-                        console.log('res', res)
+                        console.log("res", res)
                         debugger
                       }}
                       className="mt-5 inline-flex items-center px-3 py-2 border border-transparent text-sm leading-4 font-medium rounded-md shadow-sm text-white bg-green-600 hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 disabled:opacity-50"
@@ -1067,54 +990,37 @@ export default function Main() {
             </CustomerContainer>
             <LineItemsContainer>
               <p className="text-sm m-2">
-                Your shopping bag contains{' '}
-                <LineItemsCount data-test="items-count" className="font-bold" />{' '}
-                items
+                Your shopping bag contains{" "}
+                <LineItemsCount data-test="items-count" className="font-bold" /> items
               </p>
               <div className="flex flex-col p-2">
                 <LineItem>
                   <div className="flex justify-around items-center border-b p-5">
                     <LineItemImage className="p-2" width={80} />
                     <LineItemName data-test="line-item-name" className="p-2" />
-                    <Errors
-                      className="text-red-700 p-2"
-                      resource="line_items"
-                      field="quantity"
-                    />
-                    <LineItemAmount
-                      data-test="line-item-total"
-                      className="p-2"
-                    />
+                    <Errors className="text-red-700 p-2" resource="line_items" field="quantity" />
+                    <LineItemAmount data-test="line-item-total" className="p-2" />
                   </div>
                 </LineItem>
                 <LineItem type="gift_cards">
                   <div className="flex justify-between items-center border-b p-5">
                     <LineItemImage className="p-2" width={40} />
                     <LineItemName data-test="line-item-name" className="p-2" />
-                    <LineItemAmount
-                      data-test="line-item-total"
-                      className="p-2"
-                    />
+                    <LineItemAmount data-test="line-item-total" className="p-2" />
                   </div>
                 </LineItem>
                 <LineItem type="bundles">
                   <div className="flex justify-between items-center border-b p-5">
                     <LineItemImage className="p-2" width={40} />
                     <LineItemName data-test="line-item-name" className="p-2" />
-                    <LineItemAmount
-                      data-test="line-item-total"
-                      className="p-2"
-                    />
+                    <LineItemAmount data-test="line-item-total" className="p-2" />
                   </div>
                 </LineItem>
                 <LineItem type="adjustments">
                   <div className="flex justify-between items-center border-b p-5">
                     <LineItemImage className="p-2" width={40} />
                     <LineItemName data-test="line-item-name" className="p-2" />
-                    <LineItemAmount
-                      data-test="line-item-total"
-                      className="p-2"
-                    />
+                    <LineItemAmount data-test="line-item-total" className="p-2" />
                   </div>
                 </LineItem>
               </div>
diff --git a/examples/checkout/customer/payments.tsx b/examples/checkout/customer/payments.tsx
index cc04bf54..adba8adc 100644
--- a/examples/checkout/customer/payments.tsx
+++ b/examples/checkout/customer/payments.tsx
@@ -1,6 +1,6 @@
-import React, { useState, useEffect, Fragment } from 'react'
-import { getCustomerToken } from '@commercelayer/js-auth'
-import Head from 'next/head'
+import React, { useState, useEffect, Fragment } from "react"
+import { getCustomerToken } from "@commercelayer/js-auth"
+import Head from "next/head"
 import {
   CommerceLayer,
   CustomerContainer,
@@ -20,10 +20,10 @@ import {
   PlaceOrderButton,
   PlaceOrderContainer,
   CustomerCardsType,
-} from 'packages/react-components/src'
-import { useRouter } from 'next/router'
-import '@adyen/adyen-web/dist/adyen.css'
-import getSdk from '#utils/getSdk'
+} from "packages/react-components/src"
+import { useRouter } from "next/router"
+import "@adyen/adyen-web/dist/adyen.css"
+import getSdk from "#utils/getSdk"
 
 const clientId = process.env.NEXT_PUBLIC_CLIENT_ID as string
 const endpoint = process.env.NEXT_PUBLIC_ENDPOINT as string
@@ -31,16 +31,13 @@ const scope = process.env.NEXT_PUBLIC_MARKET_ID as string
 const username = process.env.NEXT_PUBLIC_CUSTOMER_USERNAME as string
 const password = process.env.NEXT_PUBLIC_CUSTOMER_PASSWORD as string
 
-let orderId = 'PDerhJplRp'
+let orderId = "PDerhJplRp"
 
-let paypalPayerId = ''
-let paypalReturnUrl = ''
-let checkoutComSession = ''
+let paypalPayerId = ""
+let paypalReturnUrl = ""
+let checkoutComSession = ""
 
-const TemplateCustomerCards = ({
-  customerPayments,
-  PaymentSourceProvider,
-}: CustomerCardsType) => {
+const TemplateCustomerCards = ({ customerPayments, PaymentSourceProvider }: CustomerCardsType) => {
   const components = customerPayments.map((p, k) => {
     return (
       <div
@@ -88,7 +85,7 @@ const TemplateSaveToWalletCheckbox = ({ name }: any) => (
 )
 
 export default function Main() {
-  const [token, setToken] = useState('')
+  const [token, setToken] = useState("")
   const [paymentSource, setPaymentSource] = useState<any>(null)
   const { query } = useRouter()
   if (query.orderId) {
@@ -97,18 +94,18 @@ export default function Main() {
   if (query.PayerID) {
     paypalPayerId = query.PayerID as string
   }
-  if (typeof window !== 'undefined') {
+  if (typeof window !== "undefined") {
     paypalReturnUrl = window.location.href
   }
-  if (query['cko-session-id']) {
-    checkoutComSession = query['cko-session-id'] as string
+  if (query["cko-session-id"]) {
+    checkoutComSession = query["cko-session-id"] as string
   }
   // const [shippingMethodId, setShippingMethodId] = useState<string>('')
   const getOrder = async () => {
     const config = { accessToken: token, endpoint }
     const sdk = getSdk(config)
     const order = await sdk.orders.retrieve(orderId, {
-      include: ['payment_source'],
+      include: ["payment_source"],
     })
     // @ts-ignore
     if (order.payment_source) setPaymentSource(order.payment_source?.options)
@@ -156,7 +153,7 @@ export default function Main() {
               <PaymentMethodsContainer
                 config={{
                   stripePayment: {
-                    containerClassName: 'p-5 my-2',
+                    containerClassName: "p-5 my-2",
                   },
                   paypalPayment: {
                     cancel_url: paypalReturnUrl,
@@ -175,7 +172,7 @@ export default function Main() {
                       className="p-2 my-1 flex flex-wrap w-1/2 items-center justify-items-center bg-gray-300"
                       activeClass="bg-opacity-25"
                       onClick={() => {
-                        console.log('custom click payment method')
+                        console.log("custom click payment method")
                       }}
                       clickableContainer
                     >
@@ -184,23 +181,18 @@ export default function Main() {
                       <PaymentMethodPrice className="pl-3 text-xs text-gray-500" />
                       <PaymentSource
                         className="py-2 my-2 flex flex-row"
-                        templateCustomerCards={(props) => (
-                          <TemplateCustomerCards {...props} />
-                        )}
+                        templateCustomerCards={(props) => <TemplateCustomerCards {...props} />}
                         templateCustomerSaveToWallet={(props) => (
                           <TemplateSaveToWalletCheckbox {...props} />
                         )}
-                        onClickCustomerCards={() => console.log('clicked')}
+                        onClickCustomerCards={() => console.log("clicked")}
                       >
                         <div className="flex flex-row items-center justify-start bg-gray-100 p-3 text-sm border">
                           <div className="flex flex-row items-center">
                             <PaymentSourceBrandIcon className="mr-2" />
                             <PaymentSourceBrandName className="mr-1" />
                             ending in
-                            <PaymentSourceDetail
-                              className="ml-1"
-                              type="last4"
-                            />
+                            <PaymentSourceDetail className="ml-1" type="last4" />
                           </div>
                           <div className="text-gray-500 ml-3">
                             <PaymentSourceDetail type="exp_month" />
@@ -212,17 +204,14 @@ export default function Main() {
                           </div>
                         </div>
                       </PaymentSource>
-                      <Errors
-                        className="text-red-600"
-                        resource="payment_methods"
-                      />
+                      <Errors className="text-red-600" resource="payment_methods" />
                     </PaymentMethod>
                   </div>
 
                   <div>
                     <PlaceOrderButton
                       onClick={(res: any) => {
-                        console.log('res', res)
+                        console.log("res", res)
                         debugger
                       }}
                       className="mt-5 inline-flex items-center px-3 py-2 border border-transparent text-sm leading-4 font-medium rounded-md shadow-sm text-white bg-green-600 hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 disabled:opacity-50"
diff --git a/examples/checkout/giftcard-or-coupon-code.tsx b/examples/checkout/giftcard-or-coupon-code.tsx
index 0d4736b7..44ad1497 100644
--- a/examples/checkout/giftcard-or-coupon-code.tsx
+++ b/examples/checkout/giftcard-or-coupon-code.tsx
@@ -1,6 +1,6 @@
-import { useState, useEffect } from 'react'
-import { getCustomerToken } from '@commercelayer/js-auth'
-import Head from 'next/head'
+import { useState, useEffect } from "react"
+import { getCustomerToken } from "@commercelayer/js-auth"
+import Head from "next/head"
 import {
   CommerceLayer,
   GiftCardOrCouponForm,
@@ -11,8 +11,8 @@ import {
   OrderContainer,
   GiftCardOrCouponCode,
   GiftCardOrCouponRemoveButton,
-} from 'packages/react-components/src'
-import { useRouter } from 'next/router'
+} from "packages/react-components/src"
+import { useRouter } from "next/router"
 
 const clientId = process.env.NEXT_PUBLIC_CLIENT_ID as string
 const endpoint = process.env.NEXT_PUBLIC_ENDPOINT as string
@@ -20,42 +20,26 @@ const scope = process.env.NEXT_PUBLIC_MARKET_ID as string
 const username = process.env.NEXT_PUBLIC_CUSTOMER_USERNAME as string
 const password = process.env.NEXT_PUBLIC_CUSTOMER_PASSWORD as string
 
-let orderId = 'PDerhJplRp'
+let orderId = "PDerhJplRp"
 
 export default function Main() {
-  const [token, setToken] = useState('')
+  const [token, setToken] = useState("")
   const [codeError, setCodeError] = useState(false)
   const { query } = useRouter()
   if (query.orderId) {
     orderId = query.orderId as string
   }
   const classError = codeError
-    ? 'border-red-300 text-red-900 placeholder-red-300 focus:ring-red-500 focus:border-red-500'
-    : ''
-  const handleSubmit = ({
-    success,
-    value,
-  }: {
-    success: boolean
-    value: string
-  }) => {
-    console.log('success, value', success, value)
+    ? "border-red-300 text-red-900 placeholder-red-300 focus:ring-red-500 focus:border-red-500"
+    : ""
+  const handleSubmit = ({ success, value }: { success: boolean; value: string }) => {
+    console.log("success, value", success, value)
     if (!success && value) return setCodeError(true)
     return setCodeError(false)
   }
   const removeIcon = (
-    <svg
-      xmlns="http://www.w3.org/2000/svg"
-      fill="none"
-      viewBox="0 0 24 24"
-      stroke="currentColor"
-    >
-      <path
-        strokeLinecap="round"
-        strokeLinejoin="round"
-        strokeWidth={2}
-        d="M6 18L18 6M6 6l12 12"
-      />
+    <svg xmlns="http://www.w3.org/2000/svg" fill="none" viewBox="0 0 24 24" stroke="currentColor">
+      <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M6 18L18 6M6 6l12 12" />
     </svg>
   )
   useEffect(() => {
@@ -104,10 +88,7 @@ export default function Main() {
           <OrderContainer orderId={orderId}>
             <GiftCardOrCouponForm onSubmit={handleSubmit}>
               <div>
-                <label
-                  htmlFor="email"
-                  className="block text-sm font-medium text-gray-700"
-                >
+                <label htmlFor="email" className="block text-sm font-medium text-gray-700">
                   Coupon or Gift Card code
                 </label>
                 <div className={`mt-1 flex rounded-md shadow-sm`}>
@@ -134,26 +115,20 @@ export default function Main() {
                       className={`${classError} focus:ring-indigo-500 focus:border-indigo-500 block w-full rounded-none rounded-l-md pl-10 sm:text-sm border-gray-300`}
                       placeholderTranslation={(codeType) => {
                         switch (codeType) {
-                          case 'gift_card_or_coupon_code':
+                          case "gift_card_or_coupon_code":
                           default:
-                            return 'Insert a gift card o coupon code'
-                          case 'coupon_code':
-                            return 'Insert a coupon code'
-                          case 'gift_card_code':
-                            return 'Insert a gift card'
+                            return "Insert a gift card o coupon code"
+                          case "coupon_code":
+                            return "Insert a coupon code"
+                          case "gift_card_code":
+                            return "Insert a gift card"
                         }
                       }}
                     >
                       {(props) => {
                         // Custom input
                         const { parentRef, placeholder, ...p } = props
-                        return (
-                          <input
-                            ref={parentRef}
-                            placeholder={placeholder}
-                            {...p}
-                          />
-                        )
+                        return <input ref={parentRef} placeholder={placeholder} {...p} />
                       }}
                     </GiftCardOrCouponInput>
                   </div>
@@ -172,10 +147,10 @@ export default function Main() {
               field="gift_card_or_coupon_code"
               messages={[
                 {
-                  code: 'VALIDATION_ERROR',
-                  resource: 'orders',
-                  field: 'gift_card_or_coupon_code',
-                  message: 'Invalid coupon code',
+                  code: "VALIDATION_ERROR",
+                  resource: "orders",
+                  field: "gift_card_or_coupon_code",
+                  message: "Invalid coupon code",
                 },
               ]}
             />
diff --git a/examples/checkout/index.tsx b/examples/checkout/index.tsx
index d32b103b..2baadb74 100644
--- a/examples/checkout/index.tsx
+++ b/examples/checkout/index.tsx
@@ -1,7 +1,7 @@
-import { useState, useEffect, Fragment } from 'react'
-import { getSalesChannelToken } from '@commercelayer/js-auth'
-import { Nav } from '..'
-import Head from 'next/head'
+import { useState, useEffect, Fragment } from "react"
+import { getSalesChannelToken } from "@commercelayer/js-auth"
+import { Nav } from ".."
+import Head from "next/head"
 import {
   CommerceLayer,
   OrderContainer,
@@ -53,20 +53,20 @@ import {
   PlaceOrderContainer,
   PrivacyAndTermsCheckbox,
   PaymentMethodAmount,
-} from 'packages/react-components/src'
-import { useRouter } from 'next/router'
+} from "packages/react-components/src"
+import { useRouter } from "next/router"
 
 const clientId = process.env.NEXT_PUBLIC_CLIENT_ID as string
 const endpoint = process.env.NEXT_PUBLIC_ENDPOINT as string
 const scope = process.env.NEXT_PUBLIC_MARKET_ID as string
 
-let orderId = ''
-let paypalPayerId = ''
-let paypalReturnUrl = ''
+let orderId = ""
+let paypalPayerId = ""
+let paypalReturnUrl = ""
 
 export default function Main() {
-  const [token, setToken] = useState('')
-  const [customerEmail, setCustomerEmail] = useState('')
+  const [token, setToken] = useState("")
+  const [customerEmail, setCustomerEmail] = useState("")
   const [shipToDifferentAddress, setShipToDifferentAddress] = useState(false)
   const [saveOnBlur, setSaveOnBlur] = useState(false)
   const [billingAddress, setBillingAddress] = useState({})
@@ -91,15 +91,15 @@ export default function Main() {
   }, [token])
   const messages: any = [
     {
-      code: 'EMPTY_ERROR',
-      resource: 'billingAddress',
-      field: 'firstName',
+      code: "EMPTY_ERROR",
+      resource: "billingAddress",
+      field: "firstName",
       message: `Can't be blank`,
     },
     {
-      code: 'VALIDATION_ERROR',
-      resource: 'billingAddress',
-      field: 'email',
+      code: "VALIDATION_ERROR",
+      resource: "billingAddress",
+      field: "email",
       message: `Must be valid email`,
     },
   ]
@@ -160,7 +160,7 @@ export default function Main() {
       <Head>
         <script src="http://localhost:8097"></script>
       </Head>
-      <Nav links={['/multiOrder', '/multiApp', '/giftCard']} />
+      <Nav links={["/multiOrder", "/multiApp", "/giftCard"]} />
       <CommerceLayer accessToken={token} endpoint={endpoint}>
         <div className="container mx-auto mt-5 px-5">
           <OrderContainer orderId={orderId}>
@@ -171,7 +171,7 @@ export default function Main() {
                 type="button"
                 aria-pressed="false"
                 className={`${
-                  saveOnBlur ? 'bg-blue-500' : 'bg-gray-200'
+                  saveOnBlur ? "bg-blue-500" : "bg-gray-200"
                 } relative inline-flex flex-shrink-0 h-6 w-11 border-2 border-transparent rounded-full cursor-pointer transition-colors ease-in-out duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500`}
                 onClick={() => setSaveOnBlur(!saveOnBlur)}
               >
@@ -179,7 +179,7 @@ export default function Main() {
                 <span
                   aria-hidden="true"
                   className={`${
-                    saveOnBlur ? 'translate-x-5' : 'translate-x-0'
+                    saveOnBlur ? "translate-x-5" : "translate-x-0"
                   } inline-block h-5 w-5 rounded-full bg-white shadow transform ring-0 transition ease-in-out duration-200`}
                 ></span>
               </button>
@@ -187,10 +187,7 @@ export default function Main() {
             </div>
             <CustomerContainer isGuest>
               <div>
-                <label
-                  htmlFor="customer_email"
-                  className="block text-sm font-medium text-gray-700"
-                >
+                <label htmlFor="customer_email" className="block text-sm font-medium text-gray-700">
                   Customer email
                 </label>
                 <div className="mt-1">
@@ -212,7 +209,7 @@ export default function Main() {
                   />
                 </p>
               </div>
-              <div className={saveOnBlur ? 'hidden' : ''}>
+              <div className={saveOnBlur ? "hidden" : ""}>
                 <div className="mt-1">
                   <SaveCustomerButton
                     data-cy="save-customer-button"
@@ -353,8 +350,8 @@ export default function Main() {
                       name="billing_address_country_code"
                       className="mt-1 block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded-md"
                       placeholder={{
-                        value: '',
-                        label: 'Country',
+                        value: "",
+                        label: "Country",
                         disabled: true,
                       }}
                       value="IT"
@@ -383,11 +380,11 @@ export default function Main() {
                       className="mt-1 block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded-md"
                       inputClassName="mt-1 block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded-md"
                       placeholder={{
-                        value: '',
-                        label: 'Select a state',
+                        value: "",
+                        label: "Select a state",
                         disabled: true,
                       }}
-                      value={'GE'}
+                      value={"GE"}
                     />
                   </div>
                   <p className="mt-2 text-sm text-red-600" id="email-error">
@@ -499,17 +496,15 @@ export default function Main() {
                   type="button"
                   aria-pressed="false"
                   className={`${
-                    shipToDifferentAddress ? 'bg-blue-500' : 'bg-gray-200'
+                    shipToDifferentAddress ? "bg-blue-500" : "bg-gray-200"
                   } relative inline-flex flex-shrink-0 h-6 w-11 border-2 border-transparent rounded-full cursor-pointer transition-colors ease-in-out duration-200 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-blue-500`}
-                  onClick={() =>
-                    setShipToDifferentAddress(!shipToDifferentAddress)
-                  }
+                  onClick={() => setShipToDifferentAddress(!shipToDifferentAddress)}
                 >
                   <span className="sr-only">Use setting</span>
                   <span
                     aria-hidden="true"
                     className={`${
-                      shipToDifferentAddress ? 'translate-x-5' : 'translate-x-0'
+                      shipToDifferentAddress ? "translate-x-5" : "translate-x-0"
                     } inline-block h-5 w-5 rounded-full bg-white shadow transform ring-0 transition ease-in-out duration-200`}
                   ></span>
                 </button>
@@ -633,8 +628,8 @@ export default function Main() {
                       name="shipping_address_country_code"
                       className="mt-1 block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded-md"
                       placeholder={{
-                        value: '',
-                        label: 'Country',
+                        value: "",
+                        label: "Country",
                         disabled: true,
                       }}
                     />
@@ -661,8 +656,8 @@ export default function Main() {
                       name="shipping_address_state_code"
                       className="shadow-sm focus:ring-blue-500 focus:border-blue-500 block w-full sm:text-sm border-gray-300 rounded-md"
                       placeholder={{
-                        value: '',
-                        label: 'Select a state',
+                        value: "",
+                        label: "Select a state",
                         disabled: true,
                       }}
                     />
@@ -773,11 +768,8 @@ export default function Main() {
                     <div>
                       <StockTransfer>
                         <div className="flex flex-row" data-cy="stock-transfer">
-                          <StockTransferField
-                            className="px-1"
-                            type="quantity"
-                          />{' '}
-                          of <LineItemQuantity readonly className="px-1" />
+                          <StockTransferField className="px-1" type="quantity" /> of{" "}
+                          <LineItemQuantity readonly className="px-1" />
                           items will undergo a transfer
                         </div>
                       </StockTransfer>
@@ -797,11 +789,8 @@ export default function Main() {
                     <div>
                       <StockTransfer>
                         <div className="flex flex-row" data-cy="stock-transfer">
-                          <StockTransferField
-                            className="px-1"
-                            type="quantity"
-                          />{' '}
-                          of <LineItemQuantity readonly className="px-1" />
+                          <StockTransferField className="px-1" type="quantity" /> of{" "}
+                          <LineItemQuantity readonly className="px-1" />
                           items will undergo a transfer
                         </div>
                       </StockTransfer>
@@ -817,11 +806,7 @@ export default function Main() {
                     <ShippingMethodName data-cy="shipping-method-name" />
                     <ShippingMethodPrice data-cy="shipping-method-price" />
                     <div className="flex">
-                      <DeliveryLeadTime
-                        type="min_days"
-                        data-cy="delivery-lead-time-min-days"
-                      />{' '}
-                      -{' '}
+                      <DeliveryLeadTime type="min_days" data-cy="delivery-lead-time-min-days" /> -{" "}
                       <DeliveryLeadTime
                         type="max_days"
                         data-cy="delivery-lead-time-max-days"
@@ -863,7 +848,7 @@ export default function Main() {
                     hideIcon: false,
                     hidePostalCode: true,
                   },
-                  containerClassName: 'w-1/2 px-3',
+                  containerClassName: "w-1/2 px-3",
                 },
                 paypalPayment: {
                   cancel_url: paypalReturnUrl,
@@ -883,7 +868,7 @@ export default function Main() {
                   <PaymentSource
                     data-cy="payment-source"
                     className="p-5 my-2"
-                    loader={'Caricamento...'}
+                    loader={"Caricamento..."}
                   >
                     <div className="flex flex-row items-center justify-start bg-gray-100 p-5 my-10">
                       <div className="flex flex-row items-center">
@@ -900,14 +885,8 @@ export default function Main() {
                         />
                       </div>
                       <div className="text-gray-500 ml-5">
-                        <PaymentSourceDetail
-                          data-cy="payment-exp-month"
-                          type="exp_month"
-                        />
-                        <PaymentSourceDetail
-                          data-cy="payment-exp-year"
-                          type="exp_year"
-                        />
+                        <PaymentSourceDetail data-cy="payment-exp-month" type="exp_month" />
+                        <PaymentSourceDetail data-cy="payment-exp-year" type="exp_year" />
                       </div>
                       <div className="ml-5">
                         <PaymentSourceEditButton
@@ -917,10 +896,7 @@ export default function Main() {
                       </div>
                     </div>
                   </PaymentSource>
-                  <Errors
-                    className="text-red-600 block"
-                    resource="payment_methods"
-                  />
+                  <Errors className="text-red-600 block" resource="payment_methods" />
                 </PaymentMethod>
 
                 <div className="flex flex-row-reverse justify-end">
@@ -940,7 +916,7 @@ export default function Main() {
                 <div>
                   <PlaceOrderButton
                     onClick={(res: any) => {
-                      console.log('res', res)
+                      console.log("res", res)
                     }}
                     className="mt-5 inline-flex items-center px-3 py-2 border border-transparent text-sm leading-4 font-medium rounded-md shadow-sm text-white bg-green-600 hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 disabled:opacity-50"
                   />
@@ -949,44 +925,30 @@ export default function Main() {
             </PaymentMethodsContainer>
             <LineItemsContainer>
               <p className="text-sm m-2">
-                Your shopping bag contains{' '}
-                <LineItemsCount data-test="items-count" className="font-bold" />{' '}
-                items
+                Your shopping bag contains{" "}
+                <LineItemsCount data-test="items-count" className="font-bold" /> items
               </p>
               <div className="flex flex-col p-2">
                 <LineItem>
                   <div className="flex justify-around items-center border-b p-5">
                     <LineItemImage className="p-2" width={80} />
                     <LineItemName data-test="line-item-name" className="p-2" />
-                    <Errors
-                      className="text-red-700 p-2"
-                      resource="line_items"
-                      field="quantity"
-                    />
-                    <LineItemAmount
-                      data-test="line-item-total"
-                      className="p-2"
-                    />
+                    <Errors className="text-red-700 p-2" resource="line_items" field="quantity" />
+                    <LineItemAmount data-test="line-item-total" className="p-2" />
                   </div>
                 </LineItem>
                 <LineItem type="gift_cards">
                   <div className="flex justify-between items-center border-b p-5">
                     <LineItemImage className="p-2" width={40} />
                     <LineItemName data-test="line-item-name" className="p-2" />
-                    <LineItemAmount
-                      data-test="line-item-total"
-                      className="p-2"
-                    />
+                    <LineItemAmount data-test="line-item-total" className="p-2" />
                   </div>
                 </LineItem>
                 <LineItem type="bundles">
                   <div className="flex justify-between items-center border-b p-5">
                     <LineItemImage className="p-2" width={40} />
                     <LineItemName data-test="line-item-name" className="p-2" />
-                    <LineItemAmount
-                      data-test="line-item-total"
-                      className="p-2"
-                    />
+                    <LineItemAmount data-test="line-item-total" className="p-2" />
                   </div>
                 </LineItem>
                 <LineItem type="adjustments">
@@ -995,14 +957,11 @@ export default function Main() {
                       className="p-2"
                       width={40}
                       placeholder={{
-                        adjustments: '',
+                        adjustments: "",
                       }}
                     />
                     <LineItemName data-test="line-item-name" className="p-2" />
-                    <LineItemAmount
-                      data-test="line-item-total"
-                      className="p-2"
-                    />
+                    <LineItemAmount data-test="line-item-total" className="p-2" />
                   </div>
                 </LineItem>
               </div>
diff --git a/examples/checkout/payments.tsx b/examples/checkout/payments.tsx
index c9d5957e..43244e7a 100644
--- a/examples/checkout/payments.tsx
+++ b/examples/checkout/payments.tsx
@@ -1,6 +1,6 @@
-import React, { useState, useEffect, Fragment } from 'react'
-import { getCustomerToken } from '@commercelayer/js-auth'
-import Head from 'next/head'
+import React, { useState, useEffect, Fragment } from "react"
+import { getCustomerToken } from "@commercelayer/js-auth"
+import Head from "next/head"
 import {
   CommerceLayer,
   Errors,
@@ -17,52 +17,52 @@ import {
   PaymentSourceEditButton,
   PlaceOrderButton,
   PlaceOrderContainer,
-  PrivacyAndTermsCheckbox
-} from 'packages/react-components/src'
-import { useRouter } from 'next/router'
-import '@adyen/adyen-web/dist/adyen.css'
+  PrivacyAndTermsCheckbox,
+} from "packages/react-components/src"
+import { useRouter } from "next/router"
+import "@adyen/adyen-web/dist/adyen.css"
 
-const clientId = process.env['NEXT_PUBLIC_CLIENT_ID']
-const endpoint = process.env['NEXT_PUBLIC_ENDPOINT']
-const scope = process.env['NEXT_PUBLIC_MARKET_ID']
-const username = process.env['NEXT_PUBLIC_USERNAME']
-const password = process.env['NEXT_PUBLIC_PASSWORD']
+const clientId = process.env["NEXT_PUBLIC_CLIENT_ID"]
+const endpoint = process.env["NEXT_PUBLIC_ENDPOINT"]
+const scope = process.env["NEXT_PUBLIC_MARKET_ID"]
+const username = process.env["NEXT_PUBLIC_USERNAME"]
+const password = process.env["NEXT_PUBLIC_PASSWORD"]
 
-let orderId = 'PDerhJplRp'
-let paypalPayerId = ''
-let paypalReturnUrl = ''
-let checkoutComSession = ''
-let redirectResult = ''
+let orderId = "PDerhJplRp"
+let paypalPayerId = ""
+let paypalReturnUrl = ""
+let checkoutComSession = ""
+let redirectResult = ""
 
 const messages: any = [
   {
-    code: 'VALIDATION_ERROR',
-    resource: 'order',
-    field: 'status',
-    message: 'test 1'
+    code: "VALIDATION_ERROR",
+    resource: "order",
+    field: "status",
+    message: "test 1",
   },
   {
-    code: 'VALIDATION_ERROR',
-    resource: 'order',
-    field: 'billingAddress',
-    message: 'test 2'
+    code: "VALIDATION_ERROR",
+    resource: "order",
+    field: "billingAddress",
+    message: "test 2",
   },
   {
-    code: 'INVALID_RESOURCE_ID',
-    resource: 'order',
-    field: 'base',
-    message: 'Paypal error'
+    code: "INVALID_RESOURCE_ID",
+    resource: "order",
+    field: "base",
+    message: "Paypal error",
   },
   {
-    code: 'PAYMENT_NOT_APPROVED_FOR_EXECUTION',
-    resource: 'order',
-    field: 'base',
-    message: 'Paypal payment not approved for execution'
-  }
+    code: "PAYMENT_NOT_APPROVED_FOR_EXECUTION",
+    resource: "order",
+    field: "base",
+    message: "Paypal payment not approved for execution",
+  },
 ]
 
 export default function Main() {
-  const [token, setToken] = useState('')
+  const [token, setToken] = useState("")
   const [placed, setPlaced] = useState(false)
   const { query } = useRouter()
   if (query?.orderId) {
@@ -71,13 +71,13 @@ export default function Main() {
   if (query?.PayerID) {
     paypalPayerId = query?.PayerID as string
   }
-  if (query['cko-session-id']) {
-    checkoutComSession = query['cko-session-id'] as string
+  if (query["cko-session-id"]) {
+    checkoutComSession = query["cko-session-id"] as string
   }
-  if (query['redirectResult']) {
-    redirectResult = query['redirectResult'] as string
+  if (query["redirectResult"]) {
+    redirectResult = query["redirectResult"] as string
   }
-  if (typeof window !== 'undefined') {
+  if (typeof window !== "undefined") {
     paypalReturnUrl = window.location.href
   }
   // const [shippingMethodId, setShippingMethodId] = useState<string>('')
@@ -96,11 +96,11 @@ export default function Main() {
         {
           clientId,
           endpoint,
-          scope
+          scope,
         },
         {
           username,
-          password
+          password,
         }
       )
       if (token) setToken(token.accessToken)
@@ -113,11 +113,11 @@ export default function Main() {
   ) : (
     <>
       <Head>
-        <script src='http://localhost:8097' />
+        <script src="http://localhost:8097" />
       </Head>
       <React.StrictMode>
-        <CommerceLayer accessToken={token} endpoint={endpoint ?? ''}>
-          <div className='container mx-auto mt-5 px-5'>
+        <CommerceLayer accessToken={token} endpoint={endpoint ?? ""}>
+          <div className="container mx-auto mt-5 px-5">
             <OrderContainer orderId={orderId}>
               <PaymentMethodsContainer
                 config={{
@@ -147,24 +147,24 @@ export default function Main() {
                       //   },
                       // },
                       hideIcon: false,
-                      hidePostalCode: true
+                      hidePostalCode: true,
                     },
-                    containerClassName: 'w-1/2 px-3'
+                    containerClassName: "w-1/2 px-3",
                   },
                   paypalPayment: {
                     cancel_url: paypalReturnUrl,
-                    return_url: paypalReturnUrl
+                    return_url: paypalReturnUrl,
                   },
                   klarnaPayment: {
                     placeOrderCallback: (res: any) => {
                       if (res.placed) setPlaced(true)
-                    }
+                    },
                   },
                   adyenPayment: {
                     placeOrderCallback: (res: any) => {
                       if (res.placed) setPlaced(true)
-                    }
-                  }
+                    },
+                  },
                 }}
               >
                 <PlaceOrderContainer
@@ -172,77 +172,64 @@ export default function Main() {
                     paypalPayerId,
                     checkoutCom: { session_id: checkoutComSession },
                     adyen: {
-                      redirectResult
-                    }
+                      redirectResult,
+                    },
                   }}
                 >
                   <PaymentMethod
-                    hide={[
-                      'stripe_payments',
-                      'adyen_payments',
-                      'klarna_payments'
-                    ]}
-                    className='p-2 my-1 flex items-center justify-items-center bg-gray-300 cursor-pointer'
-                    activeClass='bg-opacity-25'
+                    hide={["stripe_payments", "adyen_payments", "klarna_payments"]}
+                    className="p-2 my-1 flex items-center justify-items-center bg-gray-300 cursor-pointer"
+                    activeClass="bg-opacity-25"
                     clickableContainer
                   >
-                    <PaymentMethodRadioButton data-cy='payment-radio-button' />
-                    <PaymentMethodName className='pl-3' />
-                    <PaymentMethodPrice className='pl-3' />
+                    <PaymentMethodRadioButton data-cy="payment-radio-button" />
+                    <PaymentMethodName className="pl-3" />
+                    <PaymentMethodPrice className="pl-3" />
                     <PaymentSource
-                      data-test-id='payment-source'
-                      className='p-5 my-2'
-                      loader='Caricamento...'
+                      data-test-id="payment-source"
+                      className="p-5 my-2"
+                      loader="Caricamento..."
                     >
-                      <div className='flex flex-row items-center justify-start bg-gray-100 p-5 my-10'>
-                        <div className='flex flex-row items-center'>
-                          <PaymentSourceBrandIcon className='mr-3' />
+                      <div className="flex flex-row items-center justify-start bg-gray-100 p-5 my-10">
+                        <div className="flex flex-row items-center">
+                          <PaymentSourceBrandIcon className="mr-3" />
                           <PaymentSourceBrandName
-                            className='mr-1'
-                            data-cy='payment-brand-name-card'
+                            className="mr-1"
+                            data-cy="payment-brand-name-card"
                           />
                           ending in
                           <PaymentSourceDetail
-                            data-cy='payment-last4'
-                            className='ml-1'
-                            type='last4'
+                            data-cy="payment-last4"
+                            className="ml-1"
+                            type="last4"
                           />
                         </div>
-                        <div className='text-gray-500 ml-5'>
-                          <PaymentSourceDetail
-                            data-cy='payment-exp-month'
-                            type='exp_month'
-                          />
-                          <PaymentSourceDetail
-                            data-cy='payment-exp-year'
-                            type='exp_year'
-                          />
+                        <div className="text-gray-500 ml-5">
+                          <PaymentSourceDetail data-cy="payment-exp-month" type="exp_month" />
+                          <PaymentSourceDetail data-cy="payment-exp-year" type="exp_year" />
                         </div>
-                        <div className='ml-5'>
+                        <div className="ml-5">
                           <PaymentSourceEditButton
-                            data-cy='payment-edit-button'
-                            className='text-blue-500 hover:underline hover:text-blue-600'
+                            data-cy="payment-edit-button"
+                            className="text-blue-500 hover:underline hover:text-blue-600"
                           />
                         </div>
                       </div>
                     </PaymentSource>
-                    <Errors
-                      className='text-red-600 block'
-                      resource='payment_methods'
-                    />
+                    <Errors className="text-red-600 block" resource="payment_methods" />
                   </PaymentMethod>
 
-                  <div className='flex flex-row-reverse justify-end'>
+                  <div className="flex flex-row-reverse justify-end">
                     <label
-                      htmlFor='privacy-terms'
-                      className='block text-sm font-medium text-gray-700 ml-3 self-end'
+                      htmlFor="privacy-terms"
+                      className="block text-sm font-medium text-gray-700 ml-3 self-end"
                     >
                       Accept privacy and terms
                     </label>
-                    <div className='mt-1'>
+                    <div className="mt-1">
                       <PrivacyAndTermsCheckbox
-                        id='privacy-terms'
-                        className='h-4 w-4 text-blue-500 focus:ring-blue-400 border-gray-300 rounded disabled:opacity-50'
+                        id="privacy-terms"
+                        className="h-4 w-4 text-blue-500 focus:ring-blue-400 border-gray-300 rounded disabled:opacity-50"
                       />
                     </div>
                   </div>
@@ -251,13 +238,13 @@ export default function Main() {
                       onClick={(res: any) => {
                         if (res.placed) setPlaced(true)
                       }}
-                      className='mt-5 inline-flex items-center px-3 py-2 border border-transparent text-sm leading-4 font-medium rounded-md shadow-sm text-white bg-green-600 hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 disabled:opacity-50'
+                      className="mt-5 inline-flex items-center px-3 py-2 border border-transparent text-sm leading-4 font-medium rounded-md shadow-sm text-white bg-green-600 hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500 disabled:opacity-50"
                     />
                   </div>
                 </PlaceOrderContainer>
               </PaymentMethodsContainer>
-              <div className='flex flex-col text-red-600 mt-5'>
-                <Errors resource='orders' messages={messages} />
+              <div className="flex flex-col text-red-600 mt-5">
+                <Errors resource="orders" messages={messages} />
               </div>
               {/* <PaymentMethodsContainer>
               <PaymentSource readonly>
diff --git a/examples/checkout/shipments.tsx b/examples/checkout/shipments.tsx
index fecebe81..ff3b0662 100644
--- a/examples/checkout/shipments.tsx
+++ b/examples/checkout/shipments.tsx
@@ -1,6 +1,6 @@
-import { useState, useEffect, Fragment } from 'react'
-import { getCustomerToken } from '@commercelayer/js-auth'
-import Head from 'next/head'
+import { useState, useEffect, Fragment } from "react"
+import { getCustomerToken } from "@commercelayer/js-auth"
+import Head from "next/head"
 import {
   CommerceLayer,
   LineItem,
@@ -21,22 +21,22 @@ import {
   ShipmentField,
   ShippingMethodRadioButtonType,
   Errors,
-} from 'packages/react-components/src'
-import { isEmpty } from 'packages/react-components/src/utils/isEmpty'
-import { useRouter } from 'next/router'
-import getSdk from '#utils/getSdk'
+} from "packages/react-components/src"
+import { isEmpty } from "packages/react-components/src/utils/isEmpty"
+import { useRouter } from "next/router"
+import getSdk from "#utils/getSdk"
 
 const clientId = process.env.NEXT_PUBLIC_CLIENT_ID as string
 const endpoint = process.env.NEXT_PUBLIC_ENDPOINT as string
 const scope = process.env.NEXT_PUBLIC_MARKET_ID as string
 const username = process.env.NEXT_PUBLIC_USERNAME as string
 const password = process.env.NEXT_PUBLIC_PASSWORD as string
-let orderId = 'PDerhJplRp'
+let orderId = "PDerhJplRp"
 
 export default function Main() {
-  const [token, setToken] = useState('')
-  const [shippingMethodName, setShippingMethodName] = useState('')
-  const [shippingMethodId, setShippingMethodId] = useState<string>('')
+  const [token, setToken] = useState("")
+  const [shippingMethodName, setShippingMethodName] = useState("")
+  const [shippingMethodId, setShippingMethodId] = useState<string>("")
   const { query } = useRouter()
   if (query.orderId) {
     orderId = query.orderId as string
@@ -45,7 +45,7 @@ export default function Main() {
     const config = { accessToken: token, endpoint }
     const sdk = getSdk(config)
     const order = await sdk.orders.retrieve(orderId, {
-      include: ['shipments.shipping_method'],
+      include: ["shipments.shipping_method"],
     })
     const shipments = order.shipments
     if (!isEmpty(shipments) && shipments) {
@@ -75,10 +75,7 @@ export default function Main() {
     if (!token) getToken()
     if (token) getOrder()
   }, [token])
-  const handleChange = ({
-    shippingMethod,
-    shipmentId,
-  }: ShippingMethodRadioButtonType) => {
+  const handleChange = ({ shippingMethod, shipmentId }: ShippingMethodRadioButtonType) => {
     console.log(`shippingMethod`, shippingMethod, shipmentId)
     if (shippingMethod?.name) {
       setShippingMethodName(shippingMethod.name)
@@ -118,7 +115,7 @@ export default function Main() {
                             className="px-1"
                             attribute="image_url"
                             tagElement="img"
-                          />{' '}
+                          />{" "}
                           of <LineItemQuantity readonly className="px-1" />
                           items will undergo a transfer
                         </div>
@@ -135,11 +132,7 @@ export default function Main() {
                     <ShippingMethodName data-cy="shipping-method-name" />
                     <ShippingMethodPrice data-cy="shipping-method-price" />
                     <div className="flex">
-                      <DeliveryLeadTime
-                        type="min_days"
-                        data-cy="delivery-lead-time-min-days"
-                      />{' '}
-                      -{' '}
+                      <DeliveryLeadTime type="min_days" data-cy="delivery-lead-time-min-days" /> -{" "}
                       <DeliveryLeadTime
                         type="max_days"
                         data-cy="delivery-lead-time-max-days"
@@ -163,7 +156,7 @@ export default function Main() {
                         <ShippingMethodName data-cy="shipping-method-name-recap" />
                         <ShippingMethodPrice />
                         <div className="flex">
-                          <DeliveryLeadTime type="min_days" /> -{' '}
+                          <DeliveryLeadTime type="min_days" /> -{" "}
                           <DeliveryLeadTime type="max_days" className="mr-1" />
                           days
                         </div>
diff --git a/examples/gift-cards.tsx b/examples/gift-cards.tsx
index d3006763..15280000 100644
--- a/examples/gift-cards.tsx
+++ b/examples/gift-cards.tsx
@@ -1,16 +1,16 @@
-import { getSalesChannelToken } from '@commercelayer/js-auth'
-import { Fragment, useEffect, useState } from 'react'
-import CommerceLayer from '../#components/auth/CommerceLayer'
-import GiftCardContainer from '../#components/GiftCardContainer'
-import SubmitButton from '../#components/SubmitButton'
-import GiftCard from '../#components/gift_cards/GiftCard'
-import GiftCardInput from '../#components/GiftCardInput'
-import GiftCardCurrencySelector from '../#components/GiftCardCurrencySelector'
-import MetadataInput from '../#components/MetadataInput'
-import Errors from '../#components/Errors'
-import { Nav } from '.'
-import OrderContainer from '../#components/OrderContainer'
-import { BaseError } from '../#typings/errors'
+import { getSalesChannelToken } from "@commercelayer/js-auth"
+import { Fragment, useEffect, useState } from "react"
+import CommerceLayer from "../#components/auth/CommerceLayer"
+import GiftCardContainer from "../#components/GiftCardContainer"
+import SubmitButton from "../#components/SubmitButton"
+import GiftCard from "../#components/gift_cards/GiftCard"
+import GiftCardInput from "../#components/GiftCardInput"
+import GiftCardCurrencySelector from "../#components/GiftCardCurrencySelector"
+import MetadataInput from "../#components/MetadataInput"
+import Errors from "../#components/Errors"
+import { Nav } from "."
+import OrderContainer from "../#components/OrderContainer"
+import { BaseError } from "../#typings/errors"
 import {
   LineItemsContainer,
   LineItemsCount,
@@ -28,7 +28,7 @@ import {
   TotalAmount,
   CheckoutLink,
   OrderStorage,
-} from '../packages/react-components/src'
+} from "../packages/react-components/src"
 
 const clientId = process.env.NEXT_PUBLIC_CLIENT_ID as string
 const endpoint = process.env.NEXT_PUBLIC_ENDPOINT as string
@@ -38,17 +38,15 @@ const scope = process.env.NEXT_PUBLIC_MARKET_ID as string
 
 const messages = [
   {
-    code: 'VALIDATION_ERROR',
-    message: 'La email non ha un formato valido',
-    field: 'email',
+    code: "VALIDATION_ERROR",
+    message: "La email non ha un formato valido",
+    field: "email",
   },
-  { code: 'VALIDATION_ERROR', message: 'Errore di validazione' },
+  { code: "VALIDATION_ERROR", message: "Errore di validazione" },
 ]
 
 export const Title = ({ title }) => (
-  <div className="font-bold text-2xl mb-2 bg-red-500 text-gray-800 p-3">
-    {title}
-  </div>
+  <div className="font-bold text-2xl mb-2 bg-red-500 text-gray-800 p-3">{title}</div>
 )
 
 export const Type = ({ text }) => (
@@ -58,7 +56,7 @@ export const Type = ({ text }) => (
 )
 
 const Home = () => {
-  const [token, setToken] = useState('')
+  const [token, setToken] = useState("")
   useEffect(() => {
     const getToken = async () => {
       const token = await getSalesChannelToken({
@@ -72,7 +70,7 @@ const Home = () => {
   }, [])
   return (
     <Fragment>
-      <Nav links={['/order', '/multiOrder', '/multiApp']} />
+      <Nav links={["/order", "/multiOrder", "/multiApp"]} />
       <CommerceLayer accessToken={token} endpoint={endpoint}>
         <OrderStorage persistKey="orderUS">
           <OrderContainer>
@@ -99,11 +97,7 @@ const Home = () => {
                       name="email"
                       placeholder="Email*"
                     />
-                    <Errors
-                      resource="gift_cards"
-                      field="email"
-                      messages={messages}
-                    />
+                    <Errors resource="gift_cards" field="email" messages={messages} />
                   </div>
                   <div className="p-2">
                     <GiftCardInput
@@ -158,24 +152,16 @@ const Home = () => {
             <h1 className="text-4xl border-b-2 my-5">Shopping Bag</h1>
             <LineItemsContainer>
               <p className="text-sm m-2">
-                Your shopping bag contains{' '}
-                <LineItemsCount id="items-count" className="font-bold" /> items
+                Your shopping bag contains <LineItemsCount id="items-count" className="font-bold" />{" "}
+                items
               </p>
               <div className="flex flex-col p-2">
                 <LineItem>
                   <div className="flex justify-around items-center border-b p-5">
                     <LineItemImage className="p-2" width={80} />
                     <LineItemName id="line-item-name" className="p-2" />
-                    <LineItemQuantity
-                      id="line-item-quantity"
-                      max={100}
-                      className="p-2"
-                    />
-                    <Errors
-                      className="text-red-700 p-2"
-                      resource="line_items"
-                      field="quantity"
-                    />
+                    <LineItemQuantity id="line-item-quantity" max={100} className="p-2" />
+                    <Errors className="text-red-700 p-2" resource="line_items" field="quantity" />
                     <LineItemAmount id="line-item-total" className="p-2" />
                     <LineItemRemoveLink
                       id="line-item-remove"
@@ -187,12 +173,7 @@ const Home = () => {
                   <div className="flex justify-between items-center border-b p-5">
                     <LineItemImage className="p-2" width={40} />
                     <LineItemName id="line-item-name" className="p-2" />
-                    <LineItemQuantity
-                      id="line-item-quantity"
-                      max={10}
-                      className="p-2"
-                      disabled
-                    />
+                    <LineItemQuantity id="line-item-quantity" max={10} className="p-2" disabled />
                     <LineItemAmount id="line-item-total" className="p-2" />
                     <LineItemRemoveLink
                       id="line-item-remove"
@@ -255,10 +236,7 @@ const Home = () => {
               </div>
             </div>
             <div className="flex justify-center p-2">
-              <CheckoutLink
-                className="mt-2 primary font-bold py-2 px-4 rounded"
-                label="Checkout"
-              />
+              <CheckoutLink className="mt-2 primary font-bold py-2 px-4 rounded" label="Checkout" />
             </div>
           </OrderContainer>
         </OrderStorage>
diff --git a/examples/handleError.tsx b/examples/handleError.tsx
index 195c85bb..bc3b3f4a 100644
--- a/examples/handleError.tsx
+++ b/examples/handleError.tsx
@@ -1,33 +1,33 @@
-import React, { useState, useEffect, Fragment } from 'react'
-import { getIntegrationToken } from '@commercelayer/js-auth'
-import CommerceLayer from '../#components/auth/CommerceLayer'
-import { Nav } from '.'
-import OrderContainer from '../#components/OrderContainer'
-import VariantsContainer from '../#components/VariantsContainer'
-import VariantSelector from '../#components/skus/VariantSelector'
-import PricesContainer from '../#components/prices/PricesContainer'
-import Price from '../#components/Price'
-import AddToCartButton from '../#components/orders/AddToCartButton'
-import LineItemsContainer from '../#components/LineItemsContainer'
-import LineItem from '../#components/line_items/LineItem'
-import LineItemImage from '../#components/LineItemImage'
-import LineItemName from '../#components/LineItemName'
-import LineItemQuantity from '../#components/LineItemQuantity'
-import LineItemAmount from '../#components/LineItemAmount'
-import LineItemRemoveLink from '../#components/LineItemRemoveLink'
-import CheckoutLink from '../#components/orders/CheckoutLink'
-import SubTotalAmount from '../#components/SubTotalAmount'
-import QuantitySelector from '../#components/skus/QuantitySelector'
-import LineItemsCount from '../#components/LineItemsCount'
-import TotalAmount from '../#components/orders/TotalAmount'
-import DiscountAmount from '../#components/orders/DiscountAmount'
-import ShippingAmount from '../#components/orders/ShippingAmount'
-import TaxesAmount from '../#components/TaxesAmount'
-import GiftCardAmount from '../#components/orders/GiftCardAmount'
-import AvailabilityContainer from '../#components/AvailabilityContainer'
-import AvailabilityTemplate from '../#components/skus/AvailabilityTemplate'
-import ItemContainer from '../#components/orders/ItemContainer'
-import Errors from '../#components/Errors'
+import React, { useState, useEffect, Fragment } from "react"
+import { getIntegrationToken } from "@commercelayer/js-auth"
+import CommerceLayer from "../#components/auth/CommerceLayer"
+import { Nav } from "."
+import OrderContainer from "../#components/OrderContainer"
+import VariantsContainer from "../#components/VariantsContainer"
+import VariantSelector from "../#components/skus/VariantSelector"
+import PricesContainer from "../#components/prices/PricesContainer"
+import Price from "../#components/Price"
+import AddToCartButton from "../#components/orders/AddToCartButton"
+import LineItemsContainer from "../#components/LineItemsContainer"
+import LineItem from "../#components/line_items/LineItem"
+import LineItemImage from "../#components/LineItemImage"
+import LineItemName from "../#components/LineItemName"
+import LineItemQuantity from "../#components/LineItemQuantity"
+import LineItemAmount from "../#components/LineItemAmount"
+import LineItemRemoveLink from "../#components/LineItemRemoveLink"
+import CheckoutLink from "../#components/orders/CheckoutLink"
+import SubTotalAmount from "../#components/SubTotalAmount"
+import QuantitySelector from "../#components/skus/QuantitySelector"
+import LineItemsCount from "../#components/LineItemsCount"
+import TotalAmount from "../#components/orders/TotalAmount"
+import DiscountAmount from "../#components/orders/DiscountAmount"
+import ShippingAmount from "../#components/orders/ShippingAmount"
+import TaxesAmount from "../#components/TaxesAmount"
+import GiftCardAmount from "../#components/orders/GiftCardAmount"
+import AvailabilityContainer from "../#components/AvailabilityContainer"
+import AvailabilityTemplate from "../#components/skus/AvailabilityTemplate"
+import ItemContainer from "../#components/orders/ItemContainer"
+import Errors from "../#components/Errors"
 
 const clientId = process.env.NEXT_PUBLIC_CLIENT_ID_INTEGRATION as string
 const clientSecret = process.env.NEXT_PUBLIC_CLIENT_SECRET as string
@@ -37,7 +37,7 @@ const scope = process.env.NEXT_PUBLIC_MARKET_ID as string
 // const password = process.env.NEXT_PUBLIC_CUSTOMER_PASSWORD as string
 
 const CustomAddToCart = (props) => {
-  const classes = props.disabled ? 'opacity-50 cursor-not-allowed' : ''
+  const classes = props.disabled ? "opacity-50 cursor-not-allowed" : ""
   const myClick = () => {
     props.handleClick()
   }
@@ -54,7 +54,7 @@ const CustomAddToCart = (props) => {
 }
 
 export default function Order() {
-  const [token, setToken] = useState('')
+  const [token, setToken] = useState("")
   useEffect(() => {
     const getToken = async () => {
       const token = await getIntegrationToken({
@@ -69,7 +69,7 @@ export default function Order() {
   }, [])
   return (
     <Fragment>
-      <Nav links={['/multiOrder', '/multiApp', '/giftCard']} />
+      <Nav links={["/multiOrder", "/multiApp", "/giftCard"]} />
       <CommerceLayer accessToken={token} endpoint={endpoint}>
         <div className="container mx-auto mt-5 px-5">
           <OrderContainer>
@@ -99,21 +99,21 @@ export default function Order() {
                         name="variant1"
                         options={[
                           {
-                            label: '6 months',
-                            code: 'BABYONBU000000E63E746MXX',
+                            label: "6 months",
+                            code: "BABYONBU000000E63E746MXX",
                             lineItem: {
-                              name: 'Darth Vader (12 Months)',
+                              name: "Darth Vader (12 Months)",
                               imageUrl:
-                                'https://i.pinimg.com/736x/a5/32/de/a532de337eff9b1c1c4bfb8df73acea4--darth-vader-stencil-darth-vader-head.jpg?b=t',
+                                "https://i.pinimg.com/736x/a5/32/de/a532de337eff9b1c1c4bfb8df73acea4--darth-vader-stencil-darth-vader-head.jpg?b=t",
                             },
                           },
                           {
-                            label: '12 months',
-                            code: 'BABYONBU000000E63E7412MX',
+                            label: "12 months",
+                            code: "BABYONBU000000E63E7412MX",
                           },
                           {
-                            label: '24 months',
-                            code: 'BABYONBU000000E63E746MXXFAKE',
+                            label: "24 months",
+                            code: "BABYONBU000000E63E746MXXFAKE",
                           },
                         ]}
                       />
@@ -136,11 +136,7 @@ export default function Order() {
                     </AvailabilityContainer>
                   </div>
                   <div className="m-2">
-                    <Errors
-                      className="text-red-700 p-2"
-                      resource="order"
-                      field="quantity"
-                    />
+                    <Errors className="text-red-700 p-2" resource="order" field="quantity" />
                   </div>
                 </div>
               </div>
@@ -148,24 +144,16 @@ export default function Order() {
             <h1 className="text-4xl border-b-2 my-5">Shopping Bag</h1>
             <LineItemsContainer>
               <p className="text-sm m-2">
-                Your shopping bag contains{' '}
-                <LineItemsCount id="items-count" className="font-bold" /> items
+                Your shopping bag contains <LineItemsCount id="items-count" className="font-bold" />{" "}
+                items
               </p>
               <div className="flex flex-col p-2">
                 <LineItem>
                   <div className="flex justify-around items-center border-b p-5">
                     <LineItemImage className="p-2" width={80} />
                     <LineItemName id="line-item-name" className="p-2" />
-                    <LineItemQuantity
-                      id="line-item-quantity"
-                      max={100}
-                      className="p-2"
-                    />
-                    <Errors
-                      className="text-red-700 p-2"
-                      resource="lineItem"
-                      field="quantity"
-                    />
+                    <LineItemQuantity id="line-item-quantity" max={100} className="p-2" />
+                    <Errors className="text-red-700 p-2" resource="lineItem" field="quantity" />
                     <LineItemAmount id="line-item-total" className="p-2" />
                     <LineItemRemoveLink
                       id="line-item-remove"
@@ -228,10 +216,7 @@ export default function Order() {
               </div>
             </div>
             <div className="flex justify-center p-2">
-              <CheckoutLink
-                className="mt-2 primary font-bold py-2 px-4 rounded"
-                label="Checkout"
-              />
+              <CheckoutLink className="mt-2 primary font-bold py-2 px-4 rounded" label="Checkout" />
             </div>
           </OrderContainer>
         </div>
diff --git a/examples/index.tsx b/examples/index.tsx
index 223f3828..6ae27d90 100644
--- a/examples/index.tsx
+++ b/examples/index.tsx
@@ -1,11 +1,11 @@
-import { getIntegrationToken } from '@commercelayer/js-auth'
-import { useEffect, useState } from 'react'
-import Price from '#components/prices/Price'
-import PricesContainer from '#components/prices/PricesContainer'
-import CommerceLayer from '#components/auth/CommerceLayer'
-import SkusContainer from '#components/skus/SkusContainer'
-import Skus from '#components/skus/Skus'
-import SkuField from '#components/skus/SkuField'
+import { getIntegrationToken } from "@commercelayer/js-auth"
+import { useEffect, useState } from "react"
+import Price from "#components/prices/Price"
+import PricesContainer from "#components/prices/PricesContainer"
+import CommerceLayer from "#components/auth/CommerceLayer"
+import SkusContainer from "#components/skus/SkusContainer"
+import Skus from "#components/skus/Skus"
+import SkuField from "#components/skus/SkuField"
 
 const clientId = process.env.NEXT_PUBLIC_CLIENT_ID_INTEGRATION as string
 const clientSecret = process.env.NEXT_PUBLIC_CLIENT_SECRET as string
@@ -13,24 +13,20 @@ const endpoint = process.env.NEXT_PUBLIC_ENDPOINT as string
 const scope = process.env.NEXT_PUBLIC_MARKET_ID as string
 
 export const Nav = ({ links }: any) => (
-  <header className='dark p-6'>
-    <div className='container mx-auto'>
-      <nav className='flex flex-row items-center'>
-        <div className='flex items-center mr-10'>
-          <a href='/' className='w-48'>
-            <img src='//commercelayer.io/assets/img/logos/commercelayer-logo-white.svg' />
+  <header className="dark p-6">
+    <div className="container mx-auto">
+      <nav className="flex flex-row items-center">
+        <div className="flex items-center mr-10">
+          <a href="/" className="w-48">
+            <img src="//commercelayer.io/assets/img/logos/commercelayer-logo-white.svg" />
           </a>
         </div>
-        <div className='flex w-full justify-end'>
-          <div className=''>
+        <div className="flex w-full justify-end">
+          <div className="">
             {links.map((l: string, i: number) => {
               return (
-                <a
-                  key={i}
-                  className='dark capitalize text-base font-normal mr-5'
-                  href={l}
-                >
-                  {l === '/' ? 'home' : l.replace('/', ' ')}
+                <a key={i} className="dark capitalize text-base font-normal mr-5" href={l}>
+                  {l === "/" ? "home" : l.replace("/", " ")}
                 </a>
               )
             })}
@@ -42,17 +38,17 @@ export const Nav = ({ links }: any) => (
 )
 
 export const Title = ({ title }: any) => (
-  <div className='font-bold text-2xl mb-2 bg-green-300'>{title}</div>
+  <div className="font-bold text-2xl mb-2 bg-green-300">{title}</div>
 )
 
 export const Type = ({ text }: any) => (
-  <span className='inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2'>
+  <span className="inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2">
     #{text}
   </span>
 )
 
 const skus = [
-  'BABYONBU000000E63E7412MX'
+  "BABYONBU000000E63E7412MX",
   // 'BABYONBU000000E63E74',
   // 'BABYONBU000000E63E7412MX',
   // 'BABYONBU000000E63E7418MX',
@@ -342,14 +338,14 @@ const skus = [
 ]
 
 const Home = () => {
-  const [token, setToken] = useState('')
+  const [token, setToken] = useState("")
   useEffect(() => {
     const getToken = async () => {
       const { accessToken } = await getIntegrationToken({
         clientId,
         clientSecret,
         endpoint,
-        scope
+        scope,
       })
       setToken(accessToken)
     }
@@ -357,27 +353,27 @@ const Home = () => {
   }, [])
   const Loading = () => <div>Caricamento...</div>
   return (
-    <section className='bg-gray-100'>
-      <Nav links={['/order', '/multiOrder', '/multiApp', '/giftCard']} />
-      <div className='container mx-auto'>
+    <section className="bg-gray-100">
+      <Nav links={["/order", "/multiOrder", "/multiApp", "/giftCard"]} />
+      <div className="container mx-auto">
         <CommerceLayer accessToken={token} endpoint={endpoint}>
-          <div className='flex flex-row flex-wrap justify-around'>
+          <div className="flex flex-row flex-wrap justify-around">
             <SkusContainer skus={skus}>
               <Skus>
-                <SkuField attribute='image_url' tagElement='img' />
-                <SkuField attribute='code' tagElement='p' />
+                <SkuField attribute="image_url" tagElement="img" />
+                <SkuField attribute="code" tagElement="p" />
               </Skus>
             </SkusContainer>
             <PricesContainer perPage={20} loader={<Loading />}>
               {skus.map((s, k) => {
                 return (
-                  <div key={k} className='text-center p-3'>
-                    <div className='flex flex-row flex-wrap justify-center'>
+                  <div key={k} className="text-center p-3">
+                    <div className="flex flex-row flex-wrap justify-center">
                       <Price
                         data-test={`price-${k}`}
                         skuCode={s}
-                        className='text-green-600 text-2xl m-1'
-                        compareClassName='text-gray-500 text-2xl m-1 line-through'
+                        className="text-green-600 text-2xl m-1"
+                        compareClassName="text-gray-500 text-2xl m-1 line-through"
                       />
                     </div>
                   </div>
diff --git a/examples/multiApp.tsx b/examples/multiApp.tsx
index b5470237..ae7ae5f0 100644
--- a/examples/multiApp.tsx
+++ b/examples/multiApp.tsx
@@ -1,40 +1,40 @@
-import React, { useState, useEffect, Fragment } from 'react'
-import { getSalesChannelToken } from '@commercelayer/js-auth'
-import CommerceLayer from '../#components/auth/CommerceLayer'
-import { Nav } from '.'
-import OrderContainer from '../#components/OrderContainer'
-import VariantsContainer from '../#components/VariantsContainer'
-import VariantSelector from '../#components/skus/VariantSelector'
-import PricesContainer from '../#components/prices/PricesContainer'
-import Price from '../#components/Price'
-import AddToCartButton from '../#components/orders/AddToCartButton'
-import LineItemsContainer from '../#components/LineItemsContainer'
-import LineItem from '../#components/line_items/LineItem'
-import LineItemImage from '../#components/LineItemImage'
-import LineItemName from '../#components/LineItemName'
-import LineItemQuantity from '../#components/LineItemQuantity'
-import LineItemAmount from '../#components/LineItemAmount'
-import LineItemRemoveLink from '../#components/LineItemRemoveLink'
-import CheckoutLink from '../#components/orders/CheckoutLink'
-import SubTotalAmount from '../#components/SubTotalAmount'
-import QuantitySelector from '../#components/skus/QuantitySelector'
-import LineItemsCount from '../#components/LineItemsCount'
-import TotalAmount from '../#components/orders/TotalAmount'
-import DiscountAmount from '../#components/orders/DiscountAmount'
-import ShippingAmount from '../#components/orders/ShippingAmount'
-import TaxesAmount from '../#components/TaxesAmount'
-import GiftCardAmount from '../#components/orders/GiftCardAmount'
-import ItemContainer from '../#components/orders/ItemContainer'
+import React, { useState, useEffect, Fragment } from "react"
+import { getSalesChannelToken } from "@commercelayer/js-auth"
+import CommerceLayer from "../#components/auth/CommerceLayer"
+import { Nav } from "."
+import OrderContainer from "../#components/OrderContainer"
+import VariantsContainer from "../#components/VariantsContainer"
+import VariantSelector from "../#components/skus/VariantSelector"
+import PricesContainer from "../#components/prices/PricesContainer"
+import Price from "../#components/Price"
+import AddToCartButton from "../#components/orders/AddToCartButton"
+import LineItemsContainer from "../#components/LineItemsContainer"
+import LineItem from "../#components/line_items/LineItem"
+import LineItemImage from "../#components/LineItemImage"
+import LineItemName from "../#components/LineItemName"
+import LineItemQuantity from "../#components/LineItemQuantity"
+import LineItemAmount from "../#components/LineItemAmount"
+import LineItemRemoveLink from "../#components/LineItemRemoveLink"
+import CheckoutLink from "../#components/orders/CheckoutLink"
+import SubTotalAmount from "../#components/SubTotalAmount"
+import QuantitySelector from "../#components/skus/QuantitySelector"
+import LineItemsCount from "../#components/LineItemsCount"
+import TotalAmount from "../#components/orders/TotalAmount"
+import DiscountAmount from "../#components/orders/DiscountAmount"
+import ShippingAmount from "../#components/orders/ShippingAmount"
+import TaxesAmount from "../#components/TaxesAmount"
+import GiftCardAmount from "../#components/orders/GiftCardAmount"
+import ItemContainer from "../#components/orders/ItemContainer"
 
 const clientId = process.env.NEXT_PUBLIC_CLIENT_ID_INTEGRATION as string
 const clientSecret = process.env.NEXT_PUBLIC_CLIENT_SECRET as string
 const endpoint = process.env.NEXT_PUBLIC_ENDPOINT as string
 const scope = process.env.NEXT_PUBLIC_MARKET_ID as string
 
-const endpoint1 = 'https://the-lime-brand-2.commercelayer.co'
+const endpoint1 = "https://the-lime-brand-2.commercelayer.co"
 
 const CustomAddToCart = (props) => {
-  const classes = props.disabled ? 'opacity-50 cursor-not-allowed' : ''
+  const classes = props.disabled ? "opacity-50 cursor-not-allowed" : ""
   return (
     <button
       id="add-to-bag"
@@ -48,8 +48,8 @@ const CustomAddToCart = (props) => {
 }
 
 export default function Order() {
-  const [token, setToken] = useState('')
-  const [token1, setToken1] = useState('')
+  const [token, setToken] = useState("")
+  const [token1, setToken1] = useState("")
   useEffect(() => {
     const getToken = async () => {
       const salesChannel = await getSalesChannelToken({
@@ -61,10 +61,9 @@ export default function Order() {
     }
     const getToken1 = async () => {
       const salesChannel = await getSalesChannelToken({
-        clientId:
-          '24938609156dc7391cd5dfdea32b828ef2c20e02bccfccda6510ed59c09935ac',
+        clientId: "24938609156dc7391cd5dfdea32b828ef2c20e02bccfccda6510ed59c09935ac",
         endpoint: endpoint1,
-        scope: 'market:50',
+        scope: "market:50",
       })
       setToken1(salesChannel?.accessToken as string)
     }
@@ -73,7 +72,7 @@ export default function Order() {
   }, [])
   return (
     <Fragment>
-      <Nav links={['/']} />
+      <Nav links={["/"]} />
       <CommerceLayer accessToken={token} endpoint={endpoint} cache>
         <div className="max-w-full mx-auto mt-5 p-5">
           <OrderContainer persistKey="orderBlueBrand">
@@ -102,16 +101,16 @@ export default function Order() {
                         name="selector-us"
                         options={[
                           {
-                            label: '6 months',
-                            code: 'BABYONBU000000E63E746MXX',
+                            label: "6 months",
+                            code: "BABYONBU000000E63E746MXX",
                           },
                           {
-                            label: '12 months',
-                            code: 'BABYONBU000000E63E7412MX',
+                            label: "12 months",
+                            code: "BABYONBU000000E63E7412MX",
                           },
                           {
-                            label: '24 months',
-                            code: 'BABYONBU000000E63E746MXXFAKE',
+                            label: "24 months",
+                            code: "BABYONBU000000E63E746MXXFAKE",
                           },
                         ]}
                       />
@@ -137,19 +136,15 @@ export default function Order() {
             <h1 className="text-4xl border-b-2 my-5">Shopping Bag</h1>
             <LineItemsContainer>
               <p className="text-sm m-2">
-                Your shopping bag contains{' '}
-                <LineItemsCount name="count-us" className="font-bold" /> items
+                Your shopping bag contains <LineItemsCount name="count-us" className="font-bold" />{" "}
+                items
               </p>
               <div className="flex flex-col p-2">
                 <LineItem type="skus">
                   <div className="flex justify-around items-center border-b">
                     <LineItemImage className="p-2" width={80} />
                     <LineItemName className="p-2" />
-                    <LineItemQuantity
-                      name="lineItemQuantity-US"
-                      max={10}
-                      className="p-2"
-                    />
+                    <LineItemQuantity name="lineItemQuantity-US" max={10} className="p-2" />
                     <LineItemAmount className="p-2" />
                     <LineItemRemoveLink className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded" />
                   </div>
@@ -242,16 +237,16 @@ export default function Order() {
                         name="selector-it"
                         options={[
                           {
-                            label: '12 months',
-                            code: 'BABYONBUFFFFFF00000012MX',
+                            label: "12 months",
+                            code: "BABYONBUFFFFFF00000012MX",
                           },
                           {
-                            label: '6 months',
-                            code: 'BABYONBUFFFFFF0000006MXX',
+                            label: "6 months",
+                            code: "BABYONBUFFFFFF0000006MXX",
                           },
                           {
-                            label: '24 months',
-                            code: 'BABYONBUFFFFFF00000012MXFAKE',
+                            label: "24 months",
+                            code: "BABYONBUFFFFFF00000012MXFAKE",
                           },
                         ]}
                       />
@@ -277,8 +272,8 @@ export default function Order() {
             <h1 className="text-4xl border-b-2 my-5">Shopping Bag</h1>
             <LineItemsContainer>
               <p className="text-sm m-2">
-                Your shopping bag contains{' '}
-                <LineItemsCount name="count-it" className="font-bold" /> items
+                Your shopping bag contains <LineItemsCount name="count-it" className="font-bold" />{" "}
+                items
               </p>
               <div className="flex flex-col p-2">
                 <LineItem type="skus">
diff --git a/examples/multiOrder.tsx b/examples/multiOrder.tsx
index f18e5b7b..d434b12f 100644
--- a/examples/multiOrder.tsx
+++ b/examples/multiOrder.tsx
@@ -1,30 +1,30 @@
-import React, { useState, useEffect, Fragment } from 'react'
-import { getSalesChannelToken } from '@commercelayer/js-auth'
-import CommerceLayer from '../#components/auth/CommerceLayer'
-import { Nav } from '.'
-import OrderContainer from '../#components/OrderContainer'
-import VariantsContainer from '../#components/VariantsContainer'
-import VariantSelector from '../#components/skus/VariantSelector'
-import PricesContainer from '../#components/prices/PricesContainer'
-import Price from '../#components/Price'
-import AddToCartButton from '../#components/orders/AddToCartButton'
-import LineItemsContainer from '../#components/LineItemsContainer'
-import LineItem from '../#components/line_items/LineItem'
-import LineItemImage from '../#components/LineItemImage'
-import LineItemName from '../#components/LineItemName'
-import LineItemQuantity from '../#components/LineItemQuantity'
-import LineItemAmount from '../#components/LineItemAmount'
-import LineItemRemoveLink from '../#components/LineItemRemoveLink'
-import CheckoutLink from '../#components/orders/CheckoutLink'
-import SubTotalAmount from '../#components/SubTotalAmount'
-import QuantitySelector from '../#components/skus/QuantitySelector'
-import LineItemsCount from '../#components/LineItemsCount'
-import TotalAmount from '../#components/orders/TotalAmount'
-import DiscountAmount from '../#components/orders/DiscountAmount'
-import ShippingAmount from '../#components/orders/ShippingAmount'
-import TaxesAmount from '../#components/TaxesAmount'
-import GiftCardAmount from '../#components/orders/GiftCardAmount'
-import ItemContainer from '../#components/orders/ItemContainer'
+import React, { useState, useEffect, Fragment } from "react"
+import { getSalesChannelToken } from "@commercelayer/js-auth"
+import CommerceLayer from "../#components/auth/CommerceLayer"
+import { Nav } from "."
+import OrderContainer from "../#components/OrderContainer"
+import VariantsContainer from "../#components/VariantsContainer"
+import VariantSelector from "../#components/skus/VariantSelector"
+import PricesContainer from "../#components/prices/PricesContainer"
+import Price from "../#components/Price"
+import AddToCartButton from "../#components/orders/AddToCartButton"
+import LineItemsContainer from "../#components/LineItemsContainer"
+import LineItem from "../#components/line_items/LineItem"
+import LineItemImage from "../#components/LineItemImage"
+import LineItemName from "../#components/LineItemName"
+import LineItemQuantity from "../#components/LineItemQuantity"
+import LineItemAmount from "../#components/LineItemAmount"
+import LineItemRemoveLink from "../#components/LineItemRemoveLink"
+import CheckoutLink from "../#components/orders/CheckoutLink"
+import SubTotalAmount from "../#components/SubTotalAmount"
+import QuantitySelector from "../#components/skus/QuantitySelector"
+import LineItemsCount from "../#components/LineItemsCount"
+import TotalAmount from "../#components/orders/TotalAmount"
+import DiscountAmount from "../#components/orders/DiscountAmount"
+import ShippingAmount from "../#components/orders/ShippingAmount"
+import TaxesAmount from "../#components/TaxesAmount"
+import GiftCardAmount from "../#components/orders/GiftCardAmount"
+import ItemContainer from "../#components/orders/ItemContainer"
 
 const clientId = process.env.NEXT_PUBLIC_CLIENT_ID_INTEGRATION as string
 const clientSecret = process.env.NEXT_PUBLIC_CLIENT_SECRET as string
@@ -32,7 +32,7 @@ const endpoint = process.env.NEXT_PUBLIC_ENDPOINT as string
 const scope = process.env.NEXT_PUBLIC_MARKET_ID as string
 
 const CustomAddToCart = (props) => {
-  const classes = props.disabled ? 'opacity-50 cursor-not-allowed' : ''
+  const classes = props.disabled ? "opacity-50 cursor-not-allowed" : ""
   return (
     <button
       name={props.name}
@@ -46,7 +46,7 @@ const CustomAddToCart = (props) => {
 }
 
 export default function Order() {
-  const [token, setToken] = useState('')
+  const [token, setToken] = useState("")
   useEffect(() => {
     const getToken = async () => {
       // @ts-ignore
@@ -61,7 +61,7 @@ export default function Order() {
   }, [])
   return (
     <Fragment>
-      <Nav links={['/']} />
+      <Nav links={["/"]} />
       <CommerceLayer accessToken={token} endpoint={endpoint} cache>
         <div className="max-w-full mx-auto mt-5 p-5">
           <OrderContainer>
@@ -90,16 +90,16 @@ export default function Order() {
                         name="selector-us"
                         options={[
                           {
-                            label: '6 months',
-                            code: 'BABYONBU000000E63E746MXX',
+                            label: "6 months",
+                            code: "BABYONBU000000E63E746MXX",
                           },
                           {
-                            label: '12 months',
-                            code: 'BABYONBU000000E63E7412MX',
+                            label: "12 months",
+                            code: "BABYONBU000000E63E7412MX",
                           },
                           {
-                            label: '24 months',
-                            code: 'BABYONBU000000E63E746MXXFAKE',
+                            label: "24 months",
+                            code: "BABYONBU000000E63E746MXXFAKE",
                           },
                         ]}
                       />
@@ -125,19 +125,15 @@ export default function Order() {
             <h1 className="text-4xl border-b-2 my-5">Shopping Bag</h1>
             <LineItemsContainer>
               <p className="text-sm m-2">
-                Your shopping bag contains{' '}
-                <LineItemsCount name="count-us" className="font-bold" /> items
+                Your shopping bag contains <LineItemsCount name="count-us" className="font-bold" />{" "}
+                items
               </p>
               <div className="flex flex-col p-2">
                 <LineItem type="skus">
                   <div className="flex justify-around items-center border-b">
                     <LineItemImage className="p-2" width={80} />
                     <LineItemName className="p-2" />
-                    <LineItemQuantity
-                      name="lineItemQuantity-US"
-                      max={10}
-                      className="p-2"
-                    />
+                    <LineItemQuantity name="lineItemQuantity-US" max={10} className="p-2" />
                     <LineItemAmount className="p-2" />
                     <LineItemRemoveLink className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded" />
                   </div>
@@ -228,16 +224,16 @@ export default function Order() {
                         name="selector-it"
                         options={[
                           {
-                            label: '12 months',
-                            code: 'BABYONBUFFFFFF00000012MX',
+                            label: "12 months",
+                            code: "BABYONBUFFFFFF00000012MX",
                           },
                           {
-                            label: '6 months',
-                            code: 'BABYONBUFFFFFF0000006MXX',
+                            label: "6 months",
+                            code: "BABYONBUFFFFFF0000006MXX",
                           },
                           {
-                            label: '24 months',
-                            code: 'BABYONBUFFFFFF00000012MXFAKE',
+                            label: "24 months",
+                            code: "BABYONBUFFFFFF00000012MXFAKE",
                           },
                         ]}
                       />
@@ -263,8 +259,8 @@ export default function Order() {
             <h1 className="text-4xl border-b-2 my-5">Shopping Bag</h1>
             <LineItemsContainer>
               <p className="text-sm m-2">
-                Your shopping bag contains{' '}
-                <LineItemsCount name="count-it" className="font-bold" /> items
+                Your shopping bag contains <LineItemsCount name="count-it" className="font-bold" />{" "}
+                items
               </p>
               <div className="flex flex-col p-2">
                 <LineItem type="skus">
diff --git a/examples/my-account/customer-addresses.tsx b/examples/my-account/customer-addresses.tsx
index 90f11f81..5909c92f 100644
--- a/examples/my-account/customer-addresses.tsx
+++ b/examples/my-account/customer-addresses.tsx
@@ -10,22 +10,22 @@ import {
   AddressStateSelector,
   AddressCountrySelector,
   AddressesEmpty,
-} from 'packages/react-components/src'
-import { useState } from 'react'
-import useGetToken from '../../hooks/useGetToken'
-import SaveAddressesButton from '../../#components/addresses/SaveAddressesButton'
+} from "packages/react-components/src"
+import { useState } from "react"
+import useGetToken from "../../hooks/useGetToken"
+import SaveAddressesButton from "../../#components/addresses/SaveAddressesButton"
 
 const messages: any = [
   {
-    code: 'EMPTY_ERROR',
-    resource: 'addresses',
-    field: 'firstName',
+    code: "EMPTY_ERROR",
+    resource: "addresses",
+    field: "firstName",
     message: `Can't be blank`,
   },
   {
-    code: 'VALIDATION_ERROR',
-    resource: 'addresses',
-    field: 'email',
+    code: "VALIDATION_ERROR",
+    resource: "addresses",
+    field: "email",
     message: `Must be valid email`,
   },
 ]
@@ -39,7 +39,7 @@ const addresseses = () => {
     <CommerceLayer {...config}>
       <CustomerContainer>
         <AddressesContainer>
-        <AddressesEmpty />
+          <AddressesEmpty />
           <div className="w-full p-5">
             <div className="flex flex-wrap mx-auto w-full">
               <Address className="w-1/3 p-2 border hover:border-blue-500 rounded m-2 shadow-sm">
@@ -58,7 +58,7 @@ const addresseses = () => {
                         type="edit"
                         label="Edit"
                         onClick={(address) => {
-                          console.log('address', address)
+                          console.log("address", address)
                           setAddress(address)
                           setShowForm(true)
                         }}
@@ -78,7 +78,7 @@ const addresseses = () => {
             </div>
             <div className="mt-3 ml-2">
               <button
-                title='button'
+                title="button"
                 type="button"
                 className="inline-flex items-center p-1 border border-transparent rounded-full shadow-sm text-white bg-green-600 hover:bg-green-700 focus:outline-none focus:ring-2 focus:ring-offset-2 focus:ring-green-500"
                 onClick={() => {
@@ -125,7 +125,7 @@ const addresseses = () => {
                         type="text"
                         className="shadow-sm focus:ring-blue-500 focus:border-blue-500 block w-full sm:text-sm border-gray-300 rounded-md"
                         placeholder="First name"
-                        value={address?.first_name || ''}
+                        value={address?.first_name || ""}
                       />
                     </div>
                     <p className="mt-2 text-sm text-red-600" id="email-error">
@@ -151,7 +151,7 @@ const addresseses = () => {
                         type="text"
                         className="shadow-sm focus:ring-blue-500 focus:border-blue-500 block w-full sm:text-sm border-gray-300 rounded-md"
                         placeholder="Last name"
-                        value={address?.last_name || ''}
+                        value={address?.last_name || ""}
                       />
                     </div>
                     <p className="mt-2 text-sm text-red-600" id="email-error">
@@ -177,7 +177,7 @@ const addresseses = () => {
                         type="text"
                         className="shadow-sm focus:ring-blue-500 focus:border-blue-500 block w-full sm:text-sm border-gray-300 rounded-md"
                         placeholder="Address"
-                        value={address?.line_1 || ''}
+                        value={address?.line_1 || ""}
                       />
                     </div>
                     <p className="mt-2 text-sm text-red-600" id="email-error">
@@ -203,7 +203,7 @@ const addresseses = () => {
                         type="text"
                         className="shadow-sm focus:ring-blue-500 focus:border-blue-500 block w-full sm:text-sm border-gray-300 rounded-md"
                         placeholder="City"
-                        value={address?.city || ''}
+                        value={address?.city || ""}
                       />
                     </div>
                     <p className="mt-2 text-sm text-red-600" id="email-error">
@@ -228,11 +228,11 @@ const addresseses = () => {
                         name="billing_address_country_code"
                         className="mt-1 block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded-md"
                         placeholder={{
-                          value: '',
-                          label: 'Country',
+                          value: "",
+                          label: "Country",
                           disabled: true,
                         }}
-                        value={address?.country_code || ''}
+                        value={address?.country_code || ""}
                       />
                     </div>
                     <p className="mt-2 text-sm text-red-600" id="email-error">
@@ -258,11 +258,11 @@ const addresseses = () => {
                         className="mt-1 block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded-md"
                         inputClassName="mt-1 block w-full pl-3 pr-10 py-2 text-base border-gray-300 focus:outline-none focus:ring-blue-500 focus:border-blue-500 sm:text-sm rounded-md"
                         placeholder={{
-                          value: '',
-                          label: 'Select a state',
+                          value: "",
+                          label: "Select a state",
                           disabled: true,
                         }}
-                        value={address?.state_code || ''}
+                        value={address?.state_code || ""}
                       />
                     </div>
                     <p className="mt-2 text-sm text-red-600" id="email-error">
@@ -288,7 +288,7 @@ const addresseses = () => {
                         type="text"
                         className="shadow-sm focus:ring-blue-500 focus:border-blue-500 block w-full sm:text-sm border-gray-300 rounded-md"
                         placeholder="Zip code"
-                        value={address?.zip_code || ''}
+                        value={address?.zip_code || ""}
                       />
                     </div>
                     <p className="mt-2 text-sm text-red-600" id="email-error">
@@ -314,7 +314,7 @@ const addresseses = () => {
                         type="tel"
                         className="shadow-sm focus:ring-blue-500 focus:border-blue-500 block w-full sm:text-sm border-gray-300 rounded-md"
                         placeholder="Phone"
-                        value={address?.phone || ''}
+                        value={address?.phone || ""}
                       />
                     </div>
                     <p className="mt-2 text-sm text-red-600" id="email-error">
diff --git a/examples/my-account/customer-info.tsx b/examples/my-account/customer-info.tsx
index 13e79852..2ceee380 100644
--- a/examples/my-account/customer-info.tsx
+++ b/examples/my-account/customer-info.tsx
@@ -1,9 +1,5 @@
-import {
-  CommerceLayer,
-  CustomerContainer,
-  CustomerField,
-} from 'packages/react-components/src'
-import useGetToken from '../../hooks/useGetToken'
+import { CommerceLayer, CustomerContainer, CustomerField } from "packages/react-components/src"
+import useGetToken from "../../hooks/useGetToken"
 
 const OrdersList = () => {
   const config = useGetToken({ userMode: true })
diff --git a/examples/my-account/orders-list-infinite-scroll.tsx b/examples/my-account/orders-list-infinite-scroll.tsx
index 9a242b59..074c65e1 100644
--- a/examples/my-account/orders-list-infinite-scroll.tsx
+++ b/examples/my-account/orders-list-infinite-scroll.tsx
@@ -3,32 +3,32 @@ import {
   CustomerContainer,
   OrderList,
   OrderListRow,
-} from 'packages/react-components/src'
-import useGetToken from '../../hooks/useGetToken'
-const colClassName = 'uppercase text-left p-1 text-gray-400 text-sm'
-const titleClassName = 'flex flex-row items-center'
+} from "packages/react-components/src"
+import useGetToken from "../../hooks/useGetToken"
+const colClassName = "uppercase text-left p-1 text-gray-400 text-sm"
+const titleClassName = "flex flex-row items-center"
 const columns = [
   {
-    Header: 'Order',
-    accessor: 'number',
+    Header: "Order",
+    accessor: "number",
     className: colClassName,
     titleClassName,
   },
   {
-    Header: 'Status',
-    accessor: 'status',
+    Header: "Status",
+    accessor: "status",
     className: colClassName,
     titleClassName,
   },
   {
-    Header: 'Date',
-    accessor: 'updated_at',
+    Header: "Date",
+    accessor: "updated_at",
     className: colClassName,
     titleClassName,
   },
   {
-    Header: 'Date',
-    accessor: 'formatted_total_amount_with_taxes',
+    Header: "Date",
+    accessor: "formatted_total_amount_with_taxes",
     className: colClassName,
     titleClassName,
   },
@@ -76,24 +76,19 @@ const OrdersListInfiniteScroll = () => {
         >
           <OrderListRow field="number">
             {({ cell, order, infiniteScroll, ...p }) => {
-              const As = infiniteScroll ? 'div' : 'td'
+              const As = infiniteScroll ? "div" : "td"
               return cell.map((cell) => {
                 return (
                   <As {...p} className="py-5 border-b">
-                    <p className="font-bold">Order # {cell.render('Cell')}</p>
-                    <p className="text-xs text-gray-500">
-                      contains {order.skus_count} items
-                    </p>
+                    <p className="font-bold">Order # {cell.render("Cell")}</p>
+                    <p className="text-xs text-gray-500">contains {order.skus_count} items</p>
                   </As>
                 )
               })
             }}
           </OrderListRow>
           <OrderListRow field="status" className="align-top py-5 border-b" />
-          <OrderListRow
-            field="updated_at"
-            className="align-top py-5 border-b"
-          />
+          <OrderListRow field="updated_at" className="align-top py-5 border-b" />
           <OrderListRow
             field="formatted_total_amount_with_taxes"
             className="align-top py-5 border-b font-bold"
diff --git a/examples/my-account/orders-list.tsx b/examples/my-account/orders-list.tsx
index 92af84ac..ade3f1e7 100644
--- a/examples/my-account/orders-list.tsx
+++ b/examples/my-account/orders-list.tsx
@@ -4,33 +4,33 @@ import {
   CustomerContainer,
   CommerceLayer,
   OrderListEmpty,
-  OrderListColumn
-} from 'packages/react-components/src'
-import useGetToken from '../../hooks/useGetToken'
-const colClassName = 'uppercase text-left p-1 text-gray-400 text-sm'
-const titleClassName = 'flex flex-row items-center'
+  OrderListColumn,
+} from "packages/react-components/src"
+import useGetToken from "../../hooks/useGetToken"
+const colClassName = "uppercase text-left p-1 text-gray-400 text-sm"
+const titleClassName = "flex flex-row items-center"
 const columns: OrderListColumn[] = [
   {
-    Header: 'Order',
-    accessor: 'number',
+    Header: "Order",
+    accessor: "number",
     className: colClassName,
     titleClassName,
   },
   {
-    Header: 'Status',
-    accessor: 'status',
+    Header: "Status",
+    accessor: "status",
     className: colClassName,
     titleClassName,
   },
   {
-    Header: 'Date',
-    accessor: 'updated_at',
+    Header: "Date",
+    accessor: "updated_at",
     className: colClassName,
     titleClassName,
   },
   {
-    Header: 'Amount',
-    accessor: 'formatted_total_amount_with_taxes',
+    Header: "Amount",
+    accessor: "formatted_total_amount_with_taxes",
     className: colClassName,
     titleClassName,
   },
@@ -74,23 +74,22 @@ const OrdersList = () => {
           <OrderListEmpty />
           <OrderListRow field="number">
             {({ cell, order, ...p }) => {
-              return <>{cell?.map((cell) => {
-                return (
-                  <td {...p} className="py-5 border-b">
-                    <p className="font-bold">Order # {cell.render('Cell')}</p>
-                    <p className="text-xs text-gray-500">
-                      contains {order.skus_count} items
-                    </p>
-                  </td>
-                )
-              })}</>
+              return (
+                <>
+                  {cell?.map((cell) => {
+                    return (
+                      <td {...p} className="py-5 border-b">
+                        <p className="font-bold">Order # {cell.render("Cell")}</p>
+                        <p className="text-xs text-gray-500">contains {order.skus_count} items</p>
+                      </td>
+                    )
+                  })}
+                </>
+              )
             }}
           </OrderListRow>
           <OrderListRow field="status" className="align-top py-5 border-b" />
-          <OrderListRow
-            field="updated_at"
-            className="align-top py-5 border-b"
-          />
+          <OrderListRow field="updated_at" className="align-top py-5 border-b" />
           <OrderListRow
             field="formatted_total_amount_with_taxes"
             className="align-top py-5 border-b font-bold"
diff --git a/examples/my-account/parcels.tsx b/examples/my-account/parcels.tsx
index dc04a0a5..da609172 100644
--- a/examples/my-account/parcels.tsx
+++ b/examples/my-account/parcels.tsx
@@ -1,6 +1,6 @@
-import { useState, useEffect, Fragment } from 'react'
-import { getCustomerToken } from '@commercelayer/js-auth'
-import Head from 'next/head'
+import { useState, useEffect, Fragment } from "react"
+import { getCustomerToken } from "@commercelayer/js-auth"
+import Head from "next/head"
 import {
   CommerceLayer,
   OrderContainer,
@@ -14,22 +14,22 @@ import {
   ParcelLineItemField,
   ShipmentsCount,
   ParcelsCount,
-  ParcelLineItemsCount
-} from 'packages/react-components/src'
-import { useRouter } from 'next/router'
+  ParcelLineItemsCount,
+} from "packages/react-components/src"
+import { useRouter } from "next/router"
 
-const clientId = process.env['NEXT_PUBLIC_CLIENT_ID'] as string
-const endpoint = process.env['NEXT_PUBLIC_ENDPOINT'] as string
-const scope = process.env['NEXT_PUBLIC_MARKET_ID'] as string
-const username = process.env['NEXT_PUBLIC_USERNAME'] as string
-const password = process.env['NEXT_PUBLIC_PASSWORD'] as string
-let orderId = 'NrnYhAdEkx'
+const clientId = process.env["NEXT_PUBLIC_CLIENT_ID"] as string
+const endpoint = process.env["NEXT_PUBLIC_ENDPOINT"] as string
+const scope = process.env["NEXT_PUBLIC_MARKET_ID"] as string
+const username = process.env["NEXT_PUBLIC_USERNAME"] as string
+const password = process.env["NEXT_PUBLIC_PASSWORD"] as string
+let orderId = "NrnYhAdEkx"
 
 export default function Main() {
-  const [token, setToken] = useState('')
+  const [token, setToken] = useState("")
   const { query } = useRouter()
-  if (query['orderId']) {
-    orderId = query['orderId'] as string
+  if (query["orderId"]) {
+    orderId = query["orderId"] as string
   }
   useEffect(() => {
     const getToken = async () => {
@@ -64,23 +64,23 @@ export default function Main() {
                   <ShipmentField className="font-bold pl-1" name="key_number" />
                   /<ShipmentsCount className="font-bold pl-1" />
                 </div>
-                  <p>
-                    Total parcels: <ParcelsCount />
-                  </p>
+                <p>
+                  Total parcels: <ParcelsCount />
+                </p>
                 <Parcels>
                   <p>
                     Parcel line Items count: <ParcelLineItemsCount />
                   </p>
-                  <ParcelField attribute='number' tagElement='span' />
+                  <ParcelField attribute="number" tagElement="span" />
                   <ParcelLineItem>
-                    <p>{'Sku code'}</p>
-                    <ParcelLineItemField tagElement='p' attribute='sku_code' data-testid="test" />
-                    <p>{'Quantity'}</p>
-                    <ParcelLineItemField tagElement='p' attribute='quantity' />
-                    <p>{'Name'}</p>
-                    <ParcelLineItemField tagElement='p' attribute='name' />
-                    <p>{'Image'}</p>
-                    <ParcelLineItemField tagElement='img' attribute='image_url' />
+                    <p>{"Sku code"}</p>
+                    <ParcelLineItemField tagElement="p" attribute="sku_code" data-testid="test" />
+                    <p>{"Quantity"}</p>
+                    <ParcelLineItemField tagElement="p" attribute="quantity" />
+                    <p>{"Name"}</p>
+                    <ParcelLineItemField tagElement="p" attribute="name" />
+                    <p>{"Image"}</p>
+                    <ParcelLineItemField tagElement="img" attribute="image_url" />
                   </ParcelLineItem>
                 </Parcels>
               </Shipment>
diff --git a/examples/order-by-add-to-cart-button.tsx b/examples/order-by-add-to-cart-button.tsx
index a59cb40a..8c33e90d 100644
--- a/examples/order-by-add-to-cart-button.tsx
+++ b/examples/order-by-add-to-cart-button.tsx
@@ -1,6 +1,6 @@
-import { useState, useEffect } from 'react'
-import { getSalesChannelToken } from '@commercelayer/js-auth'
-import { Nav } from '.'
+import { useState, useEffect } from "react"
+import { getSalesChannelToken } from "@commercelayer/js-auth"
+import { Nav } from "."
 import {
   CommerceLayer,
   OrderContainer,
@@ -27,22 +27,22 @@ import {
   AvailabilityTemplate,
   Errors,
   OrderStorage,
-  CartLink
-} from 'packages/react-components/src'
+  CartLink,
+} from "packages/react-components/src"
 
-const clientId = process.env['NEXT_PUBLIC_CLIENT_ID'] as string
-const endpoint = process.env['NEXT_PUBLIC_ENDPOINT'] as string
-const scope = process.env['NEXT_PUBLIC_MARKET_ID'] as string
+const clientId = process.env["NEXT_PUBLIC_CLIENT_ID"] as string
+const endpoint = process.env["NEXT_PUBLIC_ENDPOINT"] as string
+const scope = process.env["NEXT_PUBLIC_MARKET_ID"] as string
 
 export default function Order() {
-  const [token, setToken] = useState('')
-  const [quantity, setQuantity] = useState('0')
+  const [token, setToken] = useState("")
+  const [quantity, setQuantity] = useState("0")
   useEffect(() => {
     const getToken = async () => {
       const token = await getSalesChannelToken({
         clientId,
         endpoint,
-        scope
+        scope,
       })
       if (token) setToken(token.accessToken)
     }
@@ -50,52 +50,52 @@ export default function Order() {
   }, [])
   return (
     <>
-      <Nav links={['/multiOrder', '/multiApp', '/giftCard']} />
+      <Nav links={["/multiOrder", "/multiApp", "/giftCard"]} />
       <CommerceLayer accessToken={token} endpoint={endpoint}>
-        <div className='container mx-auto mt-5 px-5'>
-          <OrderStorage persistKey='orderUS'>
+        <div className="container mx-auto mt-5 px-5">
+          <OrderStorage persistKey="orderUS">
             <OrderContainer
               attributes={{
-                return_url: 'https://test.co'
+                return_url: "https://test.co",
               }}
             >
-              <div className='md:flex'>
-                <div className='md:flex-shrink-0'>
+              <div className="md:flex">
+                <div className="md:flex-shrink-0">
                   <img
-                    title='Tuta da bambino'
-                    className='rounded-lg md:w-56'
-                    src='https://img.commercelayer.io/skus/BABYONBU000000E63E74.png?fm=jpg&q=90'
+                    title="Tuta da bambino"
+                    className="rounded-lg md:w-56"
+                    src="https://img.commercelayer.io/skus/BABYONBU000000E63E74.png?fm=jpg&q=90"
                   />
                 </div>
-                <div className='mt-4 md:mt-0 md:ml-6'>
-                  <h1 className='text-4xl'>Tutina da Bambino</h1>
-                  <div className='w-auto m-2' data-test='price-container'>
-                    <PricesContainer skuCode='BABYONBU000000E63E746MXX'>
+                <div className="mt-4 md:mt-0 md:ml-6">
+                  <h1 className="text-4xl">Tutina da Bambino</h1>
+                  <div className="w-auto m-2" data-test="price-container">
+                    <PricesContainer skuCode="BABYONBU000000E63E746MXX">
                       <Price
-                        data-test='price'
-                        className='text-green-600 text-2xl m-1'
-                        compareClassName='text-gray-500 text-2xl m-1 line-through'
+                        data-test="price"
+                        className="text-green-600 text-2xl m-1"
+                        compareClassName="text-gray-500 text-2xl m-1 line-through"
                       />
                     </PricesContainer>
                   </div>
                   <input
-                    title='quantity'
-                    type='number'
+                    title="quantity"
+                    type="number"
                     value={quantity}
                     onChange={(e) => setQuantity(e.target.value)}
                   />
-                  <div className='m-2'>
+                  <div className="m-2">
                     <AddToCartButton
-                      skuCode='BABYONBU000000E63E7412MX'
+                      skuCode="BABYONBU000000E63E7412MX"
                       quantity={quantity}
-                      data-test='add-to-cart-button'
-                      className='w-full primary hover:bg-green-700 text-white font-bold py-2 px-4 rounded'
+                      data-test="add-to-cart-button"
+                      className="w-full primary hover:bg-green-700 text-white font-bold py-2 px-4 rounded"
                     />
                   </div>
-                  <div className='m-2'>
-                    <AvailabilityContainer skuCode='BABYONBU000000E63E7412MX'>
+                  <div className="m-2">
+                    <AvailabilityContainer skuCode="BABYONBU000000E63E7412MX">
                       <AvailabilityTemplate
-                        data-test='availability-template'
+                        data-test="availability-template"
                         showShippingMethodName
                         showShippingMethodPrice
                       />
@@ -103,177 +103,133 @@ export default function Order() {
                   </div>
                 </div>
               </div>
-              <Errors resource='orders' />
-              <h1 className='text-4xl border-b-2 my-5'>Shopping Bag</h1>
+              <Errors resource="orders" />
+              <h1 className="text-4xl border-b-2 my-5">Shopping Bag</h1>
               <LineItemsContainer>
-                <p className='text-sm m-2'>
-                  Your shopping bag contains{' '}
-                  <LineItemsCount
-                    data-test='items-count'
-                    className='font-bold'
-                  />{' '}
-                  items
+                <p className="text-sm m-2">
+                  Your shopping bag contains{" "}
+                  <LineItemsCount data-test="items-count" className="font-bold" /> items
                 </p>
-                <div className='flex flex-col p-2'>
-                  <LineItemsEmpty data-test='line-items-empty' />
+                <div className="flex flex-col p-2">
+                  <LineItemsEmpty data-test="line-items-empty" />
                   <LineItem>
-                    <div className='flex justify-around items-center border-b p-5'>
-                      <LineItemImage className='p-2' width={80} />
-                      <LineItemName
-                        data-test='line-item-name'
-                        className='p-2'
-                      />
-                      <LineItemQuantity
-                        data-test='line-item-quantity'
-                        max={100}
-                        className='p-2'
-                      />
-                      <Errors
-                        className='text-red-700 p-2'
-                        resource='line_items'
-                        field='quantity'
-                      />
-                      <LineItemAmount
-                        data-test='line-item-total'
-                        className='p-2'
-                      />
+                    <div className="flex justify-around items-center border-b p-5">
+                      <LineItemImage className="p-2" width={80} />
+                      <LineItemName data-test="line-item-name" className="p-2" />
+                      <LineItemQuantity data-test="line-item-quantity" max={100} className="p-2" />
+                      <Errors className="text-red-700 p-2" resource="line_items" field="quantity" />
+                      <LineItemAmount data-test="line-item-total" className="p-2" />
                       <LineItemRemoveLink
-                        data-test='line-item-remove'
-                        className='p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded'
+                        data-test="line-item-remove"
+                        className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
                       />
                     </div>
                   </LineItem>
-                  <LineItem type='gift_cards'>
-                    <div className='flex justify-between items-center border-b p-5'>
-                      <LineItemImage className='p-2' width={40} />
-                      <LineItemName
-                        data-test='line-item-name'
-                        className='p-2'
-                      />
+                  <LineItem type="gift_cards">
+                    <div className="flex justify-between items-center border-b p-5">
+                      <LineItemImage className="p-2" width={40} />
+                      <LineItemName data-test="line-item-name" className="p-2" />
                       <LineItemQuantity
-                        data-test='line-item-quantity'
+                        data-test="line-item-quantity"
                         max={10}
-                        className='p-2'
+                        className="p-2"
                         disabled
                       />
-                      <LineItemAmount
-                        data-test='line-item-total'
-                        className='p-2'
-                      />
+                      <LineItemAmount data-test="line-item-total" className="p-2" />
                       <LineItemRemoveLink
-                        data-test='line-item-remove'
-                        className='p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded'
+                        data-test="line-item-remove"
+                        className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
                       />
                     </div>
                   </LineItem>
-                  <LineItem type='bundles'>
-                    <div className='flex justify-between items-center border-b p-5'>
-                      <LineItemImage className='p-2' width={40} />
-                      <LineItemName
-                        data-test='line-item-name'
-                        className='p-2'
-                      />
-                      <LineItemQuantity
-                        data-test='line-item-quantity'
-                        max={10}
-                        className='p-2'
-                      />
-                      <LineItemAmount
-                        data-test='line-item-total'
-                        className='p-2'
-                      />
+                  <LineItem type="bundles">
+                    <div className="flex justify-between items-center border-b p-5">
+                      <LineItemImage className="p-2" width={40} />
+                      <LineItemName data-test="line-item-name" className="p-2" />
+                      <LineItemQuantity data-test="line-item-quantity" max={10} className="p-2" />
+                      <LineItemAmount data-test="line-item-total" className="p-2" />
                       <LineItemRemoveLink
-                        data-test='line-item-remove'
-                        className='p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded'
+                        data-test="line-item-remove"
+                        className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
                       />
                     </div>
                   </LineItem>
-                  <LineItem type='adjustments'>
-                    <div className='flex justify-between items-center border-b p-5'>
-                      <LineItemImage className='p-2' width={40} />
-                      <LineItemName
-                        data-test='line-item-name'
-                        className='p-2'
-                      />
-                      <LineItemQuantity
-                        data-test='line-item-quantity'
-                        max={10}
-                        className='p-2'
-                      />
-                      <LineItemAmount
-                        data-test='line-item-total'
-                        className='p-2'
-                      />
+                  <LineItem type="adjustments">
+                    <div className="flex justify-between items-center border-b p-5">
+                      <LineItemImage className="p-2" width={40} />
+                      <LineItemName data-test="line-item-name" className="p-2" />
+                      <LineItemQuantity data-test="line-item-quantity" max={10} className="p-2" />
+                      <LineItemAmount data-test="line-item-total" className="p-2" />
                       <LineItemRemoveLink
-                        data-test='line-item-remove'
-                        className='p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded'
+                        data-test="line-item-remove"
+                        className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
                       />
                     </div>
                   </LineItem>
                 </div>
               </LineItemsContainer>
-              <div className='flex flex-col w-1/2 m-auto'>
-                <div className='flex items-center p-2 justify-around font-medium text-left'>
-                  <div className='w-full'>
-                    <p className='text-lg'>Subtotal </p>
+              <div className="flex flex-col w-1/2 m-auto">
+                <div className="flex items-center p-2 justify-around font-medium text-left">
+                  <div className="w-full">
+                    <p className="text-lg">Subtotal </p>
                   </div>
-                  <div className='text-right'>
-                    <SubTotalAmount data-test='subtotal-amount' />
+                  <div className="text-right">
+                    <SubTotalAmount data-test="subtotal-amount" />
                   </div>
                 </div>
-                <div className=' flex items-center p-2 justify-around text-gray-600 text-left'>
-                  <div className='w-full'>
-                    <p className='text-lg'>Discount </p>
+                <div className=" flex items-center p-2 justify-around text-gray-600 text-left">
+                  <div className="w-full">
+                    <p className="text-lg">Discount </p>
                   </div>
-                  <div className='text-right'>
-                    <DiscountAmount data-test='discount-amount' />
+                  <div className="text-right">
+                    <DiscountAmount data-test="discount-amount" />
                   </div>
                 </div>
-                <div className=' flex items-center p-2 justify-around text-gray-600 text-left'>
-                  <div className='w-full'>
-                    <p className='text-lg'>Shipping </p>
+                <div className=" flex items-center p-2 justify-around text-gray-600 text-left">
+                  <div className="w-full">
+                    <p className="text-lg">Shipping </p>
                   </div>
-                  <div className='text-right'>
-                    <ShippingAmount data-test='shipping-amount' />
+                  <div className="text-right">
+                    <ShippingAmount data-test="shipping-amount" />
                   </div>
                 </div>
-                <div className=' flex items-center p-2 justify-around text-gray-600 text-left'>
-                  <div className='w-full'>
-                    <p className='text-lg'>
-                      Taxes <span className='text-sm font-tin'>(included)</span>
+                <div className=" flex items-center p-2 justify-around text-gray-600 text-left">
+                  <div className="w-full">
+                    <p className="text-lg">
+                      Taxes <span className="text-sm font-tin">(included)</span>
                     </p>
                   </div>
-                  <div className='text-right'>
-                    <TaxesAmount data-test='taxes-amount' />
+                  <div className="text-right">
+                    <TaxesAmount data-test="taxes-amount" />
                   </div>
                 </div>
-                <div className=' flex items-center p-2 justify-around text-gray-600 text-left'>
-                  <div className='w-full'>
-                    <p className='text-lg'>Gift card </p>
+                <div className=" flex items-center p-2 justify-around text-gray-600 text-left">
+                  <div className="w-full">
+                    <p className="text-lg">Gift card </p>
                   </div>
-                  <div className='text-right'>
-                    <GiftCardAmount data-test='gift-card-amount' />
+                  <div className="text-right">
+                    <GiftCardAmount data-test="gift-card-amount" />
                   </div>
                 </div>
-                <div className=' flex items-center p-2 justify-around font-bold text-left'>
-                  <div className='w-full'>
-                    <p className='text-lg mr-2'>Total </p>
+                <div className=" flex items-center p-2 justify-around font-bold text-left">
+                  <div className="w-full">
+                    <p className="text-lg mr-2">Total </p>
                   </div>
-                  <div className='text-right'>
-                    <TotalAmount data-test='total-amount' />
+                  <div className="text-right">
+                    <TotalAmount data-test="total-amount" />
                   </div>
                 </div>
               </div>
-              <div className='flex justify-center p-2'>
+              <div className="flex justify-center p-2">
                 <CheckoutLink
-                  className='mt-2 primary font-bold py-2 px-4 rounded'
-                  label='Checkout'
+                  className="mt-2 primary font-bold py-2 px-4 rounded"
+                  label="Checkout"
                 />
               </div>
-              <div className='flex justify-center p-2'>
+              <div className="flex justify-center p-2">
                 <CartLink
-                  className='mt-2 primary font-bold py-2 px-4 rounded'
-                  label='Go to hosted cart'
+                  className="mt-2 primary font-bold py-2 px-4 rounded"
+                  label="Go to hosted cart"
                 />
               </div>
             </OrderContainer>
diff --git a/examples/order-summary.tsx b/examples/order-summary.tsx
index 40c7a230..b058281b 100644
--- a/examples/order-summary.tsx
+++ b/examples/order-summary.tsx
@@ -1,34 +1,34 @@
-import React, { useState, useEffect, Fragment } from 'react'
-import { getSalesChannelToken } from '@commercelayer/js-auth'
-import CommerceLayer from '../#components/auth/CommerceLayer'
-import { Nav } from '.'
-import OrderContainer from '../#components/OrderContainer'
-import LineItemsContainer from '../#components/LineItemsContainer'
-import LineItem from '../#components/line_items/LineItem'
-import LineItemImage from '../#components/LineItemImage'
-import LineItemName from '../#components/LineItemName'
-import LineItemQuantity from '../#components/LineItemQuantity'
-import LineItemAmount from '../#components/LineItemAmount'
-import SubTotalAmount from '../#components/SubTotalAmount'
-import LineItemsCount from '../#components/LineItemsCount'
-import TotalAmount from '../#components/orders/TotalAmount'
-import DiscountAmount from '../#components/orders/DiscountAmount'
-import ShippingAmount from '../#components/orders/ShippingAmount'
-import TaxesAmount from '../#components/TaxesAmount'
-import GiftCardAmount from '../#components/orders/GiftCardAmount'
-import Head from 'next/head'
-import { OrderNumber } from 'packages/react-components/src'
-import { useRouter } from 'next/router'
-import { OrderStorage } from 'packages/react-components/src'
+import React, { useState, useEffect, Fragment } from "react"
+import { getSalesChannelToken } from "@commercelayer/js-auth"
+import CommerceLayer from "../#components/auth/CommerceLayer"
+import { Nav } from "."
+import OrderContainer from "../#components/OrderContainer"
+import LineItemsContainer from "../#components/LineItemsContainer"
+import LineItem from "../#components/line_items/LineItem"
+import LineItemImage from "../#components/LineItemImage"
+import LineItemName from "../#components/LineItemName"
+import LineItemQuantity from "../#components/LineItemQuantity"
+import LineItemAmount from "../#components/LineItemAmount"
+import SubTotalAmount from "../#components/SubTotalAmount"
+import LineItemsCount from "../#components/LineItemsCount"
+import TotalAmount from "../#components/orders/TotalAmount"
+import DiscountAmount from "../#components/orders/DiscountAmount"
+import ShippingAmount from "../#components/orders/ShippingAmount"
+import TaxesAmount from "../#components/TaxesAmount"
+import GiftCardAmount from "../#components/orders/GiftCardAmount"
+import Head from "next/head"
+import { OrderNumber } from "packages/react-components/src"
+import { useRouter } from "next/router"
+import { OrderStorage } from "packages/react-components/src"
 
 const clientId = process.env.NEXT_PUBLIC_CLIENT_ID as string
 const endpoint = process.env.NEXT_PUBLIC_ENDPOINT as string
 const scope = process.env.NEXT_PUBLIC_MARKET_ID as string
 
-let orderId = 'qaMAhJzGnx'
+let orderId = "qaMAhJzGnx"
 
 export default function Order() {
-  const [token, setToken] = useState('')
+  const [token, setToken] = useState("")
   const { query } = useRouter()
   if (query.orderId) {
     orderId = query.orderId as string
@@ -50,7 +50,7 @@ export default function Order() {
       <Head>
         <script src="http://localhost:8097"></script>
       </Head>
-      <Nav links={['/multiOrder', '/multiApp', '/giftCard']} />
+      <Nav links={["/multiOrder", "/multiApp", "/giftCard"]} />
       <CommerceLayer accessToken={token} endpoint={endpoint}>
         <div className="container mx-auto mt-5 px-5">
           {/* <OrderStorage persistKey="orderUS"> */}
@@ -60,20 +60,15 @@ export default function Order() {
             </h1>
             <LineItemsContainer>
               <p className="text-sm m-2">
-                Your shopping bag contains{' '}
-                <LineItemsCount id="items-count" className="font-bold" /> items
+                Your shopping bag contains <LineItemsCount id="items-count" className="font-bold" />{" "}
+                items
               </p>
               <div className="flex flex-col p-2">
                 <LineItem>
                   <div className="flex justify-around items-center border-b p-5">
                     <LineItemImage className="p-2" width={80} />
                     <LineItemName id="line-item-name" className="p-2" />
-                    <LineItemQuantity
-                      id="line-item-quantity"
-                      max={100}
-                      className="p-2"
-                      readonly
-                    />
+                    <LineItemQuantity id="line-item-quantity" max={100} className="p-2" readonly />
                     <LineItemAmount id="line-item-total" className="p-2" />
                   </div>
                 </LineItem>
@@ -81,12 +76,7 @@ export default function Order() {
                   <div className="flex justify-between items-center border-b p-5">
                     <LineItemImage className="p-2" width={40} />
                     <LineItemName id="line-item-name" className="p-2" />
-                    <LineItemQuantity
-                      id="line-item-quantity"
-                      max={10}
-                      className="p-2"
-                      readonly
-                    />
+                    <LineItemQuantity id="line-item-quantity" max={10} className="p-2" readonly />
                     <LineItemAmount id="line-item-total" className="p-2" />
                   </div>
                 </LineItem>
diff --git a/examples/order-with-custom-components.tsx b/examples/order-with-custom-components.tsx
index eb983c1b..1be6e4e0 100644
--- a/examples/order-with-custom-components.tsx
+++ b/examples/order-with-custom-components.tsx
@@ -1,34 +1,34 @@
-import React, { useState, useEffect, Fragment } from 'react'
-import { getSalesChannelToken } from '@commercelayer/js-auth'
-import CommerceLayer from '../#components/auth/CommerceLayer'
-import { Nav } from '.'
-import OrderContainer from '../#components/orders/OrderContainer'
-import VariantsContainer from '../#components/skus/VariantsContainer'
-import VariantSelector from '../#components/skus/VariantSelector'
-import PricesContainer from '../#components/prices/PricesContainer'
-import Price from '../#components/prices/Price'
-import AddToCartButton from '../#components/orders/AddToCartButton'
-import LineItemsContainer from '../#components/line_items/LineItemsContainer'
-import LineItem from '../#components/line_items/LineItem'
-import LineItemImage from '../#components/line_items/LineItemImage'
-import LineItemName from '../#components/line_items/LineItemName'
-import LineItemQuantity from '../#components/line_items/LineItemQuantity'
-import LineItemAmount from '../#components/line_items/LineItemAmount'
-import LineItemRemoveLink from '../#components/line_items/LineItemRemoveLink'
-import CheckoutLink from '../#components/orders/CheckoutLink'
-import SubTotalAmount from '../#components/orders/SubTotalAmount'
-import QuantitySelector from '../#components/skus/QuantitySelector'
-import LineItemsCount from '../#components/line_items/LineItemsCount'
-import TotalAmount from '../#components/orders/TotalAmount'
-import DiscountAmount from '../#components/orders/DiscountAmount'
-import ShippingAmount from '../#components/orders/ShippingAmount'
-import TaxesAmount from '../#components/orders/TaxesAmount'
-import GiftCardAmount from '../#components/orders/GiftCardAmount'
-import AvailabilityContainer from '../#components/skus/AvailabilityContainer'
-import AvailabilityTemplate from '../#components/skus/AvailabilityTemplate'
-import ItemContainer from '../#components/orders/ItemContainer'
-import Errors from '../#components/Errors'
-import OrderStorage from '#components/orders/OrderStorage'
+import React, { useState, useEffect, Fragment } from "react"
+import { getSalesChannelToken } from "@commercelayer/js-auth"
+import CommerceLayer from "../#components/auth/CommerceLayer"
+import { Nav } from "."
+import OrderContainer from "../#components/orders/OrderContainer"
+import VariantsContainer from "../#components/skus/VariantsContainer"
+import VariantSelector from "../#components/skus/VariantSelector"
+import PricesContainer from "../#components/prices/PricesContainer"
+import Price from "../#components/prices/Price"
+import AddToCartButton from "../#components/orders/AddToCartButton"
+import LineItemsContainer from "../#components/line_items/LineItemsContainer"
+import LineItem from "../#components/line_items/LineItem"
+import LineItemImage from "../#components/line_items/LineItemImage"
+import LineItemName from "../#components/line_items/LineItemName"
+import LineItemQuantity from "../#components/line_items/LineItemQuantity"
+import LineItemAmount from "../#components/line_items/LineItemAmount"
+import LineItemRemoveLink from "../#components/line_items/LineItemRemoveLink"
+import CheckoutLink from "../#components/orders/CheckoutLink"
+import SubTotalAmount from "../#components/orders/SubTotalAmount"
+import QuantitySelector from "../#components/skus/QuantitySelector"
+import LineItemsCount from "../#components/line_items/LineItemsCount"
+import TotalAmount from "../#components/orders/TotalAmount"
+import DiscountAmount from "../#components/orders/DiscountAmount"
+import ShippingAmount from "../#components/orders/ShippingAmount"
+import TaxesAmount from "../#components/orders/TaxesAmount"
+import GiftCardAmount from "../#components/orders/GiftCardAmount"
+import AvailabilityContainer from "../#components/skus/AvailabilityContainer"
+import AvailabilityTemplate from "../#components/skus/AvailabilityTemplate"
+import ItemContainer from "../#components/orders/ItemContainer"
+import Errors from "../#components/Errors"
+import OrderStorage from "#components/orders/OrderStorage"
 
 const clientId = process.env.NEXT_PUBLIC_CLIENT_ID_INTEGRATION as string
 const clientSecret = process.env.NEXT_PUBLIC_CLIENT_SECRET as string
@@ -36,7 +36,7 @@ const endpoint = process.env.NEXT_PUBLIC_ENDPOINT as string
 const scope = process.env.NEXT_PUBLIC_MARKET_ID as string
 
 const CustomAddToCart = (props) => {
-  const classes = props.disabled ? 'opacity-50 cursor-not-allowed' : ''
+  const classes = props.disabled ? "opacity-50 cursor-not-allowed" : ""
   const myClick = async () => {
     const { success } = await props.handleClick()
     if (success) {
@@ -48,7 +48,7 @@ const CustomAddToCart = (props) => {
       className={`${classes} ${props.className}`}
       onClick={myClick}
       disabled={props.disabled}
-      data-cy={props['data-cy']}
+      data-cy={props["data-cy"]}
     >
       Custom add to cart
     </button>
@@ -71,7 +71,7 @@ const CustomAddToCart = (props) => {
 // }
 
 export default function Order() {
-  const [token, setToken] = useState('')
+  const [token, setToken] = useState("")
   useEffect(() => {
     const getToken = async () => {
       // @ts-ignore
@@ -86,11 +86,11 @@ export default function Order() {
   }, [])
   return (
     <Fragment>
-      <Nav links={['/multiOrder', '/multiApp', '/giftCard']} />
+      <Nav links={["/multiOrder", "/multiApp", "/giftCard"]} />
       <CommerceLayer accessToken={token} endpoint={endpoint}>
         <div className="container mx-auto mt-5 px-5">
           <OrderStorage persistKey="orderUS">
-            <OrderContainer attributes={{ returnUrl: 'https://test.co' }}>
+            <OrderContainer attributes={{ returnUrl: "https://test.co" }}>
               <ItemContainer>
                 <div className="md:flex">
                   <div className="md:flex-shrink-0">
@@ -117,21 +117,21 @@ export default function Order() {
                           name="variant1"
                           options={[
                             {
-                              label: '6 months',
-                              code: 'BABYONBU000000E63E746MXX',
+                              label: "6 months",
+                              code: "BABYONBU000000E63E746MXX",
                             },
                             {
-                              label: '12 months',
-                              code: 'BABYONBU000000E63E7412MX',
+                              label: "12 months",
+                              code: "BABYONBU000000E63E7412MX",
                               lineItem: {
-                                name: 'Darth Vader (12 Months)',
+                                name: "Darth Vader (12 Months)",
                                 imageUrl:
-                                  'https://i.pinimg.com/736x/a5/32/de/a532de337eff9b1c1c4bfb8df73acea4--darth-vader-stencil-darth-vader-head.jpg?b=t',
+                                  "https://i.pinimg.com/736x/a5/32/de/a532de337eff9b1c1c4bfb8df73acea4--darth-vader-stencil-darth-vader-head.jpg?b=t",
                               },
                             },
                             {
-                              label: '24 months',
-                              code: 'BABYONBU000000E63E746MXXFAKE',
+                              label: "24 months",
+                              code: "BABYONBU000000E63E746MXXFAKE",
                             },
                           ]}
                         >
@@ -153,14 +153,12 @@ export default function Order() {
                                   data-sku-id={variants[v].id}
                                   value={variants[v].code}
                                 >
-                                  {options.length > 0
-                                    ? options[k].label
-                                    : variants[v].name}
+                                  {options.length > 0 ? options[k].label : variants[v].name}
                                 </option>
                               )
                             })
                             return loading ? (
-                              'Loading...'
+                              "Loading..."
                             ) : (
                               <select
                                 id={id}
@@ -170,12 +168,10 @@ export default function Order() {
                                   const id = e.target[i].dataset.skuId as string
                                   handleSelect && handleSelect(v, id)
                                 }}
-                                value={skuCode || ''}
+                                value={skuCode || ""}
                                 {...p}
                               >
-                                <option disabled={!!skuCode}>
-                                  {placeholder}
-                                </option>
+                                <option disabled={!!skuCode}>{placeholder}</option>
                                 {selectOptions}
                               </select>
                             )
@@ -209,29 +205,17 @@ export default function Order() {
               <h1 className="text-4xl border-b-2 my-5">Shopping Bag</h1>
               <LineItemsContainer>
                 <p className="text-sm m-2">
-                  Your shopping bag contains{' '}
-                  <LineItemsCount data-cy="items-count" className="font-bold" />{' '}
-                  items
+                  Your shopping bag contains{" "}
+                  <LineItemsCount data-cy="items-count" className="font-bold" /> items
                 </p>
                 <div className="flex flex-col p-2">
                   <LineItem>
                     <div className="flex justify-around items-center border-b p-5">
                       <LineItemImage className="p-2" width={80} />
                       <LineItemName data-cy="line-item-name" className="p-2" />
-                      <LineItemQuantity
-                        data-cy="line-item-quantity"
-                        max={100}
-                        className="p-2"
-                      />
-                      <Errors
-                        className="text-red-700 p-2"
-                        resource="lineItem"
-                        field="quantity"
-                      />
-                      <LineItemAmount
-                        data-cy="line-item-total"
-                        className="p-2"
-                      />
+                      <LineItemQuantity data-cy="line-item-quantity" max={100} className="p-2" />
+                      <Errors className="text-red-700 p-2" resource="lineItem" field="quantity" />
+                      <LineItemAmount data-cy="line-item-total" className="p-2" />
                       <LineItemRemoveLink
                         data-cy="line-item-remove"
                         className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
@@ -248,10 +232,7 @@ export default function Order() {
                         className="p-2"
                         disabled
                       />
-                      <LineItemAmount
-                        data-cy="line-item-total"
-                        className="p-2"
-                      />
+                      <LineItemAmount data-cy="line-item-total" className="p-2" />
                       <LineItemRemoveLink
                         data-cy="line-item-remove"
                         className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
diff --git a/examples/order-with-sku-options.tsx b/examples/order-with-sku-options.tsx
index 1d6cf67a..c08dfb60 100644
--- a/examples/order-with-sku-options.tsx
+++ b/examples/order-with-sku-options.tsx
@@ -1,35 +1,35 @@
-import { useState, useEffect } from 'react'
-import { getSalesChannelToken } from '@commercelayer/js-auth'
-import CommerceLayer from '../#components/auth/CommerceLayer'
-import OrderContainer from '#components/orders/OrderContainer'
-import PricesContainer from '#components/prices/PricesContainer'
-import Price from '#components/prices/Price'
-import AddToCartButton from '#components/orders/AddToCartButton'
-import LineItemsContainer from '#components/line_items/LineItemsContainer'
-import LineItem from '#components/line_items/LineItem'
-import LineItemImage from '#components/line_items/LineItemImage'
-import LineItemName from '#components/line_items/LineItemName'
-import LineItemQuantity from '#components/line_items/LineItemQuantity'
-import LineItemAmount from '#components/line_items/LineItemAmount'
-import LineItemRemoveLink from '#components/line_items/LineItemRemoveLink'
-import CheckoutLink from '#components/orders/CheckoutLink'
-import SubTotalAmount from '#components/orders/SubTotalAmount'
-import LineItemsCount from '#components/line_items/LineItemsCount'
-import TotalAmount from '#components/orders/TotalAmount'
-import DiscountAmount from '#components/orders/DiscountAmount'
-import ShippingAmount from '#components/orders/ShippingAmount'
-import TaxesAmount from '#components/orders/TaxesAmount'
-import GiftCardAmount from '#components/orders/GiftCardAmount'
-import AvailabilityContainer from '#components/skus/AvailabilityContainer'
-import AvailabilityTemplate from '#components/skus/AvailabilityTemplate'
-import Errors from '#components/Errors'
-import LineItemOptions from '#components/line_items/LineItemOptions'
-import LineItemOption from '#components/line_items/LineItemOption'
-import LineItemField from '#components/line_items/LineItemField'
+import { useState, useEffect } from "react"
+import { getSalesChannelToken } from "@commercelayer/js-auth"
+import CommerceLayer from "../#components/auth/CommerceLayer"
+import OrderContainer from "#components/orders/OrderContainer"
+import PricesContainer from "#components/prices/PricesContainer"
+import Price from "#components/prices/Price"
+import AddToCartButton from "#components/orders/AddToCartButton"
+import LineItemsContainer from "#components/line_items/LineItemsContainer"
+import LineItem from "#components/line_items/LineItem"
+import LineItemImage from "#components/line_items/LineItemImage"
+import LineItemName from "#components/line_items/LineItemName"
+import LineItemQuantity from "#components/line_items/LineItemQuantity"
+import LineItemAmount from "#components/line_items/LineItemAmount"
+import LineItemRemoveLink from "#components/line_items/LineItemRemoveLink"
+import CheckoutLink from "#components/orders/CheckoutLink"
+import SubTotalAmount from "#components/orders/SubTotalAmount"
+import LineItemsCount from "#components/line_items/LineItemsCount"
+import TotalAmount from "#components/orders/TotalAmount"
+import DiscountAmount from "#components/orders/DiscountAmount"
+import ShippingAmount from "#components/orders/ShippingAmount"
+import TaxesAmount from "#components/orders/TaxesAmount"
+import GiftCardAmount from "#components/orders/GiftCardAmount"
+import AvailabilityContainer from "#components/skus/AvailabilityContainer"
+import AvailabilityTemplate from "#components/skus/AvailabilityTemplate"
+import Errors from "#components/Errors"
+import LineItemOptions from "#components/line_items/LineItemOptions"
+import LineItemOption from "#components/line_items/LineItemOption"
+import LineItemField from "#components/line_items/LineItemField"
 
-const clientId = process.env['NEXT_PUBLIC_CLIENT_ID'] as string
-const endpoint = process.env['NEXT_PUBLIC_ENDPOINT'] as string
-const scope = process.env['NEXT_PUBLIC_MARKET_ID'] as string
+const clientId = process.env["NEXT_PUBLIC_CLIENT_ID"] as string
+const endpoint = process.env["NEXT_PUBLIC_ENDPOINT"] as string
+const scope = process.env["NEXT_PUBLIC_MARKET_ID"] as string
 
 // const CustomAddToCart = (props: AddToCartButtonTemplate) => {
 //   const classes = props.disabled ? 'opacity-50 cursor-not-allowed' : ''
@@ -49,28 +49,28 @@ const scope = process.env['NEXT_PUBLIC_MARKET_ID'] as string
 // }
 const variants = [
   {
-    label: '6 months',
-    code: 'BABYONBU000000E63E746MXX'
+    label: "6 months",
+    code: "BABYONBU000000E63E746MXX",
   },
   {
-    label: '12 months',
-    code: 'BABYONBU000000E63E7412MX'
+    label: "12 months",
+    code: "BABYONBU000000E63E7412MX",
   },
   {
-    label: '24 months',
-    code: 'BABYONBU000000E63E746MXXFAKE'
-  }
+    label: "24 months",
+    code: "BABYONBU000000E63E746MXXFAKE",
+  },
 ]
 export default function Order(): JSX.Element {
-  const [token, setToken] = useState('')
-  const [currentSku, setCurrentSku] = useState('BABYONBU000000E63E746MXX')
+  const [token, setToken] = useState("")
+  const [currentSku, setCurrentSku] = useState("BABYONBU000000E63E746MXX")
   useEffect(() => {
     const getToken = async (): Promise<void> => {
       // @ts-expect-error no type
       const { accessToken } = await getSalesChannelToken({
         clientId,
         endpoint,
-        scope
+        scope,
       })
       if (accessToken) setToken(accessToken)
     }
@@ -79,30 +79,27 @@ export default function Order(): JSX.Element {
   return (
     <>
       <CommerceLayer accessToken={token} endpoint={endpoint}>
-        <div className='container mx-auto mt-5 px-5'>
+        <div className="container mx-auto mt-5 px-5">
           <OrderContainer>
-            <div className='md:flex'>
-              <div className='md:flex-shrink-0'>
+            <div className="md:flex">
+              <div className="md:flex-shrink-0">
                 <img
-                  alt=''
-                  className='rounded-lg md:w-56'
-                  src='https://img.commercelayer.io/skus/BABYONBU000000E63E74.png?fm=jpg&q=90'
+                  alt=""
+                  className="rounded-lg md:w-56"
+                  src="https://img.commercelayer.io/skus/BABYONBU000000E63E74.png?fm=jpg&q=90"
                 />
               </div>
-              <div className='mt-4 md:mt-0 md:ml-6'>
-                <h1 className='text-4xl'>Tutina da Bambino</h1>
-                <div className='w-auto m-2'>
-                  <PricesContainer skuCode='BABYONBU000000E63E746MXX'>
+              <div className="mt-4 md:mt-0 md:ml-6">
+                <h1 className="text-4xl">Tutina da Bambino</h1>
+                <div className="w-auto m-2">
+                  <PricesContainer skuCode="BABYONBU000000E63E746MXX">
                     <Price
-                      className='text-green-600 text-2xl m-1'
-                      compareClassName='text-gray-500 text-2xl m-1 line-through'
+                      className="text-green-600 text-2xl m-1"
+                      compareClassName="text-gray-500 text-2xl m-1 line-through"
                     />
                   </PricesContainer>
                 </div>
-                <select
-                  title='Variant selector'
-                  onChange={(e) => setCurrentSku(e.target.value)}
-                >
+                <select title="Variant selector" onChange={(e) => setCurrentSku(e.target.value)}>
                   {variants.map((variant) => (
                     <option key={variant.code} value={variant.code}>
                       {variant.label}
@@ -110,134 +107,118 @@ export default function Order(): JSX.Element {
                   ))}
                 </select>
 
-                <div className='m-2'>
+                <div className="m-2">
                   <AddToCartButton
                     skuCode={currentSku}
-                    className='w-full primary hover:bg-green-700 text-white font-bold py-2 px-4 rounded'
+                    className="w-full primary hover:bg-green-700 text-white font-bold py-2 px-4 rounded"
                   />
                 </div>
-                <div className='m-2'>
+                <div className="m-2">
                   <AvailabilityContainer skuCode={currentSku}>
-                    <AvailabilityTemplate
-                      timeFormat='days'
-                      showShippingMethodName
-                    />
+                    <AvailabilityTemplate timeFormat="days" showShippingMethodName />
                   </AvailabilityContainer>
                 </div>
               </div>
             </div>
-            <h1 className='text-4xl border-b-2 my-5'>Shopping Bag</h1>
+            <h1 className="text-4xl border-b-2 my-5">Shopping Bag</h1>
             <LineItemsContainer>
-              <p className='text-sm m-2'>
-                Your shopping bag contains{' '}
-                <LineItemsCount id='items-count' className='font-bold' /> items
+              <p className="text-sm m-2">
+                Your shopping bag contains <LineItemsCount id="items-count" className="font-bold" />{" "}
+                items
               </p>
-              <div className='flex flex-col p-2'>
+              <div className="flex flex-col p-2">
                 <LineItem>
-                  <div className='flex justify-around items-center border-b p-5'>
-                    <LineItemImage className='p-2' width={80} />
-                    <LineItemName id='line-item-name' className='p-2' />
+                  <div className="flex justify-around items-center border-b p-5">
+                    <LineItemImage className="p-2" width={80} />
+                    <LineItemName id="line-item-name" className="p-2" />
                     <div>
-                      <LineItemOptions titleClassName='font-bold' showAll>
+                      <LineItemOptions titleClassName="font-bold" showAll>
                         <LineItemOption
-                          className='font-bold capitalize'
-                          valueClassName='ml-2 font-normal'
+                          className="font-bold capitalize"
+                          valueClassName="ml-2 font-normal"
                         />
                       </LineItemOptions>
                     </div>
-                    <LineItemField attribute='sku_code' tagElement='span' />
-                    <LineItemQuantity
-                      id='line-item-quantity'
-                      max={100}
-                      className='p-2'
-                    />
-                    <Errors
-                      className='text-red-700 p-2'
-                      resource='line_items'
-                      field='quantity'
-                    />
-                    <LineItemAmount id='line-item-total' className='p-2' />
+                    <LineItemField attribute="sku_code" tagElement="span" />
+                    <LineItemQuantity id="line-item-quantity" max={100} className="p-2" />
+                    <Errors className="text-red-700 p-2" resource="line_items" field="quantity" />
+                    <LineItemAmount id="line-item-total" className="p-2" />
                     <LineItemRemoveLink
-                      id='line-item-remove'
-                      className='p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded'
+                      id="line-item-remove"
+                      className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
                     />
                   </div>
                 </LineItem>
-                <LineItem type='gift_cards'>
-                  <div className='flex justify-between items-center border-b p-5'>
-                    <LineItemImage className='p-2' width={40} />
-                    <LineItemName id='line-item-name' className='p-2' />
-                    <LineItemQuantity
-                      id='line-item-quantity'
-                      max={10}
-                      className='p-2'
-                      disabled
-                    />
-                    <LineItemAmount id='line-item-total' className='p-2' />
+                <LineItem type="gift_cards">
+                  <div className="flex justify-between items-center border-b p-5">
+                    <LineItemImage className="p-2" width={40} />
+                    <LineItemName id="line-item-name" className="p-2" />
+                    <LineItemQuantity id="line-item-quantity" max={10} className="p-2" disabled />
+                    <LineItemAmount id="line-item-total" className="p-2" />
                     <LineItemRemoveLink
-                      id='line-item-remove'
-                      className='p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded'
+                      id="line-item-remove"
+                      className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
                     />
                   </div>
                 </LineItem>
               </div>
             </LineItemsContainer>
-            <div className='flex flex-col w-1/2 m-auto'>
-              <div className='flex items-center p-2 justify-around font-medium text-left'>
-                <div className='w-full'>
-                  <p className='text-lg'>Subtotal </p>
+            <div className="flex flex-col w-1/2 m-auto">
+              <div className="flex items-center p-2 justify-around font-medium text-left">
+                <div className="w-full">
+                  <p className="text-lg">Subtotal </p>
                 </div>
-                <div className='text-right'>
+                <div className="text-right">
                   <SubTotalAmount />
                 </div>
               </div>
-              <div className=' flex items-center p-2 justify-around text-gray-600 text-left'>
-                <div className='w-full'>
-                  <p className='text-lg'>Discount </p>
+              <div className=" flex items-center p-2 justify-around text-gray-600 text-left">
+                <div className="w-full">
+                  <p className="text-lg">Discount </p>
                 </div>
-                <div className='text-right'>
+                <div className="text-right">
                   <DiscountAmount />
                 </div>
               </div>
-              <div className=' flex items-center p-2 justify-around text-gray-600 text-left'>
-                <div className='w-full'>
-                  <p className='text-lg'>Shipping </p>
+              <div className=" flex items-center p-2 justify-around text-gray-600 text-left">
+                <div className="w-full">
+                  <p className="text-lg">Shipping </p>
                 </div>
-                <div className='text-right'>
+                <div className="text-right">
                   <ShippingAmount />
                 </div>
               </div>
-              <div className=' flex items-center p-2 justify-around text-gray-600 text-left'>
-                <div className='w-full'>
-                  <p className='text-lg'>
-                    Taxes <span className='text-sm font-tin'>(included)</span>
+              <div className=" flex items-center p-2 justify-around text-gray-600 text-left">
+                <div className="w-full">
+                  <p className="text-lg">
+                    Taxes <span className="text-sm font-tin">(included)</span>
                   </p>
                 </div>
-                <div className='text-right'>
+                <div className="text-right">
                   <TaxesAmount />
                 </div>
               </div>
-              <div className=' flex items-center p-2 justify-around text-gray-600 text-left'>
-                <div className='w-full'>
-                  <p className='text-lg'>Gift card </p>
+              <div className=" flex items-center p-2 justify-around text-gray-600 text-left">
+                <div className="w-full">
+                  <p className="text-lg">Gift card </p>
                 </div>
-                <div className='text-right'>
+                <div className="text-right">
                   <GiftCardAmount />
                 </div>
               </div>
-              <div className=' flex items-center p-2 justify-around font-bold text-left'>
-                <div className='w-full'>
-                  <p className='text-lg mr-2'>Total </p>
+              <div className=" flex items-center p-2 justify-around font-bold text-left">
+                <div className="w-full">
+                  <p className="text-lg mr-2">Total </p>
                 </div>
-                <div className='text-right'>
-                  <TotalAmount id='total-amount' />
+                <div className="text-right">
+                  <TotalAmount id="total-amount" />
                 </div>
               </div>
             </div>
-            <div className='flex justify-center p-2'>
+            <div className="flex justify-center p-2">
               <CheckoutLink
-                className='mt-2 primary font-bold py-2 px-4 rounded'
-                label='CheckoutLink'
+                className="mt-2 primary font-bold py-2 px-4 rounded"
+                label="CheckoutLink"
               />
             </div>
           </OrderContainer>
diff --git a/examples/order.tsx b/examples/order.tsx
index f57186c8..4365f809 100644
--- a/examples/order.tsx
+++ b/examples/order.tsx
@@ -1,6 +1,6 @@
-import { useState, useEffect } from 'react'
-import { getSalesChannelToken } from '@commercelayer/js-auth'
-import { Nav } from '.'
+import { useState, useEffect } from "react"
+import { getSalesChannelToken } from "@commercelayer/js-auth"
+import { Nav } from "."
 import {
   AddToCartButtonType,
   CommerceLayer,
@@ -32,17 +32,17 @@ import {
   ItemContainer,
   Errors,
   OrderStorage,
-  CartLink
-} from 'packages/react-components/src'
+  CartLink,
+} from "packages/react-components/src"
 // import getSdk from '#utils/getSdk'
 
-const clientId = process.env['NEXT_PUBLIC_CLIENT_ID'] as string
-const endpoint = process.env['NEXT_PUBLIC_ENDPOINT'] as string
-const scope = process.env['NEXT_PUBLIC_MARKET_ID'] as string
+const clientId = process.env["NEXT_PUBLIC_CLIENT_ID"] as string
+const endpoint = process.env["NEXT_PUBLIC_ENDPOINT"] as string
+const scope = process.env["NEXT_PUBLIC_MARKET_ID"] as string
 
 const CustomAddToCart = (props: AddToCartButtonType): JSX.Element => {
   const { handleClick, disabled, className, ...p } = props
-  const classes = disabled ? 'opacity-50 cursor-not-allowed' : ''
+  const classes = disabled ? "opacity-50 cursor-not-allowed" : ""
   const myClick = async (): Promise<void> => {
     const { success } = await handleClick()
     if (success) {
@@ -51,7 +51,7 @@ const CustomAddToCart = (props: AddToCartButtonType): JSX.Element => {
   }
   return (
     <button
-      className={`${classes} ${className ?? ''}`}
+      className={`${classes} ${className ?? ""}`}
       onClick={() => {
         void myClick()
       }}
@@ -79,13 +79,13 @@ const CustomAddToCart = (props: AddToCartButtonType): JSX.Element => {
 // }
 
 export default function Order(): JSX.Element {
-  const [token, setToken] = useState('')
+  const [token, setToken] = useState("")
   useEffect(() => {
     const getToken = async (): Promise<void> => {
       const token = await getSalesChannelToken({
         clientId,
         endpoint,
-        scope
+        scope,
       })
       if (token) setToken(token.accessToken)
       // if (token?.accessToken) {
@@ -109,59 +109,59 @@ export default function Order(): JSX.Element {
   }, [])
   return (
     <>
-      <Nav links={['/multiOrder', '/multiApp', '/giftCard']} />
+      <Nav links={["/multiOrder", "/multiApp", "/giftCard"]} />
       <CommerceLayer accessToken={token} endpoint={endpoint}>
-        <div className='container mx-auto mt-5 px-5'>
-          <OrderStorage persistKey='orderUS'>
+        <div className="container mx-auto mt-5 px-5">
+          <OrderStorage persistKey="orderUS">
             <OrderContainer
               attributes={{
-                return_url: 'https://test.co'
+                return_url: "https://test.co",
               }}
             >
               <ItemContainer>
-                <div className='md:flex'>
-                  <div className='md:flex-shrink-0'>
+                <div className="md:flex">
+                  <div className="md:flex-shrink-0">
                     <img
-                      title='Tuta da bambino'
-                      className='rounded-lg md:w-56'
-                      src='https://img.commercelayer.io/skus/BABYONBU000000E63E74.png?fm=jpg&q=90'
+                      title="Tuta da bambino"
+                      className="rounded-lg md:w-56"
+                      src="https://img.commercelayer.io/skus/BABYONBU000000E63E74.png?fm=jpg&q=90"
                     />
                   </div>
-                  <div className='mt-4 md:mt-0 md:ml-6'>
-                    <h1 className='text-4xl'>Tutina da Bambino</h1>
-                    <div className='w-auto m-2' data-test='price-container'>
-                      <PricesContainer skuCode='BABYONBU000000E63E746MXX'>
+                  <div className="mt-4 md:mt-0 md:ml-6">
+                    <h1 className="text-4xl">Tutina da Bambino</h1>
+                    <div className="w-auto m-2" data-test="price-container">
+                      <PricesContainer skuCode="BABYONBU000000E63E746MXX">
                         <Price
-                          data-test='price'
-                          className='text-green-600 text-2xl m-1'
-                          compareClassName='text-gray-500 text-2xl m-1 line-through'
+                          data-test="price"
+                          className="text-green-600 text-2xl m-1"
+                          compareClassName="text-gray-500 text-2xl m-1 line-through"
                         />
                       </PricesContainer>
                     </div>
-                    <VariantsContainer skuCode='BABYONBU000000E63E746MXX'>
-                      <div className='m-2' data-test='variant-container'>
+                    <VariantsContainer skuCode="BABYONBU000000E63E746MXX">
+                      <div className="m-2" data-test="variant-container">
                         <VariantSelector
-                          data-test='variant-selector'
-                          className='w-full block bg-gray-200 border border-gray-200 text-gray-700 py-3 px-4 pr-8 rounded leading-tight focus:outline-none focus:bg-white focus:border-gray-500'
-                          name='variant1'
+                          data-test="variant-selector"
+                          className="w-full block bg-gray-200 border border-gray-200 text-gray-700 py-3 px-4 pr-8 rounded leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
+                          name="variant1"
                           options={[
                             {
-                              label: '12 months',
-                              code: 'BABYONBU000000E63E7412MX',
+                              label: "12 months",
+                              code: "BABYONBU000000E63E7412MX",
                               lineItem: {
-                                name: 'Darth Vader (12 Months)',
+                                name: "Darth Vader (12 Months)",
                                 imageUrl:
-                                  'https://i.pinimg.com/736x/a5/32/de/a532de337eff9b1c1c4bfb8df73acea4--darth-vader-stencil-darth-vader-head.jpg?b=t'
-                              }
+                                  "https://i.pinimg.com/736x/a5/32/de/a532de337eff9b1c1c4bfb8df73acea4--darth-vader-stencil-darth-vader-head.jpg?b=t",
+                              },
                             },
                             {
-                              label: '6 months',
-                              code: 'BABYONBU000000E63E746MXX'
+                              label: "6 months",
+                              code: "BABYONBU000000E63E746MXX",
                             },
                             {
-                              label: '24 months',
-                              code: 'BABYONBU000000E63E746MXXFAKE'
-                            }
+                              label: "24 months",
+                              code: "BABYONBU000000E63E746MXXFAKE",
+                            },
                           ]}
                           handleCallback={(variant) => {
                             console.log(`variant`, variant)
@@ -169,25 +169,25 @@ export default function Order(): JSX.Element {
                         />
                       </div>
                     </VariantsContainer>
-                    <div className='m-2'>
+                    <div className="m-2">
                       <QuantitySelector
                         max={12}
-                        data-test='quantity-selector'
-                        className='w-full block bg-gray-200 border border-gray-200 text-gray-700 py-3 px-4 pr-8 rounded leading-tight focus:outline-none focus:bg-white focus:border-gray-500'
+                        data-test="quantity-selector"
+                        className="w-full block bg-gray-200 border border-gray-200 text-gray-700 py-3 px-4 pr-8 rounded leading-tight focus:outline-none focus:bg-white focus:border-gray-500"
                       />
                     </div>
-                    <div className='m-2'>
+                    <div className="m-2">
                       <AddToCartButton
-                        data-test='add-to-cart-button'
-                        className='w-full primary hover:bg-green-700 text-white font-bold py-2 px-4 rounded'
+                        data-test="add-to-cart-button"
+                        className="w-full primary hover:bg-green-700 text-white font-bold py-2 px-4 rounded"
                       >
                         {CustomAddToCart}
                       </AddToCartButton>
                     </div>
-                    <div className='m-2'>
+                    <div className="m-2">
                       <AvailabilityContainer>
                         <AvailabilityTemplate
-                          data-test='availability-template'
+                          data-test="availability-template"
                           showShippingMethodName
                           showShippingMethodPrice
                         />
@@ -196,177 +196,133 @@ export default function Order(): JSX.Element {
                   </div>
                 </div>
               </ItemContainer>
-              <Errors resource='orders' />
-              <h1 className='text-4xl border-b-2 my-5'>Shopping Bag</h1>
+              <Errors resource="orders" />
+              <h1 className="text-4xl border-b-2 my-5">Shopping Bag</h1>
               <LineItemsContainer>
-                <p className='text-sm m-2'>
-                  Your shopping bag contains{' '}
-                  <LineItemsCount
-                    data-test='items-count'
-                    className='font-bold'
-                  />{' '}
-                  items
+                <p className="text-sm m-2">
+                  Your shopping bag contains{" "}
+                  <LineItemsCount data-test="items-count" className="font-bold" /> items
                 </p>
-                <div className='flex flex-col p-2'>
-                  <LineItemsEmpty data-test='line-items-empty' />
+                <div className="flex flex-col p-2">
+                  <LineItemsEmpty data-test="line-items-empty" />
                   <LineItem>
-                    <div className='flex justify-around items-center border-b p-5'>
-                      <LineItemImage className='p-2' width={80} />
-                      <LineItemName
-                        data-test='line-item-name'
-                        className='p-2'
-                      />
-                      <LineItemQuantity
-                        data-test='line-item-quantity'
-                        max={100}
-                        className='p-2'
-                      />
-                      <Errors
-                        className='text-red-700 p-2'
-                        resource='line_items'
-                        field='quantity'
-                      />
-                      <LineItemAmount
-                        data-test='line-item-total'
-                        className='p-2'
-                      />
+                    <div className="flex justify-around items-center border-b p-5">
+                      <LineItemImage className="p-2" width={80} />
+                      <LineItemName data-test="line-item-name" className="p-2" />
+                      <LineItemQuantity data-test="line-item-quantity" max={100} className="p-2" />
+                      <Errors className="text-red-700 p-2" resource="line_items" field="quantity" />
+                      <LineItemAmount data-test="line-item-total" className="p-2" />
                       <LineItemRemoveLink
-                        data-test='line-item-remove'
-                        className='p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded'
+                        data-test="line-item-remove"
+                        className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
                       />
                     </div>
                   </LineItem>
-                  <LineItem type='gift_cards'>
-                    <div className='flex justify-between items-center border-b p-5'>
-                      <LineItemImage className='p-2' width={40} />
-                      <LineItemName
-                        data-test='line-item-name'
-                        className='p-2'
-                      />
+                  <LineItem type="gift_cards">
+                    <div className="flex justify-between items-center border-b p-5">
+                      <LineItemImage className="p-2" width={40} />
+                      <LineItemName data-test="line-item-name" className="p-2" />
                       <LineItemQuantity
-                        data-test='line-item-quantity'
+                        data-test="line-item-quantity"
                         max={10}
-                        className='p-2'
+                        className="p-2"
                         disabled
                       />
-                      <LineItemAmount
-                        data-test='line-item-total'
-                        className='p-2'
-                      />
+                      <LineItemAmount data-test="line-item-total" className="p-2" />
                       <LineItemRemoveLink
-                        data-test='line-item-remove'
-                        className='p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded'
+                        data-test="line-item-remove"
+                        className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
                       />
                     </div>
                   </LineItem>
-                  <LineItem type='bundles'>
-                    <div className='flex justify-between items-center border-b p-5'>
-                      <LineItemImage className='p-2' width={40} />
-                      <LineItemName
-                        data-test='line-item-name'
-                        className='p-2'
-                      />
-                      <LineItemQuantity
-                        data-test='line-item-quantity'
-                        max={10}
-                        className='p-2'
-                      />
-                      <LineItemAmount
-                        data-test='line-item-total'
-                        className='p-2'
-                      />
+                  <LineItem type="bundles">
+                    <div className="flex justify-between items-center border-b p-5">
+                      <LineItemImage className="p-2" width={40} />
+                      <LineItemName data-test="line-item-name" className="p-2" />
+                      <LineItemQuantity data-test="line-item-quantity" max={10} className="p-2" />
+                      <LineItemAmount data-test="line-item-total" className="p-2" />
                       <LineItemRemoveLink
-                        data-test='line-item-remove'
-                        className='p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded'
+                        data-test="line-item-remove"
+                        className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
                       />
                     </div>
                   </LineItem>
-                  <LineItem type='adjustments'>
-                    <div className='flex justify-between items-center border-b p-5'>
-                      <LineItemImage className='p-2' width={40} />
-                      <LineItemName
-                        data-test='line-item-name'
-                        className='p-2'
-                      />
-                      <LineItemQuantity
-                        data-test='line-item-quantity'
-                        max={10}
-                        className='p-2'
-                      />
-                      <LineItemAmount
-                        data-test='line-item-total'
-                        className='p-2'
-                      />
+                  <LineItem type="adjustments">
+                    <div className="flex justify-between items-center border-b p-5">
+                      <LineItemImage className="p-2" width={40} />
+                      <LineItemName data-test="line-item-name" className="p-2" />
+                      <LineItemQuantity data-test="line-item-quantity" max={10} className="p-2" />
+                      <LineItemAmount data-test="line-item-total" className="p-2" />
                       <LineItemRemoveLink
-                        data-test='line-item-remove'
-                        className='p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded'
+                        data-test="line-item-remove"
+                        className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
                       />
                     </div>
                   </LineItem>
                 </div>
               </LineItemsContainer>
-              <div className='flex flex-col w-1/2 m-auto'>
-                <div className='flex items-center p-2 justify-around font-medium text-left'>
-                  <div className='w-full'>
-                    <p className='text-lg'>Subtotal </p>
+              <div className="flex flex-col w-1/2 m-auto">
+                <div className="flex items-center p-2 justify-around font-medium text-left">
+                  <div className="w-full">
+                    <p className="text-lg">Subtotal </p>
                   </div>
-                  <div className='text-right'>
-                    <SubTotalAmount data-test='subtotal-amount' />
+                  <div className="text-right">
+                    <SubTotalAmount data-test="subtotal-amount" />
                   </div>
                 </div>
-                <div className=' flex items-center p-2 justify-around text-gray-600 text-left'>
-                  <div className='w-full'>
-                    <p className='text-lg'>Discount </p>
+                <div className=" flex items-center p-2 justify-around text-gray-600 text-left">
+                  <div className="w-full">
+                    <p className="text-lg">Discount </p>
                   </div>
-                  <div className='text-right'>
-                    <DiscountAmount data-test='discount-amount' />
+                  <div className="text-right">
+                    <DiscountAmount data-test="discount-amount" />
                   </div>
                 </div>
-                <div className=' flex items-center p-2 justify-around text-gray-600 text-left'>
-                  <div className='w-full'>
-                    <p className='text-lg'>Shipping </p>
+                <div className=" flex items-center p-2 justify-around text-gray-600 text-left">
+                  <div className="w-full">
+                    <p className="text-lg">Shipping </p>
                   </div>
-                  <div className='text-right'>
-                    <ShippingAmount data-test='shipping-amount' />
+                  <div className="text-right">
+                    <ShippingAmount data-test="shipping-amount" />
                   </div>
                 </div>
-                <div className=' flex items-center p-2 justify-around text-gray-600 text-left'>
-                  <div className='w-full'>
-                    <p className='text-lg'>
-                      Taxes <span className='text-sm font-tin'>(included)</span>
+                <div className=" flex items-center p-2 justify-around text-gray-600 text-left">
+                  <div className="w-full">
+                    <p className="text-lg">
+                      Taxes <span className="text-sm font-tin">(included)</span>
                     </p>
                   </div>
-                  <div className='text-right'>
-                    <TaxesAmount data-test='taxes-amount' />
+                  <div className="text-right">
+                    <TaxesAmount data-test="taxes-amount" />
                   </div>
                 </div>
-                <div className=' flex items-center p-2 justify-around text-gray-600 text-left'>
-                  <div className='w-full'>
-                    <p className='text-lg'>Gift card </p>
+                <div className=" flex items-center p-2 justify-around text-gray-600 text-left">
+                  <div className="w-full">
+                    <p className="text-lg">Gift card </p>
                   </div>
-                  <div className='text-right'>
-                    <GiftCardAmount data-test='gift-card-amount' />
+                  <div className="text-right">
+                    <GiftCardAmount data-test="gift-card-amount" />
                   </div>
                 </div>
-                <div className=' flex items-center p-2 justify-around font-bold text-left'>
-                  <div className='w-full'>
-                    <p className='text-lg mr-2'>Total </p>
+                <div className=" flex items-center p-2 justify-around font-bold text-left">
+                  <div className="w-full">
+                    <p className="text-lg mr-2">Total </p>
                   </div>
-                  <div className='text-right'>
-                    <TotalAmount data-test='total-amount' />
+                  <div className="text-right">
+                    <TotalAmount data-test="total-amount" />
                   </div>
                 </div>
               </div>
-              <div className='flex justify-center p-2'>
+              <div className="flex justify-center p-2">
                 <CheckoutLink
-                  className='mt-2 primary font-bold py-2 px-4 rounded'
-                  label='Checkout'
+                  className="mt-2 primary font-bold py-2 px-4 rounded"
+                  label="Checkout"
                 />
               </div>
-              <div className='flex justify-center p-2'>
+              <div className="flex justify-center p-2">
                 <CartLink
-                  className='mt-2 primary font-bold py-2 px-4 rounded'
-                  label='Go to hosted cart'
+                  className="mt-2 primary font-bold py-2 px-4 rounded"
+                  label="Go to hosted cart"
                 />
               </div>
             </OrderContainer>
diff --git a/examples/order/add-item-to-hosted-cart.tsx b/examples/order/add-item-to-hosted-cart.tsx
index 4a812df4..67ebee47 100644
--- a/examples/order/add-item-to-hosted-cart.tsx
+++ b/examples/order/add-item-to-hosted-cart.tsx
@@ -1,5 +1,5 @@
-import { useState, useEffect, Fragment } from 'react'
-import { getSalesChannelToken } from '@commercelayer/js-auth'
+import { useState, useEffect, Fragment } from "react"
+import { getSalesChannelToken } from "@commercelayer/js-auth"
 import {
   CommerceLayer,
   OrderContainer,
@@ -14,17 +14,17 @@ import {
   ItemContainer,
   Errors,
   OrderStorage,
-} from 'packages/react-components/src'
-import { useRouter } from 'next/router'
+} from "packages/react-components/src"
+import { useRouter } from "next/router"
 
-const clientId = process.env['NEXT_PUBLIC_CLIENT_ID'] as string
-const endpoint = process.env['NEXT_PUBLIC_ENDPOINT'] as string
-const scope = process.env['NEXT_PUBLIC_MARKET_ID'] as string
+const clientId = process.env["NEXT_PUBLIC_CLIENT_ID"] as string
+const endpoint = process.env["NEXT_PUBLIC_ENDPOINT"] as string
+const scope = process.env["NEXT_PUBLIC_MARKET_ID"] as string
 
 export default function Order() {
-  const [token, setToken] = useState('')
+  const [token, setToken] = useState("")
   const { query } = useRouter()
-  const hostedCartUrl = !!query['hostedCartUrl'] ? 'myexample.hosted.cart' : ''
+  const hostedCartUrl = !!query["hostedCartUrl"] ? "myexample.hosted.cart" : ""
   useEffect(() => {
     const getToken = async () => {
       const token = await getSalesChannelToken({
@@ -41,7 +41,7 @@ export default function Order() {
       <CommerceLayer accessToken={token} endpoint={endpoint}>
         <div className="container mx-auto mt-5 px-5">
           <OrderStorage persistKey="orderUS">
-            <OrderContainer attributes={{ return_url: 'https://test.co' }}>
+            <OrderContainer attributes={{ return_url: "https://test.co" }}>
               <ItemContainer>
                 <div className="md:flex">
                   <div className="md:flex-shrink-0">
@@ -70,21 +70,21 @@ export default function Order() {
                           name="variant1"
                           options={[
                             {
-                              label: '12 months',
-                              code: 'BABYONBU000000E63E7412MX',
+                              label: "12 months",
+                              code: "BABYONBU000000E63E7412MX",
                               lineItem: {
-                                name: 'Darth Vader (12 Months)',
+                                name: "Darth Vader (12 Months)",
                                 imageUrl:
-                                  'https://i.pinimg.com/736x/a5/32/de/a532de337eff9b1c1c4bfb8df73acea4--darth-vader-stencil-darth-vader-head.jpg?b=t',
+                                  "https://i.pinimg.com/736x/a5/32/de/a532de337eff9b1c1c4bfb8df73acea4--darth-vader-stencil-darth-vader-head.jpg?b=t",
                               },
                             },
                             {
-                              label: '6 months',
-                              code: 'BABYONBU000000E63E746MXX',
+                              label: "6 months",
+                              code: "BABYONBU000000E63E746MXX",
                             },
                             {
-                              label: '24 months',
-                              code: 'BABYONBU000000E63E746MXXFAKE',
+                              label: "24 months",
+                              code: "BABYONBU000000E63E746MXXFAKE",
                             },
                           ]}
                           handleCallback={(variant) => {
diff --git a/examples/order/buy-now-mode.tsx b/examples/order/buy-now-mode.tsx
index e299ef3e..287b31c2 100644
--- a/examples/order/buy-now-mode.tsx
+++ b/examples/order/buy-now-mode.tsx
@@ -1,5 +1,5 @@
-import { useState, useEffect, Fragment } from 'react'
-import { getSalesChannelToken } from '@commercelayer/js-auth'
+import { useState, useEffect, Fragment } from "react"
+import { getSalesChannelToken } from "@commercelayer/js-auth"
 import {
   CommerceLayer,
   OrderContainer,
@@ -29,14 +29,14 @@ import {
   ItemContainer,
   Errors,
   OrderStorage,
-} from 'packages/react-components/src'
+} from "packages/react-components/src"
 
-const clientId = process.env['NEXT_PUBLIC_CLIENT_ID'] as string
-const endpoint = process.env['NEXT_PUBLIC_ENDPOINT'] as string
-const scope = process.env['NEXT_PUBLIC_MARKET_ID'] as string
+const clientId = process.env["NEXT_PUBLIC_CLIENT_ID"] as string
+const endpoint = process.env["NEXT_PUBLIC_ENDPOINT"] as string
+const scope = process.env["NEXT_PUBLIC_MARKET_ID"] as string
 
 export default function Order() {
-  const [token, setToken] = useState('')
+  const [token, setToken] = useState("")
   useEffect(() => {
     const getToken = async () => {
       const token = await getSalesChannelToken({
@@ -53,7 +53,7 @@ export default function Order() {
       <CommerceLayer accessToken={token} endpoint={endpoint}>
         <div className="container mx-auto mt-5 px-5">
           <OrderStorage persistKey="orderUS">
-            <OrderContainer attributes={{ return_url: 'https://test.co' }}>
+            <OrderContainer attributes={{ return_url: "https://test.co" }}>
               <ItemContainer>
                 <div className="md:flex">
                   <div className="md:flex-shrink-0">
@@ -82,21 +82,21 @@ export default function Order() {
                           name="variant1"
                           options={[
                             {
-                              label: '12 months',
-                              code: 'BABYONBU000000E63E7412MX',
+                              label: "12 months",
+                              code: "BABYONBU000000E63E7412MX",
                               lineItem: {
-                                name: 'Darth Vader (12 Months)',
+                                name: "Darth Vader (12 Months)",
                                 imageUrl:
-                                  'https://i.pinimg.com/736x/a5/32/de/a532de337eff9b1c1c4bfb8df73acea4--darth-vader-stencil-darth-vader-head.jpg?b=t',
+                                  "https://i.pinimg.com/736x/a5/32/de/a532de337eff9b1c1c4bfb8df73acea4--darth-vader-stencil-darth-vader-head.jpg?b=t",
                               },
                             },
                             {
-                              label: '6 months',
-                              code: 'BABYONBU000000E63E746MXX',
+                              label: "6 months",
+                              code: "BABYONBU000000E63E746MXX",
                             },
                             {
-                              label: '24 months',
-                              code: 'BABYONBU000000E63E746MXXFAKE',
+                              label: "24 months",
+                              code: "BABYONBU000000E63E746MXXFAKE",
                             },
                           ]}
                           handleCallback={(variant) => {
@@ -135,36 +135,18 @@ export default function Order() {
               <h1 className="text-4xl border-b-2 my-5">Shopping Bag</h1>
               <LineItemsContainer>
                 <p className="text-sm m-2">
-                  Your shopping bag contains{' '}
-                  <LineItemsCount
-                    data-test="items-count"
-                    className="font-bold"
-                  />{' '}
-                  items
+                  Your shopping bag contains{" "}
+                  <LineItemsCount data-test="items-count" className="font-bold" /> items
                 </p>
                 <div className="flex flex-col p-2">
                   <LineItemsEmpty data-test="line-items-empty" />
                   <LineItem>
                     <div className="flex justify-around items-center border-b p-5">
                       <LineItemImage className="p-2" width={80} />
-                      <LineItemName
-                        data-test="line-item-name"
-                        className="p-2"
-                      />
-                      <LineItemQuantity
-                        data-test="line-item-quantity"
-                        max={100}
-                        className="p-2"
-                      />
-                      <Errors
-                        className="text-red-700 p-2"
-                        resource="line_items"
-                        field="quantity"
-                      />
-                      <LineItemAmount
-                        data-test="line-item-total"
-                        className="p-2"
-                      />
+                      <LineItemName data-test="line-item-name" className="p-2" />
+                      <LineItemQuantity data-test="line-item-quantity" max={100} className="p-2" />
+                      <Errors className="text-red-700 p-2" resource="line_items" field="quantity" />
+                      <LineItemAmount data-test="line-item-total" className="p-2" />
                       <LineItemRemoveLink
                         data-test="line-item-remove"
                         className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
@@ -174,20 +156,14 @@ export default function Order() {
                   <LineItem type="gift_cards">
                     <div className="flex justify-between items-center border-b p-5">
                       <LineItemImage className="p-2" width={40} />
-                      <LineItemName
-                        data-test="line-item-name"
-                        className="p-2"
-                      />
+                      <LineItemName data-test="line-item-name" className="p-2" />
                       <LineItemQuantity
                         data-test="line-item-quantity"
                         max={10}
                         className="p-2"
                         disabled
                       />
-                      <LineItemAmount
-                        data-test="line-item-total"
-                        className="p-2"
-                      />
+                      <LineItemAmount data-test="line-item-total" className="p-2" />
                       <LineItemRemoveLink
                         data-test="line-item-remove"
                         className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
@@ -197,19 +173,9 @@ export default function Order() {
                   <LineItem type="bundles">
                     <div className="flex justify-between items-center border-b p-5">
                       <LineItemImage className="p-2" width={40} />
-                      <LineItemName
-                        data-test="line-item-name"
-                        className="p-2"
-                      />
-                      <LineItemQuantity
-                        data-test="line-item-quantity"
-                        max={10}
-                        className="p-2"
-                      />
-                      <LineItemAmount
-                        data-test="line-item-total"
-                        className="p-2"
-                      />
+                      <LineItemName data-test="line-item-name" className="p-2" />
+                      <LineItemQuantity data-test="line-item-quantity" max={10} className="p-2" />
+                      <LineItemAmount data-test="line-item-total" className="p-2" />
                       <LineItemRemoveLink
                         data-test="line-item-remove"
                         className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
@@ -219,19 +185,9 @@ export default function Order() {
                   <LineItem type="adjustments">
                     <div className="flex justify-between items-center border-b p-5">
                       <LineItemImage className="p-2" width={40} />
-                      <LineItemName
-                        data-test="line-item-name"
-                        className="p-2"
-                      />
-                      <LineItemQuantity
-                        data-test="line-item-quantity"
-                        max={10}
-                        className="p-2"
-                      />
-                      <LineItemAmount
-                        data-test="line-item-total"
-                        className="p-2"
-                      />
+                      <LineItemName data-test="line-item-name" className="p-2" />
+                      <LineItemQuantity data-test="line-item-quantity" max={10} className="p-2" />
+                      <LineItemAmount data-test="line-item-total" className="p-2" />
                       <LineItemRemoveLink
                         data-test="line-item-remove"
                         className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
diff --git a/examples/order/order-with-cart-link-button.tsx b/examples/order/order-with-cart-link-button.tsx
index 21f82958..6b997f2e 100644
--- a/examples/order/order-with-cart-link-button.tsx
+++ b/examples/order/order-with-cart-link-button.tsx
@@ -1,5 +1,5 @@
-import { useState, useEffect, Fragment } from 'react'
-import { getSalesChannelToken } from '@commercelayer/js-auth'
+import { useState, useEffect, Fragment } from "react"
+import { getSalesChannelToken } from "@commercelayer/js-auth"
 import {
   AddToCartButtonType,
   CommerceLayer,
@@ -32,16 +32,16 @@ import {
   Errors,
   OrderStorage,
   CartLink,
-} from 'packages/react-components/src'
-import { useRouter } from 'next/router'
+} from "packages/react-components/src"
+import { useRouter } from "next/router"
 
-const clientId = process.env['NEXT_PUBLIC_CLIENT_ID'] as string
-const endpoint = process.env['NEXT_PUBLIC_ENDPOINT'] as string
-const scope = process.env['NEXT_PUBLIC_MARKET_ID'] as string
+const clientId = process.env["NEXT_PUBLIC_CLIENT_ID"] as string
+const endpoint = process.env["NEXT_PUBLIC_ENDPOINT"] as string
+const scope = process.env["NEXT_PUBLIC_MARKET_ID"] as string
 
 const CustomAddToCart = (props: AddToCartButtonType): JSX.Element => {
   const { handleClick, disabled, className, ...p } = props
-  const classes = disabled ? 'opacity-50 cursor-not-allowed' : ''
+  const classes = disabled ? "opacity-50 cursor-not-allowed" : ""
   const myClick = async () => {
     const { success } = await handleClick()
     if (success) {
@@ -49,24 +49,19 @@ const CustomAddToCart = (props: AddToCartButtonType): JSX.Element => {
     }
   }
   return (
-    <button
-      className={`${classes} ${className}`}
-      onClick={myClick}
-      disabled={disabled}
-      {...p}
-    >
+    <button className={`${classes} ${className}`} onClick={myClick} disabled={disabled} {...p}>
       Custom add to cart
     </button>
   )
 }
 
 export default function Order() {
-  const [token, setToken] = useState('')
+  const [token, setToken] = useState("")
   const { query } = useRouter()
-  const reactNodeLabel = !!query['reactNodeLabel'] ? (
-    <>{'Cart link react node label'}</>
+  const reactNodeLabel = !!query["reactNodeLabel"] ? (
+    <>{"Cart link react node label"}</>
   ) : (
-    'Cart link string'
+    "Cart link string"
   )
   useEffect(() => {
     const getToken = async () => {
@@ -84,7 +79,7 @@ export default function Order() {
       <CommerceLayer accessToken={token} endpoint={endpoint}>
         <div className="container mx-auto mt-5 px-5">
           <OrderStorage persistKey="orderUS">
-            <OrderContainer attributes={{ return_url: 'https://test.co' }}>
+            <OrderContainer attributes={{ return_url: "https://test.co" }}>
               <ItemContainer>
                 <div className="md:flex">
                   <div className="md:flex-shrink-0">
@@ -113,21 +108,21 @@ export default function Order() {
                           name="variant1"
                           options={[
                             {
-                              label: '12 months',
-                              code: 'BABYONBU000000E63E7412MX',
+                              label: "12 months",
+                              code: "BABYONBU000000E63E7412MX",
                               lineItem: {
-                                name: 'Darth Vader (12 Months)',
+                                name: "Darth Vader (12 Months)",
                                 imageUrl:
-                                  'https://i.pinimg.com/736x/a5/32/de/a532de337eff9b1c1c4bfb8df73acea4--darth-vader-stencil-darth-vader-head.jpg?b=t',
+                                  "https://i.pinimg.com/736x/a5/32/de/a532de337eff9b1c1c4bfb8df73acea4--darth-vader-stencil-darth-vader-head.jpg?b=t",
                               },
                             },
                             {
-                              label: '6 months',
-                              code: 'BABYONBU000000E63E746MXX',
+                              label: "6 months",
+                              code: "BABYONBU000000E63E746MXX",
                             },
                             {
-                              label: '24 months',
-                              code: 'BABYONBU000000E63E746MXXFAKE',
+                              label: "24 months",
+                              code: "BABYONBU000000E63E746MXXFAKE",
                             },
                           ]}
                           handleCallback={(variant) => {
@@ -167,36 +162,18 @@ export default function Order() {
               <h1 className="text-4xl border-b-2 my-5">Shopping Bag</h1>
               <LineItemsContainer>
                 <p className="text-sm m-2">
-                  Your shopping bag contains{' '}
-                  <LineItemsCount
-                    data-test="items-count"
-                    className="font-bold"
-                  />{' '}
-                  items
+                  Your shopping bag contains{" "}
+                  <LineItemsCount data-test="items-count" className="font-bold" /> items
                 </p>
                 <div className="flex flex-col p-2">
                   <LineItemsEmpty data-test="line-items-empty" />
                   <LineItem>
                     <div className="flex justify-around items-center border-b p-5">
                       <LineItemImage className="p-2" width={80} />
-                      <LineItemName
-                        data-test="line-item-name"
-                        className="p-2"
-                      />
-                      <LineItemQuantity
-                        data-test="line-item-quantity"
-                        max={100}
-                        className="p-2"
-                      />
-                      <Errors
-                        className="text-red-700 p-2"
-                        resource="line_items"
-                        field="quantity"
-                      />
-                      <LineItemAmount
-                        data-test="line-item-total"
-                        className="p-2"
-                      />
+                      <LineItemName data-test="line-item-name" className="p-2" />
+                      <LineItemQuantity data-test="line-item-quantity" max={100} className="p-2" />
+                      <Errors className="text-red-700 p-2" resource="line_items" field="quantity" />
+                      <LineItemAmount data-test="line-item-total" className="p-2" />
                       <LineItemRemoveLink
                         data-test="line-item-remove"
                         className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
@@ -206,20 +183,14 @@ export default function Order() {
                   <LineItem type="gift_cards">
                     <div className="flex justify-between items-center border-b p-5">
                       <LineItemImage className="p-2" width={40} />
-                      <LineItemName
-                        data-test="line-item-name"
-                        className="p-2"
-                      />
+                      <LineItemName data-test="line-item-name" className="p-2" />
                       <LineItemQuantity
                         data-test="line-item-quantity"
                         max={10}
                         className="p-2"
                         disabled
                       />
-                      <LineItemAmount
-                        data-test="line-item-total"
-                        className="p-2"
-                      />
+                      <LineItemAmount data-test="line-item-total" className="p-2" />
                       <LineItemRemoveLink
                         data-test="line-item-remove"
                         className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
@@ -229,19 +200,9 @@ export default function Order() {
                   <LineItem type="bundles">
                     <div className="flex justify-between items-center border-b p-5">
                       <LineItemImage className="p-2" width={40} />
-                      <LineItemName
-                        data-test="line-item-name"
-                        className="p-2"
-                      />
-                      <LineItemQuantity
-                        data-test="line-item-quantity"
-                        max={10}
-                        className="p-2"
-                      />
-                      <LineItemAmount
-                        data-test="line-item-total"
-                        className="p-2"
-                      />
+                      <LineItemName data-test="line-item-name" className="p-2" />
+                      <LineItemQuantity data-test="line-item-quantity" max={10} className="p-2" />
+                      <LineItemAmount data-test="line-item-total" className="p-2" />
                       <LineItemRemoveLink
                         data-test="line-item-remove"
                         className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
@@ -251,19 +212,9 @@ export default function Order() {
                   <LineItem type="adjustments">
                     <div className="flex justify-between items-center border-b p-5">
                       <LineItemImage className="p-2" width={40} />
-                      <LineItemName
-                        data-test="line-item-name"
-                        className="p-2"
-                      />
-                      <LineItemQuantity
-                        data-test="line-item-quantity"
-                        max={10}
-                        className="p-2"
-                      />
-                      <LineItemAmount
-                        data-test="line-item-total"
-                        className="p-2"
-                      />
+                      <LineItemName data-test="line-item-name" className="p-2" />
+                      <LineItemQuantity data-test="line-item-quantity" max={10} className="p-2" />
+                      <LineItemAmount data-test="line-item-total" className="p-2" />
                       <LineItemRemoveLink
                         data-test="line-item-remove"
                         className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
diff --git a/examples/order/order.tsx b/examples/order/order.tsx
index dbe046f9..21655ca0 100644
--- a/examples/order/order.tsx
+++ b/examples/order/order.tsx
@@ -1,5 +1,5 @@
-import { useState, useEffect } from 'react'
-import { getSalesChannelToken } from '@commercelayer/js-auth'
+import { useState, useEffect } from "react"
+import { getSalesChannelToken } from "@commercelayer/js-auth"
 import {
   CommerceLayer,
   OrderContainer,
@@ -26,23 +26,23 @@ import {
   AvailabilityTemplate,
   Errors,
   OrderStorage,
-  CartLink
-} from 'packages/react-components/src'
+  CartLink,
+} from "packages/react-components/src"
 
-const clientId = process.env['NEXT_PUBLIC_CLIENT_ID'] as string
-const endpoint = process.env['NEXT_PUBLIC_ENDPOINT'] as string
-const scope = process.env['NEXT_PUBLIC_MARKET_ID'] as string
+const clientId = process.env["NEXT_PUBLIC_CLIENT_ID"] as string
+const endpoint = process.env["NEXT_PUBLIC_ENDPOINT"] as string
+const scope = process.env["NEXT_PUBLIC_MARKET_ID"] as string
 
 export default function Order(): JSX.Element {
-  const [token, setToken] = useState('')
-  const [currentSku, setCurrentSku] = useState('BABYONBU000000E63E746MXX')
+  const [token, setToken] = useState("")
+  const [currentSku, setCurrentSku] = useState("BABYONBU000000E63E746MXX")
   const [availability, setAvailability] = useState(0)
   useEffect(() => {
     const getToken = async (): Promise<void> => {
       const token = await getSalesChannelToken({
         clientId,
         endpoint,
-        scope
+        scope,
       })
       if (token) setToken(token.accessToken)
     }
@@ -51,68 +51,66 @@ export default function Order(): JSX.Element {
   return (
     <>
       <CommerceLayer accessToken={token} endpoint={endpoint}>
-        <div className='container mx-auto mt-5 px-5'>
-          <OrderStorage persistKey='orderUS'>
+        <div className="container mx-auto mt-5 px-5">
+          <OrderStorage persistKey="orderUS">
             <OrderContainer
               attributes={{
-                return_url: 'https://test.co'
+                return_url: "https://test.co",
               }}
             >
-              <div className='md:flex'>
-                <div className='md:flex-shrink-0'>
+              <div className="md:flex">
+                <div className="md:flex-shrink-0">
                   <img
-                    title='Tuta da bambino'
-                    className='rounded-lg md:w-56'
-                    src='https://img.commercelayer.io/skus/BABYONBU000000E63E74.png?fm=jpg&q=90'
+                    title="Tuta da bambino"
+                    className="rounded-lg md:w-56"
+                    src="https://img.commercelayer.io/skus/BABYONBU000000E63E74.png?fm=jpg&q=90"
                   />
                 </div>
-                <div className='mt-4 md:mt-0 md:ml-6'>
-                  <h1 className='text-4xl'>Tutina da Bambino</h1>
-                  <div className='w-auto m-2' data-test='price-container'>
-                    <PricesContainer skuCode='BABYONBU000000E63E746MXX'>
+                <div className="mt-4 md:mt-0 md:ml-6">
+                  <h1 className="text-4xl">Tutina da Bambino</h1>
+                  <div className="w-auto m-2" data-test="price-container">
+                    <PricesContainer skuCode="BABYONBU000000E63E746MXX">
                       <Price
-                        data-test='price'
-                        className='text-green-600 text-2xl m-1'
-                        compareClassName='text-gray-500 text-2xl m-1 line-through'
+                        data-test="price"
+                        className="text-green-600 text-2xl m-1"
+                        compareClassName="text-gray-500 text-2xl m-1 line-through"
                       />
                     </PricesContainer>
                   </div>
-                  <div className='m-2' data-test='variant-container'>
+                  <div className="m-2" data-test="variant-container">
                     <select
-                      title='variant-selector'
+                      title="variant-selector"
                       onChange={(e) => setCurrentSku(e.target.value)}
                     >
-                      <option value='BABYONBU000000E63E746MXX'>6 months</option>
-                      <option value='BABYONBU000000E63E7412MX'>
-                        12 months
-                      </option>
+                      <option value="BABYONBU000000E63E746MXX">6 months</option>
+                      <option value="BABYONBU000000E63E7412MX">12 months</option>
                     </select>
                   </div>
-                  <div className='m-2'>
+                  <div className="m-2">
                     <input
                       disabled={availability === 0}
                       defaultValue={1}
-                      title='quantity selector'
-                      type='number'
-                      className='w-full block bg-gray-200 border border-gray-200 text-gray-700 py-3 px-4 pr-8 rounded leading-tight focus:outline-none focus:bg-white focus:border-gray-500 disabled:opacity-50'
+                      title="quantity selector"
+                      type="number"
+                      className="w-full block bg-gray-200 border border-gray-200 text-gray-700 py-3 px-4 pr-8 rounded leading-tight focus:outline-none focus:bg-white focus:border-gray-500 disabled:opacity-50"
                     />
                   </div>
-                  <div className='m-2'>
+                  <div className="m-2">
                     <AddToCartButton
                       disabled={availability === 0}
                       skuCode={currentSku}
-                      data-test='add-to-cart-button'
-                      className='w-full primary hover:bg-green-700 text-white font-bold py-2 px-4 rounded disabled:opacity-50'
+                      data-test="add-to-cart-button"
+                      className="w-full primary hover:bg-green-700 text-white font-bold py-2 px-4 rounded disabled:opacity-50"
                     />
                   </div>
-                  <div className='m-2'>
+                  <div className="m-2">
                     <AvailabilityContainer
                       skuCode={currentSku}
                       getQuantity={(quantity) => setAvailability(quantity)}
                     >
                       <AvailabilityTemplate
-                        data-test='availability-template'
-                        timeFormat='days'
+                        data-test="availability-template"
+                        timeFormat="days"
                         showShippingMethodName
                         showShippingMethodPrice
                       />
@@ -120,177 +118,133 @@ export default function Order(): JSX.Element {
                   </div>
                 </div>
               </div>
-              <Errors resource='orders' />
-              <h1 className='text-4xl border-b-2 my-5'>Shopping Bag</h1>
+              <Errors resource="orders" />
+              <h1 className="text-4xl border-b-2 my-5">Shopping Bag</h1>
               <LineItemsContainer>
-                <p className='text-sm m-2'>
-                  Your shopping bag contains{' '}
-                  <LineItemsCount
-                    data-test='items-count'
-                    className='font-bold'
-                  />{' '}
-                  items
+                <p className="text-sm m-2">
+                  Your shopping bag contains{" "}
+                  <LineItemsCount data-test="items-count" className="font-bold" /> items
                 </p>
-                <div className='flex flex-col p-2'>
-                  <LineItemsEmpty data-test='line-items-empty' />
+                <div className="flex flex-col p-2">
+                  <LineItemsEmpty data-test="line-items-empty" />
                   <LineItem>
-                    <div className='flex justify-around items-center border-b p-5'>
-                      <LineItemImage className='p-2' width={80} />
-                      <LineItemName
-                        data-test='line-item-name'
-                        className='p-2'
-                      />
-                      <LineItemQuantity
-                        data-test='line-item-quantity'
-                        max={100}
-                        className='p-2'
-                      />
-                      <Errors
-                        className='text-red-700 p-2'
-                        resource='line_items'
-                        field='quantity'
-                      />
-                      <LineItemAmount
-                        data-test='line-item-total'
-                        className='p-2'
-                      />
+                    <div className="flex justify-around items-center border-b p-5">
+                      <LineItemImage className="p-2" width={80} />
+                      <LineItemName data-test="line-item-name" className="p-2" />
+                      <LineItemQuantity data-test="line-item-quantity" max={100} className="p-2" />
+                      <Errors className="text-red-700 p-2" resource="line_items" field="quantity" />
+                      <LineItemAmount data-test="line-item-total" className="p-2" />
                       <LineItemRemoveLink
-                        data-test='line-item-remove'
-                        className='p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded'
+                        data-test="line-item-remove"
+                        className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
                       />
                     </div>
                   </LineItem>
-                  <LineItem type='gift_cards'>
-                    <div className='flex justify-between items-center border-b p-5'>
-                      <LineItemImage className='p-2' width={40} />
-                      <LineItemName
-                        data-test='line-item-name'
-                        className='p-2'
-                      />
+                  <LineItem type="gift_cards">
+                    <div className="flex justify-between items-center border-b p-5">
+                      <LineItemImage className="p-2" width={40} />
+                      <LineItemName data-test="line-item-name" className="p-2" />
                       <LineItemQuantity
-                        data-test='line-item-quantity'
+                        data-test="line-item-quantity"
                         max={10}
-                        className='p-2'
+                        className="p-2"
                         disabled
                       />
-                      <LineItemAmount
-                        data-test='line-item-total'
-                        className='p-2'
-                      />
+                      <LineItemAmount data-test="line-item-total" className="p-2" />
                       <LineItemRemoveLink
-                        data-test='line-item-remove'
-                        className='p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded'
+                        data-test="line-item-remove"
+                        className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
                       />
                     </div>
                   </LineItem>
-                  <LineItem type='bundles'>
-                    <div className='flex justify-between items-center border-b p-5'>
-                      <LineItemImage className='p-2' width={40} />
-                      <LineItemName
-                        data-test='line-item-name'
-                        className='p-2'
-                      />
-                      <LineItemQuantity
-                        data-test='line-item-quantity'
-                        max={10}
-                        className='p-2'
-                      />
-                      <LineItemAmount
-                        data-test='line-item-total'
-                        className='p-2'
-                      />
+                  <LineItem type="bundles">
+                    <div className="flex justify-between items-center border-b p-5">
+                      <LineItemImage className="p-2" width={40} />
+                      <LineItemName data-test="line-item-name" className="p-2" />
+                      <LineItemQuantity data-test="line-item-quantity" max={10} className="p-2" />
+                      <LineItemAmount data-test="line-item-total" className="p-2" />
                       <LineItemRemoveLink
-                        data-test='line-item-remove'
-                        className='p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded'
+                        data-test="line-item-remove"
+                        className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
                       />
                     </div>
                   </LineItem>
-                  <LineItem type='adjustments'>
-                    <div className='flex justify-between items-center border-b p-5'>
-                      <LineItemImage className='p-2' width={40} />
-                      <LineItemName
-                        data-test='line-item-name'
-                        className='p-2'
-                      />
-                      <LineItemQuantity
-                        data-test='line-item-quantity'
-                        max={10}
-                        className='p-2'
-                      />
-                      <LineItemAmount
-                        data-test='line-item-total'
-                        className='p-2'
-                      />
+                  <LineItem type="adjustments">
+                    <div className="flex justify-between items-center border-b p-5">
+                      <LineItemImage className="p-2" width={40} />
+                      <LineItemName data-test="line-item-name" className="p-2" />
+                      <LineItemQuantity data-test="line-item-quantity" max={10} className="p-2" />
+                      <LineItemAmount data-test="line-item-total" className="p-2" />
                       <LineItemRemoveLink
-                        data-test='line-item-remove'
-                        className='p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded'
+                        data-test="line-item-remove"
+                        className="p-2 bg-red-500 hover:bg-red-700 text-white font-bold py-2 px-4 rounded"
                       />
                     </div>
                   </LineItem>
                 </div>
               </LineItemsContainer>
-              <div className='flex flex-col w-1/2 m-auto'>
-                <div className='flex items-center p-2 justify-around font-medium text-left'>
-                  <div className='w-full'>
-                    <p className='text-lg'>Subtotal </p>
+              <div className="flex flex-col w-1/2 m-auto">
+                <div className="flex items-center p-2 justify-around font-medium text-left">
+                  <div className="w-full">
+                    <p className="text-lg">Subtotal </p>
                   </div>
-                  <div className='text-right'>
-                    <SubTotalAmount data-test='subtotal-amount' />
+                  <div className="text-right">
+                    <SubTotalAmount data-test="subtotal-amount" />
                   </div>
                 </div>
-                <div className=' flex items-center p-2 justify-around text-gray-600 text-left'>
-                  <div className='w-full'>
-                    <p className='text-lg'>Discount </p>
+                <div className=" flex items-center p-2 justify-around text-gray-600 text-left">
+                  <div className="w-full">
+                    <p className="text-lg">Discount </p>
                   </div>
-                  <div className='text-right'>
-                    <DiscountAmount data-test='discount-amount' />
+                  <div className="text-right">
+                    <DiscountAmount data-test="discount-amount" />
                   </div>
                 </div>
-                <div className=' flex items-center p-2 justify-around text-gray-600 text-left'>
-                  <div className='w-full'>
-                    <p className='text-lg'>Shipping </p>
+                <div className=" flex items-center p-2 justify-around text-gray-600 text-left">
+                  <div className="w-full">
+                    <p className="text-lg">Shipping </p>
                   </div>
-                  <div className='text-right'>
-                    <ShippingAmount data-test='shipping-amount' />
+                  <div className="text-right">
+                    <ShippingAmount data-test="shipping-amount" />
                   </div>
                 </div>
-                <div className=' flex items-center p-2 justify-around text-gray-600 text-left'>
-                  <div className='w-full'>
-                    <p className='text-lg'>
-                      Taxes <span className='text-sm font-tin'>(included)</span>
+                <div className=" flex items-center p-2 justify-around text-gray-600 text-left">
+                  <div className="w-full">
+                    <p className="text-lg">
+                      Taxes <span className="text-sm font-tin">(included)</span>
                     </p>
                   </div>
-                  <div className='text-right'>
-                    <TaxesAmount data-test='taxes-amount' />
+                  <div className="text-right">
+                    <TaxesAmount data-test="taxes-amount" />
                   </div>
                 </div>
-                <div className=' flex items-center p-2 justify-around text-gray-600 text-left'>
-                  <div className='w-full'>
-                    <p className='text-lg'>Gift card </p>
+                <div className=" flex items-center p-2 justify-around text-gray-600 text-left">
+                  <div className="w-full">
+                    <p className="text-lg">Gift card </p>
                   </div>
-                  <div className='text-right'>
-                    <GiftCardAmount data-test='gift-card-amount' />
+                  <div className="text-right">
+                    <GiftCardAmount data-test="gift-card-amount" />
                   </div>
                 </div>
-                <div className=' flex items-center p-2 justify-around font-bold text-left'>
-                  <div className='w-full'>
-                    <p className='text-lg mr-2'>Total </p>
+                <div className=" flex items-center p-2 justify-around font-bold text-left">
+                  <div className="w-full">
+                    <p className="text-lg mr-2">Total </p>
                   </div>
-                  <div className='text-right'>
-                    <TotalAmount data-test='total-amount' />
+                  <div className="text-right">
+                    <TotalAmount data-test="total-amount" />
                   </div>
                 </div>
               </div>
-              <div className='flex justify-center p-2'>
+              <div className="flex justify-center p-2">
                 <CheckoutLink
-                  className='mt-2 primary font-bold py-2 px-4 rounded'
-                  label='Checkout'
+                  className="mt-2 primary font-bold py-2 px-4 rounded"
+                  label="Checkout"
                 />
               </div>
-              <div className='flex justify-center p-2'>
+              <div className="flex justify-center p-2">
                 <CartLink
-                  className='mt-2 primary font-bold py-2 px-4 rounded'
-                  label='Go to hosted cart'
+                  className="mt-2 primary font-bold py-2 px-4 rounded"
+                  label="Go to hosted cart"
                 />
               </div>
             </OrderContainer>
diff --git a/examples/prices.tsx b/examples/prices.tsx
index ae3264fc..b2bf36f9 100644
--- a/examples/prices.tsx
+++ b/examples/prices.tsx
@@ -1,33 +1,29 @@
-import { getIntegrationToken } from '@commercelayer/js-auth'
-import { useEffect, useState } from 'react'
-import Price from '#components/prices/Price'
-import PricesContainer from '#components/prices/PricesContainer'
-import CommerceLayer from '#components/auth/CommerceLayer'
+import { getIntegrationToken } from "@commercelayer/js-auth"
+import { useEffect, useState } from "react"
+import Price from "#components/prices/Price"
+import PricesContainer from "#components/prices/PricesContainer"
+import CommerceLayer from "#components/auth/CommerceLayer"
 
-const clientId = process.env['NEXT_PUBLIC_CLIENT_ID_INTEGRATION'] as string
-const clientSecret = process.env['NEXT_PUBLIC_CLIENT_SECRET'] as string
-const endpoint = process.env['NEXT_PUBLIC_ENDPOINT'] as string
-const scope = process.env['NEXT_PUBLIC_MARKET_ID'] as string
+const clientId = process.env["NEXT_PUBLIC_CLIENT_ID_INTEGRATION"] as string
+const clientSecret = process.env["NEXT_PUBLIC_CLIENT_SECRET"] as string
+const endpoint = process.env["NEXT_PUBLIC_ENDPOINT"] as string
+const scope = process.env["NEXT_PUBLIC_MARKET_ID"] as string
 
 export const Nav = ({ links }: any) => (
-  <header className='dark p-6'>
-    <div className='container mx-auto'>
-      <nav className='flex flex-row items-center'>
-        <div className='flex items-center mr-10'>
-          <a href='/' className='w-48'>
-            <img src='//commercelayer.io/assets/img/commercelayer_logo_white.svg?v=2' />
+  <header className="dark p-6">
+    <div className="container mx-auto">
+      <nav className="flex flex-row items-center">
+        <div className="flex items-center mr-10">
+          <a href="/" className="w-48">
+            <img src="//commercelayer.io/assets/img/commercelayer_logo_white.svg?v=2" />
           </a>
         </div>
-        <div className='flex w-full justify-end'>
-          <div className=''>
+        <div className="flex w-full justify-end">
+          <div className="">
             {links.map((l: string, i: number) => {
               return (
-                <a
-                  key={i}
-                  className='dark capitalize text-base font-normal mr-5'
-                  href={l}
-                >
-                  {l === '/' ? 'home' : l.replace('/', ' ')}
+                <a key={i} className="dark capitalize text-base font-normal mr-5" href={l}>
+                  {l === "/" ? "home" : l.replace("/", " ")}
                 </a>
               )
             })}
@@ -39,43 +35,43 @@ export const Nav = ({ links }: any) => (
 )
 
 export const Title = ({ title }: any) => (
-  <div className='font-bold text-2xl mb-2 bg-green-300'>{title}</div>
+  <div className="font-bold text-2xl mb-2 bg-green-300">{title}</div>
 )
 
 export const Type = ({ text }: any) => (
-  <span className='inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2'>
+  <span className="inline-block bg-gray-200 rounded-full px-3 py-1 text-sm font-semibold text-gray-700 mr-2">
     #{text}
   </span>
 )
 
 const skus = [
-  'BABYONBU000000E63E7412MX',
-  'BABYONBU000000FFFFFF12MX',
-  'BABYONBUFFFFFF00000012MX',
-  'BABYONBUFFFFFFE63E7412MX',
-  'CANVASAU000000FFFFFF1824',
-  'CANVASAUE63E74FFFFFF1824',
-  'HATBEAMU000000E63E74XXXX',
-  'HATBEAMU000000FFFFFFXXXX',
-  'HATBEAMUB7B7B7000000XXXX',
-  'HATBEAMUB7B7B7E63E74XXXX',
-  'HATBSBMU000000E63E74XXXX',
-  'HATBSBMU000000FFFFFFXXXX',
-  'HATBSBMUFFFFFF000000XXXX',
-  'HATBSBMUFFFFFFE63E74XXXX',
-  'LSLEEVMM000000E63E74LXXX',
-  'LSLEEVMM000000FFFFFFLXXX'
+  "BABYONBU000000E63E7412MX",
+  "BABYONBU000000FFFFFF12MX",
+  "BABYONBUFFFFFF00000012MX",
+  "BABYONBUFFFFFFE63E7412MX",
+  "CANVASAU000000FFFFFF1824",
+  "CANVASAUE63E74FFFFFF1824",
+  "HATBEAMU000000E63E74XXXX",
+  "HATBEAMU000000FFFFFFXXXX",
+  "HATBEAMUB7B7B7000000XXXX",
+  "HATBEAMUB7B7B7E63E74XXXX",
+  "HATBSBMU000000E63E74XXXX",
+  "HATBSBMU000000FFFFFFXXXX",
+  "HATBSBMUFFFFFF000000XXXX",
+  "HATBSBMUFFFFFFE63E74XXXX",
+  "LSLEEVMM000000E63E74LXXX",
+  "LSLEEVMM000000FFFFFFLXXX",
 ]
 
 const Home = () => {
-  const [token, setToken] = useState('')
+  const [token, setToken] = useState("")
   useEffect(() => {
     const getToken = async () => {
       const auth = await getIntegrationToken({
         clientId,
         clientSecret,
         endpoint,
-        scope
+        scope,
       })
       setToken(auth?.accessToken as string)
     }
@@ -85,41 +81,34 @@ const Home = () => {
   }, [])
   const Loading = () => <div>Caricamento...</div>
   return (
-    <section className='bg-gray-100'>
-      <div className='mx-auto'>
+    <section className="bg-gray-100">
+      <div className="mx-auto">
         <CommerceLayer accessToken={token} endpoint={endpoint}>
-          <h1 className='text-center text-3xl py-5'>Filtered by EUR</h1>
-          <div className='flex flex-row flex-wrap justify-around p-5'>
+          <h1 className="text-center text-3xl py-5">Filtered by EUR</h1>
+          <div className="flex flex-row flex-wrap justify-around p-5">
             <PricesContainer
               perPage={5}
               loader={<Loading />}
-              filters={{ price_list_currency_code_eq: 'EUR' }}
+              filters={{ price_list_currency_code_eq: "EUR" }}
             >
               {skus.map((s, k) => {
                 const lImg = s.substring(0, s.length - 4)
                 return (
-                  <div
-                    key={k}
-                    className='text-center p-5 w-full'
-                    style={{ maxWidth: '15rem' }}
-                  >
+                  <div key={k} className="text-center p-5 w-full" style={{ maxWidth: "15rem" }}>
                     <img
                       src={`https://img.commercelayer.io/skus/${lImg}.png?fm=png&q=70`}
-                      className='rounded-lg md:w-56 m-auto'
+                      className="rounded-lg md:w-56 m-auto"
                     />
-                    <div className='flex flex-row flex-wrap justify-center'>
+                    <div className="flex flex-row flex-wrap justify-center">
                       <Price
                         data-test={`price-filter-${k}`}
                         skuCode={s}
-                        className='text-green-600 text-2xl m-1'
-                        compareClassName='text-gray-500 text-2xl m-1 line-through'
+                        className="text-green-600 text-2xl m-1"
+                        compareClassName="text-gray-500 text-2xl m-1 line-through"
                       />
                     </div>
-                    <div className='p-3'>
-                      <a
-                        className='mt-2 primary font-bold py-2 px-4 rounded'
-                        href='#'
-                      >
+                    <div className="p-3">
+                      <a className="mt-2 primary font-bold py-2 px-4 rounded" href="#">
                         View Details
                       </a>
                     </div>
@@ -128,32 +117,29 @@ const Home = () => {
               })}
             </PricesContainer>
           </div>
-          <div className='bg-gray-900'>
-            <h1 className='text-center text-3xl py-5 text-white'>No filter</h1>
+          <div className="bg-gray-900">
+            <h1 className="text-center text-3xl py-5 text-white">No filter</h1>
           </div>
-          <div className='flex flex-row flex-wrap justify-around bg-gray-900 p-5'>
+          <div className="flex flex-row flex-wrap justify-around bg-gray-900 p-5">
             <PricesContainer>
               {skus.map((s, k): JSX.Element => {
                 const lImg = s.substring(0, s.length - 4)
                 return (
-                  <div key={k} className='text-center p-5 w-full'>
+                  <div key={k} className="text-center p-5 w-full">
                     <img
                       src={`https://img.commercelayer.io/skus/${lImg}.png?fm=png&q=70`}
-                      className='rounded-lg w-56 m-auto'
+                      className="rounded-lg w-56 m-auto"
                     />
-                    <div className='flex flex-row flex-wrap justify-center'>
+                    <div className="flex flex-row flex-wrap justify-center">
                       <Price
                         data-test={`price-${k}`}
                         skuCode={s}
-                        className='text-green-600 text-2xl m-1'
-                        compareClassName='text-gray-500 text-2xl m-1 line-through'
+                        className="text-green-600 text-2xl m-1"
+                        compareClassName="text-gray-500 text-2xl m-1 line-through"
                       />
                     </div>
-                    <div className='p-3'>
-                      <a
-                        className='mt-2 primary font-bold py-2 px-4 rounded'
-                        href='#'
-                      >
+                    <div className="p-3">
+                      <a className="mt-2 primary font-bold py-2 px-4 rounded" href="#">
                         View Details
                       </a>
                     </div>
diff --git a/examples/radio-variants.tsx b/examples/radio-variants.tsx
index ebfc90ca..55916526 100644
--- a/examples/radio-variants.tsx
+++ b/examples/radio-variants.tsx
@@ -1,33 +1,33 @@
-import React, { useState, useEffect, Fragment } from 'react'
-import { getIntegrationToken } from '@commercelayer/js-auth'
-import CommerceLayer from '../#components/auth/CommerceLayer'
-import { Nav } from '.'
-import OrderContainer from '../#components/OrderContainer'
-import VariantsContainer from '../#components/VariantsContainer'
-import VariantSelector from '../#components/skus/VariantSelector'
-import PricesContainer from '../#components/prices/PricesContainer'
-import Price from '../#components/Price'
-import AddToCartButton from '../#components/orders/AddToCartButton'
-import LineItemsContainer from '../#components/LineItemsContainer'
-import LineItem from '../#components/line_items/LineItem'
-import LineItemImage from '../#components/LineItemImage'
-import LineItemName from '../#components/LineItemName'
-import LineItemQuantity from '../#components/LineItemQuantity'
-import LineItemAmount from '../#components/LineItemAmount'
-import LineItemRemoveLink from '../#components/LineItemRemoveLink'
-import CheckoutLink from '../#components/orders/CheckoutLink'
-import SubTotalAmount from '../#components/SubTotalAmount'
-import QuantitySelector from '../#components/skus/QuantitySelector'
-import LineItemsCount from '../#components/LineItemsCount'
-import TotalAmount from '../#components/orders/TotalAmount'
-import DiscountAmount from '../#components/orders/DiscountAmount'
-import ShippingAmount from '../#components/orders/ShippingAmount'
-import TaxesAmount from '../#components/TaxesAmount'
-import GiftCardAmount from '../#components/orders/GiftCardAmount'
-import AvailabilityContainer from '../#components/AvailabilityContainer'
-import AvailabilityTemplate from '../#components/skus/AvailabilityTemplate'
-import ItemContainer from '../#components/orders/ItemContainer'
-import Errors from '../#components/Errors'
+import React, { useState, useEffect, Fragment } from "react"
+import { getIntegrationToken } from "@commercelayer/js-auth"
+import CommerceLayer from "../#components/auth/CommerceLayer"
+import { Nav } from "."
+import OrderContainer from "../#components/OrderContainer"
+import VariantsContainer from "../#components/VariantsContainer"
+import VariantSelector from "../#components/skus/VariantSelector"
+import PricesContainer from "../#components/prices/PricesContainer"
+import Price from "../#components/Price"
+import AddToCartButton from "../#components/orders/AddToCartButton"
+import LineItemsContainer from "../#components/LineItemsContainer"
+import LineItem from "../#components/line_items/LineItem"
+import LineItemImage from "../#components/LineItemImage"
+import LineItemName from "../#components/LineItemName"
+import LineItemQuantity from "../#components/LineItemQuantity"
+import LineItemAmount from "../#components/LineItemAmount"
+import LineItemRemoveLink from "../#components/LineItemRemoveLink"
+import CheckoutLink from "../#components/orders/CheckoutLink"
+import SubTotalAmount from "../#components/SubTotalAmount"
+import QuantitySelector from "../#components/skus/QuantitySelector"
+import LineItemsCount from "../#components/LineItemsCount"
+import TotalAmount from "../#components/orders/TotalAmount"
+import DiscountAmount from "../#components/orders/DiscountAmount"
+import ShippingAmount from "../#components/orders/ShippingAmount"
+import TaxesAmount from "../#components/TaxesAmount"
+import GiftCardAmount from "../#components/orders/GiftCardAmount"
+import AvailabilityContainer from "../#components/AvailabilityContainer"
+import AvailabilityTemplate from "../#components/skus/AvailabilityTemplate"
+import ItemContainer from "../#components/orders/ItemContainer"
+import Errors from "../#components/Errors"
 
 const clientId = process.env.NEXT_PUBLIC_CLIENT_ID_INTEGRATION as string
 const clientSecret = process.env.NEXT_PUBLIC_CLIENT_SECRET as string
@@ -35,7 +35,7 @@ const endpoint = process.env.NEXT_PUBLIC_ENDPOINT as string
 const scope = process.env.NEXT_PUBLIC_MARKET_ID as string
 
 const CustomAddToCart = (props) => {
-  const classes = props.disabled ? 'opacity-50 cursor-not-allowed' : ''
+  const classes = props.disabled ? "opacity-50 cursor-not-allowed" : ""
   const myClick = () => {
     props.handleClick()
   }
@@ -52,7 +52,7 @@ const CustomAddToCart = (props) => {
 }
 
 export default function Order() {
-  const [token, setToken] = useState('')
+  const [token, setToken] = useState("")
   useEffect(() => {
     const getToken = async () => {
       const token = await getIntegrationToken({
@@ -67,7 +67,7 @@ export default function Order() {
   }, [])
   return (
     <Fragment>
-      <Nav links={['/multiOrder', '/multiApp', '/giftCard']} />
+      <Nav links={["/multiOrder", "/multiApp", "/giftCard"]} />
       <CommerceLayer accessToken={token} endpoint={endpoint}>
         <div className="container mx-auto mt-5 px-5">
           <OrderContainer>
@@ -98,16 +98,16 @@ export default function Order() {
                         name="variant1"
                         options={[
                           {
-                            label: '6 months',
-                            code: 'BABYONBU000000E63E746MXX',
+                            label: "6 months",
+                            code: "BABYONBU000000E63E746MXX",
                           },
                           {
-                            label: '12 months',
-                            code: 'BABYONBU000000E63E7412MX',
+                            label: "12 months",
+                            code: "BABYONBU000000E63E7412MX",
                           },
                           {
-                            label: '24 months',
-                            code: 'BABYONBU000000E63E746MXXFAKE',
+                            label: "24 months",
+                            code: "BABYONBU000000E63E746MXXFAKE",
                           },
                         ]}
                       />
@@ -136,24 +136,16 @@ export default function Order() {
             <h1 className="text-4xl border-b-2 my-5">Shopping Bag</h1>
             <LineItemsContainer>
               <p className="text-sm m-2">
-                Your shopping bag contains{' '}
-                <LineItemsCount id="items-count" className="font-bold" /> items
+                Your shopping bag contains <LineItemsCount id="items-count" className="font-bold" />{" "}
+                items
               </p>
               <div className="flex flex-col p-2">
                 <LineItem>
                   <div className="flex justify-around items-center border-b p-5">
                     <LineItemImage className="p-2" width={80} />
                     <LineItemName id="line-item-name" className="p-2" />
-                    <LineItemQuantity
-                      id="line-item-quantity"
-                      max={100}
-                      className="p-2"
-                    />
-                    <Errors
-                      className="text-red-700 p-2"
-                      resource="lineItem"
-                      field="quantity"
-                    />
+                    <LineItemQuantity id="line-item-quantity" max={100} className="p-2" />
+                    <Errors className="text-red-700 p-2" resource="lineItem" field="quantity" />
                     <LineItemAmount id="line-item-total" className="p-2" />
                     <LineItemRemoveLink
                       id="line-item-remove"
@@ -165,12 +157,7 @@ export default function Order() {
                   <div className="flex justify-between items-center border-b p-5">
                     <LineItemImage className="p-2" width={40} />
                     <LineItemName id="line-item-name" className="p-2" />
-                    <LineItemQuantity
-                      id="line-item-quantity"
-                      max={10}
-                      className="p-2"
-                      disabled
-                    />
+                    <LineItemQuantity id="line-item-quantity" max={10} className="p-2" disabled />
                     <LineItemAmount id="line-item-total" className="p-2" />
                     <LineItemRemoveLink
                       id="line-item-remove"
diff --git a/examples/sku-lists.tsx b/examples/sku-lists.tsx
index 239711af..11f043b2 100644
--- a/examples/sku-lists.tsx
+++ b/examples/sku-lists.tsx
@@ -1,32 +1,32 @@
-import React, { useState, useEffect, Fragment } from 'react'
+import React, { useState, useEffect, Fragment } from "react"
 import {
   getIntegrationToken,
   // getSalesChannelToken,
-} from '@commercelayer/js-auth'
-import CommerceLayer from '../#components/auth/CommerceLayer'
-import { Nav } from '.'
-import OrderContainer from '../#components/OrderContainer'
-import LineItemsContainer from '../#components/LineItemsContainer'
-import LineItem from '../#components/line_items/LineItem'
-import LineItemImage from '../#components/LineItemImage'
-import LineItemName from '../#components/LineItemName'
-import LineItemQuantity from '../#components/LineItemQuantity'
-import LineItemAmount from '../#components/LineItemAmount'
-import LineItemRemoveLink from '../#components/LineItemRemoveLink'
-import CheckoutLink from '../#components/orders/CheckoutLink'
-import SubTotalAmount from '../#components/SubTotalAmount'
-import LineItemsCount from '../#components/LineItemsCount'
-import TotalAmount from '../#components/orders/TotalAmount'
-import DiscountAmount from '../#components/orders/DiscountAmount'
-import ShippingAmount from '../#components/orders/ShippingAmount'
-import TaxesAmount from '../#components/TaxesAmount'
-import GiftCardAmount from '../#components/orders/GiftCardAmount'
-import ItemContainer from '../#components/orders/ItemContainer'
-import SkuListsContainer from '../#components/SkuListsContainer'
-import SkuList from '../#components/SkuList'
-import AddToCartButton from '../#components/orders/AddToCartButton'
-import QuantitySelector from '../#components/skus/QuantitySelector'
-import ExternalFunction from '#components/ExternalFunction'
+} from "@commercelayer/js-auth"
+import CommerceLayer from "../#components/auth/CommerceLayer"
+import { Nav } from "."
+import OrderContainer from "../#components/OrderContainer"
+import LineItemsContainer from "../#components/LineItemsContainer"
+import LineItem from "../#components/line_items/LineItem"
+import LineItemImage from "../#components/LineItemImage"
+import LineItemName from "../#components/LineItemName"
+import LineItemQuantity from "../#components/LineItemQuantity"
+import LineItemAmount from "../#components/LineItemAmount"
+import LineItemRemoveLink from "../#components/LineItemRemoveLink"
+import CheckoutLink from "../#components/orders/CheckoutLink"
+import SubTotalAmount from "../#components/SubTotalAmount"
+import LineItemsCount from "../#components/LineItemsCount"
+import TotalAmount from "../#components/orders/TotalAmount"
+import DiscountAmount from "../#components/orders/DiscountAmount"
+import ShippingAmount from "../#components/orders/ShippingAmount"
+import TaxesAmount from "../#components/TaxesAmount"
+import GiftCardAmount from "../#components/orders/GiftCardAmount"
+import ItemContainer from "../#components/orders/ItemContainer"
+import SkuListsContainer from "../#components/SkuListsContainer"
+import SkuList from "../#components/SkuList"
+import AddToCartButton from "../#components/orders/AddToCartButton"
+import QuantitySelector from "../#components/skus/QuantitySelector"
+import ExternalFunction from "#components/ExternalFunction"
 
 const clientId = process.env.NEXT_PUBLIC_CLIENT_ID_INTEGRATION as string
 const clientSecret = process.env.NEXT_PUBLIC_CLIENT_SECRET as string
@@ -38,21 +38,17 @@ const AddToCartCustom = (props: any) => {
   const customHandleClick = async (e: any) => {
     // e.preventDefault()
     const res = await handleClick(e)
-    console.log('res', res)
+    console.log("res", res)
   }
   return (
-    <button
-      disabled={disabled}
-      className={className}
-      onClick={customHandleClick}
-    >
+    <button disabled={disabled} className={className} onClick={customHandleClick}>
       {label}
     </button>
   )
 }
 
 export default function Order() {
-  const [token, setToken] = useState('')
+  const [token, setToken] = useState("")
   useEffect(() => {
     const getToken = async () => {
       const auth = await getIntegrationToken({
@@ -67,7 +63,7 @@ export default function Order() {
   }, [])
   return (
     <Fragment>
-      <Nav links={['/']} />
+      <Nav links={["/"]} />
       <CommerceLayer accessToken={token} endpoint={endpoint}>
         <div className="container mx-auto mt-5 px-5">
           <OrderContainer>
@@ -108,18 +104,14 @@ export default function Order() {
             <h1 className="text-4xl border-b-2 my-5">Shopping Bag</h1>
             <LineItemsContainer>
               <p className="text-sm m-2">
-                Your shopping bag contains{' '}
-                <LineItemsCount id="items-count" className="font-bold" /> items
+                Your shopping bag contains <LineItemsCount id="items-count" className="font-bold" />{" "}
+                items
               </p>
               <LineItem type="skus">
                 <div className="flex justify-around items-center border-b">
                   <LineItemImage className="p-2" width={80} />
                   <LineItemName id="line-item-name" className="p-2" />
-                  <LineItemQuantity
-                    id="line-item-quantity"
-                    max={10}
-                    className="p-2"
-                  />
+                  <LineItemQuantity id="line-item-quantity" max={10} className="p-2" />
                   <LineItemAmount id="line-item-total" className="p-2" />
                   <LineItemRemoveLink
                     id="line-item-remove"
diff --git a/lerna.json b/lerna.json
index 1a9ee8f7..02b70f76 100644
--- a/lerna.json
+++ b/lerna.json
@@ -8,4 +8,4 @@
       "preid": "beta"
     }
   }
-}
\ No newline at end of file
+}
diff --git a/packages/core/src/auth/getAccessToken.spec.ts b/packages/core/src/auth/getAccessToken.spec.ts
index 415c3abb..9aff5b00 100644
--- a/packages/core/src/auth/getAccessToken.spec.ts
+++ b/packages/core/src/auth/getAccessToken.spec.ts
@@ -21,7 +21,7 @@ describe("getAccessToken", () => {
       expect(result).toEqual(mockToken)
       expect(result).toHaveProperty("accessToken")
       expect(result.accessToken).toBe(mockToken.accessToken)
-    },
+    }
   )
 
   coreTest("should throw an error if authenticate fails", async () => {
@@ -33,8 +33,6 @@ describe("getAccessToken", () => {
     const mockError = new Error("Authentication failed")
     // @ts-expect-error No types for this function
     authenticate.mockRejectedValue(mockError)
-    await expect(getAccessToken({ grantType, config })).rejects.toThrow(
-      "Authentication failed",
-    )
+    await expect(getAccessToken({ grantType, config })).rejects.toThrow("Authentication failed")
   })
 })
diff --git a/packages/core/src/availability/getSkuAvailability.interceptors.spec.ts b/packages/core/src/availability/getSkuAvailability.interceptors.spec.ts
index 699f5d02..91365242 100644
--- a/packages/core/src/availability/getSkuAvailability.interceptors.spec.ts
+++ b/packages/core/src/availability/getSkuAvailability.interceptors.spec.ts
@@ -33,9 +33,7 @@ vi.mock("@commercelayer/sdk/bundle", () => ({
   CommerceLayer: vi.fn().mockReturnValue(mockSdkInstance),
 }))
 vi.mock("@commercelayer/js-auth", () => ({
-  jwtDecode: vi
-    .fn()
-    .mockReturnValue({ payload: { organization: { slug: "my-org" } } }),
+  jwtDecode: vi.fn().mockReturnValue({ payload: { organization: { slug: "my-org" } } }),
 }))
 vi.mock("@commercelayer/sdk", () => ({
   skus: { list: mockSkusList, retrieve: mockSkusRetrieve },
@@ -90,10 +88,7 @@ describe("getSkuAvailability interceptors", () => {
       skuId: "sku-1",
       interceptors,
     })
-    expect(mockAddResponseInterceptor).toHaveBeenCalledWith(
-      onSuccess,
-      undefined,
-    )
+    expect(mockAddResponseInterceptor).toHaveBeenCalledWith(onSuccess, undefined)
     expect(mockAddRequestInterceptor).not.toHaveBeenCalled()
   })
 
diff --git a/packages/core/src/availability/getSkuAvailability.spec.ts b/packages/core/src/availability/getSkuAvailability.spec.ts
index 17b1eff3..02f81f9f 100644
--- a/packages/core/src/availability/getSkuAvailability.spec.ts
+++ b/packages/core/src/availability/getSkuAvailability.spec.ts
@@ -3,33 +3,27 @@ import { coreTest } from "#extender"
 import { getSkuAvailability } from "./getSkuAvailability.js"
 
 describe("getSkuAvailability", () => {
-  coreTest(
-    "should return availability for a sku code",
-    async ({ accessToken }) => {
-      const token = accessToken?.accessToken
-      if (token == null) return
-      const result = await getSkuAvailability({
-        accessToken: token,
-        skuCode: "BABYONBU000000E63E7412MX",
-      })
-      expect(result).toBeDefined()
-      if (result != null) {
-        expect(typeof result.quantity).toBe("number")
-        expect(result.skuCode).toBe("BABYONBU000000E63E7412MX")
-      }
-    },
-  )
+  coreTest("should return availability for a sku code", async ({ accessToken }) => {
+    const token = accessToken?.accessToken
+    if (token == null) return
+    const result = await getSkuAvailability({
+      accessToken: token,
+      skuCode: "BABYONBU000000E63E7412MX",
+    })
+    expect(result).toBeDefined()
+    if (result != null) {
+      expect(typeof result.quantity).toBe("number")
+      expect(result.skuCode).toBe("BABYONBU000000E63E7412MX")
+    }
+  })
 
-  coreTest(
-    "should return null for a non-existent sku code",
-    async ({ accessToken }) => {
-      const token = accessToken?.accessToken
-      if (token == null) return
-      const result = await getSkuAvailability({
-        accessToken: token,
-        skuCode: "NON_EXISTENT_SKU_CODE_XYZ",
-      })
-      expect(result).toBeNull()
-    },
-  )
+  coreTest("should return null for a non-existent sku code", async ({ accessToken }) => {
+    const token = accessToken?.accessToken
+    if (token == null) return
+    const result = await getSkuAvailability({
+      accessToken: token,
+      skuCode: "NON_EXISTENT_SKU_CODE_XYZ",
+    })
+    expect(result).toBeNull()
+  })
 })
diff --git a/packages/core/src/prices/getPrices.interceptors.spec.ts b/packages/core/src/prices/getPrices.interceptors.spec.ts
index 0c900969..244e8a21 100644
--- a/packages/core/src/prices/getPrices.interceptors.spec.ts
+++ b/packages/core/src/prices/getPrices.interceptors.spec.ts
@@ -27,9 +27,7 @@ vi.mock("@commercelayer/sdk/bundle", () => ({
   CommerceLayer: vi.fn().mockReturnValue(mockSdkInstance),
 }))
 vi.mock("@commercelayer/js-auth", () => ({
-  jwtDecode: vi
-    .fn()
-    .mockReturnValue({ payload: { organization: { slug: "my-org" } } }),
+  jwtDecode: vi.fn().mockReturnValue({ payload: { organization: { slug: "my-org" } } }),
 }))
 vi.mock("@commercelayer/sdk", () => ({
   prices: { list: vi.fn().mockResolvedValue(undefined) },
@@ -50,10 +48,7 @@ describe("getPrices interceptors", () => {
     const onSuccess = vi.fn()
     const interceptors: InterceptorManager = { response: { onSuccess } }
     await getPrices({ accessToken: "fake-token", interceptors })
-    expect(mockAddResponseInterceptor).toHaveBeenCalledWith(
-      onSuccess,
-      undefined,
-    )
+    expect(mockAddResponseInterceptor).toHaveBeenCalledWith(onSuccess, undefined)
     expect(mockAddRequestInterceptor).not.toHaveBeenCalled()
   })
 
diff --git a/packages/core/src/prices/retrievePrice.interceptors.spec.ts b/packages/core/src/prices/retrievePrice.interceptors.spec.ts
index 3657837d..8a7f08ea 100644
--- a/packages/core/src/prices/retrievePrice.interceptors.spec.ts
+++ b/packages/core/src/prices/retrievePrice.interceptors.spec.ts
@@ -27,9 +27,7 @@ vi.mock("@commercelayer/sdk/bundle", () => ({
   CommerceLayer: vi.fn().mockReturnValue(mockSdkInstance),
 }))
 vi.mock("@commercelayer/js-auth", () => ({
-  jwtDecode: vi
-    .fn()
-    .mockReturnValue({ payload: { organization: { slug: "my-org" } } }),
+  jwtDecode: vi.fn().mockReturnValue({ payload: { organization: { slug: "my-org" } } }),
 }))
 vi.mock("@commercelayer/sdk", () => ({
   prices: { retrieve: vi.fn().mockResolvedValue({ id: "price-1" }) },
@@ -58,10 +56,7 @@ describe("retrievePrice interceptors", () => {
       id: "price-1",
       interceptors,
     })
-    expect(mockAddResponseInterceptor).toHaveBeenCalledWith(
-      onSuccess,
-      undefined,
-    )
+    expect(mockAddResponseInterceptor).toHaveBeenCalledWith(onSuccess, undefined)
     expect(mockAddRequestInterceptor).not.toHaveBeenCalled()
   })
 
diff --git a/packages/core/src/prices/retrievePrice.ts b/packages/core/src/prices/retrievePrice.ts
index 9bdc1030..9cb1ee98 100644
--- a/packages/core/src/prices/retrievePrice.ts
+++ b/packages/core/src/prices/retrievePrice.ts
@@ -1,8 +1,4 @@
-import {
-  type Price,
-  prices,
-  type QueryParamsRetrieve,
-} from "@commercelayer/sdk"
+import { type Price, prices, type QueryParamsRetrieve } from "@commercelayer/sdk"
 import { getSdk } from "#sdk"
 import type { RequestConfig } from "#types"
 
diff --git a/packages/core/src/prices/updatePrice.interceptors.spec.ts b/packages/core/src/prices/updatePrice.interceptors.spec.ts
index 7a1a95d1..d778a0a0 100644
--- a/packages/core/src/prices/updatePrice.interceptors.spec.ts
+++ b/packages/core/src/prices/updatePrice.interceptors.spec.ts
@@ -27,9 +27,7 @@ vi.mock("@commercelayer/sdk/bundle", () => ({
   CommerceLayer: vi.fn().mockReturnValue(mockSdkInstance),
 }))
 vi.mock("@commercelayer/js-auth", () => ({
-  jwtDecode: vi
-    .fn()
-    .mockReturnValue({ payload: { organization: { slug: "my-org" } } }),
+  jwtDecode: vi.fn().mockReturnValue({ payload: { organization: { slug: "my-org" } } }),
 }))
 vi.mock("@commercelayer/sdk", () => ({
   prices: { update: vi.fn().mockResolvedValue({ id: "price-1" }) },
@@ -58,10 +56,7 @@ describe("updatePrice interceptors", () => {
       resource: { id: "price-1" },
       interceptors,
     })
-    expect(mockAddResponseInterceptor).toHaveBeenCalledWith(
-      onSuccess,
-      undefined,
-    )
+    expect(mockAddResponseInterceptor).toHaveBeenCalledWith(onSuccess, undefined)
     expect(mockAddRequestInterceptor).not.toHaveBeenCalled()
   })
 
diff --git a/packages/core/src/prices/updatePrice.spec.ts b/packages/core/src/prices/updatePrice.spec.ts
index be94dd50..5a6b0594 100644
--- a/packages/core/src/prices/updatePrice.spec.ts
+++ b/packages/core/src/prices/updatePrice.spec.ts
@@ -4,37 +4,34 @@ import { getPrices } from "./getPrices"
 import { updatePrice } from "./updatePrice"
 
 describe("updatePrice", () => {
-  coreIntegrationTest(
-    "should update a single price",
-    async ({ accessToken }) => {
-      const token = accessToken?.accessToken
-      if (token == null) return
-      const firstPrice = (await getPrices({ accessToken: token })).first()
-      expect(firstPrice).toBeDefined()
-      if (!firstPrice) {
-        throw new Error("No price found")
-      }
-      const id = firstPrice?.id
-      const result = await updatePrice({
-        accessToken: token,
-        resource: {
-          id,
-          reference: "test-price",
-        },
-      })
-      expect(result).toBeDefined()
-      expect(result.id).toBe(id)
-      expect(result.reference).toBe("test-price")
-      const clean = await updatePrice({
-        accessToken: token,
-        resource: {
-          id,
-          reference: "",
-        },
-      })
-      expect(clean).toBeDefined()
-      expect(clean.id).toBe(id)
-      expect(clean.reference).toBe("")
-    },
-  )
+  coreIntegrationTest("should update a single price", async ({ accessToken }) => {
+    const token = accessToken?.accessToken
+    if (token == null) return
+    const firstPrice = (await getPrices({ accessToken: token })).first()
+    expect(firstPrice).toBeDefined()
+    if (!firstPrice) {
+      throw new Error("No price found")
+    }
+    const id = firstPrice?.id
+    const result = await updatePrice({
+      accessToken: token,
+      resource: {
+        id,
+        reference: "test-price",
+      },
+    })
+    expect(result).toBeDefined()
+    expect(result.id).toBe(id)
+    expect(result.reference).toBe("test-price")
+    const clean = await updatePrice({
+      accessToken: token,
+      resource: {
+        id,
+        reference: "",
+      },
+    })
+    expect(clean).toBeDefined()
+    expect(clean.id).toBe(id)
+    expect(clean.reference).toBe("")
+  })
 })
diff --git a/packages/core/src/prices/updatePrice.ts b/packages/core/src/prices/updatePrice.ts
index ba8a2f9d..cd895ccd 100644
--- a/packages/core/src/prices/updatePrice.ts
+++ b/packages/core/src/prices/updatePrice.ts
@@ -1,9 +1,4 @@
-import {
-  type Price,
-  type PriceUpdate,
-  prices,
-  type QueryParamsRetrieve,
-} from "@commercelayer/sdk"
+import { type Price, type PriceUpdate, prices, type QueryParamsRetrieve } from "@commercelayer/sdk"
 import { getSdk } from "#sdk"
 import type { RequestConfig } from "#types"
 
diff --git a/packages/core/src/sdk/getSdk.spec.ts b/packages/core/src/sdk/getSdk.spec.ts
index 2ebbecd2..f54b5107 100644
--- a/packages/core/src/sdk/getSdk.spec.ts
+++ b/packages/core/src/sdk/getSdk.spec.ts
@@ -81,10 +81,7 @@ describe("getSdk", () => {
     }
     getSdk({ accessToken: "fake-token", interceptors })
     expect(mockAddResponseInterceptor).toHaveBeenCalledOnce()
-    expect(mockAddResponseInterceptor).toHaveBeenCalledWith(
-      onSuccess,
-      onFailure,
-    )
+    expect(mockAddResponseInterceptor).toHaveBeenCalledWith(onSuccess, onFailure)
     expect(mockAddRequestInterceptor).not.toHaveBeenCalled()
     expect(mockAddRawResponseReader).not.toHaveBeenCalled()
   })
@@ -126,9 +123,6 @@ describe("getSdk", () => {
       response: { onFailure },
     }
     getSdk({ accessToken: "fake-token", interceptors })
-    expect(mockAddResponseInterceptor).toHaveBeenCalledWith(
-      undefined,
-      onFailure,
-    )
+    expect(mockAddResponseInterceptor).toHaveBeenCalledWith(undefined, onFailure)
   })
 })
diff --git a/packages/core/src/sdk/index.ts b/packages/core/src/sdk/index.ts
index 63fd91cc..e5f6e112 100644
--- a/packages/core/src/sdk/index.ts
+++ b/packages/core/src/sdk/index.ts
@@ -8,12 +8,8 @@ import type { ErrorObj, RequestObj, ResponseObj } from "@commercelayer/sdk"
 import type { CommerceLayerBundle } from "@commercelayer/sdk/bundle"
 import { CommerceLayer as Sdk } from "@commercelayer/sdk/bundle"
 
-type RequestInterceptor = (
-  request: RequestObj,
-) => RequestObj | Promise<RequestObj>
-type ResponseInterceptor = (
-  response: ResponseObj,
-) => ResponseObj | Promise<ResponseObj>
+type RequestInterceptor = (request: RequestObj) => RequestObj | Promise<RequestObj>
+type ResponseInterceptor = (response: ResponseObj) => ResponseObj | Promise<ResponseObj>
 type ErrorInterceptor = (error: ErrorObj) => ErrorObj | Promise<ErrorObj>
 
 export type InterceptorManager = {
@@ -39,22 +35,13 @@ export function getSdk({
   interceptors?: InterceptorManager
 }): CommerceLayerBundle {
   const { payload } = jwtDecode(accessToken)
-  const { organization } = payload as
-    | JWTIntegration
-    | JWTWebApp
-    | JWTSalesChannel
+  const { organization } = payload as JWTIntegration | JWTWebApp | JWTSalesChannel
   const sdk = Sdk({ accessToken, organization: organization.slug })
   if (interceptors?.request != null) {
-    sdk.addRequestInterceptor(
-      interceptors.request.onSuccess,
-      interceptors.request.onFailure,
-    )
+    sdk.addRequestInterceptor(interceptors.request.onSuccess, interceptors.request.onFailure)
   }
   if (interceptors?.response != null) {
-    sdk.addResponseInterceptor(
-      interceptors.response.onSuccess,
-      interceptors.response.onFailure,
-    )
+    sdk.addResponseInterceptor(interceptors.response.onSuccess, interceptors.response.onFailure)
   }
   if (interceptors?.rawReader != null) {
     sdk.addRawResponseReader()
diff --git a/packages/core/src/sku_lists/getSkuLists.interceptors.spec.ts b/packages/core/src/sku_lists/getSkuLists.interceptors.spec.ts
index c30febd3..b3195220 100644
--- a/packages/core/src/sku_lists/getSkuLists.interceptors.spec.ts
+++ b/packages/core/src/sku_lists/getSkuLists.interceptors.spec.ts
@@ -27,9 +27,7 @@ vi.mock("@commercelayer/sdk/bundle", () => ({
   CommerceLayer: vi.fn().mockReturnValue(mockSdkInstance),
 }))
 vi.mock("@commercelayer/js-auth", () => ({
-  jwtDecode: vi
-    .fn()
-    .mockReturnValue({ payload: { organization: { slug: "my-org" } } }),
+  jwtDecode: vi.fn().mockReturnValue({ payload: { organization: { slug: "my-org" } } }),
 }))
 vi.mock("@commercelayer/sdk", () => ({
   sku_lists: { list: vi.fn().mockResolvedValue(undefined) },
@@ -50,10 +48,7 @@ describe("getSkuLists interceptors", () => {
     const onSuccess = vi.fn()
     const interceptors: InterceptorManager = { response: { onSuccess } }
     await getSkuLists({ accessToken: "fake-token", interceptors })
-    expect(mockAddResponseInterceptor).toHaveBeenCalledWith(
-      onSuccess,
-      undefined,
-    )
+    expect(mockAddResponseInterceptor).toHaveBeenCalledWith(onSuccess, undefined)
     expect(mockAddRequestInterceptor).not.toHaveBeenCalled()
   })
 
diff --git a/packages/core/src/sku_lists/getSkuLists.spec.ts b/packages/core/src/sku_lists/getSkuLists.spec.ts
index 5566580d..6e134067 100644
--- a/packages/core/src/sku_lists/getSkuLists.spec.ts
+++ b/packages/core/src/sku_lists/getSkuLists.spec.ts
@@ -3,13 +3,10 @@ import { coreIntegrationTest } from "#extender"
 import { getSkuLists } from "./getSkuLists.js"
 
 describe("getSkuLists", () => {
-  coreIntegrationTest(
-    "should return a list of SKU lists",
-    async ({ accessToken }) => {
-      const token = accessToken?.accessToken
-      if (token == null) return
-      const result = await getSkuLists({ accessToken: token })
-      expect(result).toBeDefined()
-    },
-  )
+  coreIntegrationTest("should return a list of SKU lists", async ({ accessToken }) => {
+    const token = accessToken?.accessToken
+    if (token == null) return
+    const result = await getSkuLists({ accessToken: token })
+    expect(result).toBeDefined()
+  })
 })
diff --git a/packages/core/src/sku_lists/retrieveSkuList.interceptors.spec.ts b/packages/core/src/sku_lists/retrieveSkuList.interceptors.spec.ts
index 72359a0c..3b35aedf 100644
--- a/packages/core/src/sku_lists/retrieveSkuList.interceptors.spec.ts
+++ b/packages/core/src/sku_lists/retrieveSkuList.interceptors.spec.ts
@@ -27,9 +27,7 @@ vi.mock("@commercelayer/sdk/bundle", () => ({
   CommerceLayer: vi.fn().mockReturnValue(mockSdkInstance),
 }))
 vi.mock("@commercelayer/js-auth", () => ({
-  jwtDecode: vi
-    .fn()
-    .mockReturnValue({ payload: { organization: { slug: "my-org" } } }),
+  jwtDecode: vi.fn().mockReturnValue({ payload: { organization: { slug: "my-org" } } }),
 }))
 vi.mock("@commercelayer/sdk", () => ({
   sku_lists: { retrieve: vi.fn().mockResolvedValue({ id: "list-1" }) },
@@ -58,10 +56,7 @@ describe("retrieveSkuList interceptors", () => {
       id: "list-1",
       interceptors,
     })
-    expect(mockAddResponseInterceptor).toHaveBeenCalledWith(
-      onSuccess,
-      undefined,
-    )
+    expect(mockAddResponseInterceptor).toHaveBeenCalledWith(onSuccess, undefined)
     expect(mockAddRequestInterceptor).not.toHaveBeenCalled()
   })
 
diff --git a/packages/core/src/sku_lists/retrieveSkuList.spec.ts b/packages/core/src/sku_lists/retrieveSkuList.spec.ts
index ca74e26e..82b2cbc8 100644
--- a/packages/core/src/sku_lists/retrieveSkuList.spec.ts
+++ b/packages/core/src/sku_lists/retrieveSkuList.spec.ts
@@ -22,6 +22,6 @@ describe("retrieveSkuList", () => {
       })
       expect(result).toBeDefined()
       expect(result.id).toBe(first.id)
-    },
+    }
   )
 })
diff --git a/packages/core/src/sku_lists/retrieveSkuList.ts b/packages/core/src/sku_lists/retrieveSkuList.ts
index 6a48f30f..8ae0a765 100644
--- a/packages/core/src/sku_lists/retrieveSkuList.ts
+++ b/packages/core/src/sku_lists/retrieveSkuList.ts
@@ -1,8 +1,4 @@
-import {
-  type QueryParamsRetrieve,
-  type SkuList,
-  sku_lists,
-} from "@commercelayer/sdk"
+import { type QueryParamsRetrieve, type SkuList, sku_lists } from "@commercelayer/sdk"
 import { getSdk } from "#sdk"
 import type { RequestConfig } from "#types"
 
diff --git a/packages/core/src/skus/getSkus.interceptors.spec.ts b/packages/core/src/skus/getSkus.interceptors.spec.ts
index da09f345..c88fb4f8 100644
--- a/packages/core/src/skus/getSkus.interceptors.spec.ts
+++ b/packages/core/src/skus/getSkus.interceptors.spec.ts
@@ -27,9 +27,7 @@ vi.mock("@commercelayer/sdk/bundle", () => ({
   CommerceLayer: vi.fn().mockReturnValue(mockSdkInstance),
 }))
 vi.mock("@commercelayer/js-auth", () => ({
-  jwtDecode: vi
-    .fn()
-    .mockReturnValue({ payload: { organization: { slug: "my-org" } } }),
+  jwtDecode: vi.fn().mockReturnValue({ payload: { organization: { slug: "my-org" } } }),
 }))
 vi.mock("@commercelayer/sdk", () => ({
   skus: { list: vi.fn().mockResolvedValue(undefined) },
@@ -50,10 +48,7 @@ describe("getSkus interceptors", () => {
     const onSuccess = vi.fn()
     const interceptors: InterceptorManager = { response: { onSuccess } }
     await getSkus({ accessToken: "fake-token", interceptors })
-    expect(mockAddResponseInterceptor).toHaveBeenCalledWith(
-      onSuccess,
-      undefined,
-    )
+    expect(mockAddResponseInterceptor).toHaveBeenCalledWith(onSuccess, undefined)
     expect(mockAddRequestInterceptor).not.toHaveBeenCalled()
   })
 
diff --git a/packages/core/src/skus/retrieveSku.interceptors.spec.ts b/packages/core/src/skus/retrieveSku.interceptors.spec.ts
index 18964736..32a0efe1 100644
--- a/packages/core/src/skus/retrieveSku.interceptors.spec.ts
+++ b/packages/core/src/skus/retrieveSku.interceptors.spec.ts
@@ -27,9 +27,7 @@ vi.mock("@commercelayer/sdk/bundle", () => ({
   CommerceLayer: vi.fn().mockReturnValue(mockSdkInstance),
 }))
 vi.mock("@commercelayer/js-auth", () => ({
-  jwtDecode: vi
-    .fn()
-    .mockReturnValue({ payload: { organization: { slug: "my-org" } } }),
+  jwtDecode: vi.fn().mockReturnValue({ payload: { organization: { slug: "my-org" } } }),
 }))
 vi.mock("@commercelayer/sdk", () => ({
   skus: { retrieve: vi.fn().mockResolvedValue({ id: "sku-1" }) },
@@ -50,10 +48,7 @@ describe("retrieveSku interceptors", () => {
     const onSuccess = vi.fn()
     const interceptors: InterceptorManager = { response: { onSuccess } }
     await retrieveSku({ accessToken: "fake-token", id: "sku-1", interceptors })
-    expect(mockAddResponseInterceptor).toHaveBeenCalledWith(
-      onSuccess,
-      undefined,
-    )
+    expect(mockAddResponseInterceptor).toHaveBeenCalledWith(onSuccess, undefined)
     expect(mockAddRequestInterceptor).not.toHaveBeenCalled()
   })
 
diff --git a/packages/core/src/skus/updateSku.interceptors.spec.ts b/packages/core/src/skus/updateSku.interceptors.spec.ts
index 47e7f73f..5db1fc30 100644
--- a/packages/core/src/skus/updateSku.interceptors.spec.ts
+++ b/packages/core/src/skus/updateSku.interceptors.spec.ts
@@ -27,9 +27,7 @@ vi.mock("@commercelayer/sdk/bundle", () => ({
   CommerceLayer: vi.fn().mockReturnValue(mockSdkInstance),
 }))
 vi.mock("@commercelayer/js-auth", () => ({
-  jwtDecode: vi
-    .fn()
-    .mockReturnValue({ payload: { organization: { slug: "my-org" } } }),
+  jwtDecode: vi.fn().mockReturnValue({ payload: { organization: { slug: "my-org" } } }),
 }))
 vi.mock("@commercelayer/sdk", () => ({
   skus: { update: vi.fn().mockResolvedValue({ id: "sku-1" }) },
@@ -58,10 +56,7 @@ describe("updateSku interceptors", () => {
       resource: { id: "sku-1" },
       interceptors,
     })
-    expect(mockAddResponseInterceptor).toHaveBeenCalledWith(
-      onSuccess,
-      undefined,
-    )
+    expect(mockAddResponseInterceptor).toHaveBeenCalledWith(onSuccess, undefined)
     expect(mockAddRequestInterceptor).not.toHaveBeenCalled()
   })
 
diff --git a/packages/core/src/skus/updateSku.ts b/packages/core/src/skus/updateSku.ts
index 60a60f56..8132fb66 100644
--- a/packages/core/src/skus/updateSku.ts
+++ b/packages/core/src/skus/updateSku.ts
@@ -1,9 +1,4 @@
-import {
-  type QueryParamsRetrieve,
-  type Sku,
-  type SkuUpdate,
-  skus,
-} from "@commercelayer/sdk"
+import { type QueryParamsRetrieve, type Sku, type SkuUpdate, skus } from "@commercelayer/sdk"
 import { getSdk } from "#sdk"
 import type { RequestConfig } from "#types"
 
diff --git a/packages/docs/.storybook/addon-gh-repository/Tool.tsx b/packages/docs/.storybook/addon-gh-repository/Tool.tsx
index 25f4aa10..ab197d6b 100644
--- a/packages/docs/.storybook/addon-gh-repository/Tool.tsx
+++ b/packages/docs/.storybook/addon-gh-repository/Tool.tsx
@@ -1,14 +1,14 @@
-import { A, IconButton, Icons, Separator } from '@storybook/components'
-import React from 'react'
-import { ADDON_NAME, REPOSITORY_URL, TOOL_ID } from './constants'
+import { A, IconButton, Icons, Separator } from "@storybook/components"
+import React from "react"
+import { ADDON_NAME, REPOSITORY_URL, TOOL_ID } from "./constants"
 
 export const Tool = () => {
   return (
     <>
       <Separator />
       <IconButton key={TOOL_ID} active={false} title={ADDON_NAME}>
-        <A target='_blank' href={REPOSITORY_URL}>
-          <Icons icon='github' />
+        <A target="_blank" href={REPOSITORY_URL}>
+          <Icons icon="github" />
           &nbsp;&nbsp;repository
         </A>
       </IconButton>
diff --git a/packages/docs/.storybook/addon-gh-repository/constants.ts b/packages/docs/.storybook/addon-gh-repository/constants.ts
index da0fb807..27ee6679 100644
--- a/packages/docs/.storybook/addon-gh-repository/constants.ts
+++ b/packages/docs/.storybook/addon-gh-repository/constants.ts
@@ -1,5 +1,4 @@
-export const ADDON_ID = 'addon-gh-repository'
-export const ADDON_NAME = 'View repository'
+export const ADDON_ID = "addon-gh-repository"
+export const ADDON_NAME = "View repository"
 export const TOOL_ID = `${ADDON_ID}/tool`
-export const REPOSITORY_URL =
-  'https://github.com/commercelayer/commercelayer-react-components'
+export const REPOSITORY_URL = "https://github.com/commercelayer/commercelayer-react-components"
diff --git a/packages/docs/.storybook/addon-gh-repository/manager.tsx b/packages/docs/.storybook/addon-gh-repository/manager.tsx
index a354e49b..b8bef3b8 100644
--- a/packages/docs/.storybook/addon-gh-repository/manager.tsx
+++ b/packages/docs/.storybook/addon-gh-repository/manager.tsx
@@ -1,7 +1,7 @@
-import { addons, types } from '@storybook/addons'
-import React from 'react'
-import { Tool } from './Tool'
-import { ADDON_ID, ADDON_NAME } from './constants'
+import { addons, types } from "@storybook/addons"
+import React from "react"
+import { Tool } from "./Tool"
+import { ADDON_ID, ADDON_NAME } from "./constants"
 
 addons.register(ADDON_ID, () => {
   addons.add(ADDON_ID, {
diff --git a/packages/docs/.storybook/commercelayer.theme.ts b/packages/docs/.storybook/commercelayer.theme.ts
index 1b06740a..9d55fd56 100644
--- a/packages/docs/.storybook/commercelayer.theme.ts
+++ b/packages/docs/.storybook/commercelayer.theme.ts
@@ -1,11 +1,11 @@
-import { create } from '@storybook/theming'
+import { create } from "@storybook/theming"
 
 export default create({
-  base: 'light',
-  brandTitle: 'Commerce Layer',
+  base: "light",
+  brandTitle: "Commerce Layer",
   // brandUrl: 'https://example.com',
-  brandImage: './app-logo.png',
-  brandTarget: '_self',
+  brandImage: "./app-logo.png",
+  brandTarget: "_self",
 
-  textColor: '#101111'
+  textColor: "#101111",
 })
diff --git a/packages/docs/.storybook/main.ts b/packages/docs/.storybook/main.ts
index 9c1cdee5..351d6856 100644
--- a/packages/docs/.storybook/main.ts
+++ b/packages/docs/.storybook/main.ts
@@ -1,66 +1,66 @@
-import { type StorybookConfig } from '@storybook/react-vite'
-import { resolve } from 'path'
-import { mergeConfig, type UserConfig } from 'vite'
-import tsconfigPaths from 'vite-tsconfig-paths'
+import { type StorybookConfig } from "@storybook/react-vite"
+import { resolve } from "path"
+import { mergeConfig, type UserConfig } from "vite"
+import tsconfigPaths from "vite-tsconfig-paths"
 
 const viteOverrides: UserConfig = {
   base: process.env.VITE_BASE_URL,
   plugins: [
     tsconfigPaths({
       projects: [
-        resolve(__dirname, '../../react-components/tsconfig.json'),
-        resolve(__dirname, '../tsconfig.json')
-      ]
-    })
-  ]
+        resolve(__dirname, "../../react-components/tsconfig.json"),
+        resolve(__dirname, "../tsconfig.json"),
+      ],
+    }),
+  ],
 }
 
 const storybookConfig: StorybookConfig = {
   async viteFinal(config) {
     return mergeConfig(config, viteOverrides)
   },
-  stories: ['../stories/**/*.mdx', '../stories/**/*.stories.@(js|jsx|ts|tsx)'],
+  stories: ["../stories/**/*.mdx", "../stories/**/*.stories.@(js|jsx|ts|tsx)"],
   addons: [
-    '@storybook/addon-links',
-    '@storybook/addon-essentials',
-    '@storybook/addon-interactions',
-    '@storybook/addon-mdx-gfm'
+    "@storybook/addon-links",
+    "@storybook/addon-essentials",
+    "@storybook/addon-interactions",
+    "@storybook/addon-mdx-gfm",
   ],
   // @ts-expect-error This 'managerEntries' exists.
-  managerEntries: [require.resolve('./addon-gh-repository/manager.tsx')],
+  managerEntries: [require.resolve("./addon-gh-repository/manager.tsx")],
   framework: {
-    name: '@storybook/react-vite',
-    options: {}
+    name: "@storybook/react-vite",
+    options: {},
   },
   core: {
-    disableTelemetry: true
+    disableTelemetry: true,
   },
   features: {
-    storyStoreV7: true
+    storyStoreV7: true,
   },
   docs: {
     autodocs: true,
-    docsMode: true
+    docsMode: true,
   },
   typescript: {
     check: false,
-    reactDocgen: 'react-docgen-typescript',
+    reactDocgen: "react-docgen-typescript",
     reactDocgenTypescriptOptions: {
       propFilter: (prop) => {
-        if (['children', 'className'].includes(prop.name)) {
+        if (["children", "className"].includes(prop.name)) {
           return true
         }
 
         if (prop.parent != null) {
           return (
-            !prop.parent.fileName.includes('@types/react') &&
-            !prop.parent.fileName.includes('@emotion')
+            !prop.parent.fileName.includes("@types/react") &&
+            !prop.parent.fileName.includes("@emotion")
           )
         }
         return true
-      }
-    }
-  }
+      },
+    },
+  },
 }
 
 module.exports = storybookConfig
diff --git a/packages/docs/.storybook/manager.ts b/packages/docs/.storybook/manager.ts
index 0cf7ecaa..4840ed9e 100644
--- a/packages/docs/.storybook/manager.ts
+++ b/packages/docs/.storybook/manager.ts
@@ -1,6 +1,6 @@
-import { addons } from '@storybook/manager-api'
-import commercelayerTheme from './commercelayer.theme'
+import { addons } from "@storybook/manager-api"
+import commercelayerTheme from "./commercelayer.theme"
 
 addons.setConfig({
-  theme: commercelayerTheme
+  theme: commercelayerTheme,
 })
diff --git a/packages/docs/.storybook/preview.tsx b/packages/docs/.storybook/preview.tsx
index a1fc5851..9da8097e 100644
--- a/packages/docs/.storybook/preview.tsx
+++ b/packages/docs/.storybook/preview.tsx
@@ -1,59 +1,52 @@
 // eslint-disable-next-line @typescript-eslint/triple-slash-reference
 /// <reference types="vite/client" />
 
-import type { Parameters, Preview } from '@storybook/react'
-import { worker } from '../mocks/browser'
-import {
-  Controls,
-  Description,
-  Primary,
-  Stories,
-  Subtitle,
-  Title
-} from '@storybook/addon-docs'
+import type { Parameters, Preview } from "@storybook/react"
+import { worker } from "../mocks/browser"
+import { Controls, Description, Primary, Stories, Subtitle, Title } from "@storybook/addon-docs"
 
 const parameters: Parameters = {
-  actions: { argTypesRegex: '^on[A-Z].*' },
-  layout: 'padded',
+  actions: { argTypesRegex: "^on[A-Z].*" },
+  layout: "padded",
   controls: {
     matchers: {
       color: /(background|color)$/i,
-      date: /Date$/
-    }
+      date: /Date$/,
+    },
   },
   options: {
     storySort: {
       order: [
-        'Getting Started',
-        'Components',
+        "Getting Started",
+        "Components",
         [
-          'Skus',
-          ['SkusContainer', 'Skus'],
-          'Prices',
-          ['PricesContainer'],
-          'Availability',
-          ['AvailabilityContainer'],
-          'Orders',
-          ['OrderStorage', 'OrderContainer'],
-          'Cart',
-          ['AddToCartButton', 'HostedCart', 'CartLink', 'MiniCart'],
-          'Customers',
+          "Skus",
+          ["SkusContainer", "Skus"],
+          "Prices",
+          ["PricesContainer"],
+          "Availability",
+          ["AvailabilityContainer"],
+          "Orders",
+          ["OrderStorage", "OrderContainer"],
+          "Cart",
+          ["AddToCartButton", "HostedCart", "CartLink", "MiniCart"],
+          "Customers",
           [
-            'CustomerContainer',
-            'CustomerField',
-            'AddressesContainer',
-            'AddressesEmpty',
-            'Address',
-            'AddressField',
-            'BillingAddressForm',
-            'MyAccountLink'
-          ]
+            "CustomerContainer",
+            "CustomerField",
+            "AddressesContainer",
+            "AddressesEmpty",
+            "Address",
+            "AddressField",
+            "BillingAddressForm",
+            "MyAccountLink",
+          ],
         ],
-        'Examples',
-        ['Listing Page', 'Shopping Cart', 'Checkout Page', 'My Account'],
-        'Hooks'
-      ]
-    }
+        "Examples",
+        ["Listing Page", "Shopping Cart", "Checkout Page", "My Account"],
+        "Hooks",
+      ],
+    },
   },
   docs: {
     page: () => (
@@ -65,49 +58,45 @@ const parameters: Parameters = {
         <Controls />
         <Stories includePrimary={false} />
       </>
-    )
-  }
+    ),
+  },
 }
 
 // Storybook executes this module in both bootstrap phase (Node)
 // and a story's runtime (browser). However, we cannot call `setupWorker`
 // in Node environment, so need to check if we're in a browser.
-if (typeof global.process === 'undefined') {
+if (typeof global.process === "undefined") {
   // Start the mocking when each story is loaded.
   // Repetitive calls to the `.start()` method do not register a new worker,
   // but check whether there's an existing once, reusing it, if so.
   worker.start({
     serviceWorker: {
-      url: `${import.meta.env.BASE_URL}mockServiceWorker.js`
+      url: `${import.meta.env.BASE_URL}mockServiceWorker.js`,
     },
     quiet: import.meta.env.PROD,
     onUnhandledRequest: !import.meta.env.PROD
       ? (req, reqPrint) => {
-          if (req.url.hostname === 'mock.localhost') {
+          if (req.url.hostname === "mock.localhost") {
             reqPrint.warning()
           }
         }
-      : () => {}
+      : () => {},
   })
 }
 
-const argTypesEnhancers: Preview['argTypesEnhancers'] = [
+const argTypesEnhancers: Preview["argTypesEnhancers"] = [
   (context) => {
     // when the className prop comes from `JSX.IntrinsicElements['div' | 'span']`
     // and is not documented, we add a default description
-    if (
-      'className' in context.argTypes &&
-      context.argTypes.className.description === ''
-    ) {
-      context.argTypes.className.description =
-        'CSS class name for the base component'
+    if ("className" in context.argTypes && context.argTypes.className.description === "") {
+      context.argTypes.className.description = "CSS class name for the base component"
     }
 
     return context.argTypes
-  }
+  },
 ]
 
 export default {
   parameters,
-  argTypesEnhancers
+  argTypesEnhancers,
 }
diff --git a/packages/docs/mocks/browser.js b/packages/docs/mocks/browser.js
index c578a6eb..800cbd89 100644
--- a/packages/docs/mocks/browser.js
+++ b/packages/docs/mocks/browser.js
@@ -1,6 +1,6 @@
 // src/mocks/browser.js
-import { setupWorker } from 'msw/browser'
-import { handlers } from './handlers'
+import { setupWorker } from "msw/browser"
+import { handlers } from "./handlers"
 
 // This configures a Service Worker with the given request handlers.
 export const worker = setupWorker(...handlers)
diff --git a/packages/docs/mocks/data/adjustments.js b/packages/docs/mocks/data/adjustments.js
index 72d4a6f1..1d18d331 100644
--- a/packages/docs/mocks/data/adjustments.js
+++ b/packages/docs/mocks/data/adjustments.js
@@ -1,39 +1,36 @@
-import { http } from 'msw'
+import { http } from "msw"
 
-const restPost = http.post(
-  `https://mock.localhost/api/adjustments`,
-  async (req, res, ctx) => {
-    return await new Promise((resolve) => {
-      setTimeout(() => {
-        resolve(
-          res(
-            ctx.status(200),
-            ctx.json({
-              data: {
-                id: 'eqJGhgEeBb',
-                type: 'adjustments',
-                links: {
-                  self: 'https://mock.localhost/api/adjustments/eqJGhgEeBb'
-                },
-                attributes: {
-                  name: 'Manual adjustment',
-                  currency_code: 'EUR',
-                  amount_cents: -100,
-                  amount_float: -1.0,
-                  formatted_amount: '-€1,00',
-                  created_at: '2023-08-23T15:59:30.059Z',
-                  updated_at: '2023-08-23T15:59:30.059Z',
-                  reference: null,
-                  reference_origin: null,
-                  metadata: {}
-                }
-              }
-            })
-          )
+const restPost = http.post(`https://mock.localhost/api/adjustments`, async (req, res, ctx) => {
+  return await new Promise((resolve) => {
+    setTimeout(() => {
+      resolve(
+        res(
+          ctx.status(200),
+          ctx.json({
+            data: {
+              id: "eqJGhgEeBb",
+              type: "adjustments",
+              links: {
+                self: "https://mock.localhost/api/adjustments/eqJGhgEeBb",
+              },
+              attributes: {
+                name: "Manual adjustment",
+                currency_code: "EUR",
+                amount_cents: -100,
+                amount_float: -1.0,
+                formatted_amount: "-€1,00",
+                created_at: "2023-08-23T15:59:30.059Z",
+                updated_at: "2023-08-23T15:59:30.059Z",
+                reference: null,
+                reference_origin: null,
+                metadata: {},
+              },
+            },
+          })
         )
-      }, 1000)
-    })
-  }
-)
+      )
+    }, 1000)
+  })
+})
 
 export default [restPost]
diff --git a/packages/docs/mocks/data/bundles.js b/packages/docs/mocks/data/bundles.js
index 7053b89e..91d76dd2 100644
--- a/packages/docs/mocks/data/bundles.js
+++ b/packages/docs/mocks/data/bundles.js
@@ -1,385 +1,362 @@
-import { http } from 'msw'
+import { http } from "msw"
 
 const bundles = http.get(
-  'https://mock.localhost/api/bundles?include=sku_list.sku_list_items.sku&filter[q][code_in]=WELCOME_KIT_001',
+  "https://mock.localhost/api/bundles?include=sku_list.sku_list_items.sku&filter[q][code_in]=WELCOME_KIT_001",
   (req, res, ctx) => {
     return res(
       ctx.status(200),
       ctx.json({
         data: [
           {
-            id: 'PljQzimxgB',
-            type: 'bundles',
+            id: "PljQzimxgB",
+            type: "bundles",
             links: {
-              self: 'https://mock.localhost/api/bundles/PljQzimxgB'
+              self: "https://mock.localhost/api/bundles/PljQzimxgB",
             },
             attributes: {
-              code: 'SHIRTSETSINGLE',
-              name: 'Commerce Layer Shirt set single',
-              currency_code: 'EUR',
-              description: '',
-              image_url: '',
+              code: "SHIRTSETSINGLE",
+              name: "Commerce Layer Shirt set single",
+              currency_code: "EUR",
+              description: "",
+              image_url: "",
               do_not_ship: false,
               do_not_track: false,
               price_amount_cents: 10500,
               price_amount_float: 105.0,
-              formatted_price_amount: '€105,00',
+              formatted_price_amount: "€105,00",
               compare_at_amount_cents: 10500,
               compare_at_amount_float: 105.0,
-              formatted_compare_at_amount: '€105,00',
+              formatted_compare_at_amount: "€105,00",
               skus_count: 2,
-              created_at: '2022-03-11T10:20:48.680Z',
-              updated_at: '2022-03-11T10:20:48.680Z',
-              reference: '',
-              reference_origin: '',
-              metadata: {}
+              created_at: "2022-03-11T10:20:48.680Z",
+              updated_at: "2022-03-11T10:20:48.680Z",
+              reference: "",
+              reference_origin: "",
+              metadata: {},
             },
             relationships: {
               market: {
                 links: {
-                  self: 'https://mock.localhost/api/bundles/PljQzimxgB/relationships/market',
-                  related:
-                    'https://mock.localhost/api/bundles/PljQzimxgB/market'
-                }
+                  self: "https://mock.localhost/api/bundles/PljQzimxgB/relationships/market",
+                  related: "https://mock.localhost/api/bundles/PljQzimxgB/market",
+                },
               },
               sku_list: {
                 links: {
-                  self: 'https://mock.localhost/api/bundles/PljQzimxgB/relationships/sku_list',
-                  related:
-                    'https://mock.localhost/api/bundles/PljQzimxgB/sku_list'
+                  self: "https://mock.localhost/api/bundles/PljQzimxgB/relationships/sku_list",
+                  related: "https://mock.localhost/api/bundles/PljQzimxgB/sku_list",
                 },
-                data: { type: 'sku_lists', id: 'myPrZIqano' }
+                data: { type: "sku_lists", id: "myPrZIqano" },
               },
               skus: {
                 links: {
-                  self: 'https://mock.localhost/api/bundles/PljQzimxgB/relationships/skus',
-                  related: 'https://mock.localhost/api/bundles/PljQzimxgB/skus'
-                }
+                  self: "https://mock.localhost/api/bundles/PljQzimxgB/relationships/skus",
+                  related: "https://mock.localhost/api/bundles/PljQzimxgB/skus",
+                },
               },
               attachments: {
                 links: {
-                  self: 'https://mock.localhost/api/bundles/PljQzimxgB/relationships/attachments',
-                  related:
-                    'https://mock.localhost/api/bundles/PljQzimxgB/attachments'
-                }
+                  self: "https://mock.localhost/api/bundles/PljQzimxgB/relationships/attachments",
+                  related: "https://mock.localhost/api/bundles/PljQzimxgB/attachments",
+                },
               },
               events: {
                 links: {
-                  self: 'https://mock.localhost/api/bundles/PljQzimxgB/relationships/events',
-                  related:
-                    'https://mock.localhost/api/bundles/PljQzimxgB/events'
-                }
+                  self: "https://mock.localhost/api/bundles/PljQzimxgB/relationships/events",
+                  related: "https://mock.localhost/api/bundles/PljQzimxgB/events",
+                },
               },
               tags: {
                 links: {
-                  self: 'https://mock.localhost/api/bundles/PljQzimxgB/relationships/tags',
-                  related: 'https://mock.localhost/api/bundles/PljQzimxgB/tags'
-                }
-              }
+                  self: "https://mock.localhost/api/bundles/PljQzimxgB/relationships/tags",
+                  related: "https://mock.localhost/api/bundles/PljQzimxgB/tags",
+                },
+              },
             },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
-          }
+            meta: { mode: "test", organization_id: "WXlEOFrjnr" },
+          },
         ],
         included: [
           {
-            id: 'myPrZIqano',
-            type: 'sku_lists',
+            id: "myPrZIqano",
+            type: "sku_lists",
             links: {
-              self: 'https://mock.localhost/api/sku_lists/myPrZIqano'
+              self: "https://mock.localhost/api/sku_lists/myPrZIqano",
             },
             attributes: {
-              name: 'CL SHIRTS (Single shipment)',
-              slug: 'cl-shirts-single-shipment',
-              description: '',
-              image_url: '',
+              name: "CL SHIRTS (Single shipment)",
+              slug: "cl-shirts-single-shipment",
+              description: "",
+              image_url: "",
               manual: true,
               sku_code_regex: null,
-              created_at: '2022-03-11T10:17:50.637Z',
-              updated_at: '2022-03-11T10:18:03.442Z',
+              created_at: "2022-03-11T10:17:50.637Z",
+              updated_at: "2022-03-11T10:18:03.442Z",
               reference: null,
               reference_origin: null,
-              metadata: {}
+              metadata: {},
             },
             relationships: {
               customer: {
                 links: {
-                  self: 'https://mock.localhost/api/sku_lists/myPrZIqano/relationships/customer',
-                  related:
-                    'https://mock.localhost/api/sku_lists/myPrZIqano/customer'
-                }
+                  self: "https://mock.localhost/api/sku_lists/myPrZIqano/relationships/customer",
+                  related: "https://mock.localhost/api/sku_lists/myPrZIqano/customer",
+                },
               },
               skus: {
                 links: {
-                  self: 'https://mock.localhost/api/sku_lists/myPrZIqano/relationships/skus',
-                  related:
-                    'https://mock.localhost/api/sku_lists/myPrZIqano/skus'
-                }
+                  self: "https://mock.localhost/api/sku_lists/myPrZIqano/relationships/skus",
+                  related: "https://mock.localhost/api/sku_lists/myPrZIqano/skus",
+                },
               },
               sku_list_items: {
                 links: {
-                  self: 'https://mock.localhost/api/sku_lists/myPrZIqano/relationships/sku_list_items',
-                  related:
-                    'https://mock.localhost/api/sku_lists/myPrZIqano/sku_list_items'
+                  self: "https://mock.localhost/api/sku_lists/myPrZIqano/relationships/sku_list_items",
+                  related: "https://mock.localhost/api/sku_lists/myPrZIqano/sku_list_items",
                 },
                 data: [
-                  { type: 'sku_list_items', id: 'LWKOPINkWM' },
-                  { type: 'sku_list_items', id: 'vWbjGINmWn' }
-                ]
+                  { type: "sku_list_items", id: "LWKOPINkWM" },
+                  { type: "sku_list_items", id: "vWbjGINmWn" },
+                ],
               },
               bundles: {
                 links: {
-                  self: 'https://mock.localhost/api/sku_lists/myPrZIqano/relationships/bundles',
-                  related:
-                    'https://mock.localhost/api/sku_lists/myPrZIqano/bundles'
-                }
+                  self: "https://mock.localhost/api/sku_lists/myPrZIqano/relationships/bundles",
+                  related: "https://mock.localhost/api/sku_lists/myPrZIqano/bundles",
+                },
               },
               attachments: {
                 links: {
-                  self: 'https://mock.localhost/api/sku_lists/myPrZIqano/relationships/attachments',
-                  related:
-                    'https://mock.localhost/api/sku_lists/myPrZIqano/attachments'
-                }
-              }
+                  self: "https://mock.localhost/api/sku_lists/myPrZIqano/relationships/attachments",
+                  related: "https://mock.localhost/api/sku_lists/myPrZIqano/attachments",
+                },
+              },
             },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+            meta: { mode: "test", organization_id: "WXlEOFrjnr" },
           },
           {
-            id: 'LWKOPINkWM',
-            type: 'sku_list_items',
+            id: "LWKOPINkWM",
+            type: "sku_list_items",
             links: {
-              self: 'https://mock.localhost/api/sku_list_items/LWKOPINkWM'
+              self: "https://mock.localhost/api/sku_list_items/LWKOPINkWM",
             },
             attributes: {
               position: 1,
-              sku_code: 'TSHIRTMS000000FFFFFFLXXX',
+              sku_code: "TSHIRTMS000000FFFFFFLXXX",
               quantity: 1,
-              created_at: '2022-03-11T10:17:59.154Z',
-              updated_at: '2022-03-11T10:17:59.154Z',
+              created_at: "2022-03-11T10:17:59.154Z",
+              updated_at: "2022-03-11T10:17:59.154Z",
               reference: null,
               reference_origin: null,
-              metadata: {}
+              metadata: {},
             },
             relationships: {
               sku_list: {
                 links: {
-                  self: 'https://mock.localhost/api/sku_list_items/LWKOPINkWM/relationships/sku_list',
-                  related:
-                    'https://mock.localhost/api/sku_list_items/LWKOPINkWM/sku_list'
-                }
+                  self: "https://mock.localhost/api/sku_list_items/LWKOPINkWM/relationships/sku_list",
+                  related: "https://mock.localhost/api/sku_list_items/LWKOPINkWM/sku_list",
+                },
               },
               sku: {
                 links: {
-                  self: 'https://mock.localhost/api/sku_list_items/LWKOPINkWM/relationships/sku',
-                  related:
-                    'https://mock.localhost/api/sku_list_items/LWKOPINkWM/sku'
+                  self: "https://mock.localhost/api/sku_list_items/LWKOPINkWM/relationships/sku",
+                  related: "https://mock.localhost/api/sku_list_items/LWKOPINkWM/sku",
                 },
-                data: { type: 'skus', id: 'EWzPQSpRzn' }
-              }
+                data: { type: "skus", id: "EWzPQSpRzn" },
+              },
             },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+            meta: { mode: "test", organization_id: "WXlEOFrjnr" },
           },
           {
-            id: 'vWbjGINmWn',
-            type: 'sku_list_items',
+            id: "vWbjGINmWn",
+            type: "sku_list_items",
             links: {
-              self: 'https://mock.localhost/api/sku_list_items/vWbjGINmWn'
+              self: "https://mock.localhost/api/sku_list_items/vWbjGINmWn",
             },
             attributes: {
               position: 2,
-              sku_code: 'SWEETHMUB7B7B7000000MXXX',
+              sku_code: "SWEETHMUB7B7B7000000MXXX",
               quantity: 1,
-              created_at: '2022-03-11T10:18:03.437Z',
-              updated_at: '2022-03-11T10:18:03.437Z',
+              created_at: "2022-03-11T10:18:03.437Z",
+              updated_at: "2022-03-11T10:18:03.437Z",
               reference: null,
               reference_origin: null,
-              metadata: {}
+              metadata: {},
             },
             relationships: {
               sku_list: {
                 links: {
-                  self: 'https://mock.localhost/api/sku_list_items/vWbjGINmWn/relationships/sku_list',
-                  related:
-                    'https://mock.localhost/api/sku_list_items/vWbjGINmWn/sku_list'
-                }
+                  self: "https://mock.localhost/api/sku_list_items/vWbjGINmWn/relationships/sku_list",
+                  related: "https://mock.localhost/api/sku_list_items/vWbjGINmWn/sku_list",
+                },
               },
               sku: {
                 links: {
-                  self: 'https://mock.localhost/api/sku_list_items/vWbjGINmWn/relationships/sku',
-                  related:
-                    'https://mock.localhost/api/sku_list_items/vWbjGINmWn/sku'
+                  self: "https://mock.localhost/api/sku_list_items/vWbjGINmWn/relationships/sku",
+                  related: "https://mock.localhost/api/sku_list_items/vWbjGINmWn/sku",
                 },
-                data: { type: 'skus', id: 'MBrxeSaGpZ' }
-              }
+                data: { type: "skus", id: "MBrxeSaGpZ" },
+              },
             },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+            meta: { mode: "test", organization_id: "WXlEOFrjnr" },
           },
           {
-            id: 'EWzPQSpRzn',
-            type: 'skus',
+            id: "EWzPQSpRzn",
+            type: "skus",
             links: {
-              self: 'https://mock.localhost/api/skus/EWzPQSpRzn'
+              self: "https://mock.localhost/api/skus/EWzPQSpRzn",
             },
             attributes: {
-              code: 'TSHIRTMS000000FFFFFFLXXX',
-              name: 'Black Men T-Shirt with White Logo (L)',
+              code: "TSHIRTMS000000FFFFFFLXXX",
+              name: "Black Men T-Shirt with White Logo (L)",
               description:
-                'With a large front pouch pocket and drawstrings in a matching color, this hoodie is a sure crowd-favorite. It’s soft, stylish, and perfect for the cooler evenings.',
+                "With a large front pouch pocket and drawstrings in a matching color, this hoodie is a sure crowd-favorite. It’s soft, stylish, and perfect for the cooler evenings.",
               image_url:
-                'https://data.commercelayer.app/seed/images/skus/TSHIRTMS000000FFFFFFLXXX_FLAT.png',
+                "https://data.commercelayer.app/seed/images/skus/TSHIRTMS000000FFFFFFLXXX_FLAT.png",
               pieces_per_pack: null,
               weight: null,
-              unit_of_weight: '',
-              hs_tariff_number: '',
+              unit_of_weight: "",
+              hs_tariff_number: "",
               do_not_ship: false,
               do_not_track: false,
               inventory: null,
-              created_at: '2022-03-11T09:42:47.300Z',
-              updated_at: '2022-03-11T10:17:22.143Z',
-              reference: 'sku_69',
-              reference_origin: 'CLI',
-              metadata: {}
+              created_at: "2022-03-11T09:42:47.300Z",
+              updated_at: "2022-03-11T10:17:22.143Z",
+              reference: "sku_69",
+              reference_origin: "CLI",
+              metadata: {},
             },
             relationships: {
               shipping_category: {
                 links: {
-                  self: 'https://mock.localhost/api/skus/EWzPQSpRzn/relationships/shipping_category',
-                  related:
-                    'https://mock.localhost/api/skus/EWzPQSpRzn/shipping_category'
-                }
+                  self: "https://mock.localhost/api/skus/EWzPQSpRzn/relationships/shipping_category",
+                  related: "https://mock.localhost/api/skus/EWzPQSpRzn/shipping_category",
+                },
               },
               prices: {
                 links: {
-                  self: 'https://mock.localhost/api/skus/EWzPQSpRzn/relationships/prices',
-                  related: 'https://mock.localhost/api/skus/EWzPQSpRzn/prices'
-                }
+                  self: "https://mock.localhost/api/skus/EWzPQSpRzn/relationships/prices",
+                  related: "https://mock.localhost/api/skus/EWzPQSpRzn/prices",
+                },
               },
               stock_items: {
                 links: {
-                  self: 'https://mock.localhost/api/skus/EWzPQSpRzn/relationships/stock_items',
-                  related:
-                    'https://mock.localhost/api/skus/EWzPQSpRzn/stock_items'
-                }
+                  self: "https://mock.localhost/api/skus/EWzPQSpRzn/relationships/stock_items",
+                  related: "https://mock.localhost/api/skus/EWzPQSpRzn/stock_items",
+                },
               },
               delivery_lead_times: {
                 links: {
-                  self: 'https://mock.localhost/api/skus/EWzPQSpRzn/relationships/delivery_lead_times',
-                  related:
-                    'https://mock.localhost/api/skus/EWzPQSpRzn/delivery_lead_times'
-                }
+                  self: "https://mock.localhost/api/skus/EWzPQSpRzn/relationships/delivery_lead_times",
+                  related: "https://mock.localhost/api/skus/EWzPQSpRzn/delivery_lead_times",
+                },
               },
               sku_options: {
                 links: {
-                  self: 'https://mock.localhost/api/skus/EWzPQSpRzn/relationships/sku_options',
-                  related:
-                    'https://mock.localhost/api/skus/EWzPQSpRzn/sku_options'
-                }
+                  self: "https://mock.localhost/api/skus/EWzPQSpRzn/relationships/sku_options",
+                  related: "https://mock.localhost/api/skus/EWzPQSpRzn/sku_options",
+                },
               },
               attachments: {
                 links: {
-                  self: 'https://mock.localhost/api/skus/EWzPQSpRzn/relationships/attachments',
-                  related:
-                    'https://mock.localhost/api/skus/EWzPQSpRzn/attachments'
-                }
+                  self: "https://mock.localhost/api/skus/EWzPQSpRzn/relationships/attachments",
+                  related: "https://mock.localhost/api/skus/EWzPQSpRzn/attachments",
+                },
               },
               events: {
                 links: {
-                  self: 'https://mock.localhost/api/skus/EWzPQSpRzn/relationships/events',
-                  related: 'https://mock.localhost/api/skus/EWzPQSpRzn/events'
-                }
+                  self: "https://mock.localhost/api/skus/EWzPQSpRzn/relationships/events",
+                  related: "https://mock.localhost/api/skus/EWzPQSpRzn/events",
+                },
               },
               tags: {
                 links: {
-                  self: 'https://mock.localhost/api/skus/EWzPQSpRzn/relationships/tags',
-                  related: 'https://mock.localhost/api/skus/EWzPQSpRzn/tags'
-                }
-              }
+                  self: "https://mock.localhost/api/skus/EWzPQSpRzn/relationships/tags",
+                  related: "https://mock.localhost/api/skus/EWzPQSpRzn/tags",
+                },
+              },
             },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+            meta: { mode: "test", organization_id: "WXlEOFrjnr" },
           },
           {
-            id: 'MBrxeSaGpZ',
-            type: 'skus',
+            id: "MBrxeSaGpZ",
+            type: "skus",
             links: {
-              self: 'https://mock.localhost/api/skus/MBrxeSaGpZ'
+              self: "https://mock.localhost/api/skus/MBrxeSaGpZ",
             },
             attributes: {
-              code: 'SWEETHMUB7B7B7000000MXXX',
-              name: 'Sport Grey Unisex Hoodie Sweatshirt with Black Logo (M)',
+              code: "SWEETHMUB7B7B7000000MXXX",
+              name: "Sport Grey Unisex Hoodie Sweatshirt with Black Logo (M)",
               description:
-                'With a large front pouch pocket and drawstrings in a matching color, this hoodie is a sure crowd-favorite. It’s soft, stylish, and perfect for the cooler evenings.',
+                "With a large front pouch pocket and drawstrings in a matching color, this hoodie is a sure crowd-favorite. It’s soft, stylish, and perfect for the cooler evenings.",
               image_url:
-                'https://data.commercelayer.app/seed/images/skus/HOODIEMX7F7F7F000000MXXX_FLAT.png',
+                "https://data.commercelayer.app/seed/images/skus/HOODIEMX7F7F7F000000MXXX_FLAT.png",
               pieces_per_pack: null,
               weight: null,
-              unit_of_weight: '',
-              hs_tariff_number: '',
+              unit_of_weight: "",
+              hs_tariff_number: "",
               do_not_ship: false,
               do_not_track: false,
               inventory: null,
-              created_at: '2022-03-11T09:42:48.985Z',
-              updated_at: '2022-03-11T10:17:41.219Z',
-              reference: 'sku_70',
-              reference_origin: 'CLI',
-              metadata: {}
+              created_at: "2022-03-11T09:42:48.985Z",
+              updated_at: "2022-03-11T10:17:41.219Z",
+              reference: "sku_70",
+              reference_origin: "CLI",
+              metadata: {},
             },
             relationships: {
               shipping_category: {
                 links: {
-                  self: 'https://mock.localhost/api/skus/MBrxeSaGpZ/relationships/shipping_category',
-                  related:
-                    'https://mock.localhost/api/skus/MBrxeSaGpZ/shipping_category'
-                }
+                  self: "https://mock.localhost/api/skus/MBrxeSaGpZ/relationships/shipping_category",
+                  related: "https://mock.localhost/api/skus/MBrxeSaGpZ/shipping_category",
+                },
               },
               prices: {
                 links: {
-                  self: 'https://mock.localhost/api/skus/MBrxeSaGpZ/relationships/prices',
-                  related: 'https://mock.localhost/api/skus/MBrxeSaGpZ/prices'
-                }
+                  self: "https://mock.localhost/api/skus/MBrxeSaGpZ/relationships/prices",
+                  related: "https://mock.localhost/api/skus/MBrxeSaGpZ/prices",
+                },
               },
               stock_items: {
                 links: {
-                  self: 'https://mock.localhost/api/skus/MBrxeSaGpZ/relationships/stock_items',
-                  related:
-                    'https://mock.localhost/api/skus/MBrxeSaGpZ/stock_items'
-                }
+                  self: "https://mock.localhost/api/skus/MBrxeSaGpZ/relationships/stock_items",
+                  related: "https://mock.localhost/api/skus/MBrxeSaGpZ/stock_items",
+                },
               },
               delivery_lead_times: {
                 links: {
-                  self: 'https://mock.localhost/api/skus/MBrxeSaGpZ/relationships/delivery_lead_times',
-                  related:
-                    'https://mock.localhost/api/skus/MBrxeSaGpZ/delivery_lead_times'
-                }
+                  self: "https://mock.localhost/api/skus/MBrxeSaGpZ/relationships/delivery_lead_times",
+                  related: "https://mock.localhost/api/skus/MBrxeSaGpZ/delivery_lead_times",
+                },
               },
               sku_options: {
                 links: {
-                  self: 'https://mock.localhost/api/skus/MBrxeSaGpZ/relationships/sku_options',
-                  related:
-                    'https://mock.localhost/api/skus/MBrxeSaGpZ/sku_options'
-                }
+                  self: "https://mock.localhost/api/skus/MBrxeSaGpZ/relationships/sku_options",
+                  related: "https://mock.localhost/api/skus/MBrxeSaGpZ/sku_options",
+                },
               },
               attachments: {
                 links: {
-                  self: 'https://mock.localhost/api/skus/MBrxeSaGpZ/relationships/attachments',
-                  related:
-                    'https://mock.localhost/api/skus/MBrxeSaGpZ/attachments'
-                }
+                  self: "https://mock.localhost/api/skus/MBrxeSaGpZ/relationships/attachments",
+                  related: "https://mock.localhost/api/skus/MBrxeSaGpZ/attachments",
+                },
               },
               events: {
                 links: {
-                  self: 'https://mock.localhost/api/skus/MBrxeSaGpZ/relationships/events',
-                  related: 'https://mock.localhost/api/skus/MBrxeSaGpZ/events'
-                }
+                  self: "https://mock.localhost/api/skus/MBrxeSaGpZ/relationships/events",
+                  related: "https://mock.localhost/api/skus/MBrxeSaGpZ/events",
+                },
               },
               tags: {
                 links: {
-                  self: 'https://mock.localhost/api/skus/MBrxeSaGpZ/relationships/tags',
-                  related: 'https://mock.localhost/api/skus/MBrxeSaGpZ/tags'
-                }
-              }
+                  self: "https://mock.localhost/api/skus/MBrxeSaGpZ/relationships/tags",
+                  related: "https://mock.localhost/api/skus/MBrxeSaGpZ/tags",
+                },
+              },
             },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
-          }
-        ]
+            meta: { mode: "test", organization_id: "WXlEOFrjnr" },
+          },
+        ],
       })
     )
   }
diff --git a/packages/docs/mocks/data/line_items.js b/packages/docs/mocks/data/line_items.js
index 95139b05..17045580 100644
--- a/packages/docs/mocks/data/line_items.js
+++ b/packages/docs/mocks/data/line_items.js
@@ -1,15 +1,12 @@
-import { http } from 'msw'
+import { http } from "msw"
 
-const restPatch = http.patch(
-  `https://mock.localhost/api/line_items/:id`,
-  async (req, res, ctx) => {
-    return await new Promise((resolve) => {
-      setTimeout(() => {
-        resolve(res(ctx.status(200), ctx.body(`Update ${req.params.id}`)))
-      }, 1000)
-    })
-  }
-)
+const restPatch = http.patch(`https://mock.localhost/api/line_items/:id`, async (req, res, ctx) => {
+  return await new Promise((resolve) => {
+    setTimeout(() => {
+      resolve(res(ctx.status(200), ctx.body(`Update ${req.params.id}`)))
+    }, 1000)
+  })
+})
 
 const restDelete = http.delete(
   `https://mock.localhost/api/line_items/:id`,
@@ -22,61 +19,58 @@ const restDelete = http.delete(
   }
 )
 
-const restPost = http.post(
-  `https://mock.localhost/api/line_items`,
-  async (req, res, ctx) => {
-    return await new Promise((resolve) => {
-      setTimeout(() => {
-        resolve(
-          res(
-            ctx.status(200),
-            ctx.json({
-              data: {
-                id: 'vrEAtOmRaz',
-                type: 'line_items',
-                links: {
-                  self: 'https://mock.localhost/api/line_items/vrEAtOmRaz'
-                },
-                attributes: {
-                  sku_code: null,
-                  bundle_code: null,
-                  quantity: 1,
-                  currency_code: 'EUR',
-                  unit_amount_cents: -100,
-                  unit_amount_float: -1.0,
-                  formatted_unit_amount: '-€1,00',
-                  options_amount_cents: 0,
-                  options_amount_float: 0.0,
-                  formatted_options_amount: '€0,00',
-                  discount_cents: 0,
-                  discount_float: 0.0,
-                  formatted_discount: '€0,00',
-                  total_amount_cents: -100,
-                  total_amount_float: -1.0,
-                  formatted_total_amount: '-€1,00',
-                  tax_amount_cents: 0,
-                  tax_amount_float: 0.0,
-                  formatted_tax_amount: '€0,00',
-                  name: 'Manual adjustment',
-                  image_url: null,
-                  discount_breakdown: {},
-                  tax_rate: 0.0,
-                  tax_breakdown: {},
-                  item_type: 'adjustments',
-                  frequency: null,
-                  created_at: '2023-08-23T15:59:30.205Z',
-                  updated_at: '2023-08-23T15:59:30.205Z',
-                  reference: null,
-                  reference_origin: null,
-                  metadata: {}
-                }
-              }
-            })
-          )
+const restPost = http.post(`https://mock.localhost/api/line_items`, async (req, res, ctx) => {
+  return await new Promise((resolve) => {
+    setTimeout(() => {
+      resolve(
+        res(
+          ctx.status(200),
+          ctx.json({
+            data: {
+              id: "vrEAtOmRaz",
+              type: "line_items",
+              links: {
+                self: "https://mock.localhost/api/line_items/vrEAtOmRaz",
+              },
+              attributes: {
+                sku_code: null,
+                bundle_code: null,
+                quantity: 1,
+                currency_code: "EUR",
+                unit_amount_cents: -100,
+                unit_amount_float: -1.0,
+                formatted_unit_amount: "-€1,00",
+                options_amount_cents: 0,
+                options_amount_float: 0.0,
+                formatted_options_amount: "€0,00",
+                discount_cents: 0,
+                discount_float: 0.0,
+                formatted_discount: "€0,00",
+                total_amount_cents: -100,
+                total_amount_float: -1.0,
+                formatted_total_amount: "-€1,00",
+                tax_amount_cents: 0,
+                tax_amount_float: 0.0,
+                formatted_tax_amount: "€0,00",
+                name: "Manual adjustment",
+                image_url: null,
+                discount_breakdown: {},
+                tax_rate: 0.0,
+                tax_breakdown: {},
+                item_type: "adjustments",
+                frequency: null,
+                created_at: "2023-08-23T15:59:30.205Z",
+                updated_at: "2023-08-23T15:59:30.205Z",
+                reference: null,
+                reference_origin: null,
+                metadata: {},
+              },
+            },
+          })
         )
-      }, 1000)
-    })
-  }
-)
+      )
+    }, 1000)
+  })
+})
 
 export default [restPatch, restDelete, restPost]
diff --git a/packages/docs/mocks/data/markets.js b/packages/docs/mocks/data/markets.js
index b5db10ae..9d8a0cdb 100644
--- a/packages/docs/mocks/data/markets.js
+++ b/packages/docs/mocks/data/markets.js
@@ -1,48 +1,48 @@
-import { http } from 'msw'
+import { http } from "msw"
 
 // used in HookedInputResourceGroup
 const someMarkets = http.get(
-  'https://mock.localhost/api/markets?fields[markets]=id,name&sort=name&page[size]=3',
+  "https://mock.localhost/api/markets?fields[markets]=id,name&sort=name&page[size]=3",
   (req, res, ctx) => {
     return res(
       ctx.status(200),
       ctx.json({
         data: [
           {
-            id: 'rlEPzheRgO',
-            type: 'markets',
+            id: "rlEPzheRgO",
+            type: "markets",
             links: {
-              self: 'https://mock.localhost/api/markets/rlEPzheRgO'
+              self: "https://mock.localhost/api/markets/rlEPzheRgO",
             },
-            attributes: { name: 'Adyen' },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+            attributes: { name: "Adyen" },
+            meta: { mode: "test", organization_id: "WXlEOFrjnr" },
           },
           {
-            id: 'dlQbPhNNop',
-            type: 'markets',
+            id: "dlQbPhNNop",
+            type: "markets",
             links: {
-              self: 'https://mock.localhost/api/markets/dlQbPhNNop'
+              self: "https://mock.localhost/api/markets/dlQbPhNNop",
             },
-            attributes: { name: 'Europe' },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+            attributes: { name: "Europe" },
+            meta: { mode: "test", organization_id: "WXlEOFrjnr" },
           },
           {
-            id: 'AlRevhXQga',
-            type: 'markets',
+            id: "AlRevhXQga",
+            type: "markets",
             links: {
-              self: 'https://mock.localhost/api/markets/AlRevhXQga'
+              self: "https://mock.localhost/api/markets/AlRevhXQga",
             },
-            attributes: { name: 'Milan' },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
-          }
+            attributes: { name: "Milan" },
+            meta: { mode: "test", organization_id: "WXlEOFrjnr" },
+          },
         ],
         meta: { record_count: 5, page_count: 2 },
         links: {
           first:
-            'https://mock.localhost/api/markets?fields%5Bmarkets%5D=id%2Cname&page%5Bnumber%5D=1&page%5Bsize%5D=3&sort=name',
-          next: 'https://mock.localhost/api/markets?fields%5Bmarkets%5D=id%2Cname&page%5Bnumber%5D=2&page%5Bsize%5D=3&sort=name',
-          last: 'https://mock.localhost/api/markets?fields%5Bmarkets%5D=id%2Cname&page%5Bnumber%5D=2&page%5Bsize%5D=3&sort=name'
-        }
+            "https://mock.localhost/api/markets?fields%5Bmarkets%5D=id%2Cname&page%5Bnumber%5D=1&page%5Bsize%5D=3&sort=name",
+          next: "https://mock.localhost/api/markets?fields%5Bmarkets%5D=id%2Cname&page%5Bnumber%5D=2&page%5Bsize%5D=3&sort=name",
+          last: "https://mock.localhost/api/markets?fields%5Bmarkets%5D=id%2Cname&page%5Bnumber%5D=2&page%5Bsize%5D=3&sort=name",
+        },
       })
     )
   }
@@ -50,395 +50,359 @@ const someMarkets = http.get(
 
 // used in HookedInputResourceGroup
 const allMarkets = http.get(
-  'https://mock.localhost/api/markets?sort=name&page[number]=1&page[size]=25',
+  "https://mock.localhost/api/markets?sort=name&page[number]=1&page[size]=25",
   (req, res, ctx) => {
     return res(
       ctx.status(200),
       ctx.json({
         data: [
           {
-            id: 'rlEPzheRgO',
-            type: 'markets',
+            id: "rlEPzheRgO",
+            type: "markets",
             links: {
-              self: 'https://mock.localhost/api/markets/rlEPzheRgO'
+              self: "https://mock.localhost/api/markets/rlEPzheRgO",
             },
             attributes: {
               number: 475,
-              name: 'Adyen',
+              name: "Adyen",
               facebook_pixel_id: null,
-              checkout_url: '',
-              external_prices_url: '',
+              checkout_url: "",
+              external_prices_url: "",
               external_order_validation_url: null,
-              shared_secret: '5a4c961792866897db26dd3aad9c435e',
+              shared_secret: "5a4c961792866897db26dd3aad9c435e",
               private: false,
               disabled_at: null,
-              created_at: '2022-08-23T09:59:25.940Z',
-              updated_at: '2022-08-23T09:59:25.940Z',
-              reference: '',
-              reference_origin: '',
-              metadata: {}
+              created_at: "2022-08-23T09:59:25.940Z",
+              updated_at: "2022-08-23T09:59:25.940Z",
+              reference: "",
+              reference_origin: "",
+              metadata: {},
             },
             relationships: {
               merchant: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/rlEPzheRgO/relationships/merchant',
-                  related:
-                    'https://mock.localhost/api/markets/rlEPzheRgO/merchant'
-                }
+                  self: "https://mock.localhost/api/markets/rlEPzheRgO/relationships/merchant",
+                  related: "https://mock.localhost/api/markets/rlEPzheRgO/merchant",
+                },
               },
               price_list: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/rlEPzheRgO/relationships/price_list',
-                  related:
-                    'https://mock.localhost/api/markets/rlEPzheRgO/price_list'
-                }
+                  self: "https://mock.localhost/api/markets/rlEPzheRgO/relationships/price_list",
+                  related: "https://mock.localhost/api/markets/rlEPzheRgO/price_list",
+                },
               },
               inventory_model: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/rlEPzheRgO/relationships/inventory_model',
-                  related:
-                    'https://mock.localhost/api/markets/rlEPzheRgO/inventory_model'
-                }
+                  self: "https://mock.localhost/api/markets/rlEPzheRgO/relationships/inventory_model",
+                  related: "https://mock.localhost/api/markets/rlEPzheRgO/inventory_model",
+                },
               },
               subscription_model: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/rlEPzheRgO/relationships/subscription_model',
-                  related:
-                    'https://mock.localhost/api/markets/rlEPzheRgO/subscription_model'
-                }
+                  self: "https://mock.localhost/api/markets/rlEPzheRgO/relationships/subscription_model",
+                  related: "https://mock.localhost/api/markets/rlEPzheRgO/subscription_model",
+                },
               },
               tax_calculator: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/rlEPzheRgO/relationships/tax_calculator',
-                  related:
-                    'https://mock.localhost/api/markets/rlEPzheRgO/tax_calculator'
-                }
+                  self: "https://mock.localhost/api/markets/rlEPzheRgO/relationships/tax_calculator",
+                  related: "https://mock.localhost/api/markets/rlEPzheRgO/tax_calculator",
+                },
               },
               customer_group: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/rlEPzheRgO/relationships/customer_group',
-                  related:
-                    'https://mock.localhost/api/markets/rlEPzheRgO/customer_group'
-                }
+                  self: "https://mock.localhost/api/markets/rlEPzheRgO/relationships/customer_group",
+                  related: "https://mock.localhost/api/markets/rlEPzheRgO/customer_group",
+                },
               },
               attachments: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/rlEPzheRgO/relationships/attachments',
-                  related:
-                    'https://mock.localhost/api/markets/rlEPzheRgO/attachments'
-                }
-              }
+                  self: "https://mock.localhost/api/markets/rlEPzheRgO/relationships/attachments",
+                  related: "https://mock.localhost/api/markets/rlEPzheRgO/attachments",
+                },
+              },
             },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+            meta: { mode: "test", organization_id: "WXlEOFrjnr" },
           },
           {
-            id: 'dlQbPhNNop',
-            type: 'markets',
+            id: "dlQbPhNNop",
+            type: "markets",
             links: {
-              self: 'https://mock.localhost/api/markets/dlQbPhNNop'
+              self: "https://mock.localhost/api/markets/dlQbPhNNop",
             },
             attributes: {
               number: 350,
-              name: 'Europe',
+              name: "Europe",
               facebook_pixel_id: null,
-              checkout_url: '',
-              external_prices_url:
-                'https://pippo.malessani.commercelayer.dev/api/verify',
-              external_order_validation_url: '',
-              shared_secret: '4ea4390961025de791d5bb92e92744eb',
+              checkout_url: "",
+              external_prices_url: "https://pippo.malessani.commercelayer.dev/api/verify",
+              external_order_validation_url: "",
+              shared_secret: "4ea4390961025de791d5bb92e92744eb",
               private: false,
               disabled_at: null,
-              created_at: '2022-03-11T09:40:49.000Z',
-              updated_at: '2023-03-13T13:30:32.184Z',
-              reference: 'market_1',
-              reference_origin: 'CLI',
-              metadata: {}
+              created_at: "2022-03-11T09:40:49.000Z",
+              updated_at: "2023-03-13T13:30:32.184Z",
+              reference: "market_1",
+              reference_origin: "CLI",
+              metadata: {},
             },
             relationships: {
               merchant: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/dlQbPhNNop/relationships/merchant',
-                  related:
-                    'https://mock.localhost/api/markets/dlQbPhNNop/merchant'
-                }
+                  self: "https://mock.localhost/api/markets/dlQbPhNNop/relationships/merchant",
+                  related: "https://mock.localhost/api/markets/dlQbPhNNop/merchant",
+                },
               },
               price_list: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/dlQbPhNNop/relationships/price_list',
-                  related:
-                    'https://mock.localhost/api/markets/dlQbPhNNop/price_list'
-                }
+                  self: "https://mock.localhost/api/markets/dlQbPhNNop/relationships/price_list",
+                  related: "https://mock.localhost/api/markets/dlQbPhNNop/price_list",
+                },
               },
               inventory_model: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/dlQbPhNNop/relationships/inventory_model',
-                  related:
-                    'https://mock.localhost/api/markets/dlQbPhNNop/inventory_model'
-                }
+                  self: "https://mock.localhost/api/markets/dlQbPhNNop/relationships/inventory_model",
+                  related: "https://mock.localhost/api/markets/dlQbPhNNop/inventory_model",
+                },
               },
               subscription_model: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/dlQbPhNNop/relationships/subscription_model',
-                  related:
-                    'https://mock.localhost/api/markets/dlQbPhNNop/subscription_model'
-                }
+                  self: "https://mock.localhost/api/markets/dlQbPhNNop/relationships/subscription_model",
+                  related: "https://mock.localhost/api/markets/dlQbPhNNop/subscription_model",
+                },
               },
               tax_calculator: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/dlQbPhNNop/relationships/tax_calculator',
-                  related:
-                    'https://mock.localhost/api/markets/dlQbPhNNop/tax_calculator'
-                }
+                  self: "https://mock.localhost/api/markets/dlQbPhNNop/relationships/tax_calculator",
+                  related: "https://mock.localhost/api/markets/dlQbPhNNop/tax_calculator",
+                },
               },
               customer_group: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/dlQbPhNNop/relationships/customer_group',
-                  related:
-                    'https://mock.localhost/api/markets/dlQbPhNNop/customer_group'
-                }
+                  self: "https://mock.localhost/api/markets/dlQbPhNNop/relationships/customer_group",
+                  related: "https://mock.localhost/api/markets/dlQbPhNNop/customer_group",
+                },
               },
               attachments: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/dlQbPhNNop/relationships/attachments',
-                  related:
-                    'https://mock.localhost/api/markets/dlQbPhNNop/attachments'
-                }
-              }
+                  self: "https://mock.localhost/api/markets/dlQbPhNNop/relationships/attachments",
+                  related: "https://mock.localhost/api/markets/dlQbPhNNop/attachments",
+                },
+              },
             },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+            meta: { mode: "test", organization_id: "WXlEOFrjnr" },
           },
           {
-            id: 'AlRevhXQga',
-            type: 'markets',
+            id: "AlRevhXQga",
+            type: "markets",
             links: {
-              self: 'https://mock.localhost/api/markets/AlRevhXQga'
+              self: "https://mock.localhost/api/markets/AlRevhXQga",
             },
             attributes: {
               number: 418,
-              name: 'Milan',
+              name: "Milan",
               facebook_pixel_id: null,
-              checkout_url: '',
-              external_prices_url: '',
+              checkout_url: "",
+              external_prices_url: "",
               external_order_validation_url: null,
-              shared_secret: 'fc9954fc7ae851d9588d456656ba102f',
+              shared_secret: "fc9954fc7ae851d9588d456656ba102f",
               private: false,
               disabled_at: null,
-              created_at: '2022-05-13T12:27:05.075Z',
-              updated_at: '2022-05-13T12:27:05.075Z',
-              reference: '',
-              reference_origin: '',
-              metadata: {}
+              created_at: "2022-05-13T12:27:05.075Z",
+              updated_at: "2022-05-13T12:27:05.075Z",
+              reference: "",
+              reference_origin: "",
+              metadata: {},
             },
             relationships: {
               merchant: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/AlRevhXQga/relationships/merchant',
-                  related:
-                    'https://mock.localhost/api/markets/AlRevhXQga/merchant'
-                }
+                  self: "https://mock.localhost/api/markets/AlRevhXQga/relationships/merchant",
+                  related: "https://mock.localhost/api/markets/AlRevhXQga/merchant",
+                },
               },
               price_list: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/AlRevhXQga/relationships/price_list',
-                  related:
-                    'https://mock.localhost/api/markets/AlRevhXQga/price_list'
-                }
+                  self: "https://mock.localhost/api/markets/AlRevhXQga/relationships/price_list",
+                  related: "https://mock.localhost/api/markets/AlRevhXQga/price_list",
+                },
               },
               inventory_model: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/AlRevhXQga/relationships/inventory_model',
-                  related:
-                    'https://mock.localhost/api/markets/AlRevhXQga/inventory_model'
-                }
+                  self: "https://mock.localhost/api/markets/AlRevhXQga/relationships/inventory_model",
+                  related: "https://mock.localhost/api/markets/AlRevhXQga/inventory_model",
+                },
               },
               subscription_model: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/AlRevhXQga/relationships/subscription_model',
-                  related:
-                    'https://mock.localhost/api/markets/AlRevhXQga/subscription_model'
-                }
+                  self: "https://mock.localhost/api/markets/AlRevhXQga/relationships/subscription_model",
+                  related: "https://mock.localhost/api/markets/AlRevhXQga/subscription_model",
+                },
               },
               tax_calculator: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/AlRevhXQga/relationships/tax_calculator',
-                  related:
-                    'https://mock.localhost/api/markets/AlRevhXQga/tax_calculator'
-                }
+                  self: "https://mock.localhost/api/markets/AlRevhXQga/relationships/tax_calculator",
+                  related: "https://mock.localhost/api/markets/AlRevhXQga/tax_calculator",
+                },
               },
               customer_group: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/AlRevhXQga/relationships/customer_group',
-                  related:
-                    'https://mock.localhost/api/markets/AlRevhXQga/customer_group'
-                }
+                  self: "https://mock.localhost/api/markets/AlRevhXQga/relationships/customer_group",
+                  related: "https://mock.localhost/api/markets/AlRevhXQga/customer_group",
+                },
               },
               attachments: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/AlRevhXQga/relationships/attachments',
-                  related:
-                    'https://mock.localhost/api/markets/AlRevhXQga/attachments'
-                }
-              }
+                  self: "https://mock.localhost/api/markets/AlRevhXQga/relationships/attachments",
+                  related: "https://mock.localhost/api/markets/AlRevhXQga/attachments",
+                },
+              },
             },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+            meta: { mode: "test", organization_id: "WXlEOFrjnr" },
           },
           {
-            id: 'AjRevhQOoa',
-            type: 'markets',
+            id: "AjRevhQOoa",
+            type: "markets",
             links: {
-              self: 'https://mock.localhost/api/markets/AjRevhQOoa'
+              self: "https://mock.localhost/api/markets/AjRevhQOoa",
             },
             attributes: {
               number: 351,
-              name: 'UK',
+              name: "UK",
               facebook_pixel_id: null,
               checkout_url: null,
               external_prices_url: null,
               external_order_validation_url: null,
-              shared_secret: 'a028eb9f9812ee2949da28cd3f8f5268',
+              shared_secret: "a028eb9f9812ee2949da28cd3f8f5268",
               private: false,
               disabled_at: null,
-              created_at: '2022-03-11T09:40:50.558Z',
-              updated_at: '2022-03-11T09:40:50.558Z',
-              reference: 'market_3',
-              reference_origin: 'CLI',
-              metadata: {}
+              created_at: "2022-03-11T09:40:50.558Z",
+              updated_at: "2022-03-11T09:40:50.558Z",
+              reference: "market_3",
+              reference_origin: "CLI",
+              metadata: {},
             },
             relationships: {
               merchant: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/AjRevhQOoa/relationships/merchant',
-                  related:
-                    'https://mock.localhost/api/markets/AjRevhQOoa/merchant'
-                }
+                  self: "https://mock.localhost/api/markets/AjRevhQOoa/relationships/merchant",
+                  related: "https://mock.localhost/api/markets/AjRevhQOoa/merchant",
+                },
               },
               price_list: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/AjRevhQOoa/relationships/price_list',
-                  related:
-                    'https://mock.localhost/api/markets/AjRevhQOoa/price_list'
-                }
+                  self: "https://mock.localhost/api/markets/AjRevhQOoa/relationships/price_list",
+                  related: "https://mock.localhost/api/markets/AjRevhQOoa/price_list",
+                },
               },
               inventory_model: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/AjRevhQOoa/relationships/inventory_model',
-                  related:
-                    'https://mock.localhost/api/markets/AjRevhQOoa/inventory_model'
-                }
+                  self: "https://mock.localhost/api/markets/AjRevhQOoa/relationships/inventory_model",
+                  related: "https://mock.localhost/api/markets/AjRevhQOoa/inventory_model",
+                },
               },
               subscription_model: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/AjRevhQOoa/relationships/subscription_model',
-                  related:
-                    'https://mock.localhost/api/markets/AjRevhQOoa/subscription_model'
-                }
+                  self: "https://mock.localhost/api/markets/AjRevhQOoa/relationships/subscription_model",
+                  related: "https://mock.localhost/api/markets/AjRevhQOoa/subscription_model",
+                },
               },
               tax_calculator: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/AjRevhQOoa/relationships/tax_calculator',
-                  related:
-                    'https://mock.localhost/api/markets/AjRevhQOoa/tax_calculator'
-                }
+                  self: "https://mock.localhost/api/markets/AjRevhQOoa/relationships/tax_calculator",
+                  related: "https://mock.localhost/api/markets/AjRevhQOoa/tax_calculator",
+                },
               },
               customer_group: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/AjRevhQOoa/relationships/customer_group',
-                  related:
-                    'https://mock.localhost/api/markets/AjRevhQOoa/customer_group'
-                }
+                  self: "https://mock.localhost/api/markets/AjRevhQOoa/relationships/customer_group",
+                  related: "https://mock.localhost/api/markets/AjRevhQOoa/customer_group",
+                },
               },
               attachments: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/AjRevhQOoa/relationships/attachments',
-                  related:
-                    'https://mock.localhost/api/markets/AjRevhQOoa/attachments'
-                }
-              }
+                  self: "https://mock.localhost/api/markets/AjRevhQOoa/relationships/attachments",
+                  related: "https://mock.localhost/api/markets/AjRevhQOoa/attachments",
+                },
+              },
             },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+            meta: { mode: "test", organization_id: "WXlEOFrjnr" },
           },
           {
-            id: 'EjDkXhNEoD',
-            type: 'markets',
+            id: "EjDkXhNEoD",
+            type: "markets",
             links: {
-              self: 'https://mock.localhost/api/markets/EjDkXhNEoD'
+              self: "https://mock.localhost/api/markets/EjDkXhNEoD",
             },
             attributes: {
               number: 349,
-              name: 'USA',
+              name: "USA",
               facebook_pixel_id: null,
-              checkout_url: '',
-              external_prices_url: '',
+              checkout_url: "",
+              external_prices_url: "",
               external_order_validation_url: null,
-              shared_secret: '60860b96e891725099e0b1a72dceb510',
+              shared_secret: "60860b96e891725099e0b1a72dceb510",
               private: false,
               disabled_at: null,
-              created_at: '2022-02-24T14:08:20.092Z',
-              updated_at: '2022-03-21T09:37:44.202Z',
-              reference: 'market_2',
-              reference_origin: 'CLI',
-              metadata: {}
+              created_at: "2022-02-24T14:08:20.092Z",
+              updated_at: "2022-03-21T09:37:44.202Z",
+              reference: "market_2",
+              reference_origin: "CLI",
+              metadata: {},
             },
             relationships: {
               merchant: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/EjDkXhNEoD/relationships/merchant',
-                  related:
-                    'https://mock.localhost/api/markets/EjDkXhNEoD/merchant'
-                }
+                  self: "https://mock.localhost/api/markets/EjDkXhNEoD/relationships/merchant",
+                  related: "https://mock.localhost/api/markets/EjDkXhNEoD/merchant",
+                },
               },
               price_list: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/EjDkXhNEoD/relationships/price_list',
-                  related:
-                    'https://mock.localhost/api/markets/EjDkXhNEoD/price_list'
-                }
+                  self: "https://mock.localhost/api/markets/EjDkXhNEoD/relationships/price_list",
+                  related: "https://mock.localhost/api/markets/EjDkXhNEoD/price_list",
+                },
               },
               inventory_model: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/EjDkXhNEoD/relationships/inventory_model',
-                  related:
-                    'https://mock.localhost/api/markets/EjDkXhNEoD/inventory_model'
-                }
+                  self: "https://mock.localhost/api/markets/EjDkXhNEoD/relationships/inventory_model",
+                  related: "https://mock.localhost/api/markets/EjDkXhNEoD/inventory_model",
+                },
               },
               subscription_model: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/EjDkXhNEoD/relationships/subscription_model',
-                  related:
-                    'https://mock.localhost/api/markets/EjDkXhNEoD/subscription_model'
-                }
+                  self: "https://mock.localhost/api/markets/EjDkXhNEoD/relationships/subscription_model",
+                  related: "https://mock.localhost/api/markets/EjDkXhNEoD/subscription_model",
+                },
               },
               tax_calculator: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/EjDkXhNEoD/relationships/tax_calculator',
-                  related:
-                    'https://mock.localhost/api/markets/EjDkXhNEoD/tax_calculator'
-                }
+                  self: "https://mock.localhost/api/markets/EjDkXhNEoD/relationships/tax_calculator",
+                  related: "https://mock.localhost/api/markets/EjDkXhNEoD/tax_calculator",
+                },
               },
               customer_group: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/EjDkXhNEoD/relationships/customer_group',
-                  related:
-                    'https://mock.localhost/api/markets/EjDkXhNEoD/customer_group'
-                }
+                  self: "https://mock.localhost/api/markets/EjDkXhNEoD/relationships/customer_group",
+                  related: "https://mock.localhost/api/markets/EjDkXhNEoD/customer_group",
+                },
               },
               attachments: {
                 links: {
-                  self: 'https://mock.localhost/api/markets/EjDkXhNEoD/relationships/attachments',
-                  related:
-                    'https://mock.localhost/api/markets/EjDkXhNEoD/attachments'
-                }
-              }
+                  self: "https://mock.localhost/api/markets/EjDkXhNEoD/relationships/attachments",
+                  related: "https://mock.localhost/api/markets/EjDkXhNEoD/attachments",
+                },
+              },
             },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
-          }
+            meta: { mode: "test", organization_id: "WXlEOFrjnr" },
+          },
         ],
         meta: { record_count: 5, page_count: 1 },
         links: {
           first:
-            'https://mock.localhost/api/markets?page%5Bnumber%5D=1&page%5Bsize%5D=25&sort=name',
-          last: 'https://mock.localhost/api/markets?page%5Bnumber%5D=1&page%5Bsize%5D=25&sort=name'
-        }
+            "https://mock.localhost/api/markets?page%5Bnumber%5D=1&page%5Bsize%5D=25&sort=name",
+          last: "https://mock.localhost/api/markets?page%5Bnumber%5D=1&page%5Bsize%5D=25&sort=name",
+        },
       })
     )
   }
diff --git a/packages/docs/mocks/data/orders.js b/packages/docs/mocks/data/orders.js
index 49afe454..df8c8351 100644
--- a/packages/docs/mocks/data/orders.js
+++ b/packages/docs/mocks/data/orders.js
@@ -1,88 +1,88 @@
-import { http } from 'msw'
+import { http } from "msw"
 
 const order = {
-  id: 'NMWYhbGorj',
-  type: 'orders',
+  id: "NMWYhbGorj",
+  type: "orders",
   links: {
-    self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj'
+    self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj",
   },
   attributes: {
     number: 2485862,
     autorefresh: true,
-    status: 'approved',
-    payment_status: 'paid',
-    fulfillment_status: 'in_progress',
+    status: "approved",
+    payment_status: "paid",
+    fulfillment_status: "in_progress",
     guest: true,
     editable: false,
-    customer_email: 'customer@tk.com',
-    language_code: 'en',
-    currency_code: 'EUR',
+    customer_email: "customer@tk.com",
+    language_code: "en",
+    currency_code: "EUR",
     tax_included: true,
     tax_rate: null,
     freight_taxable: null,
     requires_billing_info: true,
-    country_code: 'IT',
+    country_code: "IT",
     shipping_country_code_lock: null,
     coupon_code: null,
-    gift_card_code: '9951a05f-741a-4ab1-8405-2a7e57612792',
-    gift_card_or_coupon_code: '9951a05f-741a-4ab1-8405-2a7e57612792',
+    gift_card_code: "9951a05f-741a-4ab1-8405-2a7e57612792",
+    gift_card_or_coupon_code: "9951a05f-741a-4ab1-8405-2a7e57612792",
     subtotal_amount_cents: 24400,
     subtotal_amount_float: 244.0,
-    formatted_subtotal_amount: '€244,00',
+    formatted_subtotal_amount: "€244,00",
     shipping_amount_cents: 0,
     shipping_amount_float: 0.0,
-    formatted_shipping_amount: '€0,00',
+    formatted_shipping_amount: "€0,00",
     payment_method_amount_cents: 1000,
     payment_method_amount_float: 10.0,
-    formatted_payment_method_amount: '€10,00',
+    formatted_payment_method_amount: "€10,00",
     discount_amount_cents: 0,
     discount_amount_float: 0.0,
-    formatted_discount_amount: '€0,00',
+    formatted_discount_amount: "€0,00",
     adjustment_amount_cents: 0,
     adjustment_amount_float: 0.0,
-    formatted_adjustment_amount: '€0,00',
+    formatted_adjustment_amount: "€0,00",
     gift_card_amount_cents: -10000,
     gift_card_amount_float: -100.0,
-    formatted_gift_card_amount: '-€100,00',
+    formatted_gift_card_amount: "-€100,00",
     total_tax_amount_cents: 0,
     total_tax_amount_float: 0.0,
-    formatted_total_tax_amount: '€0,00',
+    formatted_total_tax_amount: "€0,00",
     subtotal_tax_amount_cents: 0,
     subtotal_tax_amount_float: 0.0,
-    formatted_subtotal_tax_amount: '€0,00',
+    formatted_subtotal_tax_amount: "€0,00",
     shipping_tax_amount_cents: 0,
     shipping_tax_amount_float: 0.0,
-    formatted_shipping_tax_amount: '€0,00',
+    formatted_shipping_tax_amount: "€0,00",
     payment_method_tax_amount_cents: 0,
     payment_method_tax_amount_float: 0.0,
-    formatted_payment_method_tax_amount: '€0,00',
+    formatted_payment_method_tax_amount: "€0,00",
     adjustment_tax_amount_cents: 0,
     adjustment_tax_amount_float: 0.0,
-    formatted_adjustment_tax_amount: '€0,00',
+    formatted_adjustment_tax_amount: "€0,00",
     total_amount_cents: 25400,
     total_amount_float: 254.0,
-    formatted_total_amount: '€254,00',
+    formatted_total_amount: "€254,00",
     total_taxable_amount_cents: 25400,
     total_taxable_amount_float: 254.0,
-    formatted_total_taxable_amount: '€254,00',
+    formatted_total_taxable_amount: "€254,00",
     subtotal_taxable_amount_cents: 24400,
     subtotal_taxable_amount_float: 244.0,
-    formatted_subtotal_taxable_amount: '€244,00',
+    formatted_subtotal_taxable_amount: "€244,00",
     shipping_taxable_amount_cents: 0,
     shipping_taxable_amount_float: 0.0,
-    formatted_shipping_taxable_amount: '€0,00',
+    formatted_shipping_taxable_amount: "€0,00",
     payment_method_taxable_amount_cents: 1000,
     payment_method_taxable_amount_float: 10.0,
-    formatted_payment_method_taxable_amount: '€10,00',
+    formatted_payment_method_taxable_amount: "€10,00",
     adjustment_taxable_amount_cents: 0,
     adjustment_taxable_amount_float: 0.0,
-    formatted_adjustment_taxable_amount: '€0,00',
+    formatted_adjustment_taxable_amount: "€0,00",
     total_amount_with_taxes_cents: 15400,
     total_amount_with_taxes_float: 154.0,
-    formatted_total_amount_with_taxes: '€154,00',
+    formatted_total_amount_with_taxes: "€154,00",
     fees_amount_cents: 0,
     fees_amount_float: 0.0,
-    formatted_fees_amount: '€0,00',
+    formatted_fees_amount: "€0,00",
     duty_amount_cents: null,
     duty_amount_float: null,
     formatted_duty_amount: null,
@@ -92,259 +92,237 @@ const order = {
     tax_calculations_count: 0,
     validations_count: 0,
     payment_source_details: {
-      type: 'stripe_payment',
-      payment_method_id: 'pm_1N8LhuK5j6INEBBIHXkK0FFF',
-      payment_method_type: 'card',
+      type: "stripe_payment",
+      payment_method_id: "pm_1N8LhuK5j6INEBBIHXkK0FFF",
+      payment_method_type: "card",
       payment_method_details: {
-        brand: 'visa',
-        last4: '4242',
+        brand: "visa",
+        last4: "4242",
         checks: {
-          cvc_check: 'pass',
-          address_line1_check: 'pass',
-          address_postal_code_check: 'pass'
+          cvc_check: "pass",
+          address_line1_check: "pass",
+          address_postal_code_check: "pass",
         },
         wallet: null,
-        country: 'US',
-        funding: 'credit',
+        country: "US",
+        funding: "credit",
         exp_year: 2031,
-        networks: { available: ['visa'], preferred: null },
+        networks: { available: ["visa"], preferred: null },
         exp_month: 2,
-        fingerprint: 'bVaeOEKRmYhi20Nj',
+        fingerprint: "bVaeOEKRmYhi20Nj",
         generated_from: null,
-        three_d_secure_usage: { supported: true }
-      }
+        three_d_secure_usage: { supported: true },
+      },
     },
-    token: '7fe6285a3dfdabeb8cb9324980743396',
+    token: "7fe6285a3dfdabeb8cb9324980743396",
     cart_url: null,
     return_url: null,
     terms_url: null,
     privacy_url: null,
     checkout_url: null,
-    placed_at: '2023-05-16T11:06:22.012Z',
-    approved_at: '2023-05-16T14:18:16.775Z',
+    placed_at: "2023-05-16T11:06:22.012Z",
+    approved_at: "2023-05-16T14:18:16.775Z",
     cancelled_at: null,
-    payment_updated_at: '2023-05-16T14:18:35.404Z',
-    fulfillment_updated_at: '2023-05-16T14:18:35.411Z',
-    refreshed_at: '2023-05-16T11:06:04.613Z',
+    payment_updated_at: "2023-05-16T14:18:35.404Z",
+    fulfillment_updated_at: "2023-05-16T14:18:35.411Z",
+    refreshed_at: "2023-05-16T11:06:04.613Z",
     archived_at: null,
     expires_at: null,
     subscription_created_at: null,
-    created_at: '2023-05-16T11:06:02.074Z',
-    updated_at: '2023-05-16T14:18:35.572Z',
+    created_at: "2023-05-16T11:06:02.074Z",
+    updated_at: "2023-05-16T14:18:35.572Z",
     reference: null,
     reference_origin: null,
-    metadata: {}
+    metadata: {},
   },
   relationships: {
     market: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/market',
-        related:
-          'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/market'
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/market",
+        related: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/market",
       },
-      data: { type: 'markets', id: 'dlQbPhNNop' }
+      data: { type: "markets", id: "dlQbPhNNop" },
     },
     customer: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/customer',
-        related:
-          'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/customer'
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/customer",
+        related: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/customer",
       },
-      data: { type: 'customers', id: 'JkAdBhNGjQ' }
+      data: { type: "customers", id: "JkAdBhNGjQ" },
     },
     shipping_address: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/shipping_address',
-        related:
-          'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/shipping_address'
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/shipping_address",
+        related: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/shipping_address",
       },
-      data: { type: 'addresses', id: 'dPoNukZmnB' }
+      data: { type: "addresses", id: "dPoNukZmnB" },
     },
     billing_address: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/billing_address',
-        related:
-          'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/billing_address'
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/billing_address",
+        related: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/billing_address",
       },
-      data: { type: 'addresses', id: 'dQxruwZDnB' }
+      data: { type: "addresses", id: "dQxruwZDnB" },
     },
     available_payment_methods: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/available_payment_methods',
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/available_payment_methods",
         related:
-          'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/available_payment_methods'
-      }
+          "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/available_payment_methods",
+      },
     },
     available_customer_payment_sources: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/available_customer_payment_sources',
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/available_customer_payment_sources",
         related:
-          'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/available_customer_payment_sources'
-      }
+          "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/available_customer_payment_sources",
+      },
     },
     available_free_skus: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/available_free_skus',
-        related:
-          'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/available_free_skus'
-      }
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/available_free_skus",
+        related: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/available_free_skus",
+      },
     },
     available_free_bundles: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/available_free_bundles',
-        related:
-          'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/available_free_bundles'
-      }
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/available_free_bundles",
+        related: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/available_free_bundles",
+      },
     },
     payment_method: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/payment_method',
-        related:
-          'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/payment_method'
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/payment_method",
+        related: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/payment_method",
       },
-      data: { type: 'payment_methods', id: 'wmBvQsARml' }
+      data: { type: "payment_methods", id: "wmBvQsARml" },
     },
     payment_source: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/payment_source',
-        related:
-          'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/payment_source'
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/payment_source",
+        related: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/payment_source",
       },
-      data: { type: 'stripe_payments', id: 'onXELSmbQy' }
+      data: { type: "stripe_payments", id: "onXELSmbQy" },
     },
     line_items: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/line_items',
-        related:
-          'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/line_items'
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/line_items",
+        related: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/line_items",
       },
       data: [
-        { type: 'line_items', id: 'vaoMtAZlXy' },
-        { type: 'line_items', id: 'kmnptjPlBv' },
-        { type: 'line_items', id: 'vWEZtMGVKy' },
-        { type: 'line_items', id: 'NqYatGaKnN' },
-        { type: 'line_items', id: 'NoEntBwEdk' },
-        { type: 'line_items', id: 'NlQmtMAnGy' }
-      ]
+        { type: "line_items", id: "vaoMtAZlXy" },
+        { type: "line_items", id: "kmnptjPlBv" },
+        { type: "line_items", id: "vWEZtMGVKy" },
+        { type: "line_items", id: "NqYatGaKnN" },
+        { type: "line_items", id: "NoEntBwEdk" },
+        { type: "line_items", id: "NlQmtMAnGy" },
+      ],
     },
     shipments: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/shipments',
-        related:
-          'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/shipments'
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/shipments",
+        related: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/shipments",
       },
       data: [
-        { type: 'shipments', id: 'YpLwCnNQgY' },
-        { type: 'shipments', id: 'PabvCpOxRy' }
-      ]
+        { type: "shipments", id: "YpLwCnNQgY" },
+        { type: "shipments", id: "PabvCpOxRy" },
+      ],
     },
     transactions: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/transactions',
-        related:
-          'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/transactions'
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/transactions",
+        related: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/transactions",
       },
       data: [
-        { type: 'authorizations', id: 'nKZkPUDBVj' },
-        { type: 'captures', id: 'kyAnxUgegE' }
-      ]
+        { type: "authorizations", id: "nKZkPUDBVj" },
+        { type: "captures", id: "kyAnxUgegE" },
+      ],
     },
     authorizations: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/authorizations',
-        related:
-          'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/authorizations'
-      }
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/authorizations",
+        related: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/authorizations",
+      },
     },
     captures: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/captures',
-        related:
-          'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/captures'
-      }
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/captures",
+        related: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/captures",
+      },
     },
     voids: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/voids',
-        related: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/voids'
-      }
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/voids",
+        related: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/voids",
+      },
     },
     refunds: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/refunds',
-        related:
-          'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/refunds'
-      }
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/refunds",
+        related: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/refunds",
+      },
     },
     returns: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/returns',
-        related:
-          'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/returns'
-      }
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/returns",
+        related: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/returns",
+      },
     },
     order_subscriptions: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/order_subscriptions',
-        related:
-          'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/order_subscriptions'
-      }
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/order_subscriptions",
+        related: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/order_subscriptions",
+      },
     },
     order_factories: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/order_factories',
-        related:
-          'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/order_factories'
-      }
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/order_factories",
+        related: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/order_factories",
+      },
     },
     order_copies: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/order_copies',
-        related:
-          'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/order_copies'
-      }
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/order_copies",
+        related: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/order_copies",
+      },
     },
     recurring_order_copies: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/recurring_order_copies',
-        related:
-          'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/recurring_order_copies'
-      }
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/recurring_order_copies",
+        related: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/recurring_order_copies",
+      },
     },
     attachments: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/attachments',
-        related:
-          'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/attachments'
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/attachments",
+        related: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/attachments",
       },
-      data: [{ type: 'attachments', id: 'EqGrksxWNW' }]
+      data: [{ type: "attachments", id: "EqGrksxWNW" }],
     },
     events: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/events',
-        related:
-          'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/events'
-      }
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/events",
+        related: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/events",
+      },
     },
     tags: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/tags',
-        related: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/tags'
-      }
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/tags",
+        related: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/tags",
+      },
     },
     versions: {
       links: {
-        self: 'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/versions',
-        related:
-          'https://alessani.commercelayer.co/api/orders/NMWYhbGorj/versions'
-      }
-    }
+        self: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/relationships/versions",
+        related: "https://alessani.commercelayer.co/api/orders/NMWYhbGorj/versions",
+      },
+    },
   },
-  meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+  meta: { mode: "test", organization_id: "WXlEOFrjnr" },
 }
 
 const orderDetail = http.get(
-  'https://mock.localhost/api/orders/NMWYhbGorj?include=shipments,transactions,payment_method,payment_source,attachments',
+  "https://mock.localhost/api/orders/NMWYhbGorj?include=shipments,transactions,payment_method,payment_source,attachments",
   async (req, res, ctx) => {
     return await new Promise((resolve) => {
       setTimeout(() => {
@@ -355,207 +333,205 @@ const orderDetail = http.get(
               data: order,
               included: [
                 {
-                  id: 'dlQbPhNNop',
-                  type: 'markets',
+                  id: "dlQbPhNNop",
+                  type: "markets",
                   links: {
-                    self: 'https://alessani.commercelayer.co/api/markets/dlQbPhNNop'
+                    self: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop",
                   },
                   attributes: {
                     number: 350,
-                    name: 'Europe',
+                    name: "Europe",
                     facebook_pixel_id: null,
-                    checkout_url: '',
-                    external_prices_url:
-                      'https://pippo.malessani.commercelayer.dev/api/verify',
-                    external_order_validation_url: '',
+                    checkout_url: "",
+                    external_prices_url: "https://pippo.malessani.commercelayer.dev/api/verify",
+                    external_order_validation_url: "",
                     private: false,
                     disabled_at: null,
-                    created_at: '2022-03-11T09:40:49.000Z',
-                    updated_at: '2023-03-13T13:30:32.184Z',
-                    reference: 'market_1',
-                    reference_origin: 'CLI',
-                    metadata: {}
+                    created_at: "2022-03-11T09:40:49.000Z",
+                    updated_at: "2023-03-13T13:30:32.184Z",
+                    reference: "market_1",
+                    reference_origin: "CLI",
+                    metadata: {},
                   },
                   relationships: {
                     merchant: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/merchant',
+                        self: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/merchant",
                         related:
-                          'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/merchant'
-                      }
+                          "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/merchant",
+                      },
                     },
                     price_list: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/price_list',
+                        self: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/price_list",
                         related:
-                          'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/price_list'
-                      }
+                          "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/price_list",
+                      },
                     },
                     inventory_model: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/inventory_model',
+                        self: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/inventory_model",
                         related:
-                          'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/inventory_model'
-                      }
+                          "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/inventory_model",
+                      },
                     },
                     subscription_model: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/subscription_model',
+                        self: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/subscription_model",
                         related:
-                          'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/subscription_model'
-                      }
+                          "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/subscription_model",
+                      },
                     },
                     tax_calculator: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/tax_calculator',
+                        self: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/tax_calculator",
                         related:
-                          'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/tax_calculator'
-                      }
+                          "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/tax_calculator",
+                      },
                     },
                     customer_group: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/customer_group',
+                        self: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/customer_group",
                         related:
-                          'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/customer_group'
-                      }
+                          "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/customer_group",
+                      },
                     },
                     attachments: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/attachments',
+                        self: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/attachments",
                         related:
-                          'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/attachments'
-                      }
+                          "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/attachments",
+                      },
                     },
                     versions: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/versions',
+                        self: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/versions",
                         related:
-                          'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/versions'
-                      }
-                    }
+                          "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/versions",
+                      },
+                    },
                   },
-                  meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+                  meta: { mode: "test", organization_id: "WXlEOFrjnr" },
                 },
                 {
-                  id: 'JkAdBhNGjQ',
-                  type: 'customers',
+                  id: "JkAdBhNGjQ",
+                  type: "customers",
                   links: {
-                    self: 'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ'
+                    self: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ",
                   },
                   attributes: {
-                    email: 'customer@tk.com',
-                    status: 'repeat',
+                    email: "customer@tk.com",
+                    status: "repeat",
                     has_password: false,
                     total_orders_count: 2753,
-                    created_at: '2022-03-14T09:13:06.633Z',
-                    updated_at: '2023-07-31T09:13:06.049Z',
+                    created_at: "2022-03-14T09:13:06.633Z",
+                    updated_at: "2023-07-31T09:13:06.049Z",
                     reference: null,
                     reference_origin: null,
-                    metadata: {}
+                    metadata: {},
                   },
                   relationships: {
                     customer_group: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/customer_group',
+                        self: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/customer_group",
                         related:
-                          'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/customer_group'
-                      }
+                          "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/customer_group",
+                      },
                     },
                     customer_addresses: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/customer_addresses',
+                        self: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/customer_addresses",
                         related:
-                          'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/customer_addresses'
-                      }
+                          "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/customer_addresses",
+                      },
                     },
                     customer_payment_sources: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/customer_payment_sources',
+                        self: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/customer_payment_sources",
                         related:
-                          'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/customer_payment_sources'
-                      }
+                          "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/customer_payment_sources",
+                      },
                     },
                     customer_subscriptions: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/customer_subscriptions',
+                        self: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/customer_subscriptions",
                         related:
-                          'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/customer_subscriptions'
-                      }
+                          "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/customer_subscriptions",
+                      },
                     },
                     orders: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/orders',
+                        self: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/orders",
                         related:
-                          'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/orders'
-                      }
+                          "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/orders",
+                      },
                     },
                     order_subscriptions: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/order_subscriptions',
+                        self: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/order_subscriptions",
                         related:
-                          'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/order_subscriptions'
-                      }
+                          "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/order_subscriptions",
+                      },
                     },
                     returns: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/returns',
+                        self: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/returns",
                         related:
-                          'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/returns'
-                      }
+                          "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/returns",
+                      },
                     },
                     sku_lists: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/sku_lists',
+                        self: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/sku_lists",
                         related:
-                          'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/sku_lists'
-                      }
+                          "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/sku_lists",
+                      },
                     },
                     attachments: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/attachments',
+                        self: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/attachments",
                         related:
-                          'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/attachments'
-                      }
+                          "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/attachments",
+                      },
                     },
                     events: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/events',
+                        self: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/events",
                         related:
-                          'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/events'
-                      }
+                          "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/events",
+                      },
                     },
                     tags: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/tags',
-                        related:
-                          'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/tags'
-                      }
-                    }
+                        self: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/tags",
+                        related: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/tags",
+                      },
+                    },
                   },
-                  meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+                  meta: { mode: "test", organization_id: "WXlEOFrjnr" },
                 },
                 {
-                  id: 'dPoNukZmnB',
-                  type: 'addresses',
+                  id: "dPoNukZmnB",
+                  type: "addresses",
                   links: {
-                    self: 'https://alessani.commercelayer.co/api/addresses/dPoNukZmnB'
+                    self: "https://alessani.commercelayer.co/api/addresses/dPoNukZmnB",
                   },
                   attributes: {
                     business: false,
-                    first_name: 'Darth',
-                    last_name: 'Vader',
+                    first_name: "Darth",
+                    last_name: "Vader",
                     company: null,
-                    full_name: 'Darth Vader',
-                    line_1: 'Via Morte Nera, 13',
-                    line_2: 'Ragnatela, 99',
-                    city: 'Cogorno',
-                    zip_code: '16030',
-                    state_code: 'GE',
-                    country_code: 'IT',
-                    phone: '+39 055 1234567890',
+                    full_name: "Darth Vader",
+                    line_1: "Via Morte Nera, 13",
+                    line_2: "Ragnatela, 99",
+                    city: "Cogorno",
+                    zip_code: "16030",
+                    state_code: "GE",
+                    country_code: "IT",
+                    phone: "+39 055 1234567890",
                     full_address:
-                      'Via Morte Nera, 13 Ragnatela, 99, 16030 Cogorno GE (IT) +39 055 1234567890',
-                    name: 'Darth Vader, Via Morte Nera, 13 Ragnatela, 99, 16030 Cogorno GE (IT) +39 055 1234567890',
+                      "Via Morte Nera, 13 Ragnatela, 99, 16030 Cogorno GE (IT) +39 055 1234567890",
+                    name: "Darth Vader, Via Morte Nera, 13 Ragnatela, 99, 16030 Cogorno GE (IT) +39 055 1234567890",
                     email: null,
                     notes: null,
                     lat: null,
@@ -565,67 +541,66 @@ const orderDetail = http.get(
                     provider_name: null,
                     map_url: null,
                     static_map_url: null,
-                    billing_info: 'ABCDEFGHIJKLMNOPQRSTUVWYXZ',
-                    created_at: '2023-05-16T11:06:07.638Z',
-                    updated_at: '2023-05-16T11:06:07.638Z',
+                    billing_info: "ABCDEFGHIJKLMNOPQRSTUVWYXZ",
+                    created_at: "2023-05-16T11:06:07.638Z",
+                    updated_at: "2023-05-16T11:06:07.638Z",
                     reference: null,
                     reference_origin: null,
-                    metadata: {}
+                    metadata: {},
                   },
                   relationships: {
                     geocoder: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/relationships/geocoder',
+                        self: "https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/relationships/geocoder",
                         related:
-                          'https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/geocoder'
-                      }
+                          "https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/geocoder",
+                      },
                     },
                     events: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/relationships/events',
+                        self: "https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/relationships/events",
                         related:
-                          'https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/events'
-                      }
+                          "https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/events",
+                      },
                     },
                     tags: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/relationships/tags',
-                        related:
-                          'https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/tags'
-                      }
+                        self: "https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/relationships/tags",
+                        related: "https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/tags",
+                      },
                     },
                     versions: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/relationships/versions',
+                        self: "https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/relationships/versions",
                         related:
-                          'https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/versions'
-                      }
-                    }
+                          "https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/versions",
+                      },
+                    },
                   },
-                  meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+                  meta: { mode: "test", organization_id: "WXlEOFrjnr" },
                 },
                 {
-                  id: 'dQxruwZDnB',
-                  type: 'addresses',
+                  id: "dQxruwZDnB",
+                  type: "addresses",
                   links: {
-                    self: 'https://alessani.commercelayer.co/api/addresses/dQxruwZDnB'
+                    self: "https://alessani.commercelayer.co/api/addresses/dQxruwZDnB",
                   },
                   attributes: {
                     business: false,
-                    first_name: 'Darth',
-                    last_name: 'Vader',
+                    first_name: "Darth",
+                    last_name: "Vader",
                     company: null,
-                    full_name: 'Darth Vader',
-                    line_1: 'Via Morte Nera, 13',
-                    line_2: 'Ragnatela, 99',
-                    city: 'Cogorno',
-                    zip_code: '16030',
-                    state_code: 'GE',
-                    country_code: 'IT',
-                    phone: '+39 055 1234567890',
+                    full_name: "Darth Vader",
+                    line_1: "Via Morte Nera, 13",
+                    line_2: "Ragnatela, 99",
+                    city: "Cogorno",
+                    zip_code: "16030",
+                    state_code: "GE",
+                    country_code: "IT",
+                    phone: "+39 055 1234567890",
                     full_address:
-                      'Via Morte Nera, 13 Ragnatela, 99, 16030 Cogorno GE (IT) +39 055 1234567890',
-                    name: 'Darth Vader, Via Morte Nera, 13 Ragnatela, 99, 16030 Cogorno GE (IT) +39 055 1234567890',
+                      "Via Morte Nera, 13 Ragnatela, 99, 16030 Cogorno GE (IT) +39 055 1234567890",
+                    name: "Darth Vader, Via Morte Nera, 13 Ragnatela, 99, 16030 Cogorno GE (IT) +39 055 1234567890",
                     email: null,
                     notes: null,
                     lat: null,
@@ -635,892 +610,878 @@ const orderDetail = http.get(
                     provider_name: null,
                     map_url: null,
                     static_map_url: null,
-                    billing_info: 'ABCDEFGHIJKLMNOPQRSTUVWYXZ',
-                    created_at: '2023-05-16T11:06:07.493Z',
-                    updated_at: '2023-05-16T11:06:07.493Z',
+                    billing_info: "ABCDEFGHIJKLMNOPQRSTUVWYXZ",
+                    created_at: "2023-05-16T11:06:07.493Z",
+                    updated_at: "2023-05-16T11:06:07.493Z",
                     reference: null,
                     reference_origin: null,
-                    metadata: {}
+                    metadata: {},
                   },
                   relationships: {
                     geocoder: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/relationships/geocoder',
+                        self: "https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/relationships/geocoder",
                         related:
-                          'https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/geocoder'
-                      }
+                          "https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/geocoder",
+                      },
                     },
                     events: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/relationships/events',
+                        self: "https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/relationships/events",
                         related:
-                          'https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/events'
-                      }
+                          "https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/events",
+                      },
                     },
                     tags: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/relationships/tags',
-                        related:
-                          'https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/tags'
-                      }
+                        self: "https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/relationships/tags",
+                        related: "https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/tags",
+                      },
                     },
                     versions: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/relationships/versions',
+                        self: "https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/relationships/versions",
                         related:
-                          'https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/versions'
-                      }
-                    }
+                          "https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/versions",
+                      },
+                    },
                   },
-                  meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+                  meta: { mode: "test", organization_id: "WXlEOFrjnr" },
                 },
                 {
-                  id: 'wmBvQsARml',
-                  type: 'payment_methods',
+                  id: "wmBvQsARml",
+                  type: "payment_methods",
                   links: {
-                    self: 'https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml'
+                    self: "https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml",
                   },
                   attributes: {
-                    payment_source_type: 'stripe_payments',
-                    name: 'Stripe Payment',
-                    currency_code: 'EUR',
+                    payment_source_type: "stripe_payments",
+                    name: "Stripe Payment",
+                    currency_code: "EUR",
                     moto: false,
                     require_capture: true,
                     auto_capture: false,
                     disabled_at: null,
                     price_amount_cents: 1000,
                     price_amount_float: 10.0,
-                    formatted_price_amount: '€10,00',
+                    formatted_price_amount: "€10,00",
                     auto_capture_max_amount_cents: null,
                     auto_capture_max_amount_float: null,
                     formatted_auto_capture_max_amount: null,
-                    created_at: '2022-03-11T14:18:08.420Z',
-                    updated_at: '2022-03-11T14:18:08.420Z',
-                    reference: '',
-                    reference_origin: '',
-                    metadata: {}
+                    created_at: "2022-03-11T14:18:08.420Z",
+                    updated_at: "2022-03-11T14:18:08.420Z",
+                    reference: "",
+                    reference_origin: "",
+                    metadata: {},
                   },
                   relationships: {
                     market: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/relationships/market',
+                        self: "https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/relationships/market",
                         related:
-                          'https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/market'
-                      }
+                          "https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/market",
+                      },
                     },
                     payment_gateway: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/relationships/payment_gateway',
+                        self: "https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/relationships/payment_gateway",
                         related:
-                          'https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/payment_gateway'
-                      }
+                          "https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/payment_gateway",
+                      },
                     },
                     attachments: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/relationships/attachments',
+                        self: "https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/relationships/attachments",
                         related:
-                          'https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/attachments'
-                      }
+                          "https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/attachments",
+                      },
                     },
                     versions: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/relationships/versions',
+                        self: "https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/relationships/versions",
                         related:
-                          'https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/versions'
-                      }
-                    }
+                          "https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/versions",
+                      },
+                    },
                   },
-                  meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+                  meta: { mode: "test", organization_id: "WXlEOFrjnr" },
                 },
                 {
-                  id: 'onXELSmbQy',
-                  type: 'stripe_payments',
+                  id: "onXELSmbQy",
+                  type: "stripe_payments",
                   links: {
-                    self: 'https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy'
+                    self: "https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy",
                   },
                   attributes: {
-                    client_secret:
-                      'pi_3N8LhsK5j6INEBBI0JicoLOo_secret_CKWfEPSnvyBHIQrEfRXkrJYd7',
+                    client_secret: "pi_3N8LhsK5j6INEBBI0JicoLOo_secret_CKWfEPSnvyBHIQrEfRXkrJYd7",
                     publishable_key:
-                      'pk_test_51KH86yK5j6INEBBIdkXoh0UwOoOlAbFZc3b8j0vjRHKQHdaUfEJm24F0A9QkrQXVlgh1nXJCpWR6PG3epaUWzE2z00BdEe9fho',
+                      "pk_test_51KH86yK5j6INEBBIdkXoh0UwOoOlAbFZc3b8j0vjRHKQHdaUfEJm24F0A9QkrQXVlgh1nXJCpWR6PG3epaUWzE2z00BdEe9fho",
                     options: {
-                      id: 'pm_1N8LhuK5j6INEBBI71U1QOlu',
+                      id: "pm_1N8LhuK5j6INEBBI71U1QOlu",
                       card: {
-                        brand: 'visa',
-                        last4: '4242',
+                        brand: "visa",
+                        last4: "4242",
                         checks: {
                           cvc_check: null,
                           address_line1_check: null,
-                          address_postal_code_check: null
+                          address_postal_code_check: null,
                         },
                         wallet: null,
-                        country: 'US',
-                        funding: 'credit',
+                        country: "US",
+                        funding: "credit",
                         exp_year: 2031,
-                        networks: { available: ['visa'], preferred: null },
+                        networks: { available: ["visa"], preferred: null },
                         exp_month: 2,
                         generated_from: null,
-                        three_d_secure_usage: { supported: true }
+                        three_d_secure_usage: { supported: true },
                       },
-                      type: 'card',
-                      object: 'payment_method',
+                      type: "card",
+                      object: "payment_method",
                       created: 1684235178,
                       customer: null,
                       livemode: false,
                       billing_details: {
-                        name: 'Darth Vader',
-                        email: 'customer@tk.com',
-                        phone: '+39 055 1234567890',
+                        name: "Darth Vader",
+                        email: "customer@tk.com",
+                        phone: "+39 055 1234567890",
                         address: {
-                          city: 'Cogorno',
-                          line1: 'Via Morte Nera, 13',
+                          city: "Cogorno",
+                          line1: "Via Morte Nera, 13",
                           line2: null,
-                          state: 'GE',
-                          country: 'IT',
-                          postal_code: '16030'
-                        }
+                          state: "GE",
+                          country: "IT",
+                          postal_code: "16030",
+                        },
                       },
-                      setup_future_usage: 'off_session',
-                      intent_amount_cents: 15400
+                      setup_future_usage: "off_session",
+                      intent_amount_cents: 15400,
                     },
                     payment_method: {
-                      id: 'pm_1N8LhuK5j6INEBBIHXkK0FFF',
+                      id: "pm_1N8LhuK5j6INEBBIHXkK0FFF",
                       card: {
-                        brand: 'visa',
-                        last4: '4242',
+                        brand: "visa",
+                        last4: "4242",
                         checks: {
-                          cvc_check: 'pass',
-                          address_line1_check: 'pass',
-                          address_postal_code_check: 'pass'
+                          cvc_check: "pass",
+                          address_line1_check: "pass",
+                          address_postal_code_check: "pass",
                         },
                         wallet: null,
-                        country: 'US',
-                        funding: 'credit',
+                        country: "US",
+                        funding: "credit",
                         exp_year: 2031,
-                        networks: { available: ['visa'], preferred: null },
+                        networks: { available: ["visa"], preferred: null },
                         exp_month: 2,
-                        fingerprint: 'bVaeOEKRmYhi20Nj',
+                        fingerprint: "bVaeOEKRmYhi20Nj",
                         generated_from: null,
-                        three_d_secure_usage: { supported: true }
+                        three_d_secure_usage: { supported: true },
                       },
-                      type: 'card',
-                      object: 'payment_method',
+                      type: "card",
+                      object: "payment_method",
                       created: 1684235179,
                       customer: null,
                       livemode: false,
                       metadata: {},
                       billing_details: {
-                        name: 'Darth Vader',
-                        email: 'customer@tk.com',
-                        phone: '+39 055 1234567890',
+                        name: "Darth Vader",
+                        email: "customer@tk.com",
+                        phone: "+39 055 1234567890",
                         address: {
-                          city: 'Cogorno',
-                          line1: 'Via Morte Nera, 13',
+                          city: "Cogorno",
+                          line1: "Via Morte Nera, 13",
                           line2: null,
-                          state: 'GE',
-                          country: 'IT',
-                          postal_code: '16030'
-                        }
-                      }
+                          state: "GE",
+                          country: "IT",
+                          postal_code: "16030",
+                        },
+                      },
                     },
                     mismatched_amounts: false,
                     intent_amount_cents: 15400,
                     intent_amount_float: 154.0,
-                    formatted_intent_amount: '€154,00',
+                    formatted_intent_amount: "€154,00",
                     return_url: null,
                     payment_instrument: {
-                      issuer_type: 'card',
-                      card_type: 'visa',
-                      card_last_digits: '4242',
-                      card_expiry_month: '2',
-                      card_expiry_year: '2031'
-                    },
-                    created_at: '2023-05-16T11:06:16.338Z',
-                    updated_at: '2023-05-16T11:06:21.948Z',
+                      issuer_type: "card",
+                      card_type: "visa",
+                      card_last_digits: "4242",
+                      card_expiry_month: "2",
+                      card_expiry_year: "2031",
+                    },
+                    created_at: "2023-05-16T11:06:16.338Z",
+                    updated_at: "2023-05-16T11:06:21.948Z",
                     reference: null,
                     reference_origin: null,
-                    metadata: {}
+                    metadata: {},
                   },
                   relationships: {
                     order: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy/relationships/order',
+                        self: "https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy/relationships/order",
                         related:
-                          'https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy/order'
-                      }
+                          "https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy/order",
+                      },
                     },
                     payment_gateway: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy/relationships/payment_gateway',
+                        self: "https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy/relationships/payment_gateway",
                         related:
-                          'https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy/payment_gateway'
-                      }
+                          "https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy/payment_gateway",
+                      },
                     },
                     versions: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy/relationships/versions',
+                        self: "https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy/relationships/versions",
                         related:
-                          'https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy/versions'
-                      }
-                    }
+                          "https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy/versions",
+                      },
+                    },
                   },
-                  meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+                  meta: { mode: "test", organization_id: "WXlEOFrjnr" },
                 },
                 {
-                  id: 'vaoMtAZlXy',
-                  type: 'line_items',
+                  id: "vaoMtAZlXy",
+                  type: "line_items",
                   links: {
-                    self: 'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy'
+                    self: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy",
                   },
                   attributes: {
                     sku_code: null,
                     bundle_code: null,
                     quantity: 1,
-                    currency_code: 'EUR',
+                    currency_code: "EUR",
                     unit_amount_cents: -10000,
                     unit_amount_float: -100.0,
-                    formatted_unit_amount: '-€100,00',
+                    formatted_unit_amount: "-€100,00",
                     options_amount_cents: 0,
                     options_amount_float: 0.0,
-                    formatted_options_amount: '€0,00',
+                    formatted_options_amount: "€0,00",
                     discount_cents: 0,
                     discount_float: 0.0,
-                    formatted_discount: '€0,00',
+                    formatted_discount: "€0,00",
                     total_amount_cents: -10000,
                     total_amount_float: -100.0,
-                    formatted_total_amount: '-€100,00',
+                    formatted_total_amount: "-€100,00",
                     tax_amount_cents: 0,
                     tax_amount_float: 0.0,
-                    formatted_tax_amount: '€0,00',
-                    name: 'Gift card: €100,00',
+                    formatted_tax_amount: "€0,00",
+                    name: "Gift card: €100,00",
                     image_url: null,
                     discount_breakdown: {},
                     tax_rate: 0.0,
                     tax_breakdown: {},
-                    item_type: 'gift_cards',
+                    item_type: "gift_cards",
                     frequency: null,
-                    created_at: '2023-05-16T11:06:14.674Z',
-                    updated_at: '2023-05-16T11:06:14.674Z',
+                    created_at: "2023-05-16T11:06:14.674Z",
+                    updated_at: "2023-05-16T11:06:14.674Z",
                     reference: null,
                     reference_origin: null,
-                    metadata: {}
+                    metadata: {},
                   },
                   relationships: {
                     order: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/order',
+                        self: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/order",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/order'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/order",
+                      },
                     },
                     item: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/item',
-                        related:
-                          'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/item'
-                      }
+                        self: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/item",
+                        related: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/item",
+                      },
                     },
                     line_item_options: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/line_item_options',
+                        self: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/line_item_options",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/line_item_options'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/line_item_options",
+                      },
                     },
                     shipment_line_items: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/shipment_line_items',
+                        self: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/shipment_line_items",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/shipment_line_items'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/shipment_line_items",
+                      },
                     },
                     stock_reservations: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/stock_reservations',
+                        self: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/stock_reservations",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/stock_reservations'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/stock_reservations",
+                      },
                     },
                     stock_line_items: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/stock_line_items',
+                        self: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/stock_line_items",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/stock_line_items'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/stock_line_items",
+                      },
                     },
                     stock_transfers: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/stock_transfers',
+                        self: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/stock_transfers",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/stock_transfers'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/stock_transfers",
+                      },
                     },
                     events: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/events',
+                        self: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/events",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/events'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/events",
+                      },
                     },
                     tags: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/tags',
-                        related:
-                          'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/tags'
-                      }
-                    }
+                        self: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/tags",
+                        related: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/tags",
+                      },
+                    },
                   },
-                  meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+                  meta: { mode: "test", organization_id: "WXlEOFrjnr" },
                 },
                 {
-                  id: 'kmnptjPlBv',
-                  type: 'line_items',
+                  id: "kmnptjPlBv",
+                  type: "line_items",
                   links: {
-                    self: 'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv'
+                    self: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv",
                   },
                   attributes: {
                     sku_code: null,
                     bundle_code: null,
                     quantity: 1,
-                    currency_code: 'EUR',
+                    currency_code: "EUR",
                     unit_amount_cents: 1000,
                     unit_amount_float: 10.0,
-                    formatted_unit_amount: '€10,00',
+                    formatted_unit_amount: "€10,00",
                     options_amount_cents: 0,
                     options_amount_float: 0.0,
-                    formatted_options_amount: '€0,00',
+                    formatted_options_amount: "€0,00",
                     discount_cents: 0,
                     discount_float: 0.0,
-                    formatted_discount: '€0,00',
+                    formatted_discount: "€0,00",
                     total_amount_cents: 1000,
                     total_amount_float: 10.0,
-                    formatted_total_amount: '€10,00',
+                    formatted_total_amount: "€10,00",
                     tax_amount_cents: 0,
                     tax_amount_float: 0.0,
-                    formatted_tax_amount: '€0,00',
-                    name: 'Stripe Payment',
+                    formatted_tax_amount: "€0,00",
+                    name: "Stripe Payment",
                     image_url: null,
                     discount_breakdown: {},
                     tax_rate: 0.0,
                     tax_breakdown: {},
-                    item_type: 'payment_methods',
+                    item_type: "payment_methods",
                     frequency: null,
-                    created_at: '2023-05-16T11:06:14.629Z',
-                    updated_at: '2023-05-16T11:06:14.629Z',
+                    created_at: "2023-05-16T11:06:14.629Z",
+                    updated_at: "2023-05-16T11:06:14.629Z",
                     reference: null,
                     reference_origin: null,
-                    metadata: {}
+                    metadata: {},
                   },
                   relationships: {
                     order: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/order',
+                        self: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/order",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/order'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/order",
+                      },
                     },
                     item: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/item',
-                        related:
-                          'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/item'
-                      }
+                        self: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/item",
+                        related: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/item",
+                      },
                     },
                     line_item_options: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/line_item_options',
+                        self: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/line_item_options",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/line_item_options'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/line_item_options",
+                      },
                     },
                     shipment_line_items: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/shipment_line_items',
+                        self: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/shipment_line_items",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/shipment_line_items'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/shipment_line_items",
+                      },
                     },
                     stock_reservations: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/stock_reservations',
+                        self: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/stock_reservations",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/stock_reservations'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/stock_reservations",
+                      },
                     },
                     stock_line_items: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/stock_line_items',
+                        self: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/stock_line_items",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/stock_line_items'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/stock_line_items",
+                      },
                     },
                     stock_transfers: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/stock_transfers',
+                        self: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/stock_transfers",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/stock_transfers'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/stock_transfers",
+                      },
                     },
                     events: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/events',
+                        self: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/events",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/events'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/events",
+                      },
                     },
                     tags: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/tags',
-                        related:
-                          'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/tags'
-                      }
-                    }
+                        self: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/tags",
+                        related: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/tags",
+                      },
+                    },
                   },
-                  meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+                  meta: { mode: "test", organization_id: "WXlEOFrjnr" },
                 },
                 {
-                  id: 'vWEZtMGVKy',
-                  type: 'line_items',
+                  id: "vWEZtMGVKy",
+                  type: "line_items",
                   links: {
-                    self: 'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy'
+                    self: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy",
                   },
                   attributes: {
                     sku_code: null,
                     bundle_code: null,
                     quantity: 1,
-                    currency_code: 'EUR',
+                    currency_code: "EUR",
                     unit_amount_cents: 0,
                     unit_amount_float: 0.0,
-                    formatted_unit_amount: '€0,00',
+                    formatted_unit_amount: "€0,00",
                     options_amount_cents: 0,
                     options_amount_float: 0.0,
-                    formatted_options_amount: '€0,00',
+                    formatted_options_amount: "€0,00",
                     discount_cents: 0,
                     discount_float: 0.0,
-                    formatted_discount: '€0,00',
+                    formatted_discount: "€0,00",
                     total_amount_cents: 0,
                     total_amount_float: 0.0,
-                    formatted_total_amount: '€0,00',
+                    formatted_total_amount: "€0,00",
                     tax_amount_cents: 0,
                     tax_amount_float: 0.0,
-                    formatted_tax_amount: '€0,00',
-                    name: 'Shipment #2485862/S/001',
+                    formatted_tax_amount: "€0,00",
+                    name: "Shipment #2485862/S/001",
                     image_url: null,
                     discount_breakdown: {},
                     tax_rate: 0.0,
                     tax_breakdown: {},
-                    item_type: 'shipments',
+                    item_type: "shipments",
                     frequency: null,
-                    created_at: '2023-05-16T11:06:09.728Z',
-                    updated_at: '2023-05-16T11:06:09.728Z',
+                    created_at: "2023-05-16T11:06:09.728Z",
+                    updated_at: "2023-05-16T11:06:09.728Z",
                     reference: null,
                     reference_origin: null,
-                    metadata: {}
+                    metadata: {},
                   },
                   relationships: {
                     order: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/order',
+                        self: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/order",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/order'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/order",
+                      },
                     },
                     item: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/item',
-                        related:
-                          'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/item'
-                      }
+                        self: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/item",
+                        related: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/item",
+                      },
                     },
                     line_item_options: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/line_item_options',
+                        self: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/line_item_options",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/line_item_options'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/line_item_options",
+                      },
                     },
                     shipment_line_items: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/shipment_line_items',
+                        self: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/shipment_line_items",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/shipment_line_items'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/shipment_line_items",
+                      },
                     },
                     stock_reservations: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/stock_reservations',
+                        self: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/stock_reservations",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/stock_reservations'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/stock_reservations",
+                      },
                     },
                     stock_line_items: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/stock_line_items',
+                        self: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/stock_line_items",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/stock_line_items'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/stock_line_items",
+                      },
                     },
                     stock_transfers: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/stock_transfers',
+                        self: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/stock_transfers",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/stock_transfers'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/stock_transfers",
+                      },
                     },
                     events: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/events',
+                        self: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/events",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/events'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/events",
+                      },
                     },
                     tags: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/tags',
-                        related:
-                          'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/tags'
-                      }
-                    }
+                        self: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/tags",
+                        related: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/tags",
+                      },
+                    },
                   },
-                  meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+                  meta: { mode: "test", organization_id: "WXlEOFrjnr" },
                 },
                 {
-                  id: 'NqYatGaKnN',
-                  type: 'line_items',
+                  id: "NqYatGaKnN",
+                  type: "line_items",
                   links: {
-                    self: 'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN'
+                    self: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN",
                   },
                   attributes: {
                     sku_code: null,
                     bundle_code: null,
                     quantity: 1,
-                    currency_code: 'EUR',
+                    currency_code: "EUR",
                     unit_amount_cents: 0,
                     unit_amount_float: 0.0,
-                    formatted_unit_amount: '€0,00',
+                    formatted_unit_amount: "€0,00",
                     options_amount_cents: 0,
                     options_amount_float: 0.0,
-                    formatted_options_amount: '€0,00',
+                    formatted_options_amount: "€0,00",
                     discount_cents: 0,
                     discount_float: 0.0,
-                    formatted_discount: '€0,00',
+                    formatted_discount: "€0,00",
                     total_amount_cents: 0,
                     total_amount_float: 0.0,
-                    formatted_total_amount: '€0,00',
+                    formatted_total_amount: "€0,00",
                     tax_amount_cents: 0,
                     tax_amount_float: 0.0,
-                    formatted_tax_amount: '€0,00',
-                    name: 'Shipment #2485862/S/002',
+                    formatted_tax_amount: "€0,00",
+                    name: "Shipment #2485862/S/002",
                     image_url: null,
                     discount_breakdown: {},
                     tax_rate: 0.0,
                     tax_breakdown: {},
-                    item_type: 'shipments',
+                    item_type: "shipments",
                     frequency: null,
-                    created_at: '2023-05-16T11:06:09.602Z',
-                    updated_at: '2023-05-16T11:06:09.602Z',
+                    created_at: "2023-05-16T11:06:09.602Z",
+                    updated_at: "2023-05-16T11:06:09.602Z",
                     reference: null,
                     reference_origin: null,
-                    metadata: {}
+                    metadata: {},
                   },
                   relationships: {
                     order: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/order',
+                        self: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/order",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/order'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/order",
+                      },
                     },
                     item: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/item',
-                        related:
-                          'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/item'
-                      }
+                        self: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/item",
+                        related: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/item",
+                      },
                     },
                     line_item_options: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/line_item_options',
+                        self: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/line_item_options",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/line_item_options'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/line_item_options",
+                      },
                     },
                     shipment_line_items: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/shipment_line_items',
+                        self: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/shipment_line_items",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/shipment_line_items'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/shipment_line_items",
+                      },
                     },
                     stock_reservations: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/stock_reservations',
+                        self: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/stock_reservations",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/stock_reservations'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/stock_reservations",
+                      },
                     },
                     stock_line_items: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/stock_line_items',
+                        self: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/stock_line_items",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/stock_line_items'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/stock_line_items",
+                      },
                     },
                     stock_transfers: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/stock_transfers',
+                        self: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/stock_transfers",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/stock_transfers'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/stock_transfers",
+                      },
                     },
                     events: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/events',
+                        self: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/events",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/events'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/events",
+                      },
                     },
                     tags: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/tags',
-                        related:
-                          'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/tags'
-                      }
-                    }
+                        self: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/tags",
+                        related: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/tags",
+                      },
+                    },
                   },
-                  meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+                  meta: { mode: "test", organization_id: "WXlEOFrjnr" },
                 },
                 {
-                  id: 'NoEntBwEdk',
-                  type: 'line_items',
+                  id: "NoEntBwEdk",
+                  type: "line_items",
                   links: {
-                    self: 'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk'
+                    self: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk",
                   },
                   attributes: {
-                    sku_code: 'TSHIRTMMFFFFFF000000XLXX',
+                    sku_code: "TSHIRTMMFFFFFF000000XLXX",
                     bundle_code: null,
                     quantity: 5,
-                    currency_code: 'EUR',
+                    currency_code: "EUR",
                     unit_amount_cents: 2900,
                     unit_amount_float: 29.0,
-                    formatted_unit_amount: '€29,00',
+                    formatted_unit_amount: "€29,00",
                     options_amount_cents: 0,
                     options_amount_float: 0.0,
-                    formatted_options_amount: '€0,00',
+                    formatted_options_amount: "€0,00",
                     discount_cents: -5943,
                     discount_float: -59.43,
-                    formatted_discount: '-€59,43',
+                    formatted_discount: "-€59,43",
                     total_amount_cents: 14500,
                     total_amount_float: 145.0,
-                    formatted_total_amount: '€145,00',
+                    formatted_total_amount: "€145,00",
                     tax_amount_cents: 0,
                     tax_amount_float: 0.0,
-                    formatted_tax_amount: '€0,00',
-                    name: 'White Men T-Shirt with Black Logo (XL)',
+                    formatted_tax_amount: "€0,00",
+                    name: "White Men T-Shirt with Black Logo (XL)",
                     image_url:
-                      'https://data.commercelayer.app/seed/images/skus/TSHIRTMSFFFFFF000000XLXX_FLAT.png',
+                      "https://data.commercelayer.app/seed/images/skus/TSHIRTMSFFFFFF000000XLXX_FLAT.png",
                     discount_breakdown: {
-                      vaoMtAZlXy: { cents: -5943, weight: 0.5942622950819673 }
+                      vaoMtAZlXy: { cents: -5943, weight: 0.5942622950819673 },
                     },
                     tax_rate: 0.0,
                     tax_breakdown: {},
-                    item_type: 'skus',
+                    item_type: "skus",
                     frequency: null,
-                    created_at: '2023-05-16T11:06:02.458Z',
-                    updated_at: '2023-05-16T11:06:02.458Z',
+                    created_at: "2023-05-16T11:06:02.458Z",
+                    updated_at: "2023-05-16T11:06:02.458Z",
                     reference: null,
                     reference_origin: null,
-                    metadata: {}
+                    metadata: {},
                   },
                   relationships: {
                     order: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/order',
+                        self: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/order",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/order'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/order",
+                      },
                     },
                     item: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/item',
-                        related:
-                          'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/item'
-                      }
+                        self: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/item",
+                        related: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/item",
+                      },
                     },
                     line_item_options: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/line_item_options',
+                        self: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/line_item_options",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/line_item_options'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/line_item_options",
+                      },
                     },
                     shipment_line_items: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/shipment_line_items',
+                        self: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/shipment_line_items",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/shipment_line_items'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/shipment_line_items",
+                      },
                     },
                     stock_reservations: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/stock_reservations',
+                        self: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/stock_reservations",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/stock_reservations'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/stock_reservations",
+                      },
                     },
                     stock_line_items: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/stock_line_items',
+                        self: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/stock_line_items",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/stock_line_items'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/stock_line_items",
+                      },
                     },
                     stock_transfers: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/stock_transfers',
+                        self: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/stock_transfers",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/stock_transfers'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/stock_transfers",
+                      },
                     },
                     events: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/events',
+                        self: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/events",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/events'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/events",
+                      },
                     },
                     tags: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/tags',
-                        related:
-                          'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/tags'
-                      }
-                    }
+                        self: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/tags",
+                        related: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/tags",
+                      },
+                    },
                   },
-                  meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+                  meta: { mode: "test", organization_id: "WXlEOFrjnr" },
                 },
                 {
-                  id: 'NlQmtMAnGy',
-                  type: 'line_items',
+                  id: "NlQmtMAnGy",
+                  type: "line_items",
                   links: {
-                    self: 'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy'
+                    self: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy",
                   },
                   attributes: {
-                    sku_code: 'CANVASAU000000FFFFFF1824',
+                    sku_code: "CANVASAU000000FFFFFF1824",
                     bundle_code: null,
                     quantity: 1,
-                    currency_code: 'EUR',
+                    currency_code: "EUR",
                     unit_amount_cents: 9900,
                     unit_amount_float: 99.0,
-                    formatted_unit_amount: '€99,00',
+                    formatted_unit_amount: "€99,00",
                     options_amount_cents: 0,
                     options_amount_float: 0.0,
-                    formatted_options_amount: '€0,00',
+                    formatted_options_amount: "€0,00",
                     discount_cents: -4057,
                     discount_float: -40.57,
-                    formatted_discount: '-€40,57',
+                    formatted_discount: "-€40,57",
                     total_amount_cents: 9900,
                     total_amount_float: 99.0,
-                    formatted_total_amount: '€99,00',
+                    formatted_total_amount: "€99,00",
                     tax_amount_cents: 0,
                     tax_amount_float: 0.0,
-                    formatted_tax_amount: '€0,00',
-                    name: 'Black Canvas with White Logo (18x24)',
+                    formatted_tax_amount: "€0,00",
+                    name: "Black Canvas with White Logo (18x24)",
                     image_url:
-                      'https://img.commercelayer.io/skus/CANVASAU000000FFFFFF.png?fm=jpg&q=90',
+                      "https://img.commercelayer.io/skus/CANVASAU000000FFFFFF.png?fm=jpg&q=90",
                     discount_breakdown: {
-                      vaoMtAZlXy: { cents: -4057, weight: 0.4057377049180328 }
+                      vaoMtAZlXy: { cents: -4057, weight: 0.4057377049180328 },
                     },
                     tax_rate: 0.0,
                     tax_breakdown: {},
-                    item_type: 'skus',
+                    item_type: "skus",
                     frequency: null,
-                    created_at: '2023-05-16T11:06:02.444Z',
-                    updated_at: '2023-05-16T11:06:02.444Z',
+                    created_at: "2023-05-16T11:06:02.444Z",
+                    updated_at: "2023-05-16T11:06:02.444Z",
                     reference: null,
                     reference_origin: null,
-                    metadata: {}
+                    metadata: {},
                   },
                   relationships: {
                     order: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/order',
+                        self: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/order",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/order'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/order",
+                      },
                     },
                     item: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/item',
-                        related:
-                          'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/item'
-                      }
+                        self: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/item",
+                        related: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/item",
+                      },
                     },
                     line_item_options: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/line_item_options',
+                        self: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/line_item_options",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/line_item_options'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/line_item_options",
+                      },
                     },
                     shipment_line_items: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/shipment_line_items',
+                        self: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/shipment_line_items",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/shipment_line_items'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/shipment_line_items",
+                      },
                     },
                     stock_reservations: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/stock_reservations',
+                        self: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/stock_reservations",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/stock_reservations'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/stock_reservations",
+                      },
                     },
                     stock_line_items: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/stock_line_items',
+                        self: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/stock_line_items",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/stock_line_items'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/stock_line_items",
+                      },
                     },
                     stock_transfers: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/stock_transfers',
+                        self: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/stock_transfers",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/stock_transfers'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/stock_transfers",
+                      },
                     },
                     events: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/events',
+                        self: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/events",
                         related:
-                          'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/events'
-                      }
+                          "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/events",
+                      },
                     },
                     tags: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/tags',
-                        related:
-                          'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/tags'
-                      }
-                    }
+                        self: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/tags",
+                        related: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/tags",
+                      },
+                    },
                   },
-                  meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+                  meta: { mode: "test", organization_id: "WXlEOFrjnr" },
                 },
                 {
-                  id: 'YpLwCnNQgY',
-                  type: 'shipments',
+                  id: "YpLwCnNQgY",
+                  type: "shipments",
                   links: {
-                    self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY'
+                    self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY",
                   },
                   attributes: {
-                    number: '2485862/S/001',
-                    status: 'on_hold',
-                    currency_code: 'EUR',
+                    number: "2485862/S/001",
+                    status: "on_hold",
+                    currency_code: "EUR",
                     cost_amount_cents: 0,
                     cost_amount_float: 0.0,
-                    formatted_cost_amount: '$0.00',
+                    formatted_cost_amount: "$0.00",
                     skus_count: 5,
                     selected_rate_id: null,
                     rates: [],
@@ -1532,146 +1493,145 @@ const orderDetail = http.get(
                     purchase_started_at: null,
                     purchase_completed_at: null,
                     purchase_failed_at: null,
-                    on_hold_at: '2023-07-21T14:12:13.287Z',
-                    picking_at: '2023-07-21T14:12:08.574Z',
-                    packing_at: '2023-07-21T14:10:54.107Z',
+                    on_hold_at: "2023-07-21T14:12:13.287Z",
+                    picking_at: "2023-07-21T14:12:08.574Z",
+                    packing_at: "2023-07-21T14:10:54.107Z",
                     ready_to_ship_at: null,
                     shipped_at: null,
-                    created_at: '2023-05-16T11:06:07.685Z',
-                    updated_at: '2023-07-21T14:12:13.286Z',
+                    created_at: "2023-05-16T11:06:07.685Z",
+                    updated_at: "2023-07-21T14:12:13.286Z",
                     reference: null,
                     reference_origin: null,
-                    metadata: {}
+                    metadata: {},
                   },
                   relationships: {
                     order: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/order',
-                        related:
-                          'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/order'
-                      }
+                        self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/order",
+                        related: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/order",
+                      },
                     },
                     shipping_category: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/shipping_category',
+                        self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/shipping_category",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/shipping_category'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/shipping_category",
+                      },
                     },
                     stock_location: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/stock_location',
+                        self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/stock_location",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/stock_location'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/stock_location",
+                      },
                     },
                     origin_address: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/origin_address',
+                        self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/origin_address",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/origin_address'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/origin_address",
+                      },
                     },
                     shipping_address: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/shipping_address',
+                        self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/shipping_address",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/shipping_address'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/shipping_address",
+                      },
                     },
                     shipping_method: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/shipping_method',
+                        self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/shipping_method",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/shipping_method'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/shipping_method",
+                      },
                     },
                     delivery_lead_time: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/delivery_lead_time',
+                        self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/delivery_lead_time",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/delivery_lead_time'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/delivery_lead_time",
+                      },
                     },
                     shipment_line_items: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/shipment_line_items',
+                        self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/shipment_line_items",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/shipment_line_items'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/shipment_line_items",
+                      },
                     },
                     stock_line_items: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/stock_line_items',
+                        self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/stock_line_items",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/stock_line_items'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/stock_line_items",
+                      },
                     },
                     stock_transfers: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/stock_transfers',
+                        self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/stock_transfers",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/stock_transfers'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/stock_transfers",
+                      },
                     },
                     available_shipping_methods: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/available_shipping_methods',
+                        self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/available_shipping_methods",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/available_shipping_methods'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/available_shipping_methods",
+                      },
                     },
                     carrier_accounts: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/carrier_accounts',
+                        self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/carrier_accounts",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/carrier_accounts'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/carrier_accounts",
+                      },
                     },
                     parcels: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/parcels',
+                        self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/parcels",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/parcels'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/parcels",
+                      },
                     },
                     attachments: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/attachments',
+                        self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/attachments",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/attachments'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/attachments",
+                      },
                     },
                     events: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/events',
+                        self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/events",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/events'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/events",
+                      },
                     },
                     versions: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/versions',
+                        self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/versions",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/versions'
-                      }
-                    }
+                          "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/versions",
+                      },
+                    },
                   },
-                  meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+                  meta: { mode: "test", organization_id: "WXlEOFrjnr" },
                 },
                 {
-                  id: 'PabvCpOxRy',
-                  type: 'shipments',
+                  id: "PabvCpOxRy",
+                  type: "shipments",
                   links: {
-                    self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy'
+                    self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy",
                   },
                   attributes: {
-                    number: '2485862/S/002',
-                    status: 'shipped',
-                    currency_code: 'EUR',
+                    number: "2485862/S/002",
+                    status: "shipped",
+                    currency_code: "EUR",
                     cost_amount_cents: 0,
                     cost_amount_float: 0.0,
-                    formatted_cost_amount: '$0.00',
+                    formatted_cost_amount: "$0.00",
                     skus_count: 1,
                     selected_rate_id: null,
                     rates: [],
@@ -1684,152 +1644,151 @@ const orderDetail = http.get(
                     purchase_completed_at: null,
                     purchase_failed_at: null,
                     on_hold_at: null,
-                    picking_at: '2023-05-16T14:18:35.559Z',
-                    packing_at: '2023-05-16T14:20:24.459Z',
-                    ready_to_ship_at: '2023-05-16T14:21:43.665Z',
-                    shipped_at: '2023-05-16T14:22:42.632Z',
-                    created_at: '2023-05-16T11:06:07.711Z',
-                    updated_at: '2023-05-16T14:22:42.633Z',
+                    picking_at: "2023-05-16T14:18:35.559Z",
+                    packing_at: "2023-05-16T14:20:24.459Z",
+                    ready_to_ship_at: "2023-05-16T14:21:43.665Z",
+                    shipped_at: "2023-05-16T14:22:42.632Z",
+                    created_at: "2023-05-16T11:06:07.711Z",
+                    updated_at: "2023-05-16T14:22:42.633Z",
                     reference: null,
                     reference_origin: null,
-                    metadata: {}
+                    metadata: {},
                   },
                   relationships: {
                     order: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/order',
-                        related:
-                          'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/order'
-                      }
+                        self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/order",
+                        related: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/order",
+                      },
                     },
                     shipping_category: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/shipping_category',
+                        self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/shipping_category",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/shipping_category'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/shipping_category",
+                      },
                     },
                     stock_location: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/stock_location',
+                        self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/stock_location",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/stock_location'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/stock_location",
+                      },
                     },
                     origin_address: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/origin_address',
+                        self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/origin_address",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/origin_address'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/origin_address",
+                      },
                     },
                     shipping_address: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/shipping_address',
+                        self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/shipping_address",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/shipping_address'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/shipping_address",
+                      },
                     },
                     shipping_method: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/shipping_method',
+                        self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/shipping_method",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/shipping_method'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/shipping_method",
+                      },
                     },
                     delivery_lead_time: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/delivery_lead_time',
+                        self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/delivery_lead_time",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/delivery_lead_time'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/delivery_lead_time",
+                      },
                     },
                     shipment_line_items: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/shipment_line_items',
+                        self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/shipment_line_items",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/shipment_line_items'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/shipment_line_items",
+                      },
                     },
                     stock_line_items: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/stock_line_items',
+                        self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/stock_line_items",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/stock_line_items'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/stock_line_items",
+                      },
                     },
                     stock_transfers: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/stock_transfers',
+                        self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/stock_transfers",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/stock_transfers'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/stock_transfers",
+                      },
                     },
                     available_shipping_methods: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/available_shipping_methods',
+                        self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/available_shipping_methods",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/available_shipping_methods'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/available_shipping_methods",
+                      },
                     },
                     carrier_accounts: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/carrier_accounts',
+                        self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/carrier_accounts",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/carrier_accounts'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/carrier_accounts",
+                      },
                     },
                     parcels: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/parcels',
+                        self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/parcels",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/parcels'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/parcels",
+                      },
                     },
                     attachments: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/attachments',
+                        self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/attachments",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/attachments'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/attachments",
+                      },
                     },
                     events: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/events',
+                        self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/events",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/events'
-                      }
+                          "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/events",
+                      },
                     },
                     versions: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/versions',
+                        self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/versions",
                         related:
-                          'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/versions'
-                      }
-                    }
+                          "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/versions",
+                      },
+                    },
                   },
-                  meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+                  meta: { mode: "test", organization_id: "WXlEOFrjnr" },
                 },
                 {
-                  id: 'nKZkPUDBVj',
-                  type: 'authorizations',
+                  id: "nKZkPUDBVj",
+                  type: "authorizations",
                   links: {
-                    self: 'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj'
+                    self: "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj",
                   },
                   attributes: {
-                    number: '2485862/T/001',
-                    currency_code: 'EUR',
+                    number: "2485862/T/001",
+                    currency_code: "EUR",
                     amount_cents: 15400,
                     amount_float: 154.0,
-                    formatted_amount: '€154,00',
+                    formatted_amount: "€154,00",
                     succeeded: true,
-                    message: 'Success!',
+                    message: "Success!",
                     error_code: null,
                     error_detail: null,
-                    token: 'pi_3N8LhsK5j6INEBBI0JicoLOo',
-                    gateway_transaction_id: 'pi_3N8LhsK5j6INEBBI0JicoLOo',
-                    created_at: '2023-05-16T11:06:21.964Z',
-                    updated_at: '2023-05-16T11:06:21.964Z',
+                    token: "pi_3N8LhsK5j6INEBBI0JicoLOo",
+                    gateway_transaction_id: "pi_3N8LhsK5j6INEBBI0JicoLOo",
+                    created_at: "2023-05-16T11:06:21.964Z",
+                    updated_at: "2023-05-16T11:06:21.964Z",
                     reference: null,
                     reference_origin: null,
                     metadata: {},
@@ -1840,164 +1799,162 @@ const orderDetail = http.get(
                     fraud_review: null,
                     capture_amount_cents: 0,
                     capture_amount_float: 0.0,
-                    formatted_capture_amount: '€0,00',
+                    formatted_capture_amount: "€0,00",
                     capture_balance_cents: 0,
                     capture_balance_float: 0.0,
-                    formatted_capture_balance: '€0,00',
+                    formatted_capture_balance: "€0,00",
                     void_balance_cents: 15400,
                     void_balance_float: 154.0,
-                    formatted_void_balance: '€154,00'
+                    formatted_void_balance: "€154,00",
                   },
                   relationships: {
                     order: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/relationships/order',
+                        self: "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/relationships/order",
                         related:
-                          'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/order'
-                      }
+                          "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/order",
+                      },
                     },
                     attachments: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/relationships/attachments',
+                        self: "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/relationships/attachments",
                         related:
-                          'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/attachments'
-                      }
+                          "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/attachments",
+                      },
                     },
                     versions: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/relationships/versions',
+                        self: "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/relationships/versions",
                         related:
-                          'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/versions'
-                      }
+                          "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/versions",
+                      },
                     },
                     captures: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/relationships/captures',
+                        self: "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/relationships/captures",
                         related:
-                          'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/captures'
-                      }
+                          "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/captures",
+                      },
                     },
                     voids: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/relationships/voids',
+                        self: "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/relationships/voids",
                         related:
-                          'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/voids'
-                      }
+                          "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/voids",
+                      },
                     },
                     events: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/relationships/events',
+                        self: "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/relationships/events",
                         related:
-                          'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/events'
-                      }
-                    }
+                          "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/events",
+                      },
+                    },
                   },
-                  meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+                  meta: { mode: "test", organization_id: "WXlEOFrjnr" },
                 },
                 {
-                  id: 'kyAnxUgegE',
-                  type: 'captures',
+                  id: "kyAnxUgegE",
+                  type: "captures",
                   links: {
-                    self: 'https://alessani.commercelayer.co/api/captures/kyAnxUgegE'
+                    self: "https://alessani.commercelayer.co/api/captures/kyAnxUgegE",
                   },
                   attributes: {
-                    number: '2485862/T/002',
-                    currency_code: 'EUR',
+                    number: "2485862/T/002",
+                    currency_code: "EUR",
                     amount_cents: 15400,
                     amount_float: 154.0,
-                    formatted_amount: '€154,00',
+                    formatted_amount: "€154,00",
                     succeeded: true,
-                    message: 'Success!',
+                    message: "Success!",
                     error_code: null,
                     error_detail: null,
-                    token: 'pi_3N8LhsK5j6INEBBI0JicoLOo',
-                    gateway_transaction_id: 'pi_3N8LhsK5j6INEBBI0JicoLOo',
-                    created_at: '2023-05-16T14:18:35.368Z',
-                    updated_at: '2023-05-16T14:18:35.368Z',
+                    token: "pi_3N8LhsK5j6INEBBI0JicoLOo",
+                    gateway_transaction_id: "pi_3N8LhsK5j6INEBBI0JicoLOo",
+                    created_at: "2023-05-16T14:18:35.368Z",
+                    updated_at: "2023-05-16T14:18:35.368Z",
                     reference: null,
                     reference_origin: null,
                     metadata: {},
                     refund_amount_cents: 15400,
                     refund_amount_float: 154.0,
-                    formatted_refund_amount: '€154,00',
+                    formatted_refund_amount: "€154,00",
                     refund_balance_cents: 15400,
                     refund_balance_float: 154.0,
-                    formatted_refund_balance: '€154,00'
+                    formatted_refund_balance: "€154,00",
                   },
                   relationships: {
                     order: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/captures/kyAnxUgegE/relationships/order',
-                        related:
-                          'https://alessani.commercelayer.co/api/captures/kyAnxUgegE/order'
-                      }
+                        self: "https://alessani.commercelayer.co/api/captures/kyAnxUgegE/relationships/order",
+                        related: "https://alessani.commercelayer.co/api/captures/kyAnxUgegE/order",
+                      },
                     },
                     attachments: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/captures/kyAnxUgegE/relationships/attachments',
+                        self: "https://alessani.commercelayer.co/api/captures/kyAnxUgegE/relationships/attachments",
                         related:
-                          'https://alessani.commercelayer.co/api/captures/kyAnxUgegE/attachments'
-                      }
+                          "https://alessani.commercelayer.co/api/captures/kyAnxUgegE/attachments",
+                      },
                     },
                     versions: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/captures/kyAnxUgegE/relationships/versions',
+                        self: "https://alessani.commercelayer.co/api/captures/kyAnxUgegE/relationships/versions",
                         related:
-                          'https://alessani.commercelayer.co/api/captures/kyAnxUgegE/versions'
-                      }
+                          "https://alessani.commercelayer.co/api/captures/kyAnxUgegE/versions",
+                      },
                     },
                     reference_authorization: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/captures/kyAnxUgegE/relationships/reference_authorization',
+                        self: "https://alessani.commercelayer.co/api/captures/kyAnxUgegE/relationships/reference_authorization",
                         related:
-                          'https://alessani.commercelayer.co/api/captures/kyAnxUgegE/reference_authorization'
-                      }
+                          "https://alessani.commercelayer.co/api/captures/kyAnxUgegE/reference_authorization",
+                      },
                     },
                     refunds: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/captures/kyAnxUgegE/relationships/refunds',
+                        self: "https://alessani.commercelayer.co/api/captures/kyAnxUgegE/relationships/refunds",
                         related:
-                          'https://alessani.commercelayer.co/api/captures/kyAnxUgegE/refunds'
-                      }
+                          "https://alessani.commercelayer.co/api/captures/kyAnxUgegE/refunds",
+                      },
                     },
                     events: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/captures/kyAnxUgegE/relationships/events',
-                        related:
-                          'https://alessani.commercelayer.co/api/captures/kyAnxUgegE/events'
-                      }
-                    }
+                        self: "https://alessani.commercelayer.co/api/captures/kyAnxUgegE/relationships/events",
+                        related: "https://alessani.commercelayer.co/api/captures/kyAnxUgegE/events",
+                      },
+                    },
                   },
-                  meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+                  meta: { mode: "test", organization_id: "WXlEOFrjnr" },
                 },
                 {
-                  id: 'EqGrksxWNW',
-                  type: 'attachments',
+                  id: "EqGrksxWNW",
+                  type: "attachments",
                   links: {
-                    self: 'https://alessani.commercelayer.co/api/attachments/EqGrksxWNW'
+                    self: "https://alessani.commercelayer.co/api/attachments/EqGrksxWNW",
                   },
                   attributes: {
-                    name: 'M. Montalbano',
-                    description: 'Ehi there!',
+                    name: "M. Montalbano",
+                    description: "Ehi there!",
                     url: null,
-                    created_at: '2023-07-20T13:58:52.184Z',
-                    updated_at: '2023-07-20T13:58:52.184Z',
+                    created_at: "2023-07-20T13:58:52.184Z",
+                    updated_at: "2023-07-20T13:58:52.184Z",
                     reference: null,
-                    reference_origin: 'app-orders--note',
-                    metadata: {}
+                    reference_origin: "app-orders--note",
+                    metadata: {},
                   },
                   relationships: {
                     attachable: {
                       links: {
-                        self: 'https://alessani.commercelayer.co/api/attachments/EqGrksxWNW/relationships/attachable',
+                        self: "https://alessani.commercelayer.co/api/attachments/EqGrksxWNW/relationships/attachable",
                         related:
-                          'https://alessani.commercelayer.co/api/attachments/EqGrksxWNW/attachable'
-                      }
-                    }
+                          "https://alessani.commercelayer.co/api/attachments/EqGrksxWNW/attachable",
+                      },
+                    },
                   },
-                  meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
-                }
-              ]
+                  meta: { mode: "test", organization_id: "WXlEOFrjnr" },
+                },
+              ],
             })
           )
         )
@@ -2013,1701 +1970,1625 @@ function getRandomFormattedPrice() {
 function getRandomOrderStatus() {
   const statues = [
     {
-      status: 'placed',
-      payment_status: 'authorized',
-      fulfillment_status: 'unfulfilled'
+      status: "placed",
+      payment_status: "authorized",
+      fulfillment_status: "unfulfilled",
     },
     {
-      status: 'approved',
-      payment_status: 'paid',
-      fulfillment_status: 'in_progress'
+      status: "approved",
+      payment_status: "paid",
+      fulfillment_status: "in_progress",
     },
     {
-      status: 'approved',
-      payment_status: 'paid',
-      fulfillment_status: 'fulfilled'
-    }
+      status: "approved",
+      payment_status: "paid",
+      fulfillment_status: "fulfilled",
+    },
   ]
   return statues[Math.floor(Math.random() * statues.length)]
 }
 
-const orderList = http.get(
-  'https://mock.localhost/api/orders',
-  async (req, res, ctx) => {
-    const currentPage = parseInt(
-      req.url.searchParams.get('page[number]') ?? '1'
-    )
-    const itemPerPage = parseInt(req.url.searchParams.get('page[size]') ?? '5')
-    const pageCount = itemPerPage <= 5 ? 1 : 3
+const orderList = http.get("https://mock.localhost/api/orders", async (req, res, ctx) => {
+  const currentPage = parseInt(req.url.searchParams.get("page[number]") ?? "1")
+  const itemPerPage = parseInt(req.url.searchParams.get("page[size]") ?? "5")
+  const pageCount = itemPerPage <= 5 ? 1 : 3
 
-    return res(
-      ctx.delay(2000),
-      ctx.status(200),
-      ctx.json({
-        data: Array(itemPerPage)
-          .fill(order)
-          .map((order, idx) => ({
-            ...order,
-            id: `mocked-${currentPage}-${idx}`,
-            attributes: {
-              ...order.attributes,
-              number: parseInt(`26372${currentPage}${idx}`, 10),
-              formatted_total_amount: getRandomFormattedPrice(),
-              ...getRandomOrderStatus()
-            }
-          })),
-        meta: {
-          record_count: itemPerPage * pageCount,
-          page_count: pageCount
-        },
-        included: [
-          {
-            id: 'dlQbPhNNop',
-            type: 'markets',
-            links: {
-              self: 'https://alessani.commercelayer.co/api/markets/dlQbPhNNop'
-            },
-            attributes: {
-              number: 350,
-              name: 'Europe',
-              facebook_pixel_id: null,
-              checkout_url: '',
-              external_prices_url:
-                'https://pippo.malessani.commercelayer.dev/api/verify',
-              external_order_validation_url: '',
-              private: false,
-              disabled_at: null,
-              created_at: '2022-03-11T09:40:49.000Z',
-              updated_at: '2023-03-13T13:30:32.184Z',
-              reference: 'market_1',
-              reference_origin: 'CLI',
-              metadata: {}
-            },
-            relationships: {
-              merchant: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/merchant',
-                  related:
-                    'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/merchant'
-                }
-              },
-              price_list: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/price_list',
-                  related:
-                    'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/price_list'
-                }
-              },
-              inventory_model: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/inventory_model',
-                  related:
-                    'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/inventory_model'
-                }
-              },
-              subscription_model: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/subscription_model',
-                  related:
-                    'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/subscription_model'
-                }
-              },
-              tax_calculator: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/tax_calculator',
-                  related:
-                    'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/tax_calculator'
-                }
-              },
-              customer_group: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/customer_group',
-                  related:
-                    'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/customer_group'
-                }
-              },
-              attachments: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/attachments',
-                  related:
-                    'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/attachments'
-                }
-              },
-              versions: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/versions',
-                  related:
-                    'https://alessani.commercelayer.co/api/markets/dlQbPhNNop/versions'
-                }
-              }
-            },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
-          },
-          {
-            id: 'JkAdBhNGjQ',
-            type: 'customers',
-            links: {
-              self: 'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ'
-            },
-            attributes: {
-              email: 'customer@tk.com',
-              status: 'repeat',
-              has_password: false,
-              total_orders_count: 2753,
-              created_at: '2022-03-14T09:13:06.633Z',
-              updated_at: '2023-07-31T09:13:06.049Z',
-              reference: null,
-              reference_origin: null,
-              metadata: {}
-            },
-            relationships: {
-              customer_group: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/customer_group',
-                  related:
-                    'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/customer_group'
-                }
-              },
-              customer_addresses: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/customer_addresses',
-                  related:
-                    'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/customer_addresses'
-                }
-              },
-              customer_payment_sources: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/customer_payment_sources',
-                  related:
-                    'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/customer_payment_sources'
-                }
-              },
-              customer_subscriptions: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/customer_subscriptions',
-                  related:
-                    'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/customer_subscriptions'
-                }
-              },
-              orders: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/orders',
-                  related:
-                    'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/orders'
-                }
-              },
-              order_subscriptions: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/order_subscriptions',
-                  related:
-                    'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/order_subscriptions'
-                }
-              },
-              returns: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/returns',
-                  related:
-                    'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/returns'
-                }
-              },
-              sku_lists: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/sku_lists',
-                  related:
-                    'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/sku_lists'
-                }
-              },
-              attachments: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/attachments',
-                  related:
-                    'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/attachments'
-                }
-              },
-              events: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/events',
-                  related:
-                    'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/events'
-                }
-              },
-              tags: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/tags',
-                  related:
-                    'https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/tags'
-                }
-              }
-            },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+  return res(
+    ctx.delay(2000),
+    ctx.status(200),
+    ctx.json({
+      data: Array(itemPerPage)
+        .fill(order)
+        .map((order, idx) => ({
+          ...order,
+          id: `mocked-${currentPage}-${idx}`,
+          attributes: {
+            ...order.attributes,
+            number: parseInt(`26372${currentPage}${idx}`, 10),
+            formatted_total_amount: getRandomFormattedPrice(),
+            ...getRandomOrderStatus(),
           },
-          {
-            id: 'dPoNukZmnB',
-            type: 'addresses',
-            links: {
-              self: 'https://alessani.commercelayer.co/api/addresses/dPoNukZmnB'
-            },
-            attributes: {
-              business: false,
-              first_name: 'Darth',
-              last_name: 'Vader',
-              company: null,
-              full_name: 'Darth Vader',
-              line_1: 'Via Morte Nera, 13',
-              line_2: 'Ragnatela, 99',
-              city: 'Cogorno',
-              zip_code: '16030',
-              state_code: 'GE',
-              country_code: 'IT',
-              phone: '+39 055 1234567890',
-              full_address:
-                'Via Morte Nera, 13 Ragnatela, 99, 16030 Cogorno GE (IT) +39 055 1234567890',
-              name: 'Darth Vader, Via Morte Nera, 13 Ragnatela, 99, 16030 Cogorno GE (IT) +39 055 1234567890',
-              email: null,
-              notes: null,
-              lat: null,
-              lng: null,
-              is_localized: false,
-              is_geocoded: false,
-              provider_name: null,
-              map_url: null,
-              static_map_url: null,
-              billing_info: 'ABCDEFGHIJKLMNOPQRSTUVWYXZ',
-              created_at: '2023-05-16T11:06:07.638Z',
-              updated_at: '2023-05-16T11:06:07.638Z',
-              reference: null,
-              reference_origin: null,
-              metadata: {}
-            },
-            relationships: {
-              geocoder: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/relationships/geocoder',
-                  related:
-                    'https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/geocoder'
-                }
-              },
-              events: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/relationships/events',
-                  related:
-                    'https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/events'
-                }
-              },
-              tags: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/relationships/tags',
-                  related:
-                    'https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/tags'
-                }
-              },
-              versions: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/relationships/versions',
-                  related:
-                    'https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/versions'
-                }
-              }
-            },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+        })),
+      meta: {
+        record_count: itemPerPage * pageCount,
+        page_count: pageCount,
+      },
+      included: [
+        {
+          id: "dlQbPhNNop",
+          type: "markets",
+          links: {
+            self: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop",
           },
-          {
-            id: 'dQxruwZDnB',
-            type: 'addresses',
-            links: {
-              self: 'https://alessani.commercelayer.co/api/addresses/dQxruwZDnB'
-            },
-            attributes: {
-              business: false,
-              first_name: 'Darth',
-              last_name: 'Vader',
-              company: null,
-              full_name: 'Darth Vader',
-              line_1: 'Via Morte Nera, 13',
-              line_2: 'Ragnatela, 99',
-              city: 'Cogorno',
-              zip_code: '16030',
-              state_code: 'GE',
-              country_code: 'IT',
-              phone: '+39 055 1234567890',
-              full_address:
-                'Via Morte Nera, 13 Ragnatela, 99, 16030 Cogorno GE (IT) +39 055 1234567890',
-              name: 'Darth Vader, Via Morte Nera, 13 Ragnatela, 99, 16030 Cogorno GE (IT) +39 055 1234567890',
-              email: null,
-              notes: null,
-              lat: null,
-              lng: null,
-              is_localized: false,
-              is_geocoded: false,
-              provider_name: null,
-              map_url: null,
-              static_map_url: null,
-              billing_info: 'ABCDEFGHIJKLMNOPQRSTUVWYXZ',
-              created_at: '2023-05-16T11:06:07.493Z',
-              updated_at: '2023-05-16T11:06:07.493Z',
-              reference: null,
-              reference_origin: null,
-              metadata: {}
-            },
-            relationships: {
-              geocoder: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/relationships/geocoder',
-                  related:
-                    'https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/geocoder'
-                }
-              },
-              events: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/relationships/events',
-                  related:
-                    'https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/events'
-                }
-              },
-              tags: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/relationships/tags',
-                  related:
-                    'https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/tags'
-                }
-              },
-              versions: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/relationships/versions',
-                  related:
-                    'https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/versions'
-                }
-              }
-            },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+          attributes: {
+            number: 350,
+            name: "Europe",
+            facebook_pixel_id: null,
+            checkout_url: "",
+            external_prices_url: "https://pippo.malessani.commercelayer.dev/api/verify",
+            external_order_validation_url: "",
+            private: false,
+            disabled_at: null,
+            created_at: "2022-03-11T09:40:49.000Z",
+            updated_at: "2023-03-13T13:30:32.184Z",
+            reference: "market_1",
+            reference_origin: "CLI",
+            metadata: {},
           },
-          {
-            id: 'wmBvQsARml',
-            type: 'payment_methods',
-            links: {
-              self: 'https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml'
-            },
-            attributes: {
-              payment_source_type: 'stripe_payments',
-              name: 'Stripe Payment',
-              currency_code: 'EUR',
-              moto: false,
-              require_capture: true,
-              auto_capture: false,
-              disabled_at: null,
-              price_amount_cents: 1000,
-              price_amount_float: 10.0,
-              formatted_price_amount: '€10,00',
-              auto_capture_max_amount_cents: null,
-              auto_capture_max_amount_float: null,
-              formatted_auto_capture_max_amount: null,
-              created_at: '2022-03-11T14:18:08.420Z',
-              updated_at: '2022-03-11T14:18:08.420Z',
-              reference: '',
-              reference_origin: '',
-              metadata: {}
-            },
-            relationships: {
-              market: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/relationships/market',
-                  related:
-                    'https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/market'
-                }
-              },
-              payment_gateway: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/relationships/payment_gateway',
-                  related:
-                    'https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/payment_gateway'
-                }
-              },
-              attachments: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/relationships/attachments',
-                  related:
-                    'https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/attachments'
-                }
-              },
-              versions: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/relationships/versions',
-                  related:
-                    'https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/versions'
-                }
-              }
-            },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+          relationships: {
+            merchant: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/merchant",
+                related: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/merchant",
+              },
+            },
+            price_list: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/price_list",
+                related: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/price_list",
+              },
+            },
+            inventory_model: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/inventory_model",
+                related: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/inventory_model",
+              },
+            },
+            subscription_model: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/subscription_model",
+                related:
+                  "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/subscription_model",
+              },
+            },
+            tax_calculator: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/tax_calculator",
+                related: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/tax_calculator",
+              },
+            },
+            customer_group: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/customer_group",
+                related: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/customer_group",
+              },
+            },
+            attachments: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/attachments",
+                related: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/attachments",
+              },
+            },
+            versions: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/relationships/versions",
+                related: "https://alessani.commercelayer.co/api/markets/dlQbPhNNop/versions",
+              },
+            },
           },
-          {
-            id: 'onXELSmbQy',
-            type: 'stripe_payments',
-            links: {
-              self: 'https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy'
-            },
-            attributes: {
-              client_secret:
-                'pi_3N8LhsK5j6INEBBI0JicoLOo_secret_CKWfEPSnvyBHIQrEfRXkrJYd7',
-              publishable_key:
-                'pk_test_51KH86yK5j6INEBBIdkXoh0UwOoOlAbFZc3b8j0vjRHKQHdaUfEJm24F0A9QkrQXVlgh1nXJCpWR6PG3epaUWzE2z00BdEe9fho',
-              options: {
-                id: 'pm_1N8LhuK5j6INEBBI71U1QOlu',
-                card: {
-                  brand: 'visa',
-                  last4: '4242',
-                  checks: {
-                    cvc_check: null,
-                    address_line1_check: null,
-                    address_postal_code_check: null
-                  },
-                  wallet: null,
-                  country: 'US',
-                  funding: 'credit',
-                  exp_year: 2031,
-                  networks: { available: ['visa'], preferred: null },
-                  exp_month: 2,
-                  generated_from: null,
-                  three_d_secure_usage: { supported: true }
-                },
-                type: 'card',
-                object: 'payment_method',
-                created: 1684235178,
-                customer: null,
-                livemode: false,
-                billing_details: {
-                  name: 'Darth Vader',
-                  email: 'customer@tk.com',
-                  phone: '+39 055 1234567890',
-                  address: {
-                    city: 'Cogorno',
-                    line1: 'Via Morte Nera, 13',
-                    line2: null,
-                    state: 'GE',
-                    country: 'IT',
-                    postal_code: '16030'
-                  }
-                },
-                setup_future_usage: 'off_session',
-                intent_amount_cents: 15400
-              },
-              payment_method: {
-                id: 'pm_1N8LhuK5j6INEBBIHXkK0FFF',
-                card: {
-                  brand: 'visa',
-                  last4: '4242',
-                  checks: {
-                    cvc_check: 'pass',
-                    address_line1_check: 'pass',
-                    address_postal_code_check: 'pass'
-                  },
-                  wallet: null,
-                  country: 'US',
-                  funding: 'credit',
-                  exp_year: 2031,
-                  networks: { available: ['visa'], preferred: null },
-                  exp_month: 2,
-                  fingerprint: 'bVaeOEKRmYhi20Nj',
-                  generated_from: null,
-                  three_d_secure_usage: { supported: true }
-                },
-                type: 'card',
-                object: 'payment_method',
-                created: 1684235179,
-                customer: null,
-                livemode: false,
-                metadata: {},
-                billing_details: {
-                  name: 'Darth Vader',
-                  email: 'customer@tk.com',
-                  phone: '+39 055 1234567890',
-                  address: {
-                    city: 'Cogorno',
-                    line1: 'Via Morte Nera, 13',
-                    line2: null,
-                    state: 'GE',
-                    country: 'IT',
-                    postal_code: '16030'
-                  }
-                }
-              },
-              mismatched_amounts: false,
-              intent_amount_cents: 15400,
-              intent_amount_float: 154.0,
-              formatted_intent_amount: '€154,00',
-              return_url: null,
-              payment_instrument: {
-                issuer_type: 'card',
-                card_type: 'visa',
-                card_last_digits: '4242',
-                card_expiry_month: '2',
-                card_expiry_year: '2031'
-              },
-              created_at: '2023-05-16T11:06:16.338Z',
-              updated_at: '2023-05-16T11:06:21.948Z',
-              reference: null,
-              reference_origin: null,
-              metadata: {}
-            },
-            relationships: {
-              order: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy/relationships/order',
-                  related:
-                    'https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy/order'
-                }
-              },
-              payment_gateway: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy/relationships/payment_gateway',
-                  related:
-                    'https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy/payment_gateway'
-                }
-              },
-              versions: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy/relationships/versions',
-                  related:
-                    'https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy/versions'
-                }
-              }
-            },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+          meta: { mode: "test", organization_id: "WXlEOFrjnr" },
+        },
+        {
+          id: "JkAdBhNGjQ",
+          type: "customers",
+          links: {
+            self: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ",
           },
-          {
-            id: 'vaoMtAZlXy',
-            type: 'line_items',
-            links: {
-              self: 'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy'
-            },
-            attributes: {
-              sku_code: null,
-              bundle_code: null,
-              quantity: 1,
-              currency_code: 'EUR',
-              unit_amount_cents: -10000,
-              unit_amount_float: -100.0,
-              formatted_unit_amount: '-€100,00',
-              options_amount_cents: 0,
-              options_amount_float: 0.0,
-              formatted_options_amount: '€0,00',
-              discount_cents: 0,
-              discount_float: 0.0,
-              formatted_discount: '€0,00',
-              total_amount_cents: -10000,
-              total_amount_float: -100.0,
-              formatted_total_amount: '-€100,00',
-              tax_amount_cents: 0,
-              tax_amount_float: 0.0,
-              formatted_tax_amount: '€0,00',
-              name: 'Gift card: €100,00',
-              image_url: null,
-              discount_breakdown: {},
-              tax_rate: 0.0,
-              tax_breakdown: {},
-              item_type: 'gift_cards',
-              frequency: null,
-              created_at: '2023-05-16T11:06:14.674Z',
-              updated_at: '2023-05-16T11:06:14.674Z',
-              reference: null,
-              reference_origin: null,
-              metadata: {}
-            },
-            relationships: {
-              order: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/order',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/order'
-                }
-              },
-              item: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/item',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/item'
-                }
-              },
-              line_item_options: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/line_item_options',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/line_item_options'
-                }
-              },
-              shipment_line_items: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/shipment_line_items',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/shipment_line_items'
-                }
-              },
-              stock_reservations: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/stock_reservations',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/stock_reservations'
-                }
-              },
-              stock_line_items: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/stock_line_items',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/stock_line_items'
-                }
-              },
-              stock_transfers: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/stock_transfers',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/stock_transfers'
-                }
-              },
-              events: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/events',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/events'
-                }
-              },
-              tags: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/tags',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/tags'
-                }
-              }
-            },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+          attributes: {
+            email: "customer@tk.com",
+            status: "repeat",
+            has_password: false,
+            total_orders_count: 2753,
+            created_at: "2022-03-14T09:13:06.633Z",
+            updated_at: "2023-07-31T09:13:06.049Z",
+            reference: null,
+            reference_origin: null,
+            metadata: {},
           },
-          {
-            id: 'kmnptjPlBv',
-            type: 'line_items',
-            links: {
-              self: 'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv'
-            },
-            attributes: {
-              sku_code: null,
-              bundle_code: null,
-              quantity: 1,
-              currency_code: 'EUR',
-              unit_amount_cents: 1000,
-              unit_amount_float: 10.0,
-              formatted_unit_amount: '€10,00',
-              options_amount_cents: 0,
-              options_amount_float: 0.0,
-              formatted_options_amount: '€0,00',
-              discount_cents: 0,
-              discount_float: 0.0,
-              formatted_discount: '€0,00',
-              total_amount_cents: 1000,
-              total_amount_float: 10.0,
-              formatted_total_amount: '€10,00',
-              tax_amount_cents: 0,
-              tax_amount_float: 0.0,
-              formatted_tax_amount: '€0,00',
-              name: 'Stripe Payment',
-              image_url: null,
-              discount_breakdown: {},
-              tax_rate: 0.0,
-              tax_breakdown: {},
-              item_type: 'payment_methods',
-              frequency: null,
-              created_at: '2023-05-16T11:06:14.629Z',
-              updated_at: '2023-05-16T11:06:14.629Z',
-              reference: null,
-              reference_origin: null,
-              metadata: {}
-            },
-            relationships: {
-              order: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/order',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/order'
-                }
-              },
-              item: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/item',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/item'
-                }
-              },
-              line_item_options: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/line_item_options',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/line_item_options'
-                }
-              },
-              shipment_line_items: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/shipment_line_items',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/shipment_line_items'
-                }
-              },
-              stock_reservations: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/stock_reservations',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/stock_reservations'
-                }
-              },
-              stock_line_items: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/stock_line_items',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/stock_line_items'
-                }
-              },
-              stock_transfers: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/stock_transfers',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/stock_transfers'
-                }
-              },
-              events: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/events',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/events'
-                }
-              },
-              tags: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/tags',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/tags'
-                }
-              }
-            },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+          relationships: {
+            customer_group: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/customer_group",
+                related:
+                  "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/customer_group",
+              },
+            },
+            customer_addresses: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/customer_addresses",
+                related:
+                  "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/customer_addresses",
+              },
+            },
+            customer_payment_sources: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/customer_payment_sources",
+                related:
+                  "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/customer_payment_sources",
+              },
+            },
+            customer_subscriptions: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/customer_subscriptions",
+                related:
+                  "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/customer_subscriptions",
+              },
+            },
+            orders: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/orders",
+                related: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/orders",
+              },
+            },
+            order_subscriptions: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/order_subscriptions",
+                related:
+                  "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/order_subscriptions",
+              },
+            },
+            returns: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/returns",
+                related: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/returns",
+              },
+            },
+            sku_lists: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/sku_lists",
+                related: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/sku_lists",
+              },
+            },
+            attachments: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/attachments",
+                related: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/attachments",
+              },
+            },
+            events: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/events",
+                related: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/events",
+              },
+            },
+            tags: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/relationships/tags",
+                related: "https://alessani.commercelayer.co/api/customers/JkAdBhNGjQ/tags",
+              },
+            },
+          },
+          meta: { mode: "test", organization_id: "WXlEOFrjnr" },
+        },
+        {
+          id: "dPoNukZmnB",
+          type: "addresses",
+          links: {
+            self: "https://alessani.commercelayer.co/api/addresses/dPoNukZmnB",
+          },
+          attributes: {
+            business: false,
+            first_name: "Darth",
+            last_name: "Vader",
+            company: null,
+            full_name: "Darth Vader",
+            line_1: "Via Morte Nera, 13",
+            line_2: "Ragnatela, 99",
+            city: "Cogorno",
+            zip_code: "16030",
+            state_code: "GE",
+            country_code: "IT",
+            phone: "+39 055 1234567890",
+            full_address:
+              "Via Morte Nera, 13 Ragnatela, 99, 16030 Cogorno GE (IT) +39 055 1234567890",
+            name: "Darth Vader, Via Morte Nera, 13 Ragnatela, 99, 16030 Cogorno GE (IT) +39 055 1234567890",
+            email: null,
+            notes: null,
+            lat: null,
+            lng: null,
+            is_localized: false,
+            is_geocoded: false,
+            provider_name: null,
+            map_url: null,
+            static_map_url: null,
+            billing_info: "ABCDEFGHIJKLMNOPQRSTUVWYXZ",
+            created_at: "2023-05-16T11:06:07.638Z",
+            updated_at: "2023-05-16T11:06:07.638Z",
+            reference: null,
+            reference_origin: null,
+            metadata: {},
+          },
+          relationships: {
+            geocoder: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/relationships/geocoder",
+                related: "https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/geocoder",
+              },
+            },
+            events: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/relationships/events",
+                related: "https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/events",
+              },
+            },
+            tags: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/relationships/tags",
+                related: "https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/tags",
+              },
+            },
+            versions: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/relationships/versions",
+                related: "https://alessani.commercelayer.co/api/addresses/dPoNukZmnB/versions",
+              },
+            },
+          },
+          meta: { mode: "test", organization_id: "WXlEOFrjnr" },
+        },
+        {
+          id: "dQxruwZDnB",
+          type: "addresses",
+          links: {
+            self: "https://alessani.commercelayer.co/api/addresses/dQxruwZDnB",
           },
-          {
-            id: 'vWEZtMGVKy',
-            type: 'line_items',
-            links: {
-              self: 'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy'
-            },
-            attributes: {
-              sku_code: null,
-              bundle_code: null,
-              quantity: 1,
-              currency_code: 'EUR',
-              unit_amount_cents: 0,
-              unit_amount_float: 0.0,
-              formatted_unit_amount: '€0,00',
-              options_amount_cents: 0,
-              options_amount_float: 0.0,
-              formatted_options_amount: '€0,00',
-              discount_cents: 0,
-              discount_float: 0.0,
-              formatted_discount: '€0,00',
-              total_amount_cents: 0,
-              total_amount_float: 0.0,
-              formatted_total_amount: '€0,00',
-              tax_amount_cents: 0,
-              tax_amount_float: 0.0,
-              formatted_tax_amount: '€0,00',
-              name: 'Shipment #2485862/S/001',
-              image_url: null,
-              discount_breakdown: {},
-              tax_rate: 0.0,
-              tax_breakdown: {},
-              item_type: 'shipments',
-              frequency: null,
-              created_at: '2023-05-16T11:06:09.728Z',
-              updated_at: '2023-05-16T11:06:09.728Z',
-              reference: null,
-              reference_origin: null,
-              metadata: {}
-            },
-            relationships: {
-              order: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/order',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/order'
-                }
-              },
-              item: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/item',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/item'
-                }
-              },
-              line_item_options: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/line_item_options',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/line_item_options'
-                }
-              },
-              shipment_line_items: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/shipment_line_items',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/shipment_line_items'
-                }
-              },
-              stock_reservations: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/stock_reservations',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/stock_reservations'
-                }
-              },
-              stock_line_items: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/stock_line_items',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/stock_line_items'
-                }
-              },
-              stock_transfers: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/stock_transfers',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/stock_transfers'
-                }
-              },
-              events: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/events',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/events'
-                }
-              },
-              tags: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/tags',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/tags'
-                }
-              }
-            },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+          attributes: {
+            business: false,
+            first_name: "Darth",
+            last_name: "Vader",
+            company: null,
+            full_name: "Darth Vader",
+            line_1: "Via Morte Nera, 13",
+            line_2: "Ragnatela, 99",
+            city: "Cogorno",
+            zip_code: "16030",
+            state_code: "GE",
+            country_code: "IT",
+            phone: "+39 055 1234567890",
+            full_address:
+              "Via Morte Nera, 13 Ragnatela, 99, 16030 Cogorno GE (IT) +39 055 1234567890",
+            name: "Darth Vader, Via Morte Nera, 13 Ragnatela, 99, 16030 Cogorno GE (IT) +39 055 1234567890",
+            email: null,
+            notes: null,
+            lat: null,
+            lng: null,
+            is_localized: false,
+            is_geocoded: false,
+            provider_name: null,
+            map_url: null,
+            static_map_url: null,
+            billing_info: "ABCDEFGHIJKLMNOPQRSTUVWYXZ",
+            created_at: "2023-05-16T11:06:07.493Z",
+            updated_at: "2023-05-16T11:06:07.493Z",
+            reference: null,
+            reference_origin: null,
+            metadata: {},
           },
-          {
-            id: 'NqYatGaKnN',
-            type: 'line_items',
-            links: {
-              self: 'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN'
-            },
-            attributes: {
-              sku_code: null,
-              bundle_code: null,
-              quantity: 1,
-              currency_code: 'EUR',
-              unit_amount_cents: 0,
-              unit_amount_float: 0.0,
-              formatted_unit_amount: '€0,00',
-              options_amount_cents: 0,
-              options_amount_float: 0.0,
-              formatted_options_amount: '€0,00',
-              discount_cents: 0,
-              discount_float: 0.0,
-              formatted_discount: '€0,00',
-              total_amount_cents: 0,
-              total_amount_float: 0.0,
-              formatted_total_amount: '€0,00',
-              tax_amount_cents: 0,
-              tax_amount_float: 0.0,
-              formatted_tax_amount: '€0,00',
-              name: 'Shipment #2485862/S/002',
-              image_url: null,
-              discount_breakdown: {},
-              tax_rate: 0.0,
-              tax_breakdown: {},
-              item_type: 'shipments',
-              frequency: null,
-              created_at: '2023-05-16T11:06:09.602Z',
-              updated_at: '2023-05-16T11:06:09.602Z',
-              reference: null,
-              reference_origin: null,
-              metadata: {}
-            },
-            relationships: {
-              order: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/order',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/order'
-                }
-              },
-              item: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/item',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/item'
-                }
-              },
-              line_item_options: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/line_item_options',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/line_item_options'
-                }
-              },
-              shipment_line_items: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/shipment_line_items',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/shipment_line_items'
-                }
-              },
-              stock_reservations: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/stock_reservations',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/stock_reservations'
-                }
-              },
-              stock_line_items: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/stock_line_items',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/stock_line_items'
-                }
-              },
-              stock_transfers: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/stock_transfers',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/stock_transfers'
-                }
-              },
-              events: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/events',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/events'
-                }
-              },
-              tags: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/tags',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/tags'
-                }
-              }
-            },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+          relationships: {
+            geocoder: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/relationships/geocoder",
+                related: "https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/geocoder",
+              },
+            },
+            events: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/relationships/events",
+                related: "https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/events",
+              },
+            },
+            tags: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/relationships/tags",
+                related: "https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/tags",
+              },
+            },
+            versions: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/relationships/versions",
+                related: "https://alessani.commercelayer.co/api/addresses/dQxruwZDnB/versions",
+              },
+            },
           },
-          {
-            id: 'NoEntBwEdk',
-            type: 'line_items',
-            links: {
-              self: 'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk'
-            },
-            attributes: {
-              sku_code: 'TSHIRTMMFFFFFF000000XLXX',
-              bundle_code: null,
-              quantity: 5,
-              currency_code: 'EUR',
-              unit_amount_cents: 2900,
-              unit_amount_float: 29.0,
-              formatted_unit_amount: '€29,00',
-              options_amount_cents: 0,
-              options_amount_float: 0.0,
-              formatted_options_amount: '€0,00',
-              discount_cents: -5943,
-              discount_float: -59.43,
-              formatted_discount: '-€59,43',
-              total_amount_cents: 14500,
-              total_amount_float: 145.0,
-              formatted_total_amount: '€145,00',
-              tax_amount_cents: 0,
-              tax_amount_float: 0.0,
-              formatted_tax_amount: '€0,00',
-              name: 'White Men T-Shirt with Black Logo (XL)',
-              image_url:
-                'https://data.commercelayer.app/seed/images/skus/TSHIRTMSFFFFFF000000XLXX_FLAT.png',
-              discount_breakdown: {
-                vaoMtAZlXy: { cents: -5943, weight: 0.5942622950819673 }
-              },
-              tax_rate: 0.0,
-              tax_breakdown: {},
-              item_type: 'skus',
-              frequency: null,
-              created_at: '2023-05-16T11:06:02.458Z',
-              updated_at: '2023-05-16T11:06:02.458Z',
-              reference: null,
-              reference_origin: null,
-              metadata: {}
-            },
-            relationships: {
-              order: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/order',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/order'
-                }
-              },
-              item: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/item',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/item'
-                }
-              },
-              line_item_options: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/line_item_options',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/line_item_options'
-                }
-              },
-              shipment_line_items: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/shipment_line_items',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/shipment_line_items'
-                }
-              },
-              stock_reservations: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/stock_reservations',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/stock_reservations'
-                }
-              },
-              stock_line_items: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/stock_line_items',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/stock_line_items'
-                }
-              },
-              stock_transfers: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/stock_transfers',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/stock_transfers'
-                }
-              },
-              events: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/events',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/events'
-                }
-              },
-              tags: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/tags',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/tags'
-                }
-              }
-            },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+          meta: { mode: "test", organization_id: "WXlEOFrjnr" },
+        },
+        {
+          id: "wmBvQsARml",
+          type: "payment_methods",
+          links: {
+            self: "https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml",
           },
-          {
-            id: 'NlQmtMAnGy',
-            type: 'line_items',
-            links: {
-              self: 'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy'
-            },
-            attributes: {
-              sku_code: 'CANVASAU000000FFFFFF1824',
-              bundle_code: null,
-              quantity: 1,
-              currency_code: 'EUR',
-              unit_amount_cents: 9900,
-              unit_amount_float: 99.0,
-              formatted_unit_amount: '€99,00',
-              options_amount_cents: 0,
-              options_amount_float: 0.0,
-              formatted_options_amount: '€0,00',
-              discount_cents: -4057,
-              discount_float: -40.57,
-              formatted_discount: '-€40,57',
-              total_amount_cents: 9900,
-              total_amount_float: 99.0,
-              formatted_total_amount: '€99,00',
-              tax_amount_cents: 0,
-              tax_amount_float: 0.0,
-              formatted_tax_amount: '€0,00',
-              name: 'Black Canvas with White Logo (18x24)',
-              image_url:
-                'https://img.commercelayer.io/skus/CANVASAU000000FFFFFF.png?fm=jpg&q=90',
-              discount_breakdown: {
-                vaoMtAZlXy: { cents: -4057, weight: 0.4057377049180328 }
-              },
-              tax_rate: 0.0,
-              tax_breakdown: {},
-              item_type: 'skus',
-              frequency: null,
-              created_at: '2023-05-16T11:06:02.444Z',
-              updated_at: '2023-05-16T11:06:02.444Z',
-              reference: null,
-              reference_origin: null,
-              metadata: {}
-            },
-            relationships: {
-              order: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/order',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/order'
-                }
-              },
-              item: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/item',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/item'
-                }
-              },
-              line_item_options: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/line_item_options',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/line_item_options'
-                }
-              },
-              shipment_line_items: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/shipment_line_items',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/shipment_line_items'
-                }
-              },
-              stock_reservations: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/stock_reservations',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/stock_reservations'
-                }
-              },
-              stock_line_items: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/stock_line_items',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/stock_line_items'
-                }
-              },
-              stock_transfers: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/stock_transfers',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/stock_transfers'
-                }
-              },
-              events: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/events',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/events'
-                }
-              },
-              tags: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/tags',
-                  related:
-                    'https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/tags'
-                }
-              }
-            },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+          attributes: {
+            payment_source_type: "stripe_payments",
+            name: "Stripe Payment",
+            currency_code: "EUR",
+            moto: false,
+            require_capture: true,
+            auto_capture: false,
+            disabled_at: null,
+            price_amount_cents: 1000,
+            price_amount_float: 10.0,
+            formatted_price_amount: "€10,00",
+            auto_capture_max_amount_cents: null,
+            auto_capture_max_amount_float: null,
+            formatted_auto_capture_max_amount: null,
+            created_at: "2022-03-11T14:18:08.420Z",
+            updated_at: "2022-03-11T14:18:08.420Z",
+            reference: "",
+            reference_origin: "",
+            metadata: {},
           },
-          {
-            id: 'YpLwCnNQgY',
-            type: 'shipments',
-            links: {
-              self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY'
-            },
-            attributes: {
-              number: '2485862/S/001',
-              status: 'on_hold',
-              currency_code: 'EUR',
-              cost_amount_cents: 0,
-              cost_amount_float: 0.0,
-              formatted_cost_amount: '$0.00',
-              skus_count: 5,
-              selected_rate_id: null,
-              rates: [],
-              purchase_error_code: null,
-              purchase_error_message: null,
-              get_rates_errors: [],
-              get_rates_started_at: null,
-              get_rates_completed_at: null,
-              purchase_started_at: null,
-              purchase_completed_at: null,
-              purchase_failed_at: null,
-              on_hold_at: '2023-07-21T14:12:13.287Z',
-              picking_at: '2023-07-21T14:12:08.574Z',
-              packing_at: '2023-07-21T14:10:54.107Z',
-              ready_to_ship_at: null,
-              shipped_at: null,
-              created_at: '2023-05-16T11:06:07.685Z',
-              updated_at: '2023-07-21T14:12:13.286Z',
-              reference: null,
-              reference_origin: null,
-              metadata: {}
-            },
-            relationships: {
-              order: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/order',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/order'
-                }
-              },
-              shipping_category: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/shipping_category',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/shipping_category'
-                }
-              },
-              stock_location: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/stock_location',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/stock_location'
-                }
-              },
-              origin_address: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/origin_address',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/origin_address'
-                }
-              },
-              shipping_address: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/shipping_address',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/shipping_address'
-                }
-              },
-              shipping_method: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/shipping_method',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/shipping_method'
-                }
-              },
-              delivery_lead_time: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/delivery_lead_time',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/delivery_lead_time'
-                }
-              },
-              shipment_line_items: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/shipment_line_items',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/shipment_line_items'
-                }
-              },
-              stock_line_items: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/stock_line_items',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/stock_line_items'
-                }
-              },
-              stock_transfers: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/stock_transfers',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/stock_transfers'
-                }
-              },
-              available_shipping_methods: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/available_shipping_methods',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/available_shipping_methods'
-                }
-              },
-              carrier_accounts: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/carrier_accounts',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/carrier_accounts'
-                }
-              },
-              parcels: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/parcels',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/parcels'
-                }
-              },
-              attachments: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/attachments',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/attachments'
-                }
-              },
-              events: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/events',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/events'
-                }
-              },
-              versions: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/versions',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/versions'
-                }
-              }
-            },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+          relationships: {
+            market: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/relationships/market",
+                related: "https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/market",
+              },
+            },
+            payment_gateway: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/relationships/payment_gateway",
+                related:
+                  "https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/payment_gateway",
+              },
+            },
+            attachments: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/relationships/attachments",
+                related:
+                  "https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/attachments",
+              },
+            },
+            versions: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/relationships/versions",
+                related:
+                  "https://alessani.commercelayer.co/api/payment_methods/wmBvQsARml/versions",
+              },
+            },
           },
-          {
-            id: 'PabvCpOxRy',
-            type: 'shipments',
-            links: {
-              self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy'
-            },
-            attributes: {
-              number: '2485862/S/002',
-              status: 'shipped',
-              currency_code: 'EUR',
-              cost_amount_cents: 0,
-              cost_amount_float: 0.0,
-              formatted_cost_amount: '$0.00',
-              skus_count: 1,
-              selected_rate_id: null,
-              rates: [],
-              purchase_error_code: null,
-              purchase_error_message: null,
-              get_rates_errors: [],
-              get_rates_started_at: null,
-              get_rates_completed_at: null,
-              purchase_started_at: null,
-              purchase_completed_at: null,
-              purchase_failed_at: null,
-              on_hold_at: null,
-              picking_at: '2023-05-16T14:18:35.559Z',
-              packing_at: '2023-05-16T14:20:24.459Z',
-              ready_to_ship_at: '2023-05-16T14:21:43.665Z',
-              shipped_at: '2023-05-16T14:22:42.632Z',
-              created_at: '2023-05-16T11:06:07.711Z',
-              updated_at: '2023-05-16T14:22:42.633Z',
-              reference: null,
-              reference_origin: null,
-              metadata: {}
-            },
-            relationships: {
-              order: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/order',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/order'
-                }
-              },
-              shipping_category: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/shipping_category',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/shipping_category'
-                }
-              },
-              stock_location: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/stock_location',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/stock_location'
-                }
-              },
-              origin_address: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/origin_address',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/origin_address'
-                }
-              },
-              shipping_address: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/shipping_address',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/shipping_address'
-                }
-              },
-              shipping_method: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/shipping_method',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/shipping_method'
-                }
-              },
-              delivery_lead_time: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/delivery_lead_time',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/delivery_lead_time'
-                }
-              },
-              shipment_line_items: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/shipment_line_items',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/shipment_line_items'
-                }
-              },
-              stock_line_items: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/stock_line_items',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/stock_line_items'
-                }
-              },
-              stock_transfers: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/stock_transfers',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/stock_transfers'
-                }
-              },
-              available_shipping_methods: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/available_shipping_methods',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/available_shipping_methods'
-                }
-              },
-              carrier_accounts: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/carrier_accounts',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/carrier_accounts'
-                }
-              },
-              parcels: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/parcels',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/parcels'
-                }
-              },
-              attachments: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/attachments',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/attachments'
-                }
-              },
-              events: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/events',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/events'
-                }
-              },
-              versions: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/versions',
-                  related:
-                    'https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/versions'
-                }
-              }
-            },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+          meta: { mode: "test", organization_id: "WXlEOFrjnr" },
+        },
+        {
+          id: "onXELSmbQy",
+          type: "stripe_payments",
+          links: {
+            self: "https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy",
           },
-          {
-            id: 'nKZkPUDBVj',
-            type: 'authorizations',
-            links: {
-              self: 'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj'
-            },
-            attributes: {
-              number: '2485862/T/001',
-              currency_code: 'EUR',
-              amount_cents: 15400,
-              amount_float: 154.0,
-              formatted_amount: '€154,00',
-              succeeded: true,
-              message: 'Success!',
-              error_code: null,
-              error_detail: null,
-              token: 'pi_3N8LhsK5j6INEBBI0JicoLOo',
-              gateway_transaction_id: 'pi_3N8LhsK5j6INEBBI0JicoLOo',
-              created_at: '2023-05-16T11:06:21.964Z',
-              updated_at: '2023-05-16T11:06:21.964Z',
-              reference: null,
-              reference_origin: null,
+          attributes: {
+            client_secret: "pi_3N8LhsK5j6INEBBI0JicoLOo_secret_CKWfEPSnvyBHIQrEfRXkrJYd7",
+            publishable_key:
+              "pk_test_51KH86yK5j6INEBBIdkXoh0UwOoOlAbFZc3b8j0vjRHKQHdaUfEJm24F0A9QkrQXVlgh1nXJCpWR6PG3epaUWzE2z00BdEe9fho",
+            options: {
+              id: "pm_1N8LhuK5j6INEBBI71U1QOlu",
+              card: {
+                brand: "visa",
+                last4: "4242",
+                checks: {
+                  cvc_check: null,
+                  address_line1_check: null,
+                  address_postal_code_check: null,
+                },
+                wallet: null,
+                country: "US",
+                funding: "credit",
+                exp_year: 2031,
+                networks: { available: ["visa"], preferred: null },
+                exp_month: 2,
+                generated_from: null,
+                three_d_secure_usage: { supported: true },
+              },
+              type: "card",
+              object: "payment_method",
+              created: 1684235178,
+              customer: null,
+              livemode: false,
+              billing_details: {
+                name: "Darth Vader",
+                email: "customer@tk.com",
+                phone: "+39 055 1234567890",
+                address: {
+                  city: "Cogorno",
+                  line1: "Via Morte Nera, 13",
+                  line2: null,
+                  state: "GE",
+                  country: "IT",
+                  postal_code: "16030",
+                },
+              },
+              setup_future_usage: "off_session",
+              intent_amount_cents: 15400,
+            },
+            payment_method: {
+              id: "pm_1N8LhuK5j6INEBBIHXkK0FFF",
+              card: {
+                brand: "visa",
+                last4: "4242",
+                checks: {
+                  cvc_check: "pass",
+                  address_line1_check: "pass",
+                  address_postal_code_check: "pass",
+                },
+                wallet: null,
+                country: "US",
+                funding: "credit",
+                exp_year: 2031,
+                networks: { available: ["visa"], preferred: null },
+                exp_month: 2,
+                fingerprint: "bVaeOEKRmYhi20Nj",
+                generated_from: null,
+                three_d_secure_usage: { supported: true },
+              },
+              type: "card",
+              object: "payment_method",
+              created: 1684235179,
+              customer: null,
+              livemode: false,
               metadata: {},
-              cvv_code: null,
-              cvv_message: null,
-              avs_code: null,
-              avs_message: null,
-              fraud_review: null,
-              capture_amount_cents: 0,
-              capture_amount_float: 0.0,
-              formatted_capture_amount: '€0,00',
-              capture_balance_cents: 0,
-              capture_balance_float: 0.0,
-              formatted_capture_balance: '€0,00',
-              void_balance_cents: 15400,
-              void_balance_float: 154.0,
-              formatted_void_balance: '€154,00'
-            },
-            relationships: {
-              order: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/relationships/order',
-                  related:
-                    'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/order'
-                }
-              },
-              attachments: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/relationships/attachments',
-                  related:
-                    'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/attachments'
-                }
-              },
-              versions: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/relationships/versions',
-                  related:
-                    'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/versions'
-                }
-              },
-              captures: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/relationships/captures',
-                  related:
-                    'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/captures'
-                }
-              },
-              voids: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/relationships/voids',
-                  related:
-                    'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/voids'
-                }
-              },
-              events: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/relationships/events',
-                  related:
-                    'https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/events'
-                }
-              }
-            },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+              billing_details: {
+                name: "Darth Vader",
+                email: "customer@tk.com",
+                phone: "+39 055 1234567890",
+                address: {
+                  city: "Cogorno",
+                  line1: "Via Morte Nera, 13",
+                  line2: null,
+                  state: "GE",
+                  country: "IT",
+                  postal_code: "16030",
+                },
+              },
+            },
+            mismatched_amounts: false,
+            intent_amount_cents: 15400,
+            intent_amount_float: 154.0,
+            formatted_intent_amount: "€154,00",
+            return_url: null,
+            payment_instrument: {
+              issuer_type: "card",
+              card_type: "visa",
+              card_last_digits: "4242",
+              card_expiry_month: "2",
+              card_expiry_year: "2031",
+            },
+            created_at: "2023-05-16T11:06:16.338Z",
+            updated_at: "2023-05-16T11:06:21.948Z",
+            reference: null,
+            reference_origin: null,
+            metadata: {},
           },
-          {
-            id: 'kyAnxUgegE',
-            type: 'captures',
-            links: {
-              self: 'https://alessani.commercelayer.co/api/captures/kyAnxUgegE'
-            },
-            attributes: {
-              number: '2485862/T/002',
-              currency_code: 'EUR',
-              amount_cents: 15400,
-              amount_float: 154.0,
-              formatted_amount: '€154,00',
-              succeeded: true,
-              message: 'Success!',
-              error_code: null,
-              error_detail: null,
-              token: 'pi_3N8LhsK5j6INEBBI0JicoLOo',
-              gateway_transaction_id: 'pi_3N8LhsK5j6INEBBI0JicoLOo',
-              created_at: '2023-05-16T14:18:35.368Z',
-              updated_at: '2023-05-16T14:18:35.368Z',
-              reference: null,
-              reference_origin: null,
-              metadata: {},
-              refund_amount_cents: 15400,
-              refund_amount_float: 154.0,
-              formatted_refund_amount: '€154,00',
-              refund_balance_cents: 15400,
-              refund_balance_float: 154.0,
-              formatted_refund_balance: '€154,00'
-            },
-            relationships: {
-              order: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/captures/kyAnxUgegE/relationships/order',
-                  related:
-                    'https://alessani.commercelayer.co/api/captures/kyAnxUgegE/order'
-                }
-              },
-              attachments: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/captures/kyAnxUgegE/relationships/attachments',
-                  related:
-                    'https://alessani.commercelayer.co/api/captures/kyAnxUgegE/attachments'
-                }
-              },
-              versions: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/captures/kyAnxUgegE/relationships/versions',
-                  related:
-                    'https://alessani.commercelayer.co/api/captures/kyAnxUgegE/versions'
-                }
-              },
-              reference_authorization: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/captures/kyAnxUgegE/relationships/reference_authorization',
-                  related:
-                    'https://alessani.commercelayer.co/api/captures/kyAnxUgegE/reference_authorization'
-                }
-              },
-              refunds: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/captures/kyAnxUgegE/relationships/refunds',
-                  related:
-                    'https://alessani.commercelayer.co/api/captures/kyAnxUgegE/refunds'
-                }
-              },
-              events: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/captures/kyAnxUgegE/relationships/events',
-                  related:
-                    'https://alessani.commercelayer.co/api/captures/kyAnxUgegE/events'
-                }
-              }
-            },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+          relationships: {
+            order: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy/relationships/order",
+                related: "https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy/order",
+              },
+            },
+            payment_gateway: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy/relationships/payment_gateway",
+                related:
+                  "https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy/payment_gateway",
+              },
+            },
+            versions: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy/relationships/versions",
+                related:
+                  "https://alessani.commercelayer.co/api/stripe_payments/onXELSmbQy/versions",
+              },
+            },
           },
-          {
-            id: 'EqGrksxWNW',
-            type: 'attachments',
-            links: {
-              self: 'https://alessani.commercelayer.co/api/attachments/EqGrksxWNW'
-            },
-            attributes: {
-              name: 'M. Montalbano',
-              description: 'Ehi there!',
-              url: null,
-              created_at: '2023-07-20T13:58:52.184Z',
-              updated_at: '2023-07-20T13:58:52.184Z',
-              reference: null,
-              reference_origin: 'app-orders--note',
-              metadata: {}
-            },
-            relationships: {
-              attachable: {
-                links: {
-                  self: 'https://alessani.commercelayer.co/api/attachments/EqGrksxWNW/relationships/attachable',
-                  related:
-                    'https://alessani.commercelayer.co/api/attachments/EqGrksxWNW/attachable'
-                }
-              }
-            },
-            meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
-          }
-        ]
-      })
-    )
-  }
-)
+          meta: { mode: "test", organization_id: "WXlEOFrjnr" },
+        },
+        {
+          id: "vaoMtAZlXy",
+          type: "line_items",
+          links: {
+            self: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy",
+          },
+          attributes: {
+            sku_code: null,
+            bundle_code: null,
+            quantity: 1,
+            currency_code: "EUR",
+            unit_amount_cents: -10000,
+            unit_amount_float: -100.0,
+            formatted_unit_amount: "-€100,00",
+            options_amount_cents: 0,
+            options_amount_float: 0.0,
+            formatted_options_amount: "€0,00",
+            discount_cents: 0,
+            discount_float: 0.0,
+            formatted_discount: "€0,00",
+            total_amount_cents: -10000,
+            total_amount_float: -100.0,
+            formatted_total_amount: "-€100,00",
+            tax_amount_cents: 0,
+            tax_amount_float: 0.0,
+            formatted_tax_amount: "€0,00",
+            name: "Gift card: €100,00",
+            image_url: null,
+            discount_breakdown: {},
+            tax_rate: 0.0,
+            tax_breakdown: {},
+            item_type: "gift_cards",
+            frequency: null,
+            created_at: "2023-05-16T11:06:14.674Z",
+            updated_at: "2023-05-16T11:06:14.674Z",
+            reference: null,
+            reference_origin: null,
+            metadata: {},
+          },
+          relationships: {
+            order: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/order",
+                related: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/order",
+              },
+            },
+            item: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/item",
+                related: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/item",
+              },
+            },
+            line_item_options: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/line_item_options",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/line_item_options",
+              },
+            },
+            shipment_line_items: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/shipment_line_items",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/shipment_line_items",
+              },
+            },
+            stock_reservations: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/stock_reservations",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/stock_reservations",
+              },
+            },
+            stock_line_items: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/stock_line_items",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/stock_line_items",
+              },
+            },
+            stock_transfers: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/stock_transfers",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/stock_transfers",
+              },
+            },
+            events: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/events",
+                related: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/events",
+              },
+            },
+            tags: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/relationships/tags",
+                related: "https://alessani.commercelayer.co/api/line_items/vaoMtAZlXy/tags",
+              },
+            },
+          },
+          meta: { mode: "test", organization_id: "WXlEOFrjnr" },
+        },
+        {
+          id: "kmnptjPlBv",
+          type: "line_items",
+          links: {
+            self: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv",
+          },
+          attributes: {
+            sku_code: null,
+            bundle_code: null,
+            quantity: 1,
+            currency_code: "EUR",
+            unit_amount_cents: 1000,
+            unit_amount_float: 10.0,
+            formatted_unit_amount: "€10,00",
+            options_amount_cents: 0,
+            options_amount_float: 0.0,
+            formatted_options_amount: "€0,00",
+            discount_cents: 0,
+            discount_float: 0.0,
+            formatted_discount: "€0,00",
+            total_amount_cents: 1000,
+            total_amount_float: 10.0,
+            formatted_total_amount: "€10,00",
+            tax_amount_cents: 0,
+            tax_amount_float: 0.0,
+            formatted_tax_amount: "€0,00",
+            name: "Stripe Payment",
+            image_url: null,
+            discount_breakdown: {},
+            tax_rate: 0.0,
+            tax_breakdown: {},
+            item_type: "payment_methods",
+            frequency: null,
+            created_at: "2023-05-16T11:06:14.629Z",
+            updated_at: "2023-05-16T11:06:14.629Z",
+            reference: null,
+            reference_origin: null,
+            metadata: {},
+          },
+          relationships: {
+            order: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/order",
+                related: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/order",
+              },
+            },
+            item: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/item",
+                related: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/item",
+              },
+            },
+            line_item_options: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/line_item_options",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/line_item_options",
+              },
+            },
+            shipment_line_items: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/shipment_line_items",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/shipment_line_items",
+              },
+            },
+            stock_reservations: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/stock_reservations",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/stock_reservations",
+              },
+            },
+            stock_line_items: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/stock_line_items",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/stock_line_items",
+              },
+            },
+            stock_transfers: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/stock_transfers",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/stock_transfers",
+              },
+            },
+            events: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/events",
+                related: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/events",
+              },
+            },
+            tags: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/relationships/tags",
+                related: "https://alessani.commercelayer.co/api/line_items/kmnptjPlBv/tags",
+              },
+            },
+          },
+          meta: { mode: "test", organization_id: "WXlEOFrjnr" },
+        },
+        {
+          id: "vWEZtMGVKy",
+          type: "line_items",
+          links: {
+            self: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy",
+          },
+          attributes: {
+            sku_code: null,
+            bundle_code: null,
+            quantity: 1,
+            currency_code: "EUR",
+            unit_amount_cents: 0,
+            unit_amount_float: 0.0,
+            formatted_unit_amount: "€0,00",
+            options_amount_cents: 0,
+            options_amount_float: 0.0,
+            formatted_options_amount: "€0,00",
+            discount_cents: 0,
+            discount_float: 0.0,
+            formatted_discount: "€0,00",
+            total_amount_cents: 0,
+            total_amount_float: 0.0,
+            formatted_total_amount: "€0,00",
+            tax_amount_cents: 0,
+            tax_amount_float: 0.0,
+            formatted_tax_amount: "€0,00",
+            name: "Shipment #2485862/S/001",
+            image_url: null,
+            discount_breakdown: {},
+            tax_rate: 0.0,
+            tax_breakdown: {},
+            item_type: "shipments",
+            frequency: null,
+            created_at: "2023-05-16T11:06:09.728Z",
+            updated_at: "2023-05-16T11:06:09.728Z",
+            reference: null,
+            reference_origin: null,
+            metadata: {},
+          },
+          relationships: {
+            order: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/order",
+                related: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/order",
+              },
+            },
+            item: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/item",
+                related: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/item",
+              },
+            },
+            line_item_options: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/line_item_options",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/line_item_options",
+              },
+            },
+            shipment_line_items: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/shipment_line_items",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/shipment_line_items",
+              },
+            },
+            stock_reservations: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/stock_reservations",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/stock_reservations",
+              },
+            },
+            stock_line_items: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/stock_line_items",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/stock_line_items",
+              },
+            },
+            stock_transfers: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/stock_transfers",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/stock_transfers",
+              },
+            },
+            events: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/events",
+                related: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/events",
+              },
+            },
+            tags: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/relationships/tags",
+                related: "https://alessani.commercelayer.co/api/line_items/vWEZtMGVKy/tags",
+              },
+            },
+          },
+          meta: { mode: "test", organization_id: "WXlEOFrjnr" },
+        },
+        {
+          id: "NqYatGaKnN",
+          type: "line_items",
+          links: {
+            self: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN",
+          },
+          attributes: {
+            sku_code: null,
+            bundle_code: null,
+            quantity: 1,
+            currency_code: "EUR",
+            unit_amount_cents: 0,
+            unit_amount_float: 0.0,
+            formatted_unit_amount: "€0,00",
+            options_amount_cents: 0,
+            options_amount_float: 0.0,
+            formatted_options_amount: "€0,00",
+            discount_cents: 0,
+            discount_float: 0.0,
+            formatted_discount: "€0,00",
+            total_amount_cents: 0,
+            total_amount_float: 0.0,
+            formatted_total_amount: "€0,00",
+            tax_amount_cents: 0,
+            tax_amount_float: 0.0,
+            formatted_tax_amount: "€0,00",
+            name: "Shipment #2485862/S/002",
+            image_url: null,
+            discount_breakdown: {},
+            tax_rate: 0.0,
+            tax_breakdown: {},
+            item_type: "shipments",
+            frequency: null,
+            created_at: "2023-05-16T11:06:09.602Z",
+            updated_at: "2023-05-16T11:06:09.602Z",
+            reference: null,
+            reference_origin: null,
+            metadata: {},
+          },
+          relationships: {
+            order: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/order",
+                related: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/order",
+              },
+            },
+            item: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/item",
+                related: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/item",
+              },
+            },
+            line_item_options: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/line_item_options",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/line_item_options",
+              },
+            },
+            shipment_line_items: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/shipment_line_items",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/shipment_line_items",
+              },
+            },
+            stock_reservations: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/stock_reservations",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/stock_reservations",
+              },
+            },
+            stock_line_items: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/stock_line_items",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/stock_line_items",
+              },
+            },
+            stock_transfers: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/stock_transfers",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/stock_transfers",
+              },
+            },
+            events: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/events",
+                related: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/events",
+              },
+            },
+            tags: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/relationships/tags",
+                related: "https://alessani.commercelayer.co/api/line_items/NqYatGaKnN/tags",
+              },
+            },
+          },
+          meta: { mode: "test", organization_id: "WXlEOFrjnr" },
+        },
+        {
+          id: "NoEntBwEdk",
+          type: "line_items",
+          links: {
+            self: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk",
+          },
+          attributes: {
+            sku_code: "TSHIRTMMFFFFFF000000XLXX",
+            bundle_code: null,
+            quantity: 5,
+            currency_code: "EUR",
+            unit_amount_cents: 2900,
+            unit_amount_float: 29.0,
+            formatted_unit_amount: "€29,00",
+            options_amount_cents: 0,
+            options_amount_float: 0.0,
+            formatted_options_amount: "€0,00",
+            discount_cents: -5943,
+            discount_float: -59.43,
+            formatted_discount: "-€59,43",
+            total_amount_cents: 14500,
+            total_amount_float: 145.0,
+            formatted_total_amount: "€145,00",
+            tax_amount_cents: 0,
+            tax_amount_float: 0.0,
+            formatted_tax_amount: "€0,00",
+            name: "White Men T-Shirt with Black Logo (XL)",
+            image_url:
+              "https://data.commercelayer.app/seed/images/skus/TSHIRTMSFFFFFF000000XLXX_FLAT.png",
+            discount_breakdown: {
+              vaoMtAZlXy: { cents: -5943, weight: 0.5942622950819673 },
+            },
+            tax_rate: 0.0,
+            tax_breakdown: {},
+            item_type: "skus",
+            frequency: null,
+            created_at: "2023-05-16T11:06:02.458Z",
+            updated_at: "2023-05-16T11:06:02.458Z",
+            reference: null,
+            reference_origin: null,
+            metadata: {},
+          },
+          relationships: {
+            order: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/order",
+                related: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/order",
+              },
+            },
+            item: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/item",
+                related: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/item",
+              },
+            },
+            line_item_options: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/line_item_options",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/line_item_options",
+              },
+            },
+            shipment_line_items: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/shipment_line_items",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/shipment_line_items",
+              },
+            },
+            stock_reservations: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/stock_reservations",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/stock_reservations",
+              },
+            },
+            stock_line_items: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/stock_line_items",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/stock_line_items",
+              },
+            },
+            stock_transfers: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/stock_transfers",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/stock_transfers",
+              },
+            },
+            events: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/events",
+                related: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/events",
+              },
+            },
+            tags: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/relationships/tags",
+                related: "https://alessani.commercelayer.co/api/line_items/NoEntBwEdk/tags",
+              },
+            },
+          },
+          meta: { mode: "test", organization_id: "WXlEOFrjnr" },
+        },
+        {
+          id: "NlQmtMAnGy",
+          type: "line_items",
+          links: {
+            self: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy",
+          },
+          attributes: {
+            sku_code: "CANVASAU000000FFFFFF1824",
+            bundle_code: null,
+            quantity: 1,
+            currency_code: "EUR",
+            unit_amount_cents: 9900,
+            unit_amount_float: 99.0,
+            formatted_unit_amount: "€99,00",
+            options_amount_cents: 0,
+            options_amount_float: 0.0,
+            formatted_options_amount: "€0,00",
+            discount_cents: -4057,
+            discount_float: -40.57,
+            formatted_discount: "-€40,57",
+            total_amount_cents: 9900,
+            total_amount_float: 99.0,
+            formatted_total_amount: "€99,00",
+            tax_amount_cents: 0,
+            tax_amount_float: 0.0,
+            formatted_tax_amount: "€0,00",
+            name: "Black Canvas with White Logo (18x24)",
+            image_url: "https://img.commercelayer.io/skus/CANVASAU000000FFFFFF.png?fm=jpg&q=90",
+            discount_breakdown: {
+              vaoMtAZlXy: { cents: -4057, weight: 0.4057377049180328 },
+            },
+            tax_rate: 0.0,
+            tax_breakdown: {},
+            item_type: "skus",
+            frequency: null,
+            created_at: "2023-05-16T11:06:02.444Z",
+            updated_at: "2023-05-16T11:06:02.444Z",
+            reference: null,
+            reference_origin: null,
+            metadata: {},
+          },
+          relationships: {
+            order: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/order",
+                related: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/order",
+              },
+            },
+            item: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/item",
+                related: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/item",
+              },
+            },
+            line_item_options: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/line_item_options",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/line_item_options",
+              },
+            },
+            shipment_line_items: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/shipment_line_items",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/shipment_line_items",
+              },
+            },
+            stock_reservations: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/stock_reservations",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/stock_reservations",
+              },
+            },
+            stock_line_items: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/stock_line_items",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/stock_line_items",
+              },
+            },
+            stock_transfers: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/stock_transfers",
+                related:
+                  "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/stock_transfers",
+              },
+            },
+            events: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/events",
+                related: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/events",
+              },
+            },
+            tags: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/relationships/tags",
+                related: "https://alessani.commercelayer.co/api/line_items/NlQmtMAnGy/tags",
+              },
+            },
+          },
+          meta: { mode: "test", organization_id: "WXlEOFrjnr" },
+        },
+        {
+          id: "YpLwCnNQgY",
+          type: "shipments",
+          links: {
+            self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY",
+          },
+          attributes: {
+            number: "2485862/S/001",
+            status: "on_hold",
+            currency_code: "EUR",
+            cost_amount_cents: 0,
+            cost_amount_float: 0.0,
+            formatted_cost_amount: "$0.00",
+            skus_count: 5,
+            selected_rate_id: null,
+            rates: [],
+            purchase_error_code: null,
+            purchase_error_message: null,
+            get_rates_errors: [],
+            get_rates_started_at: null,
+            get_rates_completed_at: null,
+            purchase_started_at: null,
+            purchase_completed_at: null,
+            purchase_failed_at: null,
+            on_hold_at: "2023-07-21T14:12:13.287Z",
+            picking_at: "2023-07-21T14:12:08.574Z",
+            packing_at: "2023-07-21T14:10:54.107Z",
+            ready_to_ship_at: null,
+            shipped_at: null,
+            created_at: "2023-05-16T11:06:07.685Z",
+            updated_at: "2023-07-21T14:12:13.286Z",
+            reference: null,
+            reference_origin: null,
+            metadata: {},
+          },
+          relationships: {
+            order: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/order",
+                related: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/order",
+              },
+            },
+            shipping_category: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/shipping_category",
+                related:
+                  "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/shipping_category",
+              },
+            },
+            stock_location: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/stock_location",
+                related:
+                  "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/stock_location",
+              },
+            },
+            origin_address: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/origin_address",
+                related:
+                  "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/origin_address",
+              },
+            },
+            shipping_address: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/shipping_address",
+                related:
+                  "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/shipping_address",
+              },
+            },
+            shipping_method: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/shipping_method",
+                related:
+                  "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/shipping_method",
+              },
+            },
+            delivery_lead_time: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/delivery_lead_time",
+                related:
+                  "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/delivery_lead_time",
+              },
+            },
+            shipment_line_items: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/shipment_line_items",
+                related:
+                  "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/shipment_line_items",
+              },
+            },
+            stock_line_items: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/stock_line_items",
+                related:
+                  "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/stock_line_items",
+              },
+            },
+            stock_transfers: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/stock_transfers",
+                related:
+                  "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/stock_transfers",
+              },
+            },
+            available_shipping_methods: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/available_shipping_methods",
+                related:
+                  "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/available_shipping_methods",
+              },
+            },
+            carrier_accounts: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/carrier_accounts",
+                related:
+                  "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/carrier_accounts",
+              },
+            },
+            parcels: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/parcels",
+                related: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/parcels",
+              },
+            },
+            attachments: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/attachments",
+                related: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/attachments",
+              },
+            },
+            events: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/events",
+                related: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/events",
+              },
+            },
+            versions: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/relationships/versions",
+                related: "https://alessani.commercelayer.co/api/shipments/YpLwCnNQgY/versions",
+              },
+            },
+          },
+          meta: { mode: "test", organization_id: "WXlEOFrjnr" },
+        },
+        {
+          id: "PabvCpOxRy",
+          type: "shipments",
+          links: {
+            self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy",
+          },
+          attributes: {
+            number: "2485862/S/002",
+            status: "shipped",
+            currency_code: "EUR",
+            cost_amount_cents: 0,
+            cost_amount_float: 0.0,
+            formatted_cost_amount: "$0.00",
+            skus_count: 1,
+            selected_rate_id: null,
+            rates: [],
+            purchase_error_code: null,
+            purchase_error_message: null,
+            get_rates_errors: [],
+            get_rates_started_at: null,
+            get_rates_completed_at: null,
+            purchase_started_at: null,
+            purchase_completed_at: null,
+            purchase_failed_at: null,
+            on_hold_at: null,
+            picking_at: "2023-05-16T14:18:35.559Z",
+            packing_at: "2023-05-16T14:20:24.459Z",
+            ready_to_ship_at: "2023-05-16T14:21:43.665Z",
+            shipped_at: "2023-05-16T14:22:42.632Z",
+            created_at: "2023-05-16T11:06:07.711Z",
+            updated_at: "2023-05-16T14:22:42.633Z",
+            reference: null,
+            reference_origin: null,
+            metadata: {},
+          },
+          relationships: {
+            order: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/order",
+                related: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/order",
+              },
+            },
+            shipping_category: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/shipping_category",
+                related:
+                  "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/shipping_category",
+              },
+            },
+            stock_location: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/stock_location",
+                related:
+                  "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/stock_location",
+              },
+            },
+            origin_address: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/origin_address",
+                related:
+                  "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/origin_address",
+              },
+            },
+            shipping_address: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/shipping_address",
+                related:
+                  "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/shipping_address",
+              },
+            },
+            shipping_method: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/shipping_method",
+                related:
+                  "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/shipping_method",
+              },
+            },
+            delivery_lead_time: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/delivery_lead_time",
+                related:
+                  "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/delivery_lead_time",
+              },
+            },
+            shipment_line_items: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/shipment_line_items",
+                related:
+                  "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/shipment_line_items",
+              },
+            },
+            stock_line_items: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/stock_line_items",
+                related:
+                  "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/stock_line_items",
+              },
+            },
+            stock_transfers: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/stock_transfers",
+                related:
+                  "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/stock_transfers",
+              },
+            },
+            available_shipping_methods: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/available_shipping_methods",
+                related:
+                  "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/available_shipping_methods",
+              },
+            },
+            carrier_accounts: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/carrier_accounts",
+                related:
+                  "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/carrier_accounts",
+              },
+            },
+            parcels: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/parcels",
+                related: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/parcels",
+              },
+            },
+            attachments: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/attachments",
+                related: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/attachments",
+              },
+            },
+            events: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/events",
+                related: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/events",
+              },
+            },
+            versions: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/relationships/versions",
+                related: "https://alessani.commercelayer.co/api/shipments/PabvCpOxRy/versions",
+              },
+            },
+          },
+          meta: { mode: "test", organization_id: "WXlEOFrjnr" },
+        },
+        {
+          id: "nKZkPUDBVj",
+          type: "authorizations",
+          links: {
+            self: "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj",
+          },
+          attributes: {
+            number: "2485862/T/001",
+            currency_code: "EUR",
+            amount_cents: 15400,
+            amount_float: 154.0,
+            formatted_amount: "€154,00",
+            succeeded: true,
+            message: "Success!",
+            error_code: null,
+            error_detail: null,
+            token: "pi_3N8LhsK5j6INEBBI0JicoLOo",
+            gateway_transaction_id: "pi_3N8LhsK5j6INEBBI0JicoLOo",
+            created_at: "2023-05-16T11:06:21.964Z",
+            updated_at: "2023-05-16T11:06:21.964Z",
+            reference: null,
+            reference_origin: null,
+            metadata: {},
+            cvv_code: null,
+            cvv_message: null,
+            avs_code: null,
+            avs_message: null,
+            fraud_review: null,
+            capture_amount_cents: 0,
+            capture_amount_float: 0.0,
+            formatted_capture_amount: "€0,00",
+            capture_balance_cents: 0,
+            capture_balance_float: 0.0,
+            formatted_capture_balance: "€0,00",
+            void_balance_cents: 15400,
+            void_balance_float: 154.0,
+            formatted_void_balance: "€154,00",
+          },
+          relationships: {
+            order: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/relationships/order",
+                related: "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/order",
+              },
+            },
+            attachments: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/relationships/attachments",
+                related:
+                  "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/attachments",
+              },
+            },
+            versions: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/relationships/versions",
+                related: "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/versions",
+              },
+            },
+            captures: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/relationships/captures",
+                related: "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/captures",
+              },
+            },
+            voids: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/relationships/voids",
+                related: "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/voids",
+              },
+            },
+            events: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/relationships/events",
+                related: "https://alessani.commercelayer.co/api/authorizations/nKZkPUDBVj/events",
+              },
+            },
+          },
+          meta: { mode: "test", organization_id: "WXlEOFrjnr" },
+        },
+        {
+          id: "kyAnxUgegE",
+          type: "captures",
+          links: {
+            self: "https://alessani.commercelayer.co/api/captures/kyAnxUgegE",
+          },
+          attributes: {
+            number: "2485862/T/002",
+            currency_code: "EUR",
+            amount_cents: 15400,
+            amount_float: 154.0,
+            formatted_amount: "€154,00",
+            succeeded: true,
+            message: "Success!",
+            error_code: null,
+            error_detail: null,
+            token: "pi_3N8LhsK5j6INEBBI0JicoLOo",
+            gateway_transaction_id: "pi_3N8LhsK5j6INEBBI0JicoLOo",
+            created_at: "2023-05-16T14:18:35.368Z",
+            updated_at: "2023-05-16T14:18:35.368Z",
+            reference: null,
+            reference_origin: null,
+            metadata: {},
+            refund_amount_cents: 15400,
+            refund_amount_float: 154.0,
+            formatted_refund_amount: "€154,00",
+            refund_balance_cents: 15400,
+            refund_balance_float: 154.0,
+            formatted_refund_balance: "€154,00",
+          },
+          relationships: {
+            order: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/captures/kyAnxUgegE/relationships/order",
+                related: "https://alessani.commercelayer.co/api/captures/kyAnxUgegE/order",
+              },
+            },
+            attachments: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/captures/kyAnxUgegE/relationships/attachments",
+                related: "https://alessani.commercelayer.co/api/captures/kyAnxUgegE/attachments",
+              },
+            },
+            versions: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/captures/kyAnxUgegE/relationships/versions",
+                related: "https://alessani.commercelayer.co/api/captures/kyAnxUgegE/versions",
+              },
+            },
+            reference_authorization: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/captures/kyAnxUgegE/relationships/reference_authorization",
+                related:
+                  "https://alessani.commercelayer.co/api/captures/kyAnxUgegE/reference_authorization",
+              },
+            },
+            refunds: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/captures/kyAnxUgegE/relationships/refunds",
+                related: "https://alessani.commercelayer.co/api/captures/kyAnxUgegE/refunds",
+              },
+            },
+            events: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/captures/kyAnxUgegE/relationships/events",
+                related: "https://alessani.commercelayer.co/api/captures/kyAnxUgegE/events",
+              },
+            },
+          },
+          meta: { mode: "test", organization_id: "WXlEOFrjnr" },
+        },
+        {
+          id: "EqGrksxWNW",
+          type: "attachments",
+          links: {
+            self: "https://alessani.commercelayer.co/api/attachments/EqGrksxWNW",
+          },
+          attributes: {
+            name: "M. Montalbano",
+            description: "Ehi there!",
+            url: null,
+            created_at: "2023-07-20T13:58:52.184Z",
+            updated_at: "2023-07-20T13:58:52.184Z",
+            reference: null,
+            reference_origin: "app-orders--note",
+            metadata: {},
+          },
+          relationships: {
+            attachable: {
+              links: {
+                self: "https://alessani.commercelayer.co/api/attachments/EqGrksxWNW/relationships/attachable",
+                related: "https://alessani.commercelayer.co/api/attachments/EqGrksxWNW/attachable",
+              },
+            },
+          },
+          meta: { mode: "test", organization_id: "WXlEOFrjnr" },
+        },
+      ],
+    })
+  )
+})
 
 export default [orderDetail, orderList]
diff --git a/packages/docs/mocks/data/tags.js b/packages/docs/mocks/data/tags.js
index 3fdf23d7..1cae9152 100644
--- a/packages/docs/mocks/data/tags.js
+++ b/packages/docs/mocks/data/tags.js
@@ -1,42 +1,36 @@
-import { HttpResponse, http } from 'msw'
+import { HttpResponse, http } from "msw"
 
 const mockedTags = Array(15)
   .fill(null)
   .map((item, idx) => ({
     id: Math.random().toString().substring(2, 12),
-    type: 'tags',
+    type: "tags",
     attributes: {
       name: `tag-${idx}`,
-      created_at: '2023-03-17T14:07:36.604Z',
-      updated_at: '2023-03-17T14:07:36.604Z'
+      created_at: "2023-03-17T14:07:36.604Z",
+      updated_at: "2023-03-17T14:07:36.604Z",
     },
-    meta: { mode: 'test', organization_id: 'WXlEOFrjnr' }
+    meta: { mode: "test", organization_id: "WXlEOFrjnr" },
   }))
 
-const customerTags = http.get(
-  `https://mock.localhost/api/customers/NMWYhbGorj/tags`,
-  async () => {
-    return HttpResponse.json(
-      {
-        data: mockedTags.slice(0, 2),
-        meta: { record_count: 2, page_count: 1 }
-      },
-      { status: 200 }
-    )
-  }
-)
+const customerTags = http.get(`https://mock.localhost/api/customers/NMWYhbGorj/tags`, async () => {
+  return HttpResponse.json(
+    {
+      data: mockedTags.slice(0, 2),
+      meta: { record_count: 2, page_count: 1 },
+    },
+    { status: 200 }
+  )
+})
 
-const organizationTags = http.get(
-  `https://mock.localhost/api/tags`,
-  async () => {
-    return HttpResponse.json(
-      {
-        data: mockedTags,
-        meta: { record_count: 100, page_count: 10 }
-      },
-      { status: 200 }
-    )
-  }
-)
+const organizationTags = http.get(`https://mock.localhost/api/tags`, async () => {
+  return HttpResponse.json(
+    {
+      data: mockedTags,
+      meta: { record_count: 100, page_count: 10 },
+    },
+    { status: 200 }
+  )
+})
 
 export default [customerTags, organizationTags]
diff --git a/packages/docs/mocks/handlers.js b/packages/docs/mocks/handlers.js
index df071002..63cfd48e 100644
--- a/packages/docs/mocks/handlers.js
+++ b/packages/docs/mocks/handlers.js
@@ -1,15 +1,8 @@
-import adjustments from './data/adjustments'
-import bundles from './data/bundles'
-import lineItems from './data/line_items'
-import markets from './data/markets'
-import orders from './data/orders'
-import tags from './data/tags'
+import adjustments from "./data/adjustments"
+import bundles from "./data/bundles"
+import lineItems from "./data/line_items"
+import markets from "./data/markets"
+import orders from "./data/orders"
+import tags from "./data/tags"
 
-export const handlers = [
-  ...adjustments,
-  ...bundles,
-  ...lineItems,
-  ...markets,
-  ...orders,
-  ...tags
-]
+export const handlers = [...adjustments, ...bundles, ...lineItems, ...markets, ...orders, ...tags]
diff --git a/packages/docs/public/mockServiceWorker.js b/packages/docs/public/mockServiceWorker.js
index 87e0f31b..8374331e 100644
--- a/packages/docs/public/mockServiceWorker.js
+++ b/packages/docs/public/mockServiceWorker.js
@@ -8,18 +8,18 @@
  * - Please do NOT serve this file on production.
  */
 
-const INTEGRITY_CHECKSUM = '3d6b9f06410d179a7f7404d4bf4c3c70'
+const INTEGRITY_CHECKSUM = "3d6b9f06410d179a7f7404d4bf4c3c70"
 const activeClientIds = new Set()
 
-self.addEventListener('install', function () {
+self.addEventListener("install", function () {
   self.skipWaiting()
 })
 
-self.addEventListener('activate', function (event) {
+self.addEventListener("activate", function (event) {
   event.waitUntil(self.clients.claim())
 })
 
-self.addEventListener('message', async function (event) {
+self.addEventListener("message", async function (event) {
   const clientId = event.source.id
 
   if (!clientId || !self.clients) {
@@ -33,41 +33,41 @@ self.addEventListener('message', async function (event) {
   }
 
   const allClients = await self.clients.matchAll({
-    type: 'window',
+    type: "window",
   })
 
   switch (event.data) {
-    case 'KEEPALIVE_REQUEST': {
+    case "KEEPALIVE_REQUEST": {
       sendToClient(client, {
-        type: 'KEEPALIVE_RESPONSE',
+        type: "KEEPALIVE_RESPONSE",
       })
       break
     }
 
-    case 'INTEGRITY_CHECK_REQUEST': {
+    case "INTEGRITY_CHECK_REQUEST": {
       sendToClient(client, {
-        type: 'INTEGRITY_CHECK_RESPONSE',
+        type: "INTEGRITY_CHECK_RESPONSE",
         payload: INTEGRITY_CHECKSUM,
       })
       break
     }
 
-    case 'MOCK_ACTIVATE': {
+    case "MOCK_ACTIVATE": {
       activeClientIds.add(clientId)
 
       sendToClient(client, {
-        type: 'MOCKING_ENABLED',
+        type: "MOCKING_ENABLED",
         payload: true,
       })
       break
     }
 
-    case 'MOCK_DEACTIVATE': {
+    case "MOCK_DEACTIVATE": {
       activeClientIds.delete(clientId)
       break
     }
 
-    case 'CLIENT_CLOSED': {
+    case "CLIENT_CLOSED": {
       activeClientIds.delete(clientId)
 
       const remainingClients = allClients.filter((client) => {
@@ -84,23 +84,23 @@ self.addEventListener('message', async function (event) {
   }
 })
 
-self.addEventListener('fetch', function (event) {
+self.addEventListener("fetch", function (event) {
   const { request } = event
-  const accept = request.headers.get('accept') || ''
+  const accept = request.headers.get("accept") || ""
 
   // Bypass server-sent events.
-  if (accept.includes('text/event-stream')) {
+  if (accept.includes("text/event-stream")) {
     return
   }
 
   // Bypass navigation requests.
-  if (request.mode === 'navigate') {
+  if (request.mode === "navigate") {
     return
   }
 
   // Opening the DevTools triggers the "only-if-cached" request
   // that cannot be handled by the worker. Bypass such requests.
-  if (request.cache === 'only-if-cached' && request.mode !== 'same-origin') {
+  if (request.cache === "only-if-cached" && request.mode !== "same-origin") {
     return
   }
 
@@ -116,11 +116,11 @@ self.addEventListener('fetch', function (event) {
 
   event.respondWith(
     handleRequest(event, requestId).catch((error) => {
-      if (error.name === 'NetworkError') {
+      if (error.name === "NetworkError") {
         console.warn(
           '[MSW] Successfully emulated a network error for the "%s %s" request.',
           request.method,
-          request.url,
+          request.url
         )
         return
       }
@@ -131,9 +131,9 @@ self.addEventListener('fetch', function (event) {
 [MSW] Caught an exception from the "%s %s" request (%s). This is probably not a problem with Mock Service Worker. There is likely an additional logging output above.`,
         request.method,
         request.url,
-        `${error.name}: ${error.message}`,
+        `${error.name}: ${error.message}`
       )
-    }),
+    })
   )
 })
 
@@ -148,15 +148,14 @@ async function handleRequest(event, requestId) {
     ;(async function () {
       const clonedResponse = response.clone()
       sendToClient(client, {
-        type: 'RESPONSE',
+        type: "RESPONSE",
         payload: {
           requestId,
           type: clonedResponse.type,
           ok: clonedResponse.ok,
           status: clonedResponse.status,
           statusText: clonedResponse.statusText,
-          body:
-            clonedResponse.body === null ? null : await clonedResponse.text(),
+          body: clonedResponse.body === null ? null : await clonedResponse.text(),
           headers: Object.fromEntries(clonedResponse.headers.entries()),
           redirected: clonedResponse.redirected,
         },
@@ -174,18 +173,18 @@ async function handleRequest(event, requestId) {
 async function resolveMainClient(event) {
   const client = await self.clients.get(event.clientId)
 
-  if (client?.frameType === 'top-level') {
+  if (client?.frameType === "top-level") {
     return client
   }
 
   const allClients = await self.clients.matchAll({
-    type: 'window',
+    type: "window",
   })
 
   return allClients
     .filter((client) => {
       // Get only those clients that are currently visible.
-      return client.visibilityState === 'visible'
+      return client.visibilityState === "visible"
     })
     .find((client) => {
       // Find the client ID that's recorded in the
@@ -207,7 +206,7 @@ async function getResponse(event, client, requestId) {
     // comply with the server's CORS preflight check.
     // Operate with the headers as an object because request "Headers"
     // are immutable.
-    delete headers['x-msw-bypass']
+    delete headers["x-msw-bypass"]
 
     return fetch(clonedRequest, { headers })
   }
@@ -227,13 +226,13 @@ async function getResponse(event, client, requestId) {
 
   // Bypass requests with the explicit bypass header.
   // Such requests can be issued by "ctx.fetch()".
-  if (request.headers.get('x-msw-bypass') === 'true') {
+  if (request.headers.get("x-msw-bypass") === "true") {
     return passthrough()
   }
 
   // Notify the client that a request has been intercepted.
   const clientMessage = await sendToClient(client, {
-    type: 'REQUEST',
+    type: "REQUEST",
     payload: {
       id: requestId,
       url: request.url,
@@ -254,15 +253,15 @@ async function getResponse(event, client, requestId) {
   })
 
   switch (clientMessage.type) {
-    case 'MOCK_RESPONSE': {
+    case "MOCK_RESPONSE": {
       return respondWithMock(clientMessage.data)
     }
 
-    case 'MOCK_NOT_FOUND': {
+    case "MOCK_NOT_FOUND": {
       return passthrough()
     }
 
-    case 'NETWORK_ERROR': {
+    case "NETWORK_ERROR": {
       const { name, message } = clientMessage.data
       const networkError = new Error(message)
       networkError.name = name
diff --git a/packages/docs/public/storybook-preview.css b/packages/docs/public/storybook-preview.css
index ab5db5b8..de98283a 100644
--- a/packages/docs/public/storybook-preview.css
+++ b/packages/docs/public/storybook-preview.css
@@ -1,38 +1,38 @@
-/* Global */
-.sbdocs-wrapper ol {
-  list-style: decimal;
-}
-
-/** Blockquote */
-span[type] {
-  display: block;
-  padding: 16px !important;
-  font-size: 14px !important;
-  color: #2e3438 !important;
-  margin: 16px 0;
-  border-left: 4px solid;
-}
-span[type]::before {
-  content: attr(title);
-  display: block;
-  font-weight: bold;
-}
-span[type] > p {
-  margin: 0;
-}
-span[type="info"] {
-  border-color: #3b82f6;
-  background-color: #dbebfe;
-}
-span[type="warning"] {
-  border-color: #f97317;
-  background-color: #ffedd5;
-}
-span[type="success"] {
-  border-color: #22c55f;
-  background-color: #ddfce7;
-}
-span[type="danger"] {
-  border-color: #ef4544;
-  background-color: #fee2e3;
-}
+/* Global */
+.sbdocs-wrapper ol {
+  list-style: decimal;
+}
+
+/** Blockquote */
+span[type] {
+  display: block;
+  padding: 16px !important;
+  font-size: 14px !important;
+  color: #2e3438 !important;
+  margin: 16px 0;
+  border-left: 4px solid;
+}
+span[type]::before {
+  content: attr(title);
+  display: block;
+  font-weight: bold;
+}
+span[type] > p {
+  margin: 0;
+}
+span[type="info"] {
+  border-color: #3b82f6;
+  background-color: #dbebfe;
+}
+span[type="warning"] {
+  border-color: #f97317;
+  background-color: #ffedd5;
+}
+span[type="success"] {
+  border-color: #22c55f;
+  background-color: #ddfce7;
+}
+span[type="danger"] {
+  border-color: #ef4544;
+  background-color: #fee2e3;
+}
diff --git a/packages/docs/stories/_internals/Code.tsx b/packages/docs/stories/_internals/Code.tsx
index 383c69b0..d048bd41 100644
--- a/packages/docs/stories/_internals/Code.tsx
+++ b/packages/docs/stories/_internals/Code.tsx
@@ -1,3 +1,3 @@
 export const Code: React.FC<{ children?: string }> = ({ children }) => {
-  return <code className='bg-gray-100 px-2'>{children}</code>
+  return <code className="bg-gray-100 px-2">{children}</code>
 }
diff --git a/packages/docs/stories/_internals/CommerceLayer.tsx b/packages/docs/stories/_internals/CommerceLayer.tsx
index e4bed7a8..c51c0b53 100644
--- a/packages/docs/stories/_internals/CommerceLayer.tsx
+++ b/packages/docs/stories/_internals/CommerceLayer.tsx
@@ -1,13 +1,10 @@
-import { type DefaultChildrenType } from '#typings/globals'
-import CommerceLayerComponent from '#components/auth/CommerceLayer'
-import { useGetToken } from './useGetToken'
+import { type DefaultChildrenType } from "#typings/globals"
+import CommerceLayerComponent from "#components/auth/CommerceLayer"
+import { useGetToken } from "./useGetToken"
 
 interface Props {
   children: DefaultChildrenType
-  accessToken:
-    | 'customer-access-token'
-    | 'customer-orders-access-token'
-    | 'my-access-token' // guest token
+  accessToken: "customer-access-token" | "customer-orders-access-token" | "my-access-token" // guest token
   endpoint?: string
 }
 
@@ -18,11 +15,11 @@ interface Props {
 function CommerceLayer({ children, ...props }: Props): JSX.Element {
   const { accessToken, endpoint } = useGetToken({
     mode:
-      props.accessToken === 'customer-access-token'
-        ? 'customer'
-        : props.accessToken === 'customer-orders-access-token'
-        ? 'customer-orders'
-        : 'guest'
+      props.accessToken === "customer-access-token"
+        ? "customer"
+        : props.accessToken === "customer-orders-access-token"
+          ? "customer-orders"
+          : "guest",
   })
 
   return (
diff --git a/packages/docs/stories/_internals/OrderStorage.tsx b/packages/docs/stories/_internals/OrderStorage.tsx
index 41df3c7b..aa38fd6d 100644
--- a/packages/docs/stories/_internals/OrderStorage.tsx
+++ b/packages/docs/stories/_internals/OrderStorage.tsx
@@ -1,96 +1,87 @@
 /* eslint-disable @typescript-eslint/no-misused-promises */
-import OrderStorageComponent from "#components/orders/OrderStorage";
-import useCommerceLayer from "#hooks/useCommerceLayer";
-import { useState, useEffect } from "react";
-import useOrderContainer from "#hooks/useOrderContainer";
-import type { CommerceLayerClient } from "@commercelayer/sdk";
+import OrderStorageComponent from "#components/orders/OrderStorage"
+import useCommerceLayer from "#hooks/useCommerceLayer"
+import { useState, useEffect } from "react"
+import useOrderContainer from "#hooks/useOrderContainer"
+import type { CommerceLayerClient } from "@commercelayer/sdk"
 
 export const OrderStorage = ({
-	persistKey,
-	children,
+  persistKey,
+  children,
 }: {
-	persistKey: string;
-	children: React.ReactNode;
+  persistKey: string
+  children: React.ReactNode
 }): JSX.Element => {
-	const [orderId, setOrderId] = useState(localStorage.getItem(persistKey));
-	const { sdkClient, accessToken } = useCommerceLayer();
-	const cl =
-		accessToken != null && accessToken !== "" && sdkClient != null
-			? sdkClient()
-			: undefined;
+  const [orderId, setOrderId] = useState(localStorage.getItem(persistKey))
+  const { sdkClient, accessToken } = useCommerceLayer()
+  const cl =
+    accessToken != null && accessToken !== "" && sdkClient != null ? sdkClient() : undefined
 
-	useEffect(() => {
-		if (cl != null && orderId == null) {
-			createOrderWithItems(cl).then((orderId) => {
-				setOrderId(orderId);
-				localStorage.setItem(persistKey, orderId);
-			});
-		}
-	}, [cl, persistKey]);
+  useEffect(() => {
+    if (cl != null && orderId == null) {
+      createOrderWithItems(cl).then((orderId) => {
+        setOrderId(orderId)
+        localStorage.setItem(persistKey, orderId)
+      })
+    }
+  }, [cl, persistKey])
 
-	if (cl == null || orderId == null) {
-		return <div />;
-	}
+  if (cl == null || orderId == null) {
+    return <div />
+  }
 
-	return (
-		<OrderStorageComponent persistKey={persistKey}>
-			{children}
-		</OrderStorageComponent>
-	);
-};
+  return <OrderStorageComponent persistKey={persistKey}>{children}</OrderStorageComponent>
+}
 
 export const AddSampleItems = (): JSX.Element => {
-	const { sdkClient, accessToken } = useCommerceLayer();
-	const { order, addToCart } = useOrderContainer();
-	const cl = accessToken != null && accessToken !== "" && sdkClient();
+  const { sdkClient, accessToken } = useCommerceLayer()
+  const { order, addToCart } = useOrderContainer()
+  const cl = accessToken != null && accessToken !== "" && sdkClient()
 
-	if (cl == null || cl === false || order == null) return <div>loading...</div>;
+  if (cl == null || cl === false || order == null) return <div>loading...</div>
 
-	return (
-		<div>
-			<p className="mb-4">Cart is empty</p>
-			<button
-				onClick={async () => {
-					await addToCart({
-						skuCode: "5PANECAP9D9CA1FFFFFFXXXX",
-						quantity: 2,
-					});
-					await addToCart({
-						skuCode: "BACKPACK000000FFFFFFXXXX",
-						quantity: 3,
-					});
-				}}
-				className="py-2 px-4 bg-black text-white rounded text-sm"
-			>
-				Click me to fill cart with sample items
-			</button>
-		</div>
-	);
-};
+  return (
+    <div>
+      <p className="mb-4">Cart is empty</p>
+      <button
+        onClick={async () => {
+          await addToCart({
+            skuCode: "5PANECAP9D9CA1FFFFFFXXXX",
+            quantity: 2,
+          })
+          await addToCart({
+            skuCode: "BACKPACK000000FFFFFFXXXX",
+            quantity: 3,
+          })
+        }}
+        className="py-2 px-4 bg-black text-white rounded text-sm"
+      >
+        Click me to fill cart with sample items
+      </button>
+    </div>
+  )
+}
 
 async function createOrderWithItems(cl: CommerceLayerClient): Promise<string> {
-	const order = await cl.orders.create({
-		language_code: "en",
-	});
-	await fillOrder(order.id, cl);
-	return order.id;
+  const order = await cl.orders.create({
+    language_code: "en",
+  })
+  await fillOrder(order.id, cl)
+  return order.id
 }
 
-async function fillOrder(
-	orderId: string,
-	cl: CommerceLayerClient,
-): Promise<void> {
-	await cl.line_items.create({
-		item_type: "skus",
-		sku_code: "5PANECAP9D9CA1FFFFFFXXXX",
-		quantity: 2,
-		order: cl.orders.relationship(orderId),
-	});
+async function fillOrder(orderId: string, cl: CommerceLayerClient): Promise<void> {
+  await cl.line_items.create({
+    item_type: "skus",
+    sku_code: "5PANECAP9D9CA1FFFFFFXXXX",
+    quantity: 2,
+    order: cl.orders.relationship(orderId),
+  })
 
-	await cl.line_items.create({
-		item_type: "skus",
-		sku_code: "BACKPACK000000FFFFFFXXXX",
-		quantity: 3,
-		order: cl.orders.relationship(orderId),
-	});
+  await cl.line_items.create({
+    item_type: "skus",
+    sku_code: "BACKPACK000000FFFFFFXXXX",
+    quantity: 3,
+    order: cl.orders.relationship(orderId),
+  })
 }
diff --git a/packages/docs/stories/_internals/useGetToken.ts b/packages/docs/stories/_internals/useGetToken.ts
index 966dd14f..fe93b6d3 100644
--- a/packages/docs/stories/_internals/useGetToken.ts
+++ b/packages/docs/stories/_internals/useGetToken.ts
@@ -1,29 +1,27 @@
-import { authenticate } from '@commercelayer/js-auth'
-import { useEffect, useMemo, useState } from 'react'
-import Cookie from 'js-cookie'
-import { jwtDecode } from 'jwt-decode'
+import { authenticate } from "@commercelayer/js-auth"
+import { useEffect, useMemo, useState } from "react"
+import Cookie from "js-cookie"
+import { jwtDecode } from "jwt-decode"
 
 const salesChannel = {
-  clientId: 'Z5ypiDlsqgV8twWRz0GabrJvTKXad4U-PMoVAU-XvV0',
-  slug: 'react-components-store',
-  scope: 'market:15283',
-  domain: 'commercelayer.io'
+  clientId: "Z5ypiDlsqgV8twWRz0GabrJvTKXad4U-PMoVAU-XvV0",
+  slug: "react-components-store",
+  scope: "market:15283",
+  domain: "commercelayer.io",
 }
 const savedCustomerWithOrders = {
-  username: 'bruce@wayne.com',
-  password: '123456'
+  username: "bruce@wayne.com",
+  password: "123456",
 }
 
-type UserMode = 'customer' | 'customer-orders' | 'guest'
+type UserMode = "customer" | "customer-orders" | "guest"
 interface UseGetTokenOptions {
   mode?: UserMode
 }
 
-const getAccessTokenCookieName = (mode: UserMode): string =>
-  `clToken.${salesChannel.slug}.${mode}`
+const getAccessTokenCookieName = (mode: UserMode): string => `clToken.${salesChannel.slug}.${mode}`
 
-const getCustomerLoginCookieName = (mode: UserMode): string =>
-  `clToken.customerLogin.${mode}`
+const getCustomerLoginCookieName = (mode: UserMode): string => `clToken.customerLogin.${mode}`
 
 export function useGetToken<T extends UseGetTokenOptions>(
   options?: T
@@ -31,10 +29,8 @@ export function useGetToken<T extends UseGetTokenOptions>(
   accessToken: string
   endpoint: string
 } {
-  const mode = options?.mode ?? 'guest'
-  const [accessToken, setAccessToken] = useState(
-    Cookie.get(getAccessTokenCookieName(mode)) ?? ''
-  )
+  const mode = options?.mode ?? "guest"
+  const [accessToken, setAccessToken] = useState(Cookie.get(getAccessTokenCookieName(mode)) ?? "")
   const clientId = salesChannel.clientId
   const slug = salesChannel.slug
   const scope = salesChannel.scope
@@ -43,15 +39,15 @@ export function useGetToken<T extends UseGetTokenOptions>(
   const initToken = useMemo(() => {
     return async () => {
       const user =
-        mode === 'customer'
+        mode === "customer"
           ? await retrieveCustomerData({
               clientId,
               slug,
               scope,
               domain,
-              mode
+              mode,
             })
-          : mode === 'customer-orders'
+          : mode === "customer-orders"
             ? savedCustomerWithOrders
             : undefined
 
@@ -61,7 +57,7 @@ export function useGetToken<T extends UseGetTokenOptions>(
         scope,
         domain,
         user,
-        mode
+        mode,
       }).then(({ accessToken, expires }) => {
         setAccessToken(accessToken)
         Cookie.set(getAccessTokenCookieName(mode), accessToken, { expires })
@@ -72,7 +68,7 @@ export function useGetToken<T extends UseGetTokenOptions>(
   useEffect(() => {
     if (
       accessToken == null ||
-      accessToken === '' ||
+      accessToken === "" ||
       isTokenExpired({ accessToken, compareTo: new Date() })
     ) {
       initToken()
@@ -81,7 +77,7 @@ export function useGetToken<T extends UseGetTokenOptions>(
 
   return {
     accessToken,
-    endpoint: `https://${slug}.${domain}`
+    endpoint: `https://${slug}.${domain}`,
   }
 }
 
@@ -90,7 +86,7 @@ async function retrieveCustomerData({
   slug,
   scope,
   domain,
-  mode
+  mode,
 }: {
   clientId: string
   slug: string
@@ -102,19 +98,17 @@ async function retrieveCustomerData({
   password: string
 }> {
   const existingUser = Cookie.get(getCustomerLoginCookieName(mode))
-  const savedEmail = parseEmailAddress(existingUser?.split(':')[0])
-  const savedPassword = parsePassword(existingUser?.split(':')[1])
+  const savedEmail = parseEmailAddress(existingUser?.split(":")[0])
+  const savedPassword = parsePassword(existingUser?.split(":")[1])
 
   if (savedEmail != null && savedPassword != null) {
     return {
       username: savedEmail,
-      password: savedPassword
+      password: savedPassword,
     }
   }
 
-  const newEmail = `user-${generateRandomString(5)}-${generateRandomString(
-    5
-  )}@domain.com`
+  const newEmail = `user-${generateRandomString(5)}-${generateRandomString(5)}@domain.com`
   const newPassword = generateRandomString(10)
 
   const guestToken = await generateNewToken({
@@ -122,7 +116,7 @@ async function retrieveCustomerData({
     slug,
     scope,
     domain,
-    mode
+    mode,
   })
 
   await createNewCustomer({
@@ -130,14 +124,14 @@ async function retrieveCustomerData({
     password: newPassword,
     salesChannelToken: guestToken.accessToken,
     slug,
-    domain
+    domain,
   })
 
   Cookie.set(getCustomerLoginCookieName(mode), `${newEmail}:${newPassword}`)
 
   return {
     username: newEmail,
-    password: newPassword
+    password: newPassword,
   }
 }
 
@@ -148,7 +142,7 @@ async function generateNewToken({
   scope,
   domain,
   user,
-  mode
+  mode,
 }: {
   clientId: string
   slug: string
@@ -158,20 +152,20 @@ async function generateNewToken({
   mode: UserMode
 }) {
   return user == null
-    ? await authenticate('client_credentials', {
+    ? await authenticate("client_credentials", {
         clientId,
         scope,
-        domain
+        domain,
       })
-    : await authenticate('password', {
+    : await authenticate("password", {
         clientId,
         scope,
         domain,
-        ...user
+        ...user,
       }).then((res) => {
-        if (res != null && 'error' in res) {
-          Cookie.remove(getCustomerLoginCookieName('customer'))
-          Cookie.remove(getCustomerLoginCookieName('customer-orders'))
+        if (res != null && "error" in res) {
+          Cookie.remove(getCustomerLoginCookieName("customer"))
+          Cookie.remove(getCustomerLoginCookieName("customer-orders"))
           Cookie.remove(getAccessTokenCookieName(mode))
         }
         return res
@@ -180,12 +174,12 @@ async function generateNewToken({
 
 function isTokenExpired({
   accessToken,
-  compareTo
+  compareTo,
 }: {
   accessToken?: string
   compareTo: Date
 }): boolean {
-  if (accessToken == null || accessToken === '') {
+  if (accessToken == null || accessToken === "") {
     return true
   }
 
@@ -204,8 +198,8 @@ function isTokenExpired({
 }
 
 function generateRandomString(length = 10): string {
-  const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'
-  let result = ''
+  const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789"
+  let result = ""
   for (let i = 0; i < length; i++) {
     result += chars.charAt(Math.floor(Math.random() * chars.length))
   }
@@ -229,7 +223,7 @@ async function createNewCustomer({
   password,
   salesChannelToken,
   slug,
-  domain
+  domain,
 }: {
   email: string
   password: string
@@ -238,24 +232,24 @@ async function createNewCustomer({
   domain: string
 }): Promise<void> {
   const newCustomer = await fetch(`https://${slug}.${domain}/api/customers`, {
-    method: 'POST',
+    method: "POST",
     headers: {
-      Accept: 'application/vnd.api+json',
-      'Content-Type': 'application/vnd.api+json',
-      Authorization: `Bearer ${salesChannelToken}`
+      Accept: "application/vnd.api+json",
+      "Content-Type": "application/vnd.api+json",
+      Authorization: `Bearer ${salesChannelToken}`,
     },
     body: JSON.stringify({
       data: {
-        type: 'customers',
+        type: "customers",
         attributes: {
           email,
-          password
-        }
-      }
-    })
+          password,
+        },
+      },
+    }),
   })
 
   if (newCustomer.status !== 201) {
-    throw new Error('Error creating customer')
+    throw new Error("Error creating customer")
   }
 }
diff --git a/packages/docs/stories/availability/AvailabilityContainer.stories.tsx b/packages/docs/stories/availability/AvailabilityContainer.stories.tsx
index 8b1897eb..1bfce1e9 100644
--- a/packages/docs/stories/availability/AvailabilityContainer.stories.tsx
+++ b/packages/docs/stories/availability/AvailabilityContainer.stories.tsx
@@ -1,20 +1,17 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../_internals/CommerceLayer'
-import { AvailabilityContainer } from '#components/skus/AvailabilityContainer'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../_internals/CommerceLayer"
+import { AvailabilityContainer } from "#components/skus/AvailabilityContainer"
 
 const setup: Meta<typeof AvailabilityContainer> = {
-  title: 'Components/Availability/AvailabilityContainer',
-  component: AvailabilityContainer
+  title: "Components/Availability/AvailabilityContainer",
+  component: AvailabilityContainer,
 }
 
 export default setup
 
 const Template: StoryFn<typeof AvailabilityContainer> = (args) => {
   return (
-    <CommerceLayer
-      accessToken='my-access-token'
-      endpoint='https://demo-store.commercelayer.io'
-    >
+    <CommerceLayer accessToken="my-access-token" endpoint="https://demo-store.commercelayer.io">
       <AvailabilityContainer {...args}>...</AvailabilityContainer>
     </CommerceLayer>
   )
@@ -22,15 +19,15 @@ const Template: StoryFn<typeof AvailabilityContainer> = (args) => {
 
 export const Default = Template.bind({})
 Default.args = {
-  skuCode: 'POLOMXXX000000FFFFFFLXXX',
+  skuCode: "POLOMXXX000000FFFFFFLXXX",
   getQuantity: (quantity) => {
-    console.log('quantity', quantity)
-  }
+    console.log("quantity", quantity)
+  },
 }
 Default.parameters = {
   docs: {
     canvas: {
-      sourceState: 'shown'
-    }
-  }
+      sourceState: "shown",
+    },
+  },
 }
diff --git a/packages/docs/stories/availability/AvailabilityTemplate.stories.tsx b/packages/docs/stories/availability/AvailabilityTemplate.stories.tsx
index bd5a9791..692b2beb 100644
--- a/packages/docs/stories/availability/AvailabilityTemplate.stories.tsx
+++ b/packages/docs/stories/availability/AvailabilityTemplate.stories.tsx
@@ -1,32 +1,32 @@
-import type { Meta, StoryFn, StoryObj } from '@storybook/react'
-import CommerceLayer from '../_internals/CommerceLayer'
-import { AvailabilityTemplate } from '#components/skus/AvailabilityTemplate'
-import { AvailabilityContainer } from '#components/skus/AvailabilityContainer'
-import PricesContainer from '#components/prices/PricesContainer'
+import type { Meta, StoryFn, StoryObj } from "@storybook/react"
+import CommerceLayer from "../_internals/CommerceLayer"
+import { AvailabilityTemplate } from "#components/skus/AvailabilityTemplate"
+import { AvailabilityContainer } from "#components/skus/AvailabilityContainer"
+import PricesContainer from "#components/prices/PricesContainer"
 
 const setup: Meta<typeof AvailabilityTemplate> = {
-  title: 'Components/Availability/AvailabilityTemplate',
+  title: "Components/Availability/AvailabilityTemplate",
   component: AvailabilityTemplate,
   argTypes: {
     showShippingMethodName: {
-      control: 'boolean'
+      control: "boolean",
     },
     showShippingMethodPrice: {
-      control: 'boolean'
+      control: "boolean",
     },
     timeFormat: {
-      control: 'radio',
-      options: ['days', 'hours', undefined]
-    }
-  }
+      control: "radio",
+      options: ["days", "hours", undefined],
+    },
+  },
 }
 
 export default setup
 
 const Template: StoryFn<typeof AvailabilityTemplate> = (args) => {
   return (
-    <CommerceLayer accessToken='my-access-token'>
-      <AvailabilityContainer skuCode='POLOMXXX000000FFFFFFLXXX'>
+    <CommerceLayer accessToken="my-access-token">
+      <AvailabilityContainer skuCode="POLOMXXX000000FFFFFFLXXX">
         <AvailabilityTemplate {...args} />
       </AvailabilityContainer>
     </CommerceLayer>
@@ -35,9 +35,9 @@ const Template: StoryFn<typeof AvailabilityTemplate> = (args) => {
 
 export const AvailableWithDeliveryTime = Template.bind({})
 AvailableWithDeliveryTime.args = {
-  timeFormat: 'days',
+  timeFormat: "days",
   showShippingMethodName: true,
-  showShippingMethodPrice: true
+  showShippingMethodPrice: true,
 }
 
 /**
@@ -46,8 +46,8 @@ AvailableWithDeliveryTime.args = {
 export const WithCustomLabel = Template.bind({})
 WithCustomLabel.args = {
   labels: {
-    available: 'Item is available'
-  }
+    available: "Item is available",
+  },
 }
 
 /**
@@ -55,16 +55,9 @@ WithCustomLabel.args = {
  */
 export const NotAvailable: StoryFn<typeof AvailabilityTemplate> = (args) => {
   return (
-    <CommerceLayer
-      accessToken='my-access-token'
-      endpoint='https://demo-store.commercelayer.io'
-    >
-      <AvailabilityContainer skuCode='TSHIRTWV000000FFFFFFSXXX'>
-        <AvailabilityTemplate
-          timeFormat='days'
-          showShippingMethodName
-          showShippingMethodPrice
-        />
+    <CommerceLayer accessToken="my-access-token" endpoint="https://demo-store.commercelayer.io">
+      <AvailabilityContainer skuCode="TSHIRTWV000000FFFFFFSXXX">
+        <AvailabilityTemplate timeFormat="days" showShippingMethodName showShippingMethodPrice />
       </AvailabilityContainer>
     </CommerceLayer>
   )
@@ -79,21 +72,18 @@ export const NotAvailable: StoryFn<typeof AvailabilityTemplate> = (args) => {
  */
 export const ChildrenProps: StoryObj = () => {
   return (
-    <CommerceLayer
-      accessToken='my-access-token'
-      endpoint='https://demo-store.commercelayer.io'
-    >
-      <AvailabilityContainer skuCode='POLOMXXX000000FFFFFFLXXX'>
+    <CommerceLayer accessToken="my-access-token" endpoint="https://demo-store.commercelayer.io">
+      <AvailabilityContainer skuCode="POLOMXXX000000FFFFFFLXXX">
         <AvailabilityTemplate>
           {(childrenProps) => {
             return (
               <div>
-                <p className='font-bold'>Custom logic:</p>
-                <p className='mb-8'>
-                  {childrenProps.quantity} items available delivered in{' '}
-                  {childrenProps.min?.hours} hours
+                <p className="font-bold">Custom logic:</p>
+                <p className="mb-8">
+                  {childrenProps.quantity} items available delivered in {childrenProps.min?.hours}{" "}
+                  hours
                 </p>
-                <p className='font-bold'>The delivery_lead_times object</p>
+                <p className="font-bold">The delivery_lead_times object</p>
                 <pre>{JSON.stringify(childrenProps, null, 2)}</pre>
               </div>
             )
@@ -106,21 +96,18 @@ export const ChildrenProps: StoryObj = () => {
 ChildrenProps.decorators = [
   (Story) => {
     return (
-      <CommerceLayer
-        accessToken='my-access-token'
-        endpoint='https://demo-store.commercelayer.io'
-      >
+      <CommerceLayer accessToken="my-access-token" endpoint="https://demo-store.commercelayer.io">
         <PricesContainer>
           <Story />
         </PricesContainer>
       </CommerceLayer>
     )
-  }
+  },
 ]
 ChildrenProps.parameters = {
   docs: {
     source: {
-      type: 'code'
-    }
-  }
+      type: "code",
+    },
+  },
 }
diff --git a/packages/docs/stories/cart/AddToCartButton.stories.tsx b/packages/docs/stories/cart/AddToCartButton.stories.tsx
index 876bfae7..54c72efd 100644
--- a/packages/docs/stories/cart/AddToCartButton.stories.tsx
+++ b/packages/docs/stories/cart/AddToCartButton.stories.tsx
@@ -1,93 +1,91 @@
-import type { Meta, StoryFn, StoryObj } from "@storybook/react";
-import CommerceLayer from "../_internals/CommerceLayer";
-import OrderContainerComponent from "#components/orders/OrderContainer";
-import { AddToCartButton } from "#components/orders/AddToCartButton";
-import OrderStorage from "#components/orders/OrderStorage";
-import LineItemsContainer from "#components/line_items/LineItemsContainer";
-import Errors from "#components/errors/Errors";
-import LineItemName from "#components/line_items/LineItemName";
-import LineItem from "#components/line_items/LineItem";
-import LineItemQuantity from "#components/line_items/LineItemQuantity";
-import LineItemRemoveLink from "#components/line_items/LineItemRemoveLink";
-import LineItemsEmpty from "#components/line_items/LineItemsEmpty";
-import AvailabilityContainer from "#components/skus/AvailabilityContainer";
-import AvailabilityTemplate from "#components/skus/AvailabilityTemplate";
-import { SkusContainer } from "#components/skus/SkusContainer";
-import Skus from "#components/skus/Skus";
+import type { Meta, StoryFn, StoryObj } from "@storybook/react"
+import CommerceLayer from "../_internals/CommerceLayer"
+import OrderContainerComponent from "#components/orders/OrderContainer"
+import { AddToCartButton } from "#components/orders/AddToCartButton"
+import OrderStorage from "#components/orders/OrderStorage"
+import LineItemsContainer from "#components/line_items/LineItemsContainer"
+import Errors from "#components/errors/Errors"
+import LineItemName from "#components/line_items/LineItemName"
+import LineItem from "#components/line_items/LineItem"
+import LineItemQuantity from "#components/line_items/LineItemQuantity"
+import LineItemRemoveLink from "#components/line_items/LineItemRemoveLink"
+import LineItemsEmpty from "#components/line_items/LineItemsEmpty"
+import AvailabilityContainer from "#components/skus/AvailabilityContainer"
+import AvailabilityTemplate from "#components/skus/AvailabilityTemplate"
+import { SkusContainer } from "#components/skus/SkusContainer"
+import Skus from "#components/skus/Skus"
 
 const setup: Meta<typeof AddToCartButton> = {
-	title: "Components/Cart/AddToCartButton",
-	component: AddToCartButton,
-};
+  title: "Components/Cart/AddToCartButton",
+  component: AddToCartButton,
+}
 
-export default setup;
+export default setup
 
 const Template: StoryFn<typeof AddToCartButton> = (args) => {
-	return (
-		<CommerceLayer accessToken="my-access-token">
-			<OrderStorage persistKey="cl-examples-addToCart">
-				<OrderContainer>
-					<AddToCartButton {...args} />
-				</OrderContainer>
-			</OrderStorage>
-		</CommerceLayer>
-	);
-};
+  return (
+    <CommerceLayer accessToken="my-access-token">
+      <OrderStorage persistKey="cl-examples-addToCart">
+        <OrderContainer>
+          <AddToCartButton {...args} />
+        </OrderContainer>
+      </OrderStorage>
+    </CommerceLayer>
+  )
+}
 
-export const AddSku = Template.bind({});
+export const AddSku = Template.bind({})
 AddSku.args = {
-	skuCode: "SWEATWCX000000FFFFFFXSXX",
-	label: "Add SKU to cart",
-	quantity: "2",
-	className: "px-3 py-2 bg-black text-white rounded disabled:opacity-50",
-};
+  skuCode: "SWEATWCX000000FFFFFFXSXX",
+  label: "Add SKU to cart",
+  quantity: "2",
+  className: "px-3 py-2 bg-black text-white rounded disabled:opacity-50",
+}
 
-export const AddBundle = Template.bind({});
+export const AddBundle = Template.bind({})
 AddBundle.args = {
-	bundleCode: "BUNDLE001",
-	label: "Add bundle to cart",
-	quantity: "2",
-	className: "px-3 py-2 bg-black text-white rounded disabled:opacity-50",
-};
+  bundleCode: "BUNDLE001",
+  label: "Add bundle to cart",
+  quantity: "2",
+  className: "px-3 py-2 bg-black text-white rounded disabled:opacity-50",
+}
 
 /**
  * You can combine components and contexts to render an `<AddToCartButton>` within a `<Sku>` context
  * and get available quantity from the `<AvailabilityTemplate>` to control the button disable state.
  */
 export const DisabledWhenOutOfStock: StoryObj = () => {
-	return (
-		<CommerceLayer accessToken="my-access-token">
-			<OrderStorage persistKey="cl-examples-addToCart">
-				<OrderContainer>
-					<SkusContainer
-						skus={["POLOMXXX000000FFFFFFLXXX", "TSHIRTWV000000FFFFFFSXXX"]}
-					>
-						<Skus>
-							<AvailabilityContainer>
-								<AvailabilityTemplate>
-									{(childrenProps) => {
-										return (
-											<div className="mb-4 grid max-w-md">
-												Quantity available: {childrenProps.quantity}
-												<AddToCartButton
-													className="px-3 py-2 bg-black text-white rounded disabled:opacity-50"
-													// reading quantity from the `AvailabilityTemplate` children props to disable the button
-													disabled={childrenProps.quantity <= 0}
-												/>
-											</div>
-										);
-									}}
-								</AvailabilityTemplate>
-							</AvailabilityContainer>
-						</Skus>
-					</SkusContainer>
-				</OrderContainer>
-			</OrderStorage>
-		</CommerceLayer>
-	);
-};
+  return (
+    <CommerceLayer accessToken="my-access-token">
+      <OrderStorage persistKey="cl-examples-addToCart">
+        <OrderContainer>
+          <SkusContainer skus={["POLOMXXX000000FFFFFFLXXX", "TSHIRTWV000000FFFFFFSXXX"]}>
+            <Skus>
+              <AvailabilityContainer>
+                <AvailabilityTemplate>
+                  {(childrenProps) => {
+                    return (
+                      <div className="mb-4 grid max-w-md">
+                        Quantity available: {childrenProps.quantity}
+                        <AddToCartButton
+                          className="px-3 py-2 bg-black text-white rounded disabled:opacity-50"
+                          // reading quantity from the `AvailabilityTemplate` children props to disable the button
+                          disabled={childrenProps.quantity <= 0}
+                        />
+                      </div>
+                    )
+                  }}
+                </AvailabilityTemplate>
+              </AvailabilityContainer>
+            </Skus>
+          </SkusContainer>
+        </OrderContainer>
+      </OrderStorage>
+    </CommerceLayer>
+  )
+}
 
-DisabledWhenOutOfStock.args = {};
+DisabledWhenOutOfStock.args = {}
 
 /**
  * The add to cart button will automatically create a new `line_item` (or update an existing one), but it is also possible to
@@ -100,25 +98,25 @@ DisabledWhenOutOfStock.args = {};
  * </span>
  */
 export const UseCustomAttributesOrExternalPrice: StoryObj = () => {
-	return (
-		<CommerceLayer accessToken="my-access-token">
-			<OrderStorage persistKey="cl-examples-addToCart">
-				<OrderContainer>
-					<AddToCartButton
-						label="Add with custom name"
-						skuCode="SWEATWCX000000FFFFFFXSXX"
-						className="px-3 py-2 bg-black text-white rounded disabled:opacity-50"
-						lineItem={{
-							name: "My custom item name",
-							externalPrice: false, // set as true if your market supports external prices
-						}}
-					/>
-				</OrderContainer>
-			</OrderStorage>
-		</CommerceLayer>
-	);
-};
-UseCustomAttributesOrExternalPrice.args = {};
+  return (
+    <CommerceLayer accessToken="my-access-token">
+      <OrderStorage persistKey="cl-examples-addToCart">
+        <OrderContainer>
+          <AddToCartButton
+            label="Add with custom name"
+            skuCode="SWEATWCX000000FFFFFFXSXX"
+            className="px-3 py-2 bg-black text-white rounded disabled:opacity-50"
+            lineItem={{
+              name: "My custom item name",
+              externalPrice: false, // set as true if your market supports external prices
+            }}
+          />
+        </OrderContainer>
+      </OrderStorage>
+    </CommerceLayer>
+  )
+}
+UseCustomAttributesOrExternalPrice.args = {}
 
 /**
  * You can access the component children props to customize the button or use a different tag.
@@ -127,68 +125,66 @@ UseCustomAttributesOrExternalPrice.args = {};
  * and show an alert with the `orderId` when the operation is successful.
  */
 export const ChildrenProps: StoryObj = () => {
-	return (
-		<AddToCartButton skuCode="SWEATWCX000000FFFFFFXSXX" quantity="1">
-			{(childrenProps) => {
-				return (
-					<div
-						role="button"
-						className="border-dotted border-2 border-blue-500 text-blue-500 p-4 w-auto inline"
-						onClick={() => {
-							childrenProps.handleClick().then(({ orderId, success }) => {
-								if (success) {
-									alert(`item added to cart with orderId ${orderId}`);
-								}
-							});
-						}}
-					>
-						Add to cart
-					</div>
-				);
-			}}
-		</AddToCartButton>
-	);
-};
+  return (
+    <AddToCartButton skuCode="SWEATWCX000000FFFFFFXSXX" quantity="1">
+      {(childrenProps) => {
+        return (
+          <div
+            role="button"
+            className="border-dotted border-2 border-blue-500 text-blue-500 p-4 w-auto inline"
+            onClick={() => {
+              childrenProps.handleClick().then(({ orderId, success }) => {
+                if (success) {
+                  alert(`item added to cart with orderId ${orderId}`)
+                }
+              })
+            }}
+          >
+            Add to cart
+          </div>
+        )
+      }}
+    </AddToCartButton>
+  )
+}
 ChildrenProps.decorators = [
-	(Story) => {
-		return (
-			<CommerceLayer accessToken="my-access-token">
-				<OrderStorage persistKey="cl-examples-addToCart">
-					<OrderContainer>
-						<Story />
-					</OrderContainer>
-				</OrderStorage>
-			</CommerceLayer>
-		);
-	},
-];
+  (Story) => {
+    return (
+      <CommerceLayer accessToken="my-access-token">
+        <OrderStorage persistKey="cl-examples-addToCart">
+          <OrderContainer>
+            <Story />
+          </OrderContainer>
+        </OrderStorage>
+      </CommerceLayer>
+    )
+  },
+]
 
 // Fake OrderContainer to show a cart recap block but keep it hidden in the documentation source code
-const OrderContainer: React.FC<{ children: React.ReactNode }> = ({
-	children,
-}) => {
-	return (
-		<OrderContainerComponent>
-			<>{children}</>
+const OrderContainer: React.FC<{ children: React.ReactNode }> = ({ children }) => {
+  return (
+    <OrderContainerComponent>
+      <>{children}</>
 
-			<div id="cart-recap" className="mt-8 block">
-				<LineItemsContainer>
-					<LineItemsEmpty text="Cart is empty" />
-					<div>
-						{(["skus", "bundles"] as const).map((type) => (
-							<LineItem type={type} key={type}>
-								<div className="flex gap-4 items-center mb-2">
-									<div className="flex" />
-									<LineItemName />
-									<LineItemQuantity readonly={true} />
-									<LineItemRemoveLink className="ml-auto px-2 text-sm rounded bg-red-500 text-white" />
-								</div>
-							</LineItem>
-						))}
-					</div>
-					<Errors resource="orders" />
-				</LineItemsContainer>
-			</div>
-		</OrderContainerComponent>
-	);
-};
+      <div id="cart-recap" className="mt-8 block">
+        <LineItemsContainer>
+          <LineItemsEmpty text="Cart is empty" />
+          <div>
+            {(["skus", "bundles"] as const).map((type) => (
+              <LineItem type={type} key={type}>
+                <div className="flex gap-4 items-center mb-2">
+                  <div className="flex" />
+                  <LineItemName />
+                  <LineItemQuantity readonly={true} />
+                  <LineItemRemoveLink className="ml-auto px-2 text-sm rounded bg-red-500 text-white" />
+                </div>
+              </LineItem>
+            ))}
+          </div>
+          <Errors resource="orders" />
+        </LineItemsContainer>
+      </div>
+    </OrderContainerComponent>
+  )
+}
diff --git a/packages/docs/stories/cart/CartLink.stories.tsx b/packages/docs/stories/cart/CartLink.stories.tsx
index ab2a9e0e..ad7b74c0 100644
--- a/packages/docs/stories/cart/CartLink.stories.tsx
+++ b/packages/docs/stories/cart/CartLink.stories.tsx
@@ -1,19 +1,19 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../_internals/CommerceLayer'
-import OrderContainer from '#components/orders/OrderContainer'
-import CartLink from '#components/orders/CartLink'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../_internals/CommerceLayer"
+import OrderContainer from "#components/orders/OrderContainer"
+import CartLink from "#components/orders/CartLink"
 
 const setup: Meta<typeof CartLink> = {
-  title: 'Components/Cart/CartLink',
-  component: CartLink
+  title: "Components/Cart/CartLink",
+  component: CartLink,
 }
 
 export default setup
 
 const Template: StoryFn<typeof CartLink> = (args) => {
   return (
-    <CommerceLayer accessToken='my-access-token'>
-      <OrderContainer orderId='BXVhDoxVpx'>
+    <CommerceLayer accessToken="my-access-token">
+      <OrderContainer orderId="BXVhDoxVpx">
         <CartLink {...args} />
       </OrderContainer>
     </CommerceLayer>
@@ -22,8 +22,8 @@ const Template: StoryFn<typeof CartLink> = (args) => {
 
 export const Default = Template.bind({})
 Default.args = {
-  label: 'Go to cart',
-  target: '_blank',
+  label: "Go to cart",
+  target: "_blank",
   onClick: () => {},
-  className: 'text-blue-500 hover:underline'
+  className: "text-blue-500 hover:underline",
 }
diff --git a/packages/docs/stories/cart/HostedCart.stories.tsx b/packages/docs/stories/cart/HostedCart.stories.tsx
index c946fb71..dae8bc42 100644
--- a/packages/docs/stories/cart/HostedCart.stories.tsx
+++ b/packages/docs/stories/cart/HostedCart.stories.tsx
@@ -1,14 +1,14 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../_internals/CommerceLayer'
-import OrderContainer from '#components/orders/OrderContainer'
-import { HostedCart } from '#components/orders/HostedCart'
-import { OrderStorage, AddSampleItems } from '../_internals/OrderStorage'
-import LineItemsEmpty from '#components/line_items/LineItemsEmpty'
-import LineItemsContainer from '#components/line_items/LineItemsContainer'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../_internals/CommerceLayer"
+import OrderContainer from "#components/orders/OrderContainer"
+import { HostedCart } from "#components/orders/HostedCart"
+import { OrderStorage, AddSampleItems } from "../_internals/OrderStorage"
+import LineItemsEmpty from "#components/line_items/LineItemsEmpty"
+import LineItemsContainer from "#components/line_items/LineItemsContainer"
 
 const setup: Meta<typeof HostedCart> = {
-  title: 'Components/Cart/HostedCart',
-  component: HostedCart
+  title: "Components/Cart/HostedCart",
+  component: HostedCart,
 }
 
 export default setup
@@ -23,17 +23,14 @@ const Template: StoryFn<typeof HostedCart> = (args) => {
 
 export const Default = Template.bind({})
 Default.args = {
-  type: undefined
+  type: undefined,
 }
 
 Default.decorators = [
   (Story) => {
     return (
-      <CommerceLayer
-        accessToken='my-access-token'
-        endpoint='https://demo-store.commercelayer.io'
-      >
-        <OrderStorage persistKey='cl-examples1-cartId'>
+      <CommerceLayer accessToken="my-access-token" endpoint="https://demo-store.commercelayer.io">
+        <OrderStorage persistKey="cl-examples1-cartId">
           <OrderContainer>
             <LineItemsContainer>
               <LineItemsEmpty>
@@ -49,5 +46,5 @@ Default.decorators = [
         </OrderStorage>
       </CommerceLayer>
     )
-  }
+  },
 ]
diff --git a/packages/docs/stories/cart/MiniCart.stories.tsx b/packages/docs/stories/cart/MiniCart.stories.tsx
index e446023e..a69cbc66 100644
--- a/packages/docs/stories/cart/MiniCart.stories.tsx
+++ b/packages/docs/stories/cart/MiniCart.stories.tsx
@@ -1,28 +1,25 @@
-import type { Meta, StoryFn, Decorator } from '@storybook/react'
-import CommerceLayer from '../_internals/CommerceLayer'
-import OrderContainer from '#components/orders/OrderContainer'
-import CartLink from '#components/orders/CartLink'
-import { HostedCart } from '#components/orders/HostedCart'
-import { OrderStorage } from '../_internals/OrderStorage'
-import LineItemsContainer from '#components/line_items/LineItemsContainer'
-import LineItemsCount from '#components/line_items/LineItemsCount'
+import type { Meta, StoryFn, Decorator } from "@storybook/react"
+import CommerceLayer from "../_internals/CommerceLayer"
+import OrderContainer from "#components/orders/OrderContainer"
+import CartLink from "#components/orders/CartLink"
+import { HostedCart } from "#components/orders/HostedCart"
+import { OrderStorage } from "../_internals/OrderStorage"
+import LineItemsContainer from "#components/line_items/LineItemsContainer"
+import LineItemsCount from "#components/line_items/LineItemsCount"
 
 const setup: Meta = {
-  title: 'Components/Cart/Mini Cart'
+  title: "Components/Cart/Mini Cart",
 }
 
 export default setup
 
 const CartDecorator: Decorator = (Story) => {
   return (
-    <CommerceLayer
-      accessToken='my-access-token'
-      endpoint='https://demo-store.commercelayer.io'
-    >
-      <OrderStorage persistKey='cl-examples1-cartId'>
+    <CommerceLayer accessToken="my-access-token" endpoint="https://demo-store.commercelayer.io">
+      <OrderStorage persistKey="cl-examples1-cartId">
         <div
           style={{
-            minHeight: 600
+            minHeight: 600,
           }}
         >
           {/* we need more space on the canvas to open the mini cart */}
@@ -37,19 +34,15 @@ export const Basic: StoryFn = (arg) => {
   return (
     <OrderContainer>
       <HostedCart
-        type='mini'
+        type="mini"
         openAdd
         style={{
           container: {
-            backgroundColor: 'white'
-          }
+            backgroundColor: "white",
+          },
         }}
       />
-      <CartLink
-        label='Open mini cart'
-        type='mini'
-        className='underline hover:text-blue-500'
-      />
+      <CartLink label="Open mini cart" type="mini" className="underline hover:text-blue-500" />
     </OrderContainer>
   )
 }
@@ -58,18 +51,18 @@ Basic.decorators = [CartDecorator]
 
 export const CartIcon: StoryFn = (args) => {
   return (
-    <div className='relative inline-block cursor-pointer  text-xs font-bold'>
+    <div className="relative inline-block cursor-pointer  text-xs font-bold">
       <LineItemsContainer>
         <svg
-          xmlns='http://www.w3.org/2000/svg'
-          width='36'
-          height='36'
-          fill='currentColor'
-          viewBox='0 0 256 256'
+          xmlns="http://www.w3.org/2000/svg"
+          width="36"
+          height="36"
+          fill="currentColor"
+          viewBox="0 0 256 256"
         >
-          <path d='M216,64H176a48,48,0,0,0-96,0H40A16,16,0,0,0,24,80V200a16,16,0,0,0,16,16H216a16,16,0,0,0,16-16V80A16,16,0,0,0,216,64ZM128,32a32,32,0,0,1,32,32H96A32,32,0,0,1,128,32Zm88,168H40V80H80V96a8,8,0,0,0,16,0V80h64V96a8,8,0,0,0,16,0V80h40Z' />
+          <path d="M216,64H176a48,48,0,0,0-96,0H40A16,16,0,0,0,24,80V200a16,16,0,0,0,16,16H216a16,16,0,0,0,16-16V80A16,16,0,0,0,216,64ZM128,32a32,32,0,0,1,32,32H96A32,32,0,0,1,128,32Zm88,168H40V80H80V96a8,8,0,0,0,16,0V80h64V96a8,8,0,0,0,16,0V80h40Z" />
         </svg>
-        <LineItemsCount className='absolute bottom-2 left-1/2 transform -translate-x-1/2' />
+        <LineItemsCount className="absolute bottom-2 left-1/2 transform -translate-x-1/2" />
       </LineItemsContainer>
     </div>
   )
@@ -77,46 +70,39 @@ export const CartIcon: StoryFn = (args) => {
 CartIcon.parameters = {}
 CartIcon.decorators = [
   (Story) => (
-    <CommerceLayer
-      accessToken='my-access-token'
-      endpoint='https://demo-store.commercelayer.io'
-    >
-      <OrderStorage persistKey='cl-examples1-cartId'>
+    <CommerceLayer accessToken="my-access-token" endpoint="https://demo-store.commercelayer.io">
+      <OrderStorage persistKey="cl-examples1-cartId">
         <OrderContainer>
           <Story />
         </OrderContainer>
       </OrderStorage>
     </CommerceLayer>
-  )
+  ),
 ]
 
 const MyCartIcon = (): JSX.Element => (
-  <div className='relative inline-block cursor-pointer  text-xs font-bold'>
+  <div className="relative inline-block cursor-pointer  text-xs font-bold">
     <LineItemsContainer>
       <svg
-        xmlns='http://www.w3.org/2000/svg'
-        width='36'
-        height='36'
-        fill='currentColor'
-        viewBox='0 0 256 256'
+        xmlns="http://www.w3.org/2000/svg"
+        width="36"
+        height="36"
+        fill="currentColor"
+        viewBox="0 0 256 256"
       >
-        <path d='M216,64H176a48,48,0,0,0-96,0H40A16,16,0,0,0,24,80V200a16,16,0,0,0,16,16H216a16,16,0,0,0,16-16V80A16,16,0,0,0,216,64ZM128,32a32,32,0,0,1,32,32H96A32,32,0,0,1,128,32Zm88,168H40V80H80V96a8,8,0,0,0,16,0V80h64V96a8,8,0,0,0,16,0V80h40Z' />
+        <path d="M216,64H176a48,48,0,0,0-96,0H40A16,16,0,0,0,24,80V200a16,16,0,0,0,16,16H216a16,16,0,0,0,16-16V80A16,16,0,0,0,216,64ZM128,32a32,32,0,0,1,32,32H96A32,32,0,0,1,128,32Zm88,168H40V80H80V96a8,8,0,0,0,16,0V80h64V96a8,8,0,0,0,16,0V80h40Z" />
       </svg>
-      <LineItemsCount className='absolute bottom-2 left-1/2 transform -translate-x-1/2' />
+      <LineItemsCount className="absolute bottom-2 left-1/2 transform -translate-x-1/2" />
     </LineItemsContainer>
   </div>
 )
-MyCartIcon.DisplayName = 'MyCartIcon'
+MyCartIcon.DisplayName = "MyCartIcon"
 
-const cartOverlayStyle = { container: { backgroundColor: 'white' } }
+const cartOverlayStyle = { container: { backgroundColor: "white" } }
 export const WithCartIcon: StoryFn = () => (
   <OrderContainer>
-    <HostedCart type='mini' openAdd style={cartOverlayStyle} />
-    <CartLink
-      label={<MyCartIcon />}
-      type='mini'
-      className='underline hover:text-blue-500'
-    />
+    <HostedCart type="mini" openAdd style={cartOverlayStyle} />
+    <CartLink label={<MyCartIcon />} type="mini" className="underline hover:text-blue-500" />
   </OrderContainer>
 )
 
@@ -124,7 +110,7 @@ WithCartIcon.decorators = [CartDecorator]
 WithCartIcon.parameters = {
   docs: {
     canvas: {
-      sourceState: 'shown'
-    }
-  }
+      sourceState: "shown",
+    },
+  },
 }
diff --git a/packages/docs/stories/customers/Address.stories.tsx b/packages/docs/stories/customers/Address.stories.tsx
index 3065b090..5ab7bb0a 100644
--- a/packages/docs/stories/customers/Address.stories.tsx
+++ b/packages/docs/stories/customers/Address.stories.tsx
@@ -1,44 +1,44 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../_internals/CommerceLayer'
-import CustomerContainer from '#components/customers/CustomerContainer'
-import AddressesContainer from '#components/addresses/AddressesContainer'
-import { AddressesEmpty } from '#components/addresses/AddressesEmpty'
-import { Address } from '#components/addresses/Address'
-import { AddressField } from '#components/addresses/AddressField'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../_internals/CommerceLayer"
+import CustomerContainer from "#components/customers/CustomerContainer"
+import AddressesContainer from "#components/addresses/AddressesContainer"
+import { AddressesEmpty } from "#components/addresses/AddressesEmpty"
+import { Address } from "#components/addresses/Address"
+import { AddressField } from "#components/addresses/AddressField"
 
 const setup: Meta<typeof Address> = {
-  title: 'Components/Customers/Address',
-  component: Address
+  title: "Components/Customers/Address",
+  component: Address,
 }
 
 export default setup
 
 const Template: StoryFn<typeof Address> = () => {
   return (
-    <CommerceLayer accessToken='customer-access-token'>
+    <CommerceLayer accessToken="customer-access-token">
       <CustomerContainer>
         <AddressesContainer>
-          <h1 className='text-xl mb-2'>Customer Addresses</h1>
-          <AddressesEmpty emptyText='No saved address for current customer' />
+          <h1 className="text-xl mb-2">Customer Addresses</h1>
+          <AddressesEmpty emptyText="No saved address for current customer" />
           <Address
-            className='rounded border-2 border-gray-200 cursor-pointer select-none'
-            selectedClassName='!border-green-500'
+            className="rounded border-2 border-gray-200 cursor-pointer select-none"
+            selectedClassName="!border-green-500"
             onSelect={() => {
-              alert('select')
+              alert("select")
             }}
           >
-            <div className='flex gap-2'>
+            <div className="flex gap-2">
               <div>
                 <strong>First Name</strong>
-                <AddressField name='first_name' />
+                <AddressField name="first_name" />
               </div>
               <div>
                 <strong>Last Name</strong>
-                <AddressField name='last_name' />
+                <AddressField name="last_name" />
               </div>
               <div>
                 <strong>Address</strong>
-                <AddressField name='full_address' />
+                <AddressField name="full_address" />
               </div>
             </div>
           </Address>
@@ -53,10 +53,10 @@ Default.args = {}
 Default.parameters = {
   docs: {
     canvas: {
-      sourceState: 'shown'
+      sourceState: "shown",
     },
     source: {
-      type: 'code'
-    }
-  }
+      type: "code",
+    },
+  },
 }
diff --git a/packages/docs/stories/customers/AddressField.stories.tsx b/packages/docs/stories/customers/AddressField.stories.tsx
index 115f0cd3..1d2e6090 100644
--- a/packages/docs/stories/customers/AddressField.stories.tsx
+++ b/packages/docs/stories/customers/AddressField.stories.tsx
@@ -1,40 +1,31 @@
-import { type Meta, type StoryFn } from '@storybook/react'
-import CommerceLayer from '../_internals/CommerceLayer'
-import { AddressesContainer } from '#components/addresses/AddressesContainer'
-import { Address } from '#components/addresses/Address'
-import { AddressField } from '#components/addresses/AddressField'
-import CustomerContainer from '#components/customers/CustomerContainer'
-import AddressesEmpty from '#components/addresses/AddressesEmpty'
+import { type Meta, type StoryFn } from "@storybook/react"
+import CommerceLayer from "../_internals/CommerceLayer"
+import { AddressesContainer } from "#components/addresses/AddressesContainer"
+import { Address } from "#components/addresses/Address"
+import { AddressField } from "#components/addresses/AddressField"
+import CustomerContainer from "#components/customers/CustomerContainer"
+import AddressesEmpty from "#components/addresses/AddressesEmpty"
 
 const setup: Meta<typeof AddressField> = {
-  title: 'Components/Customers/AddressField',
+  title: "Components/Customers/AddressField",
   component: AddressField,
   argTypes: {
     name: {
-      control: 'select',
-      options: [
-        'first_name',
-        'last_name',
-        'full_name',
-        'full_address',
-        'email',
-        'phone',
-        'line_1'
-      ],
-      description: 'Resource attribute to be displayed.'
+      control: "select",
+      options: ["first_name", "last_name", "full_name", "full_address", "email", "phone", "line_1"],
+      description: "Resource attribute to be displayed.",
     },
     type: {
-      control: 'select',
-      options: ['field', 'edit', 'delete'],
+      control: "select",
+      options: ["field", "edit", "delete"],
       description:
-        'Behavior requested for current `AddressField`. It could be `field` to show an attribute of an `address` or either `Edit` or `Delete` to generate an action button to interact with current `address`.'
+        "Behavior requested for current `AddressField`. It could be `field` to show an attribute of an `address` or either `Edit` or `Delete` to generate an action button to interact with current `address`.",
     },
     label: {
-      control: 'text',
-      description:
-        'Label to be displayed in case of `field` is set to either `edit` or `delete`.'
-    }
-  }
+      control: "text",
+      description: "Label to be displayed in case of `field` is set to either `edit` or `delete`.",
+    },
+  },
 }
 
 export default setup
@@ -45,18 +36,18 @@ const Template: StoryFn<typeof AddressField> = (args) => {
 
 export const Default = Template.bind({})
 Default.args = {
-  name: 'first_name',
-  type: 'field'
+  name: "first_name",
+  type: "field",
 }
 
 Default.decorators = [
   (Story) => (
-    <CommerceLayer accessToken='customer-access-token'>
+    <CommerceLayer accessToken="customer-access-token">
       <CustomerContainer>
         <AddressesContainer>
           <AddressesEmpty
-            className='text-small'
-            emptyText='No addresses to list. Add an address to print here the relative <AddressField> content'
+            className="text-small"
+            emptyText="No addresses to list. Add an address to print here the relative <AddressField> content"
           />
           <Address>
             <Story />
@@ -64,5 +55,5 @@ Default.decorators = [
         </AddressesContainer>
       </CustomerContainer>
     </CommerceLayer>
-  )
+  ),
 ]
diff --git a/packages/docs/stories/customers/AddressesContainer.stories.tsx b/packages/docs/stories/customers/AddressesContainer.stories.tsx
index 5c57e1b8..9640c1d8 100644
--- a/packages/docs/stories/customers/AddressesContainer.stories.tsx
+++ b/packages/docs/stories/customers/AddressesContainer.stories.tsx
@@ -1,24 +1,24 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../_internals/CommerceLayer'
-import CustomerContainer from '#components/customers/CustomerContainer'
-import AddressesContainer from '#components/addresses/AddressesContainer'
-import { AddressesEmpty } from '#components/addresses/AddressesEmpty'
-import { Address as AddressComponent } from '#components/addresses/Address'
-import { AddressField } from '#components/addresses/AddressField'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../_internals/CommerceLayer"
+import CustomerContainer from "#components/customers/CustomerContainer"
+import AddressesContainer from "#components/addresses/AddressesContainer"
+import { AddressesEmpty } from "#components/addresses/AddressesEmpty"
+import { Address as AddressComponent } from "#components/addresses/Address"
+import { AddressField } from "#components/addresses/AddressField"
 
 const setup: Meta<typeof AddressesContainer> = {
-  title: 'Components/Customers/AddressesContainer',
-  component: AddressesContainer
+  title: "Components/Customers/AddressesContainer",
+  component: AddressesContainer,
 }
 
 export default setup
 
 const Template: StoryFn<typeof AddressesContainer> = (args) => {
   return (
-    <CommerceLayer accessToken='customer-access-token'>
+    <CommerceLayer accessToken="customer-access-token">
       <CustomerContainer>
         <AddressesContainer>
-          <AddressesEmpty emptyText='No saved address for current customer' />
+          <AddressesEmpty emptyText="No saved address for current customer" />
           <Address />
         </AddressesContainer>
       </CustomerContainer>
@@ -31,17 +31,17 @@ Default.args = {}
 Default.parameters = {
   docs: {
     canvas: {
-      sourceState: 'shown'
-    }
-  }
+      sourceState: "shown",
+    },
+  },
 }
 
 const Address: React.FC = () => {
   return (
     <AddressComponent>
-      <div className='grid gap-2'>
-        <AddressField name='full_name' />
-        <AddressField name='full_address' />
+      <div className="grid gap-2">
+        <AddressField name="full_name" />
+        <AddressField name="full_address" />
       </div>
     </AddressComponent>
   )
diff --git a/packages/docs/stories/customers/AddressesEmpty.stories.tsx b/packages/docs/stories/customers/AddressesEmpty.stories.tsx
index 04ed138e..7e20a408 100644
--- a/packages/docs/stories/customers/AddressesEmpty.stories.tsx
+++ b/packages/docs/stories/customers/AddressesEmpty.stories.tsx
@@ -1,22 +1,22 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../_internals/CommerceLayer'
-import CustomerContainer from '#components/customers/CustomerContainer'
-import AddressesContainer from '#components/addresses/AddressesContainer'
-import { AddressesEmpty } from '#components/addresses/AddressesEmpty'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../_internals/CommerceLayer"
+import CustomerContainer from "#components/customers/CustomerContainer"
+import AddressesContainer from "#components/addresses/AddressesContainer"
+import { AddressesEmpty } from "#components/addresses/AddressesEmpty"
 
 const setup: Meta<typeof AddressesEmpty> = {
-  title: 'Components/Customers/AddressesEmpty',
-  component: AddressesEmpty
+  title: "Components/Customers/AddressesEmpty",
+  component: AddressesEmpty,
 }
 
 export default setup
 
 const Template: StoryFn<typeof AddressesEmpty> = (args) => {
   return (
-    <CommerceLayer accessToken='customer-access-token'>
+    <CommerceLayer accessToken="customer-access-token">
       <CustomerContainer>
         <AddressesContainer>
-          <AddressesEmpty emptyText='No saved address for current customer' />
+          <AddressesEmpty emptyText="No saved address for current customer" />
         </AddressesContainer>
       </CustomerContainer>
     </CommerceLayer>
@@ -28,7 +28,7 @@ Default.args = {}
 Default.parameters = {
   docs: {
     canvas: {
-      sourceState: 'shown'
-    }
-  }
+      sourceState: "shown",
+    },
+  },
 }
diff --git a/packages/docs/stories/customers/BillingAddressForm.stories.tsx b/packages/docs/stories/customers/BillingAddressForm.stories.tsx
index 69eb66e0..56ec1421 100644
--- a/packages/docs/stories/customers/BillingAddressForm.stories.tsx
+++ b/packages/docs/stories/customers/BillingAddressForm.stories.tsx
@@ -1,26 +1,22 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../_internals/CommerceLayer'
-import CustomerContainer from '#components/customers/CustomerContainer'
-import AddressesContainer from '#components/addresses/AddressesContainer'
-import { BillingAddressForm } from '#components/addresses/BillingAddressForm'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../_internals/CommerceLayer"
+import CustomerContainer from "#components/customers/CustomerContainer"
+import AddressesContainer from "#components/addresses/AddressesContainer"
+import { BillingAddressForm } from "#components/addresses/BillingAddressForm"
 
 const setup: Meta<typeof BillingAddressForm> = {
-  title: 'Components/Customers/BillingAddressForm',
-  component: BillingAddressForm
+  title: "Components/Customers/BillingAddressForm",
+  component: BillingAddressForm,
 }
 
 export default setup
 
 const Template: StoryFn<typeof BillingAddressForm> = () => {
   return (
-    <CommerceLayer accessToken='customer-access-token'>
+    <CommerceLayer accessToken="customer-access-token">
       <CustomerContainer>
         <AddressesContainer>
-          <BillingAddressForm
-            errorClassName='border-red-600'
-            autoComplete='on'
-            className='p-2'
-          >
+          <BillingAddressForm errorClassName="border-red-600" autoComplete="on" className="p-2">
             <div>
               {/* Fields here... */}
               BillingAddressForm
@@ -37,7 +33,7 @@ Default.args = {}
 Default.parameters = {
   docs: {
     canvas: {
-      sourceState: 'shown'
-    }
-  }
+      sourceState: "shown",
+    },
+  },
 }
diff --git a/packages/docs/stories/customers/CustomerContainer.stories.tsx b/packages/docs/stories/customers/CustomerContainer.stories.tsx
index b67f32bd..202da7c6 100644
--- a/packages/docs/stories/customers/CustomerContainer.stories.tsx
+++ b/packages/docs/stories/customers/CustomerContainer.stories.tsx
@@ -1,20 +1,20 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../_internals/CommerceLayer'
-import CustomerContainer from '#components/customers/CustomerContainer'
-import { CustomerField } from '#components/customers/CustomerField'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../_internals/CommerceLayer"
+import CustomerContainer from "#components/customers/CustomerContainer"
+import { CustomerField } from "#components/customers/CustomerField"
 
 const setup: Meta<typeof CustomerContainer> = {
-  title: 'Components/Customers/CustomerContainer',
-  component: CustomerContainer
+  title: "Components/Customers/CustomerContainer",
+  component: CustomerContainer,
 }
 
 export default setup
 
 const Template: StoryFn<typeof CustomerContainer> = (args) => {
   return (
-    <CommerceLayer accessToken='customer-access-token'>
+    <CommerceLayer accessToken="customer-access-token">
       <CustomerContainer>
-        <CustomerField name='email' attribute='email' tagElement='p' />
+        <CustomerField name="email" attribute="email" tagElement="p" />
       </CustomerContainer>
     </CommerceLayer>
   )
@@ -25,7 +25,7 @@ Default.args = {}
 Default.parameters = {
   docs: {
     canvas: {
-      sourceState: 'shown'
-    }
-  }
+      sourceState: "shown",
+    },
+  },
 }
diff --git a/packages/docs/stories/customers/CustomerField.stories.tsx b/packages/docs/stories/customers/CustomerField.stories.tsx
index e80d1d9a..10c969fd 100644
--- a/packages/docs/stories/customers/CustomerField.stories.tsx
+++ b/packages/docs/stories/customers/CustomerField.stories.tsx
@@ -1,24 +1,24 @@
-import { type Meta, type StoryFn } from '@storybook/react'
-import CommerceLayer from '../_internals/CommerceLayer'
-import { CustomerContainer } from '#components/customers/CustomerContainer'
-import { CustomerField } from '#components/customers/CustomerField'
+import { type Meta, type StoryFn } from "@storybook/react"
+import CommerceLayer from "../_internals/CommerceLayer"
+import { CustomerContainer } from "#components/customers/CustomerContainer"
+import { CustomerField } from "#components/customers/CustomerField"
 
 const setup: Meta<typeof CustomerField> = {
-  title: 'Components/Customers/CustomerField',
+  title: "Components/Customers/CustomerField",
   component: CustomerField,
   argTypes: {
     attribute: {
-      control: 'select',
-      options: ['email', 'status', 'total_orders_count'],
-      description: 'Resource attribute to display'
+      control: "select",
+      options: ["email", "status", "total_orders_count"],
+      description: "Resource attribute to display",
     },
     tagElement: {
-      control: 'select',
-      options: ['div', 'p', 'span', 'section'],
+      control: "select",
+      options: ["div", "p", "span", "section"],
       description:
-        'Resource attribute to displayHtml tag to render. When tag is `img` the value will be used to fill the `src` attribute.'
-    }
-  }
+        "Resource attribute to displayHtml tag to render. When tag is `img` the value will be used to fill the `src` attribute.",
+    },
+  },
 }
 
 export default setup
@@ -29,16 +29,16 @@ const Template: StoryFn<typeof CustomerField> = (args) => {
 
 export const Default = Template.bind({})
 Default.args = {
-  attribute: 'email',
-  tagElement: 'p'
+  attribute: "email",
+  tagElement: "p",
 }
 
 Default.decorators = [
   (Story) => (
-    <CommerceLayer accessToken='customer-access-token'>
+    <CommerceLayer accessToken="customer-access-token">
       <CustomerContainer>
         <Story />
       </CustomerContainer>
     </CommerceLayer>
-  )
+  ),
 ]
diff --git a/packages/docs/stories/customers/MyAccountLink.stories.tsx b/packages/docs/stories/customers/MyAccountLink.stories.tsx
index cede187b..7d6b7419 100644
--- a/packages/docs/stories/customers/MyAccountLink.stories.tsx
+++ b/packages/docs/stories/customers/MyAccountLink.stories.tsx
@@ -1,18 +1,18 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../_internals/CommerceLayer'
-import MyAccountLink from '#components/customers/MyAccountLink'
-import CustomerContainer from '#components/customers/CustomerContainer'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../_internals/CommerceLayer"
+import MyAccountLink from "#components/customers/MyAccountLink"
+import CustomerContainer from "#components/customers/CustomerContainer"
 
 const setup: Meta<typeof MyAccountLink> = {
-  title: 'Components/Customers/MyAccountLink',
-  component: MyAccountLink
+  title: "Components/Customers/MyAccountLink",
+  component: MyAccountLink,
 }
 
 export default setup
 
 const Template: StoryFn<typeof MyAccountLink> = (args) => {
   return (
-    <CommerceLayer accessToken='customer-access-token'>
+    <CommerceLayer accessToken="customer-access-token">
       <CustomerContainer>
         <MyAccountLink {...args} />
       </CustomerContainer>
@@ -22,8 +22,8 @@ const Template: StoryFn<typeof MyAccountLink> = (args) => {
 
 export const Default = Template.bind({})
 Default.args = {
-  label: 'Go to my-account',
-  target: '_blank',
+  label: "Go to my-account",
+  target: "_blank",
   onClick: () => {},
-  className: 'text-blue-500 hover:underline'
+  className: "text-blue-500 hover:underline",
 }
diff --git a/packages/docs/stories/customers/MyIdentityLink.stories.tsx b/packages/docs/stories/customers/MyIdentityLink.stories.tsx
index c5250860..273d880e 100644
--- a/packages/docs/stories/customers/MyIdentityLink.stories.tsx
+++ b/packages/docs/stories/customers/MyIdentityLink.stories.tsx
@@ -1,17 +1,11 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../_internals/CommerceLayer'
-import MyIdentityLink from '#components/customers/MyIdentityLink'
-import { Code } from 'stories/_internals/Code'
-import {
-  Description,
-  Subtitle,
-  Title,
-  Controls,
-  Primary
-} from '@storybook/addon-docs'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../_internals/CommerceLayer"
+import MyIdentityLink from "#components/customers/MyIdentityLink"
+import { Code } from "stories/_internals/Code"
+import { Description, Subtitle, Title, Controls, Primary } from "@storybook/addon-docs"
 
 const setup: Meta<typeof MyIdentityLink> = {
-  title: 'Components/Customers/MyIdentityLink',
+  title: "Components/Customers/MyIdentityLink",
   component: MyIdentityLink,
 
   parameters: {
@@ -25,16 +19,16 @@ const setup: Meta<typeof MyIdentityLink> = {
           <Instructions />
           <Controls />
         </>
-      )
-    }
-  }
+      ),
+    },
+  },
 }
 
 export default setup
 
 const Template: StoryFn<typeof MyIdentityLink> = (args) => {
   return (
-    <CommerceLayer accessToken='my-access-token'>
+    <CommerceLayer accessToken="my-access-token">
       <MyIdentityLink {...args} />
     </CommerceLayer>
   )
@@ -42,14 +36,14 @@ const Template: StoryFn<typeof MyIdentityLink> = (args) => {
 
 export const Default = Template.bind({})
 Default.args = {
-  label: 'Open my-identity app',
-  target: '_blank',
+  label: "Open my-identity app",
+  target: "_blank",
   onClick: () => {},
-  className: 'text-blue-500 hover:underline',
-  returnUrl: '',
-  clientId: '',
-  type: 'signup',
-  scope: ''
+  className: "text-blue-500 hover:underline",
+  returnUrl: "",
+  clientId: "",
+  type: "signup",
+  scope: "",
 }
 
 Default.decorators = [
@@ -59,21 +53,18 @@ Default.decorators = [
         <Story />
       </div>
     )
-  }
+  },
 ]
 
 const Instructions = (): JSX.Element => (
-  <div className='mb-4'>
+  <div className="mb-4">
     {/* @ts-expect-error add a note of type `info` just for documenting the use case */}
-    <span title='How to use' type='warning'>
-      Fill the table of values below with a valid <Code>clientId</Code>,{' '}
-      <Code>scope</Code> and <Code>returnUrl</Code> from your organization to
-      see the link in action. <br />
+    <span title="How to use" type="warning">
+      Fill the table of values below with a valid <Code>clientId</Code>, <Code>scope</Code> and{" "}
+      <Code>returnUrl</Code> from your organization to see the link in action. <br />
       <br />
       As return url you can use our hosted mfe-my-account: <br />
-      <Code>
-        https://&lt;organization-slug&gt;.commercelayer.app/my-account
-      </Code>
+      <Code>https://&lt;organization-slug&gt;.commercelayer.app/my-account</Code>
     </span>
   </div>
 )
diff --git a/packages/docs/stories/examples/cart/001.cart.stories.tsx b/packages/docs/stories/examples/cart/001.cart.stories.tsx
index 628bf3bd..6e9ba17b 100644
--- a/packages/docs/stories/examples/cart/001.cart.stories.tsx
+++ b/packages/docs/stories/examples/cart/001.cart.stories.tsx
@@ -1,59 +1,53 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../../_internals/CommerceLayer'
-import OrderContainer from '#components/orders/OrderContainer'
-import LineItemsContainer from '#components/line_items/LineItemsContainer'
-import LineItemsCount from '#components/line_items/LineItemsCount'
-import LineItem from '#components/line_items/LineItem'
-import LineItemName from '#components/line_items/LineItemName'
-import LineItemRemoveLink from '#components/line_items/LineItemRemoveLink'
-import LineItemImage from '#components/line_items/LineItemImage'
-import LineItemQuantity from '#components/line_items/LineItemQuantity'
-import Errors from '#components/errors/Errors'
-import LineItemAmount from '#components/line_items/LineItemAmount'
-import LineItemsEmpty from '#components/line_items/LineItemsEmpty'
-import SubTotalAmount from '#components/orders/SubTotalAmount'
-import DiscountAmount from '#components/orders/DiscountAmount'
-import GiftCardAmount from '#components/orders/GiftCardAmount'
-import TotalAmount from '#components/orders/TotalAmount'
-import GiftCardOrCouponForm from '#components/gift_cards/GiftCardOrCouponForm'
-import GiftCardOrCouponSubmit from '#components/gift_cards/GiftCardOrCouponSubmit'
-import GiftCardOrCouponInput from '#components/gift_cards/GiftCardOrCouponInput'
-import GiftCardOrCouponCode from '#components/gift_cards/GiftCardOrCouponCode'
-import GiftCardOrCouponRemoveButton from '#components/gift_cards/GiftCardOrCouponRemoveButton'
-import { OrderStorage, AddSampleItems } from '../../_internals/OrderStorage'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../../_internals/CommerceLayer"
+import OrderContainer from "#components/orders/OrderContainer"
+import LineItemsContainer from "#components/line_items/LineItemsContainer"
+import LineItemsCount from "#components/line_items/LineItemsCount"
+import LineItem from "#components/line_items/LineItem"
+import LineItemName from "#components/line_items/LineItemName"
+import LineItemRemoveLink from "#components/line_items/LineItemRemoveLink"
+import LineItemImage from "#components/line_items/LineItemImage"
+import LineItemQuantity from "#components/line_items/LineItemQuantity"
+import Errors from "#components/errors/Errors"
+import LineItemAmount from "#components/line_items/LineItemAmount"
+import LineItemsEmpty from "#components/line_items/LineItemsEmpty"
+import SubTotalAmount from "#components/orders/SubTotalAmount"
+import DiscountAmount from "#components/orders/DiscountAmount"
+import GiftCardAmount from "#components/orders/GiftCardAmount"
+import TotalAmount from "#components/orders/TotalAmount"
+import GiftCardOrCouponForm from "#components/gift_cards/GiftCardOrCouponForm"
+import GiftCardOrCouponSubmit from "#components/gift_cards/GiftCardOrCouponSubmit"
+import GiftCardOrCouponInput from "#components/gift_cards/GiftCardOrCouponInput"
+import GiftCardOrCouponCode from "#components/gift_cards/GiftCardOrCouponCode"
+import GiftCardOrCouponRemoveButton from "#components/gift_cards/GiftCardOrCouponRemoveButton"
+import { OrderStorage, AddSampleItems } from "../../_internals/OrderStorage"
 
 const setup: Meta = {
-  title: 'Examples/Shopping Cart/Cart page'
+  title: "Examples/Shopping Cart/Cart page",
 }
 
 export default setup
 
 export const Default: StoryFn = (args) => {
   return (
-    <CommerceLayer
-      accessToken='my-access-token'
-      endpoint='https://demo-store.commercelayer.io'
-    >
-      <OrderStorage persistKey='cl-examples1-cartId'>
+    <CommerceLayer accessToken="my-access-token" endpoint="https://demo-store.commercelayer.io">
+      <OrderStorage persistKey="cl-examples1-cartId">
         <OrderContainer>
-          <section className='p-6 border rounded-lg mb-4 max-w-xl'>
-            <legend className='text-lg font-bold'>Line items</legend>
+          <section className="p-6 border rounded-lg mb-4 max-w-xl">
+            <legend className="text-lg font-bold">Line items</legend>
             <LineItemsContainer>
-              <p className='text-large mb-4'>
+              <p className="text-large mb-4">
                 Items count: <LineItemsCount />
               </p>
-              <LineItem type='skus'>
-                <div className='grid gap-4 grid-cols-[auto,5fr,auto,2fr,auto] mb-4 items-center'>
+              <LineItem type="skus">
+                <div className="grid gap-4 grid-cols-[auto,5fr,auto,2fr,auto] mb-4 items-center">
                   <LineItemImage width={50} />
                   <LineItemName />
                   <div>
-                    <LineItemQuantity
-                      max={10}
-                      className='p-2 border border-gray-300'
-                    />
-                    <Errors resource='line_items' field='quantity' />
+                    <LineItemQuantity max={10} className="p-2 border border-gray-300" />
+                    <Errors resource="line_items" field="quantity" />
                   </div>
-                  <LineItemAmount className='text-right' />
+                  <LineItemAmount className="text-right" />
                   <LineItemRemoveLink />
                 </div>
               </LineItem>
@@ -63,38 +57,38 @@ export const Default: StoryFn = (args) => {
             </LineItemsContainer>
           </section>
 
-          <section className='p-6 border rounded-lg mb-4'>
-            <legend className='text-lg font-bold'>Coupon</legend>
-            <GiftCardOrCouponForm codeType='coupon_code'>
-              <GiftCardOrCouponInput className='border p-2' />
-              <GiftCardOrCouponSubmit className='px-4 py-2 bg-black border text-white' />
+          <section className="p-6 border rounded-lg mb-4">
+            <legend className="text-lg font-bold">Coupon</legend>
+            <GiftCardOrCouponForm codeType="coupon_code">
+              <GiftCardOrCouponInput className="border p-2" />
+              <GiftCardOrCouponSubmit className="px-4 py-2 bg-black border text-white" />
             </GiftCardOrCouponForm>
-            <div className='flex'>
-              <GiftCardOrCouponCode type='coupon' />
+            <div className="flex">
+              <GiftCardOrCouponCode type="coupon" />
               <GiftCardOrCouponRemoveButton
-                type='coupon'
-                className='px-4 py-2 bg-black border text-white'
+                type="coupon"
+                className="px-4 py-2 bg-black border text-white"
               />
             </div>
           </section>
-          <section className='p-6 border rounded-lg mb-4'>
-            <legend className='text-lg font-bold'>Gift Card</legend>
-            <GiftCardOrCouponForm codeType='gift_card_code'>
-              <GiftCardOrCouponInput className='border p-2' />
-              <GiftCardOrCouponSubmit className='px-4 py-2 bg-black border text-white' />
+          <section className="p-6 border rounded-lg mb-4">
+            <legend className="text-lg font-bold">Gift Card</legend>
+            <GiftCardOrCouponForm codeType="gift_card_code">
+              <GiftCardOrCouponInput className="border p-2" />
+              <GiftCardOrCouponSubmit className="px-4 py-2 bg-black border text-white" />
             </GiftCardOrCouponForm>
-            <div className='flex'>
-              <GiftCardOrCouponCode type='gift_card' />
+            <div className="flex">
+              <GiftCardOrCouponCode type="gift_card" />
               <GiftCardOrCouponRemoveButton
-                type='gift_card'
-                className='px-4 py-2 bg-black border text-white'
+                type="gift_card"
+                className="px-4 py-2 bg-black border text-white"
               />
             </div>
           </section>
 
-          <section className='p-6 border rounded-lg'>
-            <legend className='text-lg font-bold'>Totals</legend>
-            <div className='grid grid-cols-2 max-width'>
+          <section className="p-6 border rounded-lg">
+            <legend className="text-lg font-bold">Totals</legend>
+            <div className="grid grid-cols-2 max-width">
               Subtotal <SubTotalAmount />
               Discount <DiscountAmount />
               Gift Card <GiftCardAmount />
@@ -102,7 +96,7 @@ export const Default: StoryFn = (args) => {
             </div>
           </section>
 
-          <Errors resource='orders' />
+          <Errors resource="orders" />
         </OrderContainer>
       </OrderStorage>
     </CommerceLayer>
diff --git a/packages/docs/stories/examples/checkout/001.items.stories.tsx b/packages/docs/stories/examples/checkout/001.items.stories.tsx
index 6ffed270..63a20272 100644
--- a/packages/docs/stories/examples/checkout/001.items.stories.tsx
+++ b/packages/docs/stories/examples/checkout/001.items.stories.tsx
@@ -1,52 +1,52 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../../_internals/CommerceLayer'
-import OrderContainer from '#components/orders/OrderContainer'
-import LineItemsContainer from '#components/line_items/LineItemsContainer'
-import LineItem from '#components/line_items/LineItem'
-import LineItemName from '#components/line_items/LineItemName'
-import LineItemImage from '#components/line_items/LineItemImage'
-import LineItemAmount from '#components/line_items/LineItemAmount'
-import LineItemsEmpty from '#components/line_items/LineItemsEmpty'
-import { OrderStorage, AddSampleItems } from '../../_internals/OrderStorage'
-import LineItemQuantity from '#components/line_items/LineItemQuantity'
-import { persistKey } from './utils'
-import GiftCardOrCouponForm from '#components/gift_cards/GiftCardOrCouponForm'
-import GiftCardOrCouponSubmit from '#components/gift_cards/GiftCardOrCouponSubmit'
-import GiftCardOrCouponInput from '#components/gift_cards/GiftCardOrCouponInput'
-import Errors from '#components/errors/Errors'
-import GiftCardOrCouponCode from '#components/gift_cards/GiftCardOrCouponCode'
-import GiftCardOrCouponRemoveButton from '#components/gift_cards/GiftCardOrCouponRemoveButton'
-import SubTotalAmount from '#components/orders/SubTotalAmount'
-import DiscountAmount from '#components/orders/DiscountAmount'
-import GiftCardAmount from '#components/orders/GiftCardAmount'
-import TotalAmount from '#components/orders/TotalAmount'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../../_internals/CommerceLayer"
+import OrderContainer from "#components/orders/OrderContainer"
+import LineItemsContainer from "#components/line_items/LineItemsContainer"
+import LineItem from "#components/line_items/LineItem"
+import LineItemName from "#components/line_items/LineItemName"
+import LineItemImage from "#components/line_items/LineItemImage"
+import LineItemAmount from "#components/line_items/LineItemAmount"
+import LineItemsEmpty from "#components/line_items/LineItemsEmpty"
+import { OrderStorage, AddSampleItems } from "../../_internals/OrderStorage"
+import LineItemQuantity from "#components/line_items/LineItemQuantity"
+import { persistKey } from "./utils"
+import GiftCardOrCouponForm from "#components/gift_cards/GiftCardOrCouponForm"
+import GiftCardOrCouponSubmit from "#components/gift_cards/GiftCardOrCouponSubmit"
+import GiftCardOrCouponInput from "#components/gift_cards/GiftCardOrCouponInput"
+import Errors from "#components/errors/Errors"
+import GiftCardOrCouponCode from "#components/gift_cards/GiftCardOrCouponCode"
+import GiftCardOrCouponRemoveButton from "#components/gift_cards/GiftCardOrCouponRemoveButton"
+import SubTotalAmount from "#components/orders/SubTotalAmount"
+import DiscountAmount from "#components/orders/DiscountAmount"
+import GiftCardAmount from "#components/orders/GiftCardAmount"
+import TotalAmount from "#components/orders/TotalAmount"
 
 const setup: Meta = {
-  title: 'Examples/Checkout Page/Item list'
+  title: "Examples/Checkout Page/Item list",
 }
 
 export default setup
 
 export const ListOfItems: StoryFn = (args) => {
   return (
-    <CommerceLayer accessToken='my-access-token'>
+    <CommerceLayer accessToken="my-access-token">
       <OrderStorage persistKey={persistKey}>
         <OrderContainer>
-          <section className='max-w-xl'>
+          <section className="max-w-xl">
             <LineItemsContainer>
-              <LineItem type='skus'>
-                <div className='grid gap-4 grid-cols-[1fr,5fr,1fr,1fr] mb-4 items-center'>
+              <LineItem type="skus">
+                <div className="grid gap-4 grid-cols-[1fr,5fr,1fr,1fr] mb-4 items-center">
                   <LineItemImage width={50} />
                   <div>
                     <LineItemName />
-                    <div className='text-gray-500 text-sm'>
-                      Unit price: <LineItemAmount type='unit' />
+                    <div className="text-gray-500 text-sm">
+                      Unit price: <LineItemAmount type="unit" />
                     </div>
                   </div>
                   <div>
                     &times; <LineItemQuantity readonly />
                   </div>
-                  <LineItemAmount className='text-right' />
+                  <LineItemAmount className="text-right" />
                 </div>
               </LineItem>
               <LineItemsEmpty>
@@ -62,44 +62,41 @@ export const ListOfItems: StoryFn = (args) => {
 
 export const Coupons: StoryFn = (args) => {
   return (
-    <CommerceLayer accessToken='my-access-token'>
+    <CommerceLayer accessToken="my-access-token">
       <OrderStorage persistKey={persistKey}>
         <OrderContainer>
-          <section className='mb-4'>
+          <section className="mb-4">
             <GiftCardOrCouponForm>
-              <GiftCardOrCouponInput
-                placeholder='Gift card or coupon'
-                className='border p-2'
-              />
+              <GiftCardOrCouponInput placeholder="Gift card or coupon" className="border p-2" />
               <GiftCardOrCouponSubmit
-                label='Add'
-                className='px-4 py-2 bg-black border text-white'
+                label="Add"
+                className="px-4 py-2 bg-black border text-white"
               />
             </GiftCardOrCouponForm>
-            <div className='flex gap-2 items-center mt-2'>
+            <div className="flex gap-2 items-center mt-2">
               <GiftCardOrCouponCode />
               <GiftCardOrCouponRemoveButton
-                label='remove'
-                className='hover:underline text-sm text-red-500'
+                label="remove"
+                className="hover:underline text-sm text-red-500"
               />
             </div>
           </section>
 
           <Errors
-            resource='orders'
-            field='gift_card_or_coupon_code'
-            className='text-red-500 text-sm'
+            resource="orders"
+            field="gift_card_or_coupon_code"
+            className="text-red-500 text-sm"
             messages={[
               {
-                code: 'VALIDATION_ERROR',
-                resource: 'orders',
-                field: 'gift_card_or_coupon_code',
-                message: 'Invalid coupon code'
-              }
+                code: "VALIDATION_ERROR",
+                resource: "orders",
+                field: "gift_card_or_coupon_code",
+                message: "Invalid coupon code",
+              },
             ]}
           />
 
-          <div className='grid grid-cols-2 max-width'>
+          <div className="grid grid-cols-2 max-width">
             Subtotal <SubTotalAmount />
             Discount <DiscountAmount />
             Gift Card <GiftCardAmount />
diff --git a/packages/docs/stories/examples/checkout/002.addresses.stories.tsx b/packages/docs/stories/examples/checkout/002.addresses.stories.tsx
index e8d9b8f5..d44c2854 100644
--- a/packages/docs/stories/examples/checkout/002.addresses.stories.tsx
+++ b/packages/docs/stories/examples/checkout/002.addresses.stories.tsx
@@ -1,30 +1,30 @@
 /* eslint-disable @typescript-eslint/restrict-template-expressions */
 /* eslint-disable @typescript-eslint/no-base-to-string */
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../../_internals/CommerceLayer'
-import OrderContainer from '#components/orders/OrderContainer'
-import { OrderStorage } from '../../_internals/OrderStorage'
-import { CustomerContainer } from '#components/customers/CustomerContainer'
-import { CustomerInput } from '#components/customers/CustomerInput'
-import Errors from '#components/errors/Errors'
-import { BillingAddressForm } from '#components/addresses/BillingAddressForm'
-import { ShippingAddressForm } from '#components/addresses/ShippingAddressForm'
-import { AddressesContainer } from '#components/addresses/AddressesContainer'
-import { AddressInput } from '#components/addresses/AddressInput'
-import { AddressCountrySelector } from '#components/addresses/AddressCountrySelector'
-import { AddressStateSelector } from '#components/addresses/AddressStateSelector'
-import { SaveAddressesButton } from '#components/addresses/SaveAddressesButton'
-import { makeAddressWithRequired, persistKey } from './utils'
-import { useMemo, useState } from 'react'
-import { type Order } from '@commercelayer/sdk'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../../_internals/CommerceLayer"
+import OrderContainer from "#components/orders/OrderContainer"
+import { OrderStorage } from "../../_internals/OrderStorage"
+import { CustomerContainer } from "#components/customers/CustomerContainer"
+import { CustomerInput } from "#components/customers/CustomerInput"
+import Errors from "#components/errors/Errors"
+import { BillingAddressForm } from "#components/addresses/BillingAddressForm"
+import { ShippingAddressForm } from "#components/addresses/ShippingAddressForm"
+import { AddressesContainer } from "#components/addresses/AddressesContainer"
+import { AddressInput } from "#components/addresses/AddressInput"
+import { AddressCountrySelector } from "#components/addresses/AddressCountrySelector"
+import { AddressStateSelector } from "#components/addresses/AddressStateSelector"
+import { SaveAddressesButton } from "#components/addresses/SaveAddressesButton"
+import { makeAddressWithRequired, persistKey } from "./utils"
+import { useMemo, useState } from "react"
+import { type Order } from "@commercelayer/sdk"
 
 const setup: Meta = {
-  title: 'Examples/Checkout Page/Addresses'
+  title: "Examples/Checkout Page/Addresses",
 }
 
 export default setup
 
-const inputCss = 'border border-gray-300 p-2 rounded-md w-full'
+const inputCss = "border border-gray-300 p-2 rounded-md w-full"
 
 export const CustomerAddresses: StoryFn = (args) => {
   const [order, setOrder] = useState<Order | null>(null)
@@ -40,192 +40,155 @@ export const CustomerAddresses: StoryFn = (args) => {
   // )
 
   return (
-    <CommerceLayer accessToken='my-access-token'>
+    <CommerceLayer accessToken="my-access-token">
       <OrderStorage persistKey={persistKey}>
         <OrderContainer fetchOrder={setOrder}>
-          <section title='Checkout Address' className='max-w-xl'>
+          <section title="Checkout Address" className="max-w-xl">
             <CustomerContainer isGuest>
               <AddressesContainer shipToDifferentAddress={false}>
-                <div className='mb-4'>
-                  <label htmlFor='customer_email'>Customer email</label>
+                <div className="mb-4">
+                  <label htmlFor="customer_email">Customer email</label>
                   <CustomerInput
-                    id='customer_email'
+                    id="customer_email"
                     className={inputCss}
-                    placeholder='email'
-                    errorClassName='border-red-600'
-                    value={order?.customer_email ?? ''}
+                    placeholder="email"
+                    errorClassName="border-red-600"
+                    value={order?.customer_email ?? ""}
                   />
-                  <Errors resource='orders' field='customer_email' />
+                  <Errors resource="orders" field="customer_email" />
                 </div>
 
                 {/*  Use `key` to re-render the BillingAddressForm once we have the order from  `fetchOrder`. */}
                 {/*  When you are in your own project, you can retrieve the order before rendering the form. */}
                 <BillingAddressForm key={billingAddress?.id}>
-                  <fieldset className='flex gap-4 w-full mb-4'>
-                    <div className='flex-1'>
-                      <label htmlFor='billing_address_first_name'>
-                        First name
-                      </label>
+                  <fieldset className="flex gap-4 w-full mb-4">
+                    <div className="flex-1">
+                      <label htmlFor="billing_address_first_name">First name</label>
                       <AddressInput
-                        id='billing_address_first_name'
-                        name='billing_address_first_name'
-                        type='text'
+                        id="billing_address_first_name"
+                        name="billing_address_first_name"
+                        type="text"
                         className={inputCss}
                         value={billingAddress?.first_name}
                       />
-                      <Errors
-                        resource='billing_address'
-                        field='billing_address_first_name'
-                      />
+                      <Errors resource="billing_address" field="billing_address_first_name" />
                     </div>
 
-                    <div className='flex-1'>
-                      <label htmlFor='billing_address_last_name'>
-                        Last name
-                      </label>
+                    <div className="flex-1">
+                      <label htmlFor="billing_address_last_name">Last name</label>
                       <AddressInput
-                        id='billing_address_last_name'
-                        name='billing_address_last_name'
-                        type='text'
+                        id="billing_address_last_name"
+                        name="billing_address_last_name"
+                        type="text"
                         className={inputCss}
                         value={billingAddress?.last_name}
                       />
-                      <Errors
-                        resource='billing_address'
-                        field='billing_address_last_name'
-                      />
+                      <Errors resource="billing_address" field="billing_address_last_name" />
                     </div>
                   </fieldset>
 
-                  <div className='mb-4'>
-                    <label htmlFor='billing_address_line_1'>
-                      Address line 1
-                    </label>
+                  <div className="mb-4">
+                    <label htmlFor="billing_address_line_1">Address line 1</label>
                     <AddressInput
-                      id='billing_address_line_1'
-                      name='billing_address_line_1'
-                      type='text'
+                      id="billing_address_line_1"
+                      name="billing_address_line_1"
+                      type="text"
                       className={inputCss}
                       value={billingAddress?.line_1}
                     />
-                    <Errors
-                      resource='billing_address'
-                      field='billing_address_line_1'
-                    />
+                    <Errors resource="billing_address" field="billing_address_line_1" />
                   </div>
 
-                  <div className='mb-4'>
-                    <label htmlFor='billing_address_line_2'>
-                      Address line 2
-                    </label>
+                  <div className="mb-4">
+                    <label htmlFor="billing_address_line_2">Address line 2</label>
                     <AddressInput
-                      id='billing_address_line_2'
-                      name='billing_address_line_2'
-                      type='text'
+                      id="billing_address_line_2"
+                      name="billing_address_line_2"
+                      type="text"
                       className={inputCss}
                       value={billingAddress?.line_2}
                     />
-                    <Errors
-                      resource='billing_address'
-                      field='billing_address_line_2'
-                    />
+                    <Errors resource="billing_address" field="billing_address_line_2" />
                   </div>
 
-                  <fieldset className='flex gap-4 w-full mb-4'>
-                    <div className='flex-1'>
-                      <label htmlFor='billing_address_city'>City</label>
+                  <fieldset className="flex gap-4 w-full mb-4">
+                    <div className="flex-1">
+                      <label htmlFor="billing_address_city">City</label>
                       <AddressInput
-                        id='billing_address_city'
-                        name='billing_address_city'
-                        type='text'
+                        id="billing_address_city"
+                        name="billing_address_city"
+                        type="text"
                         className={inputCss}
                         value={billingAddress?.city}
                       />
-                      <Errors
-                        resource='billing_address'
-                        field='billing_address_city'
-                      />
+                      <Errors resource="billing_address" field="billing_address_city" />
                     </div>
 
-                    <div className='flex-1'>
-                      <label htmlFor='billing_address_country_code'>
-                        Country
-                      </label>
+                    <div className="flex-1">
+                      <label htmlFor="billing_address_country_code">Country</label>
                       <AddressCountrySelector
-                        data-cy='billing_address_country_code'
-                        name='billing_address_country_code'
+                        data-cy="billing_address_country_code"
+                        name="billing_address_country_code"
                         className={inputCss}
                         placeholder={{
-                          value: '',
-                          label: 'Country',
-                          disabled: true
+                          value: "",
+                          label: "Country",
+                          disabled: true,
                         }}
                         value={billingAddress?.country_code}
                       />
-                      <Errors
-                        resource='billing_address'
-                        field='billing_address_country_code'
-                      />
+                      <Errors resource="billing_address" field="billing_address_country_code" />
                     </div>
                   </fieldset>
 
-                  <fieldset className='flex gap-4 w-full mb-4'>
-                    <div className='flex-1'>
-                      <label htmlFor='billing_address_state_code'>State</label>
+                  <fieldset className="flex gap-4 w-full mb-4">
+                    <div className="flex-1">
+                      <label htmlFor="billing_address_state_code">State</label>
                       <AddressStateSelector
-                        id='billing_address_state_code'
-                        name='billing_address_state_code'
+                        id="billing_address_state_code"
+                        name="billing_address_state_code"
                         placeholder={{
-                          value: '',
-                          label: 'Select a state',
-                          disabled: true
+                          value: "",
+                          label: "Select a state",
+                          disabled: true,
                         }}
                         className={inputCss}
                         value={billingAddress?.state_code}
                       />
-                      <Errors
-                        resource='billing_address'
-                        field='billing_address_state_code'
-                      />
+                      <Errors resource="billing_address" field="billing_address_state_code" />
                     </div>
 
-                    <div className='flex-1'>
-                      <label htmlFor='billing_address_zip_code'>Zip Code</label>
+                    <div className="flex-1">
+                      <label htmlFor="billing_address_zip_code">Zip Code</label>
                       <AddressInput
-                        id='billing_address_zip_code'
-                        name='billing_address_zip_code'
-                        type='text'
+                        id="billing_address_zip_code"
+                        name="billing_address_zip_code"
+                        type="text"
                         className={inputCss}
                         value={billingAddress?.zip_code}
                       />
-                      <Errors
-                        resource='billing_address'
-                        field='billing_address_zip_code'
-                      />
+                      <Errors resource="billing_address" field="billing_address_zip_code" />
                     </div>
                   </fieldset>
 
-                  <div className='mb-4'>
-                    <label htmlFor='billing_address_phone'>Phone number</label>
+                  <div className="mb-4">
+                    <label htmlFor="billing_address_phone">Phone number</label>
                     <AddressInput
-                      id='billing_address_phone'
-                      name='billing_address_phone'
-                      type='tel'
+                      id="billing_address_phone"
+                      name="billing_address_phone"
+                      type="tel"
                       className={inputCss}
                       value={billingAddress?.phone}
                     />
-                    <Errors
-                      resource='billing_address'
-                      field='billing_address_phone'
-                    />
+                    <Errors resource="billing_address" field="billing_address_phone" />
                   </div>
                 </BillingAddressForm>
 
                 <SaveAddressesButton
-                  className='p-4 bg-black text-white rounded disabled:opacity-50'
-                  label='Save address'
+                  className="p-4 bg-black text-white rounded disabled:opacity-50"
+                  label="Save address"
                   onClick={() => {
-                    alert('Address updated')
+                    alert("Address updated")
                   }}
                 />
               </AddressesContainer>
@@ -252,379 +215,294 @@ export const CustomerInvertAddresses: StoryFn = (args) => {
   )
 
   return (
-    <CommerceLayer accessToken='my-access-token'>
+    <CommerceLayer accessToken="my-access-token">
       <OrderStorage persistKey={persistKey}>
         <OrderContainer fetchOrder={setOrder}>
-          <section title='Checkout Address' className='max-w-xl'>
+          <section title="Checkout Address" className="max-w-xl">
             <CustomerContainer isGuest>
-              <AddressesContainer
-                shipToDifferentAddress={shipToDifferentAddress}
-                invertAddresses
-              >
-                <div className='mb-4'>
-                  <label htmlFor='customer_email'>Customer email</label>
+              <AddressesContainer shipToDifferentAddress={shipToDifferentAddress} invertAddresses>
+                <div className="mb-4">
+                  <label htmlFor="customer_email">Customer email</label>
                   <CustomerInput
-                    id='customer_email'
+                    id="customer_email"
                     className={inputCss}
-                    placeholder='email'
-                    errorClassName='border-red-600'
-                    value={order?.customer_email ?? ''}
+                    placeholder="email"
+                    errorClassName="border-red-600"
+                    value={order?.customer_email ?? ""}
                   />
-                  <Errors resource='orders' field='customer_email' />
+                  <Errors resource="orders" field="customer_email" />
                 </div>
                 {/*  Use `key` to re-render the ShippingAddressForm once we have the order from  `fetchOrder`. */}
                 {/*  When you are in your own project, you can retrieve the order before rendering the form. */}
                 <ShippingAddressForm key={shippingAddress?.id}>
-                  <fieldset className='flex gap-4 w-full mb-4'>
-                    <div className='flex-1'>
-                      <label htmlFor='shipping_address_first_name'>
-                        First name
-                      </label>
+                  <fieldset className="flex gap-4 w-full mb-4">
+                    <div className="flex-1">
+                      <label htmlFor="shipping_address_first_name">First name</label>
                       <AddressInput
-                        id='shipping_address_first_name'
-                        name='shipping_address_first_name'
-                        type='text'
+                        id="shipping_address_first_name"
+                        name="shipping_address_first_name"
+                        type="text"
                         className={inputCss}
                         value={shippingAddress?.first_name}
                       />
-                      <Errors
-                        resource='shipping_address'
-                        field='shipping_address_first_name'
-                      />
+                      <Errors resource="shipping_address" field="shipping_address_first_name" />
                     </div>
 
-                    <div className='flex-1'>
-                      <label htmlFor='shipping_address_last_name'>
-                        Last name
-                      </label>
+                    <div className="flex-1">
+                      <label htmlFor="shipping_address_last_name">Last name</label>
                       <AddressInput
-                        id='shipping_address_last_name'
-                        name='shipping_address_last_name'
-                        type='text'
+                        id="shipping_address_last_name"
+                        name="shipping_address_last_name"
+                        type="text"
                         className={inputCss}
                         value={shippingAddress?.last_name}
                       />
-                      <Errors
-                        resource='shipping_address'
-                        field='shipping_address_last_name'
-                      />
+                      <Errors resource="shipping_address" field="shipping_address_last_name" />
                     </div>
                   </fieldset>
 
-                  <div className='mb-4'>
-                    <label htmlFor='shipping_address_line_1'>
-                      Address line 1
-                    </label>
+                  <div className="mb-4">
+                    <label htmlFor="shipping_address_line_1">Address line 1</label>
                     <AddressInput
-                      id='shipping_address_line_1'
-                      name='shipping_address_line_1'
-                      type='text'
+                      id="shipping_address_line_1"
+                      name="shipping_address_line_1"
+                      type="text"
                       className={inputCss}
                       value={shippingAddress?.line_1}
                     />
-                    <Errors
-                      resource='shipping_address'
-                      field='shipping_address_line_1'
-                    />
+                    <Errors resource="shipping_address" field="shipping_address_line_1" />
                   </div>
 
-                  <div className='mb-4'>
-                    <label htmlFor='shipping_address_line_2'>
-                      Address line 2
-                    </label>
+                  <div className="mb-4">
+                    <label htmlFor="shipping_address_line_2">Address line 2</label>
                     <AddressInput
-                      id='shipping_address_line_2'
-                      name='shipping_address_line_2'
-                      type='text'
+                      id="shipping_address_line_2"
+                      name="shipping_address_line_2"
+                      type="text"
                       className={inputCss}
                       value={shippingAddress?.line_2}
                     />
-                    <Errors
-                      resource='shipping_address'
-                      field='shipping_address_line_2'
-                    />
+                    <Errors resource="shipping_address" field="shipping_address_line_2" />
                   </div>
 
-                  <fieldset className='flex gap-4 w-full mb-4'>
-                    <div className='flex-1'>
-                      <label htmlFor='shipping_address_city'>City</label>
+                  <fieldset className="flex gap-4 w-full mb-4">
+                    <div className="flex-1">
+                      <label htmlFor="shipping_address_city">City</label>
                       <AddressInput
-                        id='shipping_address_city'
-                        name='shipping_address_city'
-                        type='text'
+                        id="shipping_address_city"
+                        name="shipping_address_city"
+                        type="text"
                         className={inputCss}
                         value={shippingAddress?.city}
                       />
-                      <Errors
-                        resource='shipping_address'
-                        field='shipping_address_city'
-                      />
+                      <Errors resource="shipping_address" field="shipping_address_city" />
                     </div>
 
-                    <div className='flex-1'>
-                      <label htmlFor='shipping_address_country_code'>
-                        Country
-                      </label>
+                    <div className="flex-1">
+                      <label htmlFor="shipping_address_country_code">Country</label>
                       <AddressCountrySelector
-                        data-cy='shipping_address_country_code'
-                        name='shipping_address_country_code'
+                        data-cy="shipping_address_country_code"
+                        name="shipping_address_country_code"
                         className={inputCss}
                         placeholder={{
-                          value: '',
-                          label: 'Country',
-                          disabled: true
+                          value: "",
+                          label: "Country",
+                          disabled: true,
                         }}
                         value={shippingAddress?.country_code}
                       />
-                      <Errors
-                        resource='shipping_address'
-                        field='shipping_address_country_code'
-                      />
+                      <Errors resource="shipping_address" field="shipping_address_country_code" />
                     </div>
                   </fieldset>
 
-                  <fieldset className='flex gap-4 w-full mb-4'>
-                    <div className='flex-1'>
-                      <label htmlFor='shipping_address_state_code'>State</label>
+                  <fieldset className="flex gap-4 w-full mb-4">
+                    <div className="flex-1">
+                      <label htmlFor="shipping_address_state_code">State</label>
                       <AddressStateSelector
-                        id='shipping_address_state_code'
-                        name='shipping_address_state_code'
+                        id="shipping_address_state_code"
+                        name="shipping_address_state_code"
                         placeholder={{
-                          value: '',
-                          label: 'Select a state',
-                          disabled: true
+                          value: "",
+                          label: "Select a state",
+                          disabled: true,
                         }}
                         className={inputCss}
                         value={shippingAddress?.state_code}
                       />
-                      <Errors
-                        resource='shipping_address'
-                        field='shipping_address_state_code'
-                      />
+                      <Errors resource="shipping_address" field="shipping_address_state_code" />
                     </div>
 
-                    <div className='flex-1'>
-                      <label htmlFor='shipping_address_zip_code'>
-                        Zip Code
-                      </label>
+                    <div className="flex-1">
+                      <label htmlFor="shipping_address_zip_code">Zip Code</label>
                       <AddressInput
-                        id='shipping_address_zip_code'
-                        name='shipping_address_zip_code'
-                        type='text'
+                        id="shipping_address_zip_code"
+                        name="shipping_address_zip_code"
+                        type="text"
                         className={inputCss}
                         value={shippingAddress?.zip_code}
                       />
-                      <Errors
-                        resource='shipping_address'
-                        field='shipping_address_zip_code'
-                      />
+                      <Errors resource="shipping_address" field="shipping_address_zip_code" />
                     </div>
                   </fieldset>
 
-                  <div className='mb-4'>
-                    <label htmlFor='shipping_address_phone'>Phone number</label>
+                  <div className="mb-4">
+                    <label htmlFor="shipping_address_phone">Phone number</label>
                     <AddressInput
-                      id='shipping_address_phone'
-                      name='shipping_address_phone'
-                      type='tel'
+                      id="shipping_address_phone"
+                      name="shipping_address_phone"
+                      type="tel"
                       className={inputCss}
                       value={shippingAddress?.phone}
                     />
-                    <Errors
-                      resource='shipping_address'
-                      field='shipping_address_phone'
-                    />
+                    <Errors resource="shipping_address" field="shipping_address_phone" />
                   </div>
                 </ShippingAddressForm>
-                <fieldset className='flex gap-4 w-full mb-4'>
-                  <div className='flex-1'>
+                <fieldset className="flex gap-4 w-full mb-4">
+                  <div className="flex-1">
                     <input
-                      type='checkbox'
-                      id='ship_to_different_address'
+                      type="checkbox"
+                      id="ship_to_different_address"
                       checked={shipToDifferentAddress}
                       onChange={() => {
                         setShipToDifferentAddress(!shipToDifferentAddress)
                       }}
                     />
-                    <label htmlFor='ship_to_different_address' className='ml-3'>
+                    <label htmlFor="ship_to_different_address" className="ml-3">
                       Bill to different address
                     </label>
                   </div>
                 </fieldset>
                 {!shipToDifferentAddress ? null : (
                   <BillingAddressForm key={billingAddress?.id}>
-                    <fieldset className='flex gap-4 w-full mb-4'>
-                      <div className='flex-1'>
-                        <label htmlFor='billing_address_first_name'>
-                          First name
-                        </label>
+                    <fieldset className="flex gap-4 w-full mb-4">
+                      <div className="flex-1">
+                        <label htmlFor="billing_address_first_name">First name</label>
                         <AddressInput
-                          id='billing_address_first_name'
-                          name='billing_address_first_name'
-                          type='text'
+                          id="billing_address_first_name"
+                          name="billing_address_first_name"
+                          type="text"
                           className={inputCss}
                           value={billingAddress?.first_name}
                         />
-                        <Errors
-                          resource='billing_address'
-                          field='billing_address_first_name'
-                        />
+                        <Errors resource="billing_address" field="billing_address_first_name" />
                       </div>
 
-                      <div className='flex-1'>
-                        <label htmlFor='billing_address_last_name'>
-                          Last name
-                        </label>
+                      <div className="flex-1">
+                        <label htmlFor="billing_address_last_name">Last name</label>
                         <AddressInput
-                          id='billing_address_last_name'
-                          name='billing_address_last_name'
-                          type='text'
+                          id="billing_address_last_name"
+                          name="billing_address_last_name"
+                          type="text"
                           className={inputCss}
                           value={billingAddress?.last_name}
                         />
-                        <Errors
-                          resource='billing_address'
-                          field='billing_address_last_name'
-                        />
+                        <Errors resource="billing_address" field="billing_address_last_name" />
                       </div>
                     </fieldset>
 
-                    <div className='mb-4'>
-                      <label htmlFor='billing_address_line_1'>
-                        Address line 1
-                      </label>
+                    <div className="mb-4">
+                      <label htmlFor="billing_address_line_1">Address line 1</label>
                       <AddressInput
-                        id='billing_address_line_1'
-                        name='billing_address_line_1'
-                        type='text'
+                        id="billing_address_line_1"
+                        name="billing_address_line_1"
+                        type="text"
                         className={inputCss}
                         value={billingAddress?.line_1}
                       />
-                      <Errors
-                        resource='billing_address'
-                        field='billing_address_line_1'
-                      />
+                      <Errors resource="billing_address" field="billing_address_line_1" />
                     </div>
 
-                    <div className='mb-4'>
-                      <label htmlFor='billing_address_line_2'>
-                        Address line 2
-                      </label>
+                    <div className="mb-4">
+                      <label htmlFor="billing_address_line_2">Address line 2</label>
                       <AddressInput
-                        id='billing_address_line_2'
-                        name='billing_address_line_2'
-                        type='text'
+                        id="billing_address_line_2"
+                        name="billing_address_line_2"
+                        type="text"
                         className={inputCss}
                         value={billingAddress?.line_2}
                       />
-                      <Errors
-                        resource='billing_address'
-                        field='billing_address_line_2'
-                      />
+                      <Errors resource="billing_address" field="billing_address_line_2" />
                     </div>
 
-                    <fieldset className='flex gap-4 w-full mb-4'>
-                      <div className='flex-1'>
-                        <label htmlFor='billing_address_city'>City</label>
+                    <fieldset className="flex gap-4 w-full mb-4">
+                      <div className="flex-1">
+                        <label htmlFor="billing_address_city">City</label>
                         <AddressInput
-                          id='billing_address_city'
-                          name='billing_address_city'
-                          type='text'
+                          id="billing_address_city"
+                          name="billing_address_city"
+                          type="text"
                           className={inputCss}
                           value={billingAddress?.city}
                         />
-                        <Errors
-                          resource='billing_address'
-                          field='billing_address_city'
-                        />
+                        <Errors resource="billing_address" field="billing_address_city" />
                       </div>
 
-                      <div className='flex-1'>
-                        <label htmlFor='billing_address_country_code'>
-                          Country
-                        </label>
+                      <div className="flex-1">
+                        <label htmlFor="billing_address_country_code">Country</label>
                         <AddressCountrySelector
-                          data-cy='billing_address_country_code'
-                          name='billing_address_country_code'
+                          data-cy="billing_address_country_code"
+                          name="billing_address_country_code"
                           className={inputCss}
                           placeholder={{
-                            value: '',
-                            label: 'Country',
-                            disabled: true
+                            value: "",
+                            label: "Country",
+                            disabled: true,
                           }}
                           value={billingAddress?.country_code}
                         />
-                        <Errors
-                          resource='billing_address'
-                          field='billing_address_country_code'
-                        />
+                        <Errors resource="billing_address" field="billing_address_country_code" />
                       </div>
                     </fieldset>
 
-                    <fieldset className='flex gap-4 w-full mb-4'>
-                      <div className='flex-1'>
-                        <label htmlFor='billing_address_state_code'>
-                          State
-                        </label>
+                    <fieldset className="flex gap-4 w-full mb-4">
+                      <div className="flex-1">
+                        <label htmlFor="billing_address_state_code">State</label>
                         <AddressStateSelector
-                          id='billing_address_state_code'
-                          name='billing_address_state_code'
+                          id="billing_address_state_code"
+                          name="billing_address_state_code"
                           placeholder={{
-                            value: '',
-                            label: 'Select a state',
-                            disabled: true
+                            value: "",
+                            label: "Select a state",
+                            disabled: true,
                           }}
                           className={inputCss}
                           value={billingAddress?.state_code}
                         />
-                        <Errors
-                          resource='billing_address'
-                          field='billing_address_state_code'
-                        />
+                        <Errors resource="billing_address" field="billing_address_state_code" />
                       </div>
 
-                      <div className='flex-1'>
-                        <label htmlFor='billing_address_zip_code'>
-                          Zip Code
-                        </label>
+                      <div className="flex-1">
+                        <label htmlFor="billing_address_zip_code">Zip Code</label>
                         <AddressInput
-                          id='billing_address_zip_code'
-                          name='billing_address_zip_code'
-                          type='text'
+                          id="billing_address_zip_code"
+                          name="billing_address_zip_code"
+                          type="text"
                           className={inputCss}
                           value={billingAddress?.zip_code}
                         />
-                        <Errors
-                          resource='billing_address'
-                          field='billing_address_zip_code'
-                        />
+                        <Errors resource="billing_address" field="billing_address_zip_code" />
                       </div>
                     </fieldset>
 
-                    <div className='mb-4'>
-                      <label htmlFor='billing_address_phone'>
-                        Phone number
-                      </label>
+                    <div className="mb-4">
+                      <label htmlFor="billing_address_phone">Phone number</label>
                       <AddressInput
-                        id='billing_address_phone'
-                        name='billing_address_phone'
-                        type='tel'
+                        id="billing_address_phone"
+                        name="billing_address_phone"
+                        type="tel"
                         className={inputCss}
                         value={billingAddress?.phone}
                       />
-                      <Errors
-                        resource='billing_address'
-                        field='billing_address_phone'
-                      />
+                      <Errors resource="billing_address" field="billing_address_phone" />
                     </div>
                   </BillingAddressForm>
                 )}
 
                 <SaveAddressesButton
-                  className='p-4 bg-black text-white rounded disabled:opacity-50'
-                  label='Save address'
+                  className="p-4 bg-black text-white rounded disabled:opacity-50"
+                  label="Save address"
                   onClick={() => {
-                    alert('Address updated')
+                    alert("Address updated")
                   }}
                 />
               </AddressesContainer>
@@ -640,24 +518,24 @@ export const CustomerEmailSaveOnBlur: StoryFn = (args) => {
   const [order, setOrder] = useState<Order | null>(null)
 
   return (
-    <CommerceLayer accessToken='my-access-token'>
+    <CommerceLayer accessToken="my-access-token">
       <OrderStorage persistKey={persistKey}>
         <OrderContainer fetchOrder={setOrder}>
           <CustomerContainer isGuest>
-            <div className='max-w-xl'>
-              <label htmlFor='customer_email'>Customer email</label>
+            <div className="max-w-xl">
+              <label htmlFor="customer_email">Customer email</label>
               <CustomerInput
-                id='customer_email'
+                id="customer_email"
                 className={inputCss}
-                placeholder='email'
+                placeholder="email"
                 saveOnBlur
                 onBlur={(savedCustomerEmail) => {
                   alert(`Customer email saved: ${savedCustomerEmail}`)
                 }}
-                errorClassName='border-red-600'
-                value={order?.customer_email ?? ''}
+                errorClassName="border-red-600"
+                value={order?.customer_email ?? ""}
               />
-              <Errors resource='orders' field='customer_email' />
+              <Errors resource="orders" field="customer_email" />
             </div>
           </CustomerContainer>
         </OrderContainer>
@@ -674,198 +552,163 @@ export const CustomErrorMessages: StoryFn = () => {
     [order?.billing_address]
   )
   return (
-    <CommerceLayer accessToken='my-access-token'>
+    <CommerceLayer accessToken="my-access-token">
       <OrderStorage persistKey={persistKey}>
         <OrderContainer fetchOrder={setOrder}>
-          <section title='Checkout Address' className='max-w-xl'>
+          <section title="Checkout Address" className="max-w-xl">
             <CustomerContainer isGuest>
               <AddressesContainer shipToDifferentAddress={false}>
                 <BillingAddressForm
-                  errorClassName='border-red-600'
+                  errorClassName="border-red-600"
                   key={billingAddress?.id}
                   customFieldMessageError={(props) => {
                     const regex = /[a-zA-Z]+/g
                     const phoneRegex = /^\d+$/
                     // const textWithSpace = /^[a-zA-Z0-9\s]{1,20}$/
-                    console.log('props', props)
-                    if (
-                      props.field === 'billing_address_first_name' &&
-                      !regex.test(props.value)
-                    ) {
-                      return 'Validation error - only characters are allowed - this is a custom message'
+                    console.log("props", props)
+                    if (props.field === "billing_address_first_name" && !regex.test(props.value)) {
+                      return "Validation error - only characters are allowed - this is a custom message"
                     }
-                    if (props.field === 'billing_address_metadata_phone') {
-                      return props.value === ''
+                    if (props.field === "billing_address_metadata_phone") {
+                      return props.value === ""
                         ? null
                         : !phoneRegex.test(props.value)
-                          ? 'Validation error - only numbers are allowed - this is a custom message'
+                          ? "Validation error - only numbers are allowed - this is a custom message"
                           : null
                     }
-                    if (props.field === 'billing_address_country_code') {
+                    if (props.field === "billing_address_country_code") {
                       const state = props.values?.state_code as string
-                      console.log('state', state)
-                      console.log('props.value', props.value)
-                      if (
-                        ['US', 'CN', 'JP', 'AU', 'CA'].includes(props.value)
-                      ) {
+                      console.log("state", state)
+                      console.log("props.value", props.value)
+                      if (["US", "CN", "JP", "AU", "CA"].includes(props.value)) {
                         return [
                           {
-                            field: 'billing_address_state_code',
+                            field: "billing_address_state_code",
                             value: undefined,
                             isValid: false,
-                            message: 'State is required for this country'
-                          }
+                            message: "State is required for this country",
+                          },
                         ]
                       } else {
                         return [
                           {
-                            field: 'billing_address_state_code',
+                            field: "billing_address_state_code",
                             value: state,
-                            isValid: true
-                          }
+                            isValid: true,
+                          },
                         ]
                       }
                     }
                     return null
                   }}
                 >
-                  <fieldset className='flex gap-4 w-full mb-4'>
-                    <div className='flex-1'>
-                      <label htmlFor='billing_address_first_name'>
-                        First name
-                      </label>
+                  <fieldset className="flex gap-4 w-full mb-4">
+                    <div className="flex-1">
+                      <label htmlFor="billing_address_first_name">First name</label>
                       <AddressInput
-                        id='billing_address_first_name'
-                        name='billing_address_first_name'
-                        type='text'
+                        id="billing_address_first_name"
+                        name="billing_address_first_name"
+                        type="text"
                         className={inputCss}
                       />
-                      <Errors
-                        resource='billing_address'
-                        field='billing_address_first_name'
-                      />
+                      <Errors resource="billing_address" field="billing_address_first_name" />
                     </div>
 
-                    <div className='flex-1'>
-                      <label htmlFor='billing_address_last_name'>
-                        Last name
-                      </label>
+                    <div className="flex-1">
+                      <label htmlFor="billing_address_last_name">Last name</label>
                       <AddressInput
-                        id='billing_address_last_name'
-                        name='billing_address_last_name'
-                        type='text'
+                        id="billing_address_last_name"
+                        name="billing_address_last_name"
+                        type="text"
                         className={inputCss}
                         value={billingAddress?.last_name}
                       />
-                      <Errors
-                        resource='billing_address'
-                        field='billing_address_last_name'
-                      />
+                      <Errors resource="billing_address" field="billing_address_last_name" />
                     </div>
                   </fieldset>
-                  <fieldset className='flex gap-4 w-full mb-4'>
-                    <div className='flex-1'>
-                      <label htmlFor='billing_address_metadata_phone'>
+                  <fieldset className="flex gap-4 w-full mb-4">
+                    <div className="flex-1">
+                      <label htmlFor="billing_address_metadata_phone">
                         Phone number (metadata field - not required)
                       </label>
                       <AddressInput
-                        id='billing_address_metadata_phone'
-                        name='billing_address_metadata_phone'
-                        type='text'
+                        id="billing_address_metadata_phone"
+                        name="billing_address_metadata_phone"
+                        type="text"
                         className={inputCss}
                         required={false}
                       />
-                      <Errors
-                        resource='billing_address'
-                        field='billing_address_metadata_phone'
-                      />
+                      <Errors resource="billing_address" field="billing_address_metadata_phone" />
                     </div>
                   </fieldset>
-                  <fieldset className='flex gap-4 w-full mb-4'>
-                    <div className='flex-1'>
-                      <label htmlFor='billing_address_line_1'>Address</label>
+                  <fieldset className="flex gap-4 w-full mb-4">
+                    <div className="flex-1">
+                      <label htmlFor="billing_address_line_1">Address</label>
                       <AddressInput
-                        id='billing_address_line_1'
-                        name='billing_address_line_1'
-                        type='text'
+                        id="billing_address_line_1"
+                        name="billing_address_line_1"
+                        type="text"
                         className={inputCss}
                         required={false}
                       />
-                      <Errors
-                        resource='billing_address'
-                        field='billing_address_line_1'
-                      />
+                      <Errors resource="billing_address" field="billing_address_line_1" />
                     </div>
                   </fieldset>
-                  <fieldset className='flex gap-4 w-full mb-4'>
-                    <div className='flex-1'>
-                      <label htmlFor='billing_address_city'>City</label>
+                  <fieldset className="flex gap-4 w-full mb-4">
+                    <div className="flex-1">
+                      <label htmlFor="billing_address_city">City</label>
                       <AddressInput
-                        id='billing_address_city'
-                        name='billing_address_city'
-                        type='text'
+                        id="billing_address_city"
+                        name="billing_address_city"
+                        type="text"
                         className={inputCss}
                         value={billingAddress?.city}
                       />
-                      <Errors
-                        resource='billing_address'
-                        field='billing_address_city'
-                      />
+                      <Errors resource="billing_address" field="billing_address_city" />
                     </div>
 
-                    <div className='flex-1'>
-                      <label htmlFor='billing_address_country_code'>
-                        Country
-                      </label>
+                    <div className="flex-1">
+                      <label htmlFor="billing_address_country_code">Country</label>
                       <AddressCountrySelector
-                        data-cy='billing_address_country_code'
-                        name='billing_address_country_code'
+                        data-cy="billing_address_country_code"
+                        name="billing_address_country_code"
                         className={inputCss}
                         placeholder={{
-                          value: '',
-                          label: 'Country',
-                          disabled: true
+                          value: "",
+                          label: "Country",
+                          disabled: true,
                         }}
                         value={billingAddress?.country_code}
                       />
-                      <Errors
-                        resource='billing_address'
-                        field='billing_address_country_code'
-                      />
+                      <Errors resource="billing_address" field="billing_address_country_code" />
                     </div>
                   </fieldset>
-                  <fieldset className='flex gap-4 w-full mb-4'>
-                    <div className='flex-1'>
-                      <label htmlFor='billing_address_state_code'>State</label>
+                  <fieldset className="flex gap-4 w-full mb-4">
+                    <div className="flex-1">
+                      <label htmlFor="billing_address_state_code">State</label>
                       <AddressStateSelector
-                        id='billing_address_state_code'
-                        name='billing_address_state_code'
+                        id="billing_address_state_code"
+                        name="billing_address_state_code"
                         placeholder={{
-                          value: '',
-                          label: 'Select a state',
-                          disabled: true
+                          value: "",
+                          label: "Select a state",
+                          disabled: true,
                         }}
                         className={inputCss}
                       />
-                      <Errors
-                        resource='billing_address'
-                        field='billing_address_state_code'
-                      />
+                      <Errors resource="billing_address" field="billing_address_state_code" />
                     </div>
 
-                    <div className='flex-1'>
-                      <label htmlFor='billing_address_zip_code'>Zip Code</label>
+                    <div className="flex-1">
+                      <label htmlFor="billing_address_zip_code">Zip Code</label>
                       <AddressInput
-                        id='billing_address_zip_code'
-                        name='billing_address_zip_code'
-                        type='text'
+                        id="billing_address_zip_code"
+                        name="billing_address_zip_code"
+                        type="text"
                         className={inputCss}
                         value={billingAddress?.zip_code}
                       />
-                      <Errors
-                        resource='billing_address'
-                        field='billing_address_zip_code'
-                      />
+                      <Errors resource="billing_address" field="billing_address_zip_code" />
                     </div>
                   </fieldset>
                 </BillingAddressForm>
diff --git a/packages/docs/stories/examples/checkout/003.shipping.stories.tsx b/packages/docs/stories/examples/checkout/003.shipping.stories.tsx
index 01369bbf..067d0f69 100644
--- a/packages/docs/stories/examples/checkout/003.shipping.stories.tsx
+++ b/packages/docs/stories/examples/checkout/003.shipping.stories.tsx
@@ -1,47 +1,47 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../../_internals/CommerceLayer'
-import OrderContainer from '#components/orders/OrderContainer'
-import { OrderStorage } from '../../_internals/OrderStorage'
-import Errors from '#components/errors/Errors'
-import { ShipmentsContainer } from '#components/shipments/ShipmentsContainer'
-import { Shipment } from '#components/shipments/Shipment'
-import { ShipmentField } from '#components/shipments/ShipmentField'
-import { ShippingMethod } from '#components/shipping_methods/ShippingMethod'
-import { ShippingMethodRadioButton } from '#components/shipping_methods/ShippingMethodRadioButton'
-import { ShippingMethodName } from '#components/shipping_methods/ShippingMethodName'
-import { ShippingMethodPrice } from '#components/shipping_methods/ShippingMethodPrice'
-import { DeliveryLeadTime } from '#components/skus/DeliveryLeadTime'
-import { persistKey } from './utils'
-import LineItemsContainer from '#components/line_items/LineItemsContainer'
-import LineItemName from '#components/line_items/LineItemName'
-import LineItem from '#components/line_items/LineItem'
-import LineItemQuantity from '#components/line_items/LineItemQuantity'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../../_internals/CommerceLayer"
+import OrderContainer from "#components/orders/OrderContainer"
+import { OrderStorage } from "../../_internals/OrderStorage"
+import Errors from "#components/errors/Errors"
+import { ShipmentsContainer } from "#components/shipments/ShipmentsContainer"
+import { Shipment } from "#components/shipments/Shipment"
+import { ShipmentField } from "#components/shipments/ShipmentField"
+import { ShippingMethod } from "#components/shipping_methods/ShippingMethod"
+import { ShippingMethodRadioButton } from "#components/shipping_methods/ShippingMethodRadioButton"
+import { ShippingMethodName } from "#components/shipping_methods/ShippingMethodName"
+import { ShippingMethodPrice } from "#components/shipping_methods/ShippingMethodPrice"
+import { DeliveryLeadTime } from "#components/skus/DeliveryLeadTime"
+import { persistKey } from "./utils"
+import LineItemsContainer from "#components/line_items/LineItemsContainer"
+import LineItemName from "#components/line_items/LineItemName"
+import LineItem from "#components/line_items/LineItem"
+import LineItemQuantity from "#components/line_items/LineItemQuantity"
 
 const setup: Meta = {
-  title: 'Examples/Checkout Page/Shipping Methods'
+  title: "Examples/Checkout Page/Shipping Methods",
 }
 
 export default setup
 
 export const ShipmentMethods: StoryFn = (args) => {
   return (
-    <CommerceLayer accessToken='my-access-token'>
+    <CommerceLayer accessToken="my-access-token">
       <OrderStorage persistKey={persistKey}>
         <OrderContainer>
           <ShipmentsContainer>
-            <Errors resource='shipments' className='block' />
+            <Errors resource="shipments" className="block" />
             <Shipment>
-              <div className='mb-8 pb-8 border-b last:border-b-0 last:pb-0 last:mb-0 '>
-                <section title='package recap' className='mb-4'>
-                  <div className='font-bold'>
-                    Content of the package for shipment nr.{' '}
-                    <ShipmentField name='number' className='' />
+              <div className="mb-8 pb-8 border-b last:border-b-0 last:pb-0 last:mb-0 ">
+                <section title="package recap" className="mb-4">
+                  <div className="font-bold">
+                    Content of the package for shipment nr.{" "}
+                    <ShipmentField name="number" className="" />
                   </div>
 
-                  <section className='p-3 border rounded'>
+                  <section className="p-3 border rounded">
                     <LineItemsContainer>
-                      <LineItem type='skus'>
-                        <div className='flex gap-2'>
+                      <LineItem type="skus">
+                        <div className="flex gap-2">
                           <LineItemName />
                           <span>
                             (<LineItemQuantity readonly />)
@@ -52,19 +52,17 @@ export const ShipmentMethods: StoryFn = (args) => {
                   </section>
                 </section>
 
-                <div className='font-bold'>
-                  Select shipping method for this package
-                </div>
+                <div className="font-bold">Select shipping method for this package</div>
 
-                <section className='px-3 py-6 border rounded'>
-                  <ShippingMethod emptyText='Please set as your address an allowed country to view available shipping methods'>
-                    <fieldset className='mb-2 last:mb-0'>
-                      <ShippingMethodRadioButton className='cursor-pointer' />{' '}
-                      <ShippingMethodName className='cursor-pointer' /> (
-                      <ShippingMethodPrice className='font-bold' />){' '}
-                      <div className='inline text-gray-600'>
-                        <DeliveryLeadTime type='min_days' />-
-                        <DeliveryLeadTime type='max_days' /> days
+                <section className="px-3 py-6 border rounded">
+                  <ShippingMethod emptyText="Please set as your address an allowed country to view available shipping methods">
+                    <fieldset className="mb-2 last:mb-0">
+                      <ShippingMethodRadioButton className="cursor-pointer" />{" "}
+                      <ShippingMethodName className="cursor-pointer" /> (
+                      <ShippingMethodPrice className="font-bold" />){" "}
+                      <div className="inline text-gray-600">
+                        <DeliveryLeadTime type="min_days" />-
+                        <DeliveryLeadTime type="max_days" /> days
                       </div>
                     </fieldset>
                   </ShippingMethod>
diff --git a/packages/docs/stories/examples/checkout/004.payment.stories.tsx b/packages/docs/stories/examples/checkout/004.payment.stories.tsx
index cf00d261..cb6f937b 100644
--- a/packages/docs/stories/examples/checkout/004.payment.stories.tsx
+++ b/packages/docs/stories/examples/checkout/004.payment.stories.tsx
@@ -1,26 +1,26 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../../_internals/CommerceLayer'
-import OrderContainer from '#components/orders/OrderContainer'
-import { OrderStorage } from '../../_internals/OrderStorage'
-import Errors from '#components/errors/Errors'
-import { persistKey } from './utils'
-import { PaymentMethod } from '#components/payment_methods/PaymentMethod'
-import { PaymentMethodPrice } from '#components/payment_methods/PaymentMethodPrice'
-import { PaymentMethodName } from '#components/payment_methods/PaymentMethodName'
-import { PaymentMethodRadioButton } from '#components/payment_methods/PaymentMethodRadioButton'
-import { PaymentMethodsContainer } from '#components/payment_methods/PaymentMethodsContainer'
-import { PaymentSource } from '#components/payment_source/PaymentSource'
-import { PaymentSourceBrandIcon } from '#components/payment_source/PaymentSourceBrandIcon'
-import { PaymentSourceBrandName } from '#components/payment_source/PaymentSourceBrandName'
-import { PaymentSourceDetail } from '#components/payment_source/PaymentSourceDetail'
-import { PaymentSourceEditButton } from '#components/payment_source/PaymentSourceEditButton'
-import { PlaceOrderButton } from '#components/orders/PlaceOrderButton'
-import { PlaceOrderContainer } from '#components/orders/PlaceOrderContainer'
-import { PrivacyAndTermsCheckbox } from '#components/orders/PrivacyAndTermsCheckbox'
-import { useState } from 'react'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../../_internals/CommerceLayer"
+import OrderContainer from "#components/orders/OrderContainer"
+import { OrderStorage } from "../../_internals/OrderStorage"
+import Errors from "#components/errors/Errors"
+import { persistKey } from "./utils"
+import { PaymentMethod } from "#components/payment_methods/PaymentMethod"
+import { PaymentMethodPrice } from "#components/payment_methods/PaymentMethodPrice"
+import { PaymentMethodName } from "#components/payment_methods/PaymentMethodName"
+import { PaymentMethodRadioButton } from "#components/payment_methods/PaymentMethodRadioButton"
+import { PaymentMethodsContainer } from "#components/payment_methods/PaymentMethodsContainer"
+import { PaymentSource } from "#components/payment_source/PaymentSource"
+import { PaymentSourceBrandIcon } from "#components/payment_source/PaymentSourceBrandIcon"
+import { PaymentSourceBrandName } from "#components/payment_source/PaymentSourceBrandName"
+import { PaymentSourceDetail } from "#components/payment_source/PaymentSourceDetail"
+import { PaymentSourceEditButton } from "#components/payment_source/PaymentSourceEditButton"
+import { PlaceOrderButton } from "#components/orders/PlaceOrderButton"
+import { PlaceOrderContainer } from "#components/orders/PlaceOrderContainer"
+import { PrivacyAndTermsCheckbox } from "#components/orders/PrivacyAndTermsCheckbox"
+import { useState } from "react"
 
 const setup: Meta = {
-  title: 'Examples/Checkout Page/Payment Methods'
+  title: "Examples/Checkout Page/Payment Methods",
 }
 
 export default setup
@@ -28,15 +28,15 @@ export default setup
 export const PaymentMethods: StoryFn = () => {
   const [isPlaced, setIsPlaced] = useState(false)
   return (
-    <CommerceLayer accessToken='my-access-token'>
+    <CommerceLayer accessToken="my-access-token">
       <OrderStorage persistKey={persistKey}>
         <OrderContainer
           attributes={{
-            privacy_url: 'https://www.demo-store.com/privacy-policy',
-            terms_url: 'https://www.demo-store.com/terms-and-conditions'
+            privacy_url: "https://www.demo-store.com/privacy-policy",
+            terms_url: "https://www.demo-store.com/terms-and-conditions",
           }}
           fetchOrder={(order) => {
-            if (order.status === 'placed') {
+            if (order.status === "placed") {
               setIsPlaced(true)
             }
           }}
@@ -49,16 +49,16 @@ export const PaymentMethods: StoryFn = () => {
                 config={{
                   stripePayment: {
                     appearance: {},
-                    containerClassName: 'flex-1 pl-4',
-                    options: {}
+                    containerClassName: "flex-1 pl-4",
+                    options: {},
                   },
                   adyenPayment: {
                     placeOrderCallback: (data) => {
                       if (data.placed) {
                         setIsPlaced(true)
                       }
-                    }
-                  }
+                    },
+                  },
                 }}
               >
                 <PlaceOrderContainer
@@ -72,45 +72,39 @@ export const PaymentMethods: StoryFn = () => {
                   }
                 >
                   <PaymentMethod
-                    hide={['klarna_payments']} // optional array of payment sources to hide
-                    className='p-4 mb-4 flex items-center justify-items-center border-2 rounded-md cursor-pointer hover:bg-gray-100'
-                    activeClass='border-green-500'
+                    hide={["klarna_payments"]} // optional array of payment sources to hide
+                    className="p-4 mb-4 flex items-center justify-items-center border-2 rounded-md cursor-pointer hover:bg-gray-100"
+                    activeClass="border-green-500"
                     clickableContainer
                   >
-                    <PaymentMethodRadioButton className='cursor-pointer' />
-                    <PaymentMethodName className='block pl-3' />
-                    <PaymentMethodPrice className='block pl-3' />
-                    <PaymentSource className='p-5 my-2'>
-                      <div className='flex flex-row items-center justify-start bg-gray-100 p-5 my-10'>
-                        <div className='flex flex-row items-center'>
-                          <PaymentSourceBrandIcon className='mr-3' />
-                          <PaymentSourceBrandName className='mr-1' />
+                    <PaymentMethodRadioButton className="cursor-pointer" />
+                    <PaymentMethodName className="block pl-3" />
+                    <PaymentMethodPrice className="block pl-3" />
+                    <PaymentSource className="p-5 my-2">
+                      <div className="flex flex-row items-center justify-start bg-gray-100 p-5 my-10">
+                        <div className="flex flex-row items-center">
+                          <PaymentSourceBrandIcon className="mr-3" />
+                          <PaymentSourceBrandName className="mr-1" />
                           ending in
-                          <PaymentSourceDetail className='ml-1' type='last4' />
+                          <PaymentSourceDetail className="ml-1" type="last4" />
                         </div>
-                        <div className='text-gray-500 ml-5'>
-                          <PaymentSourceDetail type='exp_month' />
-                          <PaymentSourceDetail type='exp_year' />
+                        <div className="text-gray-500 ml-5">
+                          <PaymentSourceDetail type="exp_month" />
+                          <PaymentSourceDetail type="exp_year" />
                         </div>
-                        <div className='ml-5'>
-                          <PaymentSourceEditButton className='text-blue-500 hover:underline hover:text-blue-600' />
+                        <div className="ml-5">
+                          <PaymentSourceEditButton className="text-blue-500 hover:underline hover:text-blue-600" />
                         </div>
                       </div>
                     </PaymentSource>
-                    <Errors
-                      className='text-red-600 block'
-                      resource='payment_methods'
-                    />
+                    <Errors className="text-red-600 block" resource="payment_methods" />
                   </PaymentMethod>
 
-                  <div className='  mb-4'>
-                    <label
-                      htmlFor='privacy-terms'
-                      className='block ml-2 self-end'
-                    >
+                  <div className="  mb-4">
+                    <label htmlFor="privacy-terms" className="block ml-2 self-end">
                       <PrivacyAndTermsCheckbox
-                        id='privacy-terms'
-                        className='disabled:opacity-50 mr-2'
+                        id="privacy-terms"
+                        className="disabled:opacity-50 mr-2"
                       />
                       Accept privacy and terms
                     </label>
@@ -118,15 +112,15 @@ export const PaymentMethods: StoryFn = () => {
                   <PlaceOrderButton
                     onClick={(data) => {
                       if (data.placed) {
-                        alert('Order has been placed -> show thank you page')
+                        alert("Order has been placed -> show thank you page")
                       }
                     }}
-                    className='px-3 py-2 rounded bg-green-500 text-white disabled:opacity-50'
+                    className="px-3 py-2 rounded bg-green-500 text-white disabled:opacity-50"
                   />
                 </PlaceOrderContainer>
               </PaymentMethodsContainer>
-              <div className='flex flex-col text-red-600 mt-5'>
-                <Errors resource='orders' />
+              <div className="flex flex-col text-red-600 mt-5">
+                <Errors resource="orders" />
               </div>
             </>
           )}
@@ -138,7 +132,7 @@ export const PaymentMethods: StoryFn = () => {
 
 const SampleThankYouPage: React.FC = () => {
   return (
-    <div className='p-8 bg-green-600 rounded text-white text-2xl'>
+    <div className="p-8 bg-green-600 rounded text-white text-2xl">
       <p>Thank you!</p>
       <p>Your order has been successfully placed</p>
     </div>
diff --git a/packages/docs/stories/examples/checkout/utils.ts b/packages/docs/stories/examples/checkout/utils.ts
index 49de10b6..776c7742 100644
--- a/packages/docs/stories/examples/checkout/utils.ts
+++ b/packages/docs/stories/examples/checkout/utils.ts
@@ -1,24 +1,22 @@
-import { type Address } from '@commercelayer/sdk'
-import useOrderContainer from '#hooks/useOrderContainer'
-import { type SetNonNullable } from 'type-fest'
+import { type Address } from "@commercelayer/sdk"
+import useOrderContainer from "#hooks/useOrderContainer"
+import { type SetNonNullable } from "type-fest"
 
 type AddressWithRequired = SetNonNullable<
   Address,
-  | 'first_name'
-  | 'last_name'
-  | 'company'
-  | 'full_name'
-  | 'line_1'
-  | 'line_2'
-  | 'city'
-  | 'state_code'
-  | 'zip_code'
-  | 'country_code'
+  | "first_name"
+  | "last_name"
+  | "company"
+  | "full_name"
+  | "line_1"
+  | "line_2"
+  | "city"
+  | "state_code"
+  | "zip_code"
+  | "country_code"
 >
 
-export const makeAddressWithRequired = (
-  address?: Address | null
-): AddressWithRequired | null => {
+export const makeAddressWithRequired = (address?: Address | null): AddressWithRequired | null => {
   if (address == null) {
     return null
   }
@@ -26,17 +24,17 @@ export const makeAddressWithRequired = (
   return {
     ...address,
     business: address?.business,
-    first_name: address?.first_name ?? '',
-    last_name: address?.last_name ?? '',
-    company: address?.company ?? '',
-    full_name: address?.full_name ?? '',
-    line_1: address?.line_1 ?? '',
-    line_2: address?.line_2 ?? '',
-    city: address?.city ?? '',
-    state_code: address?.state_code ?? '',
-    zip_code: address?.zip_code ?? '',
-    country_code: address?.country_code ?? '',
-    billing_info: address?.first_name ?? ''
+    first_name: address?.first_name ?? "",
+    last_name: address?.last_name ?? "",
+    company: address?.company ?? "",
+    full_name: address?.full_name ?? "",
+    line_1: address?.line_1 ?? "",
+    line_2: address?.line_2 ?? "",
+    city: address?.city ?? "",
+    state_code: address?.state_code ?? "",
+    zip_code: address?.zip_code ?? "",
+    country_code: address?.country_code ?? "",
+    billing_info: address?.first_name ?? "",
   }
 }
 
@@ -48,10 +46,10 @@ export const useOrderAddresses = (): {
   const { order } = useOrderContainer()
 
   return {
-    email: order?.customer_email ?? '',
+    email: order?.customer_email ?? "",
     billing_address: makeAddressWithRequired(order?.billing_address),
-    shipping_address: makeAddressWithRequired(order?.shipping_address)
+    shipping_address: makeAddressWithRequired(order?.shipping_address),
   }
 }
 
-export const persistKey = 'cl-examples-checkoutpage-001'
+export const persistKey = "cl-examples-checkoutpage-001"
diff --git a/packages/docs/stories/examples/customer/001.orders.stories.tsx b/packages/docs/stories/examples/customer/001.orders.stories.tsx
index bc3d2e06..cbf29968 100644
--- a/packages/docs/stories/examples/customer/001.orders.stories.tsx
+++ b/packages/docs/stories/examples/customer/001.orders.stories.tsx
@@ -1,78 +1,74 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../../_internals/CommerceLayer'
-import CustomerContainer from '#components/customers/CustomerContainer'
-import OrderList from '#components/orders/OrderList'
-import OrderListEmpty from '#components/orders/OrderListEmpty'
-import OrderListRow from '#components/orders/OrderListRow'
-import OrderListPaginationButtons from '#components/orders/OrderListPaginationButtons'
-import OrderListPaginationInfo from '#components/orders/OrderListPaginationInfo'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../../_internals/CommerceLayer"
+import CustomerContainer from "#components/customers/CustomerContainer"
+import OrderList from "#components/orders/OrderList"
+import OrderListEmpty from "#components/orders/OrderListEmpty"
+import OrderListRow from "#components/orders/OrderListRow"
+import OrderListPaginationButtons from "#components/orders/OrderListPaginationButtons"
+import OrderListPaginationInfo from "#components/orders/OrderListPaginationInfo"
 
 const setup: Meta = {
-  title: 'Examples/Customer Account/Order list'
+  title: "Examples/Customer Account/Order list",
 }
 
 export default setup
 
 export const Default: StoryFn = (args) => {
-  const colClassName = 'uppercase text-left p-1 text-gray-400 text-sm'
-  const titleClassName = 'flex flex-row items-center gap-3 py-3'
+  const colClassName = "uppercase text-left p-1 text-gray-400 text-sm"
+  const titleClassName = "flex flex-row items-center gap-3 py-3"
 
-  const columns: React.ComponentProps<typeof OrderList>['columns'] = [
+  const columns: React.ComponentProps<typeof OrderList>["columns"] = [
     {
-      header: 'Order',
-      accessorKey: 'number',
+      header: "Order",
+      accessorKey: "number",
       className: colClassName,
-      titleClassName
+      titleClassName,
     },
     {
-      header: 'Status',
-      accessorKey: 'status',
+      header: "Status",
+      accessorKey: "status",
       className: colClassName,
-      titleClassName
+      titleClassName,
     },
     {
-      header: 'Date',
-      accessorKey: 'updated_at',
+      header: "Date",
+      accessorKey: "updated_at",
       className: colClassName,
-      titleClassName
+      titleClassName,
     },
     {
-      header: 'Amount',
-      accessorKey: 'formatted_total_amount_with_taxes',
-      id: 'total_amount_cents',
+      header: "Amount",
+      accessorKey: "formatted_total_amount_with_taxes",
+      id: "total_amount_cents",
       className: colClassName,
-      titleClassName
-    }
+      titleClassName,
+    },
   ]
 
   return (
-    <CommerceLayer accessToken='customer-orders-access-token'>
+    <CommerceLayer accessToken="customer-orders-access-token">
       <CustomerContainer>
         <OrderList
-          type='orders'
-          className='table-fixed w-full border-collapse'
+          type="orders"
+          className="table-fixed w-full border-collapse"
           columns={columns}
-          theadClassName='thead-class bg-gray-100'
-          rowTrClassName='row-tr-class border-b'
+          theadClassName="thead-class bg-gray-100"
+          rowTrClassName="row-tr-class border-b"
           showPagination
           pageSize={15}
-          paginationContainerClassName='flex justify-between items-center'
+          paginationContainerClassName="flex justify-between items-center"
         >
           <OrderListEmpty />
 
-          <OrderListRow field='number'>
+          <OrderListRow field="number">
             {({ cell, order, ...p }) => {
               return (
                 <>
                   {cell?.map((cell) => (
-                    <div {...p} key={cell.id} className='py-5'>
-                      <p className='font-bold'>
-                        Order # {cell.renderValue<string>()}
-                      </p>
-                      {order.type === 'order_subscriptions' ? null : (
-                        <p className='text-xs text-gray-500'>
-                          contains {order.skus_count} items
-                        </p>
+                    <div {...p} key={cell.id} className="py-5">
+                      <p className="font-bold">Order # {cell.renderValue<string>()}</p>
+                      {order.type === "order_subscriptions" ? null : (
+                        <p className="text-xs text-gray-500">contains {order.skus_count} items</p>
                       )}
                     </div>
                   ))}
@@ -80,36 +76,26 @@ export const Default: StoryFn = (args) => {
               )
             }}
           </OrderListRow>
-          <OrderListRow field='status' className='align-top py-5 border-b' />
-          <OrderListRow
-            field='updated_at'
-            className='align-top py-5 border-b'
-          />
-          <OrderListRow
-            field='total_amount_cents'
-            className='align-top py-5 border-b font-bold'
-          />
-          <OrderListPaginationInfo className='text-sm text-gray-500' />
+          <OrderListRow field="status" className="align-top py-5 border-b" />
+          <OrderListRow field="updated_at" className="align-top py-5 border-b" />
+          <OrderListRow field="total_amount_cents" className="align-top py-5 border-b font-bold" />
+          <OrderListPaginationInfo className="text-sm text-gray-500" />
           <OrderListPaginationButtons
             previousPageButton={{
-              className:
-                'w-[46px] h-[38px] mr-2 border rounded text-sm text-gray-500',
+              className: "w-[46px] h-[38px] mr-2 border rounded text-sm text-gray-500",
               show: true,
-              hideWhenDisabled: true
+              hideWhenDisabled: true,
             }}
             nextPageButton={{
-              className:
-                'w-[46px] h-[38px] mr-2 border rounded text-sm text-gray-500',
+              className: "w-[46px] h-[38px] mr-2 border rounded text-sm text-gray-500",
               show: true,
-              hideWhenDisabled: true
+              hideWhenDisabled: true,
             }}
             navigationButtons={{
-              className:
-                'w-[46px] h-[38px] mr-2 border rounded text-sm text-gray-500',
-              activeClassName:
-                'text-primary font-semibold border-primary border-2'
+              className: "w-[46px] h-[38px] mr-2 border rounded text-sm text-gray-500",
+              activeClassName: "text-primary font-semibold border-primary border-2",
             }}
-            className='p-2'
+            className="p-2"
           />
         </OrderList>
       </CustomerContainer>
@@ -120,7 +106,7 @@ export const Default: StoryFn = (args) => {
 Default.parameters = {
   docs: {
     source: {
-      type: 'code'
-    }
-  }
+      type: "code",
+    },
+  },
 }
diff --git a/packages/docs/stories/examples/customer/002.address-form.stories.tsx b/packages/docs/stories/examples/customer/002.address-form.stories.tsx
index f9446e89..21436e25 100644
--- a/packages/docs/stories/examples/customer/002.address-form.stories.tsx
+++ b/packages/docs/stories/examples/customer/002.address-form.stories.tsx
@@ -1,227 +1,204 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../../_internals/CommerceLayer'
-import CustomerContainer from '#components/customers/CustomerContainer'
-import { BillingAddressForm } from '#components/addresses/BillingAddressForm'
-import { useState } from 'react'
-import AddressInput from '#components/addresses/AddressInput'
-import AddressInputSelect from '#components/addresses/AddressInputSelect'
-import Errors from '#components/errors/Errors'
-import AddressCountrySelector from '#components/addresses/AddressCountrySelector'
-import AddressStateSelector from '#components/addresses/AddressStateSelector'
-import SaveAddressesButton from '#components/addresses/SaveAddressesButton'
-import { type Address as TAddress } from '@commercelayer/sdk'
-import AddressesContainer from '#components/addresses/AddressesContainer'
-import { AddressField } from '#components/addresses/AddressField'
-import { Address } from '#components/addresses/Address'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../../_internals/CommerceLayer"
+import CustomerContainer from "#components/customers/CustomerContainer"
+import { BillingAddressForm } from "#components/addresses/BillingAddressForm"
+import { useState } from "react"
+import AddressInput from "#components/addresses/AddressInput"
+import AddressInputSelect from "#components/addresses/AddressInputSelect"
+import Errors from "#components/errors/Errors"
+import AddressCountrySelector from "#components/addresses/AddressCountrySelector"
+import AddressStateSelector from "#components/addresses/AddressStateSelector"
+import SaveAddressesButton from "#components/addresses/SaveAddressesButton"
+import { type Address as TAddress } from "@commercelayer/sdk"
+import AddressesContainer from "#components/addresses/AddressesContainer"
+import { AddressField } from "#components/addresses/AddressField"
+import { Address } from "#components/addresses/Address"
 
 const setup: Meta = {
-  title: 'Examples/Customer Account/Address form'
+  title: "Examples/Customer Account/Address form",
 }
 
 export default setup
 
 type PartialAddress = Partial<TAddress>
 
-export const SampleAddressForm: StoryFn<{ address: PartialAddress }> = (
-  args
-) => {
-  const labelClassNames = 'block text-sm font-medium'
-  const inputClassNames = 'border border-gray-300 p-2 rounded-md w-full'
-  const errorClassNames = 'mt-1 text-sm text-red-600'
+export const SampleAddressForm: StoryFn<{ address: PartialAddress }> = (args) => {
+  const labelClassNames = "block text-sm font-medium"
+  const inputClassNames = "border border-gray-300 p-2 rounded-md w-full"
+  const errorClassNames = "mt-1 text-sm text-red-600"
 
   const [address] = useState<PartialAddress>(args.address ?? {})
 
   return (
-    <CommerceLayer accessToken='customer-access-token'>
+    <CommerceLayer accessToken="customer-access-token">
       <CustomerContainer>
         <AddressesContainer>
           <BillingAddressForm
-            errorClassName='outline-none !border-red-600 focus:!border-red-600'
-            autoComplete='on'
-            className='p-2'
+            errorClassName="outline-none !border-red-600 focus:!border-red-600"
+            autoComplete="on"
+            className="p-2"
           >
-            <div className='mb-4'>
-              <label
-                htmlFor='billing_address_first_name'
-                className={labelClassNames}
-              >
+            <div className="mb-4">
+              <label htmlFor="billing_address_first_name" className={labelClassNames}>
                 First name
               </label>
               <AddressInput
-                name='billing_address_first_name'
+                name="billing_address_first_name"
                 className={inputClassNames}
-                value={address?.first_name ?? ''}
+                value={address?.first_name ?? ""}
               />
               <Errors
-                resource='billing_address'
-                field='billing_address_first_name'
+                resource="billing_address"
+                field="billing_address_first_name"
                 className={errorClassNames}
               />
             </div>
 
-            <div className='mb-4'>
-              <label
-                htmlFor='billing_address_last_name'
-                className={labelClassNames}
-              >
+            <div className="mb-4">
+              <label htmlFor="billing_address_last_name" className={labelClassNames}>
                 Last name
               </label>
               <AddressInput
-                name='billing_address_last_name'
+                name="billing_address_last_name"
                 className={inputClassNames}
-                value={address?.last_name ?? ''}
+                value={address?.last_name ?? ""}
               />
               <Errors
-                resource='billing_address'
-                field='billing_address_last_name'
+                resource="billing_address"
+                field="billing_address_last_name"
                 className={errorClassNames}
               />
             </div>
 
-            <div className='mb-4'>
-              <label
-                htmlFor='billing_address_line_1'
-                className={labelClassNames}
-              >
+            <div className="mb-4">
+              <label htmlFor="billing_address_line_1" className={labelClassNames}>
                 Address
               </label>
               <AddressInput
-                name='billing_address_line_1'
-                type='text'
+                name="billing_address_line_1"
+                type="text"
                 className={inputClassNames}
-                placeholder='Address'
-                value={address?.line_1 ?? ''}
+                placeholder="Address"
+                value={address?.line_1 ?? ""}
               />
               <Errors
-                resource='billing_address'
-                field='billing_address_line_1'
+                resource="billing_address"
+                field="billing_address_line_1"
                 className={errorClassNames}
               />
             </div>
 
-            <div className='mb-4'>
-              <label htmlFor='billing_address_city' className={labelClassNames}>
+            <div className="mb-4">
+              <label htmlFor="billing_address_city" className={labelClassNames}>
                 City
               </label>
               <AddressInput
-                name='billing_address_city'
-                type='text'
+                name="billing_address_city"
+                type="text"
                 className={inputClassNames}
-                placeholder='City'
-                value={address?.city ?? ''}
+                placeholder="City"
+                value={address?.city ?? ""}
               />
               <Errors
-                resource='billing_address'
-                field='billing_address_city'
+                resource="billing_address"
+                field="billing_address_city"
                 className={errorClassNames}
               />
             </div>
 
-            <div className='mb-4'>
-              <label
-                htmlFor='billing_address_country_code'
-                className={labelClassNames}
-              >
+            <div className="mb-4">
+              <label htmlFor="billing_address_country_code" className={labelClassNames}>
                 Country
               </label>
               <AddressCountrySelector
-                name='billing_address_country_code'
+                name="billing_address_country_code"
                 className={inputClassNames}
                 placeholder={{
-                  value: '',
-                  label: 'Select a country',
-                  disabled: true
+                  value: "",
+                  label: "Select a country",
+                  disabled: true,
                 }}
-                value={address?.country_code ?? ''}
+                value={address?.country_code ?? ""}
               />
               <Errors
-                resource='billing_address'
-                field='billing_address_country_code'
+                resource="billing_address"
+                field="billing_address_country_code"
                 className={errorClassNames}
               />
             </div>
 
-            <div className='mb-4'>
-              <label
-                htmlFor='billing_address_state_code'
-                className={labelClassNames}
-              >
+            <div className="mb-4">
+              <label htmlFor="billing_address_state_code" className={labelClassNames}>
                 State
               </label>
               <AddressStateSelector
-                name='billing_address_state_code'
+                name="billing_address_state_code"
                 className={inputClassNames}
                 placeholder={{
-                  value: '',
-                  label: 'Select a state',
-                  disabled: true
+                  value: "",
+                  label: "Select a state",
+                  disabled: true,
                 }}
-                value={address?.state_code ?? ''}
+                value={address?.state_code ?? ""}
               />
               <Errors
-                resource='billing_address'
-                field='billing_address_state_code'
+                resource="billing_address"
+                field="billing_address_state_code"
                 className={errorClassNames}
               />
             </div>
 
-            <div className='mb-4'>
-              <label
-                htmlFor='billing_address_zip_code'
-                className={labelClassNames}
-              >
+            <div className="mb-4">
+              <label htmlFor="billing_address_zip_code" className={labelClassNames}>
                 Zip code
               </label>
               <AddressInput
-                name='billing_address_zip_code'
+                name="billing_address_zip_code"
                 className={inputClassNames}
-                value={address?.zip_code ?? ''}
+                value={address?.zip_code ?? ""}
               />
               <Errors
-                resource='billing_address'
-                field='billing_address_zip_code'
+                resource="billing_address"
+                field="billing_address_zip_code"
                 className={errorClassNames}
               />
             </div>
 
-            <div className='mb-5'>
-              <label
-                htmlFor='billing_address_phone'
-                className={labelClassNames}
-              >
+            <div className="mb-5">
+              <label htmlFor="billing_address_phone" className={labelClassNames}>
                 Phone
               </label>
               <AddressInput
-                name='billing_address_phone'
-                type='tel'
+                name="billing_address_phone"
+                type="tel"
                 className={inputClassNames}
-                value={address?.phone ?? ''}
+                value={address?.phone ?? ""}
               />
               <Errors
-                resource='billing_address'
-                field='billing_address_phone'
+                resource="billing_address"
+                field="billing_address_phone"
                 className={errorClassNames}
               />
             </div>
           </BillingAddressForm>
           <SaveAddressesButton
-            label='Save Address'
-            className='px-3 py-2 rounded bg-green-600 text-white disabled:opacity-50'
+            label="Save Address"
+            className="px-3 py-2 rounded bg-green-600 text-white disabled:opacity-50"
             onClick={() => {
-              alert('Address saved')
+              alert("Address saved")
             }}
             addressId={address?.id}
           />
         </AddressesContainer>
 
-        <section className='grid grid-cols-3 gap-4 mt-4'>
-          <Address className='border p-4 grid gap-2 text-sm rounded-md'>
-            <AddressField name='full_name' className='font-bold' />
-            <AddressField name='full_address' />
+        <section className="grid grid-cols-3 gap-4 mt-4">
+          <Address className="border p-4 grid gap-2 text-sm rounded-md">
+            <AddressField name="full_name" className="font-bold" />
+            <AddressField name="full_address" />
             <AddressField
-              className='cursor-pointer text-red-400 text-sm font-bold'
-              type='delete'
-              label='Delete'
+              className="cursor-pointer text-red-400 text-sm font-bold"
+              type="delete"
+              label="Delete"
               onClick={() => {}}
             />
           </Address>
diff --git a/packages/docs/stories/examples/customer/003.address-book.stories.tsx b/packages/docs/stories/examples/customer/003.address-book.stories.tsx
index 394c511f..1a186b92 100644
--- a/packages/docs/stories/examples/customer/003.address-book.stories.tsx
+++ b/packages/docs/stories/examples/customer/003.address-book.stories.tsx
@@ -1,61 +1,61 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../../_internals/CommerceLayer'
-import CustomerContainer from '#components/customers/CustomerContainer'
-import AddressesContainer from '#components/addresses/AddressesContainer'
-import { AddressesEmpty } from '#components/addresses/AddressesEmpty'
-import { Address } from '#components/addresses/Address'
-import { BillingAddressForm } from '#components/addresses/BillingAddressForm'
-import { AddressField } from '#components/addresses/AddressField'
-import { useState } from 'react'
-import AddressInput from '#components/addresses/AddressInput'
-import Errors from '#components/errors/Errors'
-import AddressCountrySelector from '#components/addresses/AddressCountrySelector'
-import AddressStateSelector from '#components/addresses/AddressStateSelector'
-import SaveAddressesButton from '#components/addresses/SaveAddressesButton'
-import { type Address as TAddress } from '@commercelayer/sdk'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../../_internals/CommerceLayer"
+import CustomerContainer from "#components/customers/CustomerContainer"
+import AddressesContainer from "#components/addresses/AddressesContainer"
+import { AddressesEmpty } from "#components/addresses/AddressesEmpty"
+import { Address } from "#components/addresses/Address"
+import { BillingAddressForm } from "#components/addresses/BillingAddressForm"
+import { AddressField } from "#components/addresses/AddressField"
+import { useState } from "react"
+import AddressInput from "#components/addresses/AddressInput"
+import Errors from "#components/errors/Errors"
+import AddressCountrySelector from "#components/addresses/AddressCountrySelector"
+import AddressStateSelector from "#components/addresses/AddressStateSelector"
+import SaveAddressesButton from "#components/addresses/SaveAddressesButton"
+import { type Address as TAddress } from "@commercelayer/sdk"
 
 type PartialAddress = Partial<TAddress>
 
 const setup: Meta = {
-  title: 'Examples/Customer Account/Address book'
+  title: "Examples/Customer Account/Address book",
 }
 
 export default setup
 
 export const Default: StoryFn = () => {
-  const labelClassNames = 'block text-sm font-medium'
-  const inputClassNames = 'border border-gray-300 p-2 rounded-md w-full'
-  const errorClassNames = 'mt-1 text-sm text-red-600'
+  const labelClassNames = "block text-sm font-medium"
+  const inputClassNames = "border border-gray-300 p-2 rounded-md w-full"
+  const errorClassNames = "mt-1 text-sm text-red-600"
 
   // address to edit
   const [address, setAddress] = useState<PartialAddress | null>(null)
 
   // our code
   return (
-    <CommerceLayer accessToken='customer-access-token'>
+    <CommerceLayer accessToken="customer-access-token">
       <CustomerContainer>
         <AddressesContainer>
           {/* Empty state (no saved addresses) */}
-          <AddressesEmpty emptyText='No addresses found' />
+          <AddressesEmpty emptyText="No addresses found" />
 
           {/* Listing saved addresses */}
-          <section className='grid grid-cols-3 gap-4 mt-4'>
-            <Address className='border p-4 grid gap-2 text-sm rounded-md'>
-              <AddressField name='full_name' className='font-bold' />
-              <AddressField name='full_address' />
-              <div className='flex justify-between'>
+          <section className="grid grid-cols-3 gap-4 mt-4">
+            <Address className="border p-4 grid gap-2 text-sm rounded-md">
+              <AddressField name="full_name" className="font-bold" />
+              <AddressField name="full_address" />
+              <div className="flex justify-between">
                 <AddressField
-                  className='cursor-pointer text-sm font-bold'
-                  type='edit'
-                  label='Edit'
+                  className="cursor-pointer text-sm font-bold"
+                  type="edit"
+                  label="Edit"
                   onClick={(address) => {
                     setAddress(address)
                   }}
                 />
                 <AddressField
-                  className='cursor-pointer text-red-400 text-sm font-bold'
-                  type='delete'
-                  label='Delete'
+                  className="cursor-pointer text-red-400 text-sm font-bold"
+                  type="delete"
+                  label="Delete"
                   onClick={() => {}}
                 />
               </div>
@@ -64,7 +64,7 @@ export const Default: StoryFn = () => {
 
           {/* Add new address */}
           <button
-            className='my-3 px-3 py-2 rounded bg-green-600 text-white'
+            className="my-3 px-3 py-2 rounded bg-green-600 text-white"
             onClick={() => {
               setAddress({})
             }}
@@ -76,173 +76,149 @@ export const Default: StoryFn = () => {
           {address != null && (
             <section>
               <BillingAddressForm
-                errorClassName='outline-none !border-red-600 focus:!border-red-600'
-                autoComplete='on'
-                className='p-2'
+                errorClassName="outline-none !border-red-600 focus:!border-red-600"
+                autoComplete="on"
+                className="p-2"
               >
-                <div className='mb-4'>
-                  <label
-                    htmlFor='billing_address_first_name'
-                    className={labelClassNames}
-                  >
+                <div className="mb-4">
+                  <label htmlFor="billing_address_first_name" className={labelClassNames}>
                     First name
                   </label>
                   <AddressInput
-                    name='billing_address_first_name'
+                    name="billing_address_first_name"
                     className={inputClassNames}
-                    value={address?.first_name ?? ''}
+                    value={address?.first_name ?? ""}
                   />
                   <Errors
-                    resource='billing_address'
-                    field='billing_address_first_name'
+                    resource="billing_address"
+                    field="billing_address_first_name"
                     className={errorClassNames}
                   />
                 </div>
 
-                <div className='mb-4'>
-                  <label
-                    htmlFor='billing_address_last_name'
-                    className={labelClassNames}
-                  >
+                <div className="mb-4">
+                  <label htmlFor="billing_address_last_name" className={labelClassNames}>
                     Last name
                   </label>
                   <AddressInput
-                    name='billing_address_last_name'
+                    name="billing_address_last_name"
                     className={inputClassNames}
-                    value={address?.last_name ?? ''}
+                    value={address?.last_name ?? ""}
                   />
                   <Errors
-                    resource='billing_address'
-                    field='billing_address_last_name'
+                    resource="billing_address"
+                    field="billing_address_last_name"
                     className={errorClassNames}
                   />
                 </div>
 
-                <div className='mb-4'>
-                  <label
-                    htmlFor='billing_address_line_1'
-                    className={labelClassNames}
-                  >
+                <div className="mb-4">
+                  <label htmlFor="billing_address_line_1" className={labelClassNames}>
                     Address
                   </label>
                   <AddressInput
-                    name='billing_address_line_1'
-                    type='text'
+                    name="billing_address_line_1"
+                    type="text"
                     className={inputClassNames}
-                    placeholder='Address'
-                    value={address?.line_1 ?? ''}
+                    placeholder="Address"
+                    value={address?.line_1 ?? ""}
                   />
                   <Errors
-                    resource='billing_address'
-                    field='billing_address_line_1'
+                    resource="billing_address"
+                    field="billing_address_line_1"
                     className={errorClassNames}
                   />
                 </div>
 
-                <div className='mb-4'>
-                  <label
-                    htmlFor='billing_address_city'
-                    className={labelClassNames}
-                  >
+                <div className="mb-4">
+                  <label htmlFor="billing_address_city" className={labelClassNames}>
                     City
                   </label>
                   <AddressInput
-                    name='billing_address_city'
-                    type='text'
+                    name="billing_address_city"
+                    type="text"
                     className={inputClassNames}
-                    placeholder='City'
-                    value={address?.city ?? ''}
+                    placeholder="City"
+                    value={address?.city ?? ""}
                   />
                   <Errors
-                    resource='billing_address'
-                    field='billing_address_city'
+                    resource="billing_address"
+                    field="billing_address_city"
                     className={errorClassNames}
                   />
                 </div>
 
-                <div className='mb-4'>
-                  <label
-                    htmlFor='billing_address_country_code'
-                    className={labelClassNames}
-                  >
+                <div className="mb-4">
+                  <label htmlFor="billing_address_country_code" className={labelClassNames}>
                     Country
                   </label>
                   <AddressCountrySelector
-                    name='billing_address_country_code'
+                    name="billing_address_country_code"
                     className={inputClassNames}
                     placeholder={{
-                      value: '',
-                      label: 'Select a country',
-                      disabled: true
+                      value: "",
+                      label: "Select a country",
+                      disabled: true,
                     }}
-                    value={address?.country_code ?? ''}
+                    value={address?.country_code ?? ""}
                   />
                   <Errors
-                    resource='billing_address'
-                    field='billing_address_country_code'
+                    resource="billing_address"
+                    field="billing_address_country_code"
                     className={errorClassNames}
                   />
                 </div>
 
-                <div className='mb-4'>
-                  <label
-                    htmlFor='billing_address_state_code'
-                    className={labelClassNames}
-                  >
+                <div className="mb-4">
+                  <label htmlFor="billing_address_state_code" className={labelClassNames}>
                     State
                   </label>
                   <AddressStateSelector
-                    name='billing_address_state_code'
+                    name="billing_address_state_code"
                     className={inputClassNames}
                     placeholder={{
-                      value: '',
-                      label: 'Select a state',
-                      disabled: true
+                      value: "",
+                      label: "Select a state",
+                      disabled: true,
                     }}
-                    value={address?.state_code ?? ''}
+                    value={address?.state_code ?? ""}
                   />
                   <Errors
-                    resource='billing_address'
-                    field='billing_address_state_code'
+                    resource="billing_address"
+                    field="billing_address_state_code"
                     className={errorClassNames}
                   />
                 </div>
 
-                <div className='mb-4'>
-                  <label
-                    htmlFor='billing_address_zip_code'
-                    className={labelClassNames}
-                  >
+                <div className="mb-4">
+                  <label htmlFor="billing_address_zip_code" className={labelClassNames}>
                     Zip code
                   </label>
                   <AddressInput
-                    name='billing_address_zip_code'
+                    name="billing_address_zip_code"
                     className={inputClassNames}
-                    value={address?.zip_code ?? ''}
+                    value={address?.zip_code ?? ""}
                   />
                   <Errors
-                    resource='billing_address'
-                    field='billing_address_zip_code'
+                    resource="billing_address"
+                    field="billing_address_zip_code"
                     className={errorClassNames}
                   />
                 </div>
 
-                <div className='mb-5'>
-                  <label
-                    htmlFor='billing_address_phone'
-                    className={labelClassNames}
-                  >
+                <div className="mb-5">
+                  <label htmlFor="billing_address_phone" className={labelClassNames}>
                     Phone
                   </label>
                   <AddressInput
-                    name='billing_address_phone'
-                    type='tel'
+                    name="billing_address_phone"
+                    type="tel"
                     className={inputClassNames}
-                    value={address?.phone ?? ''}
+                    value={address?.phone ?? ""}
                   />
                   <Errors
-                    resource='billing_address'
-                    field='billing_address_phone'
+                    resource="billing_address"
+                    field="billing_address_phone"
                     className={errorClassNames}
                   />
                 </div>
@@ -252,8 +228,8 @@ export const Default: StoryFn = () => {
               {/* When `addressId` is set it will update existing address, otherwise will create a new address */}
               <SaveAddressesButton
                 addressId={address?.id}
-                label='Save Address'
-                className='px-3 py-2 rounded bg-green-600 text-white disabled:opacity-50'
+                label="Save Address"
+                className="px-3 py-2 rounded bg-green-600 text-white disabled:opacity-50"
                 onClick={() => {
                   setAddress(null)
                 }}
diff --git a/packages/docs/stories/examples/customer/004.subscriptions.stories.tsx b/packages/docs/stories/examples/customer/004.subscriptions.stories.tsx
index 972b6bb6..956dd83e 100644
--- a/packages/docs/stories/examples/customer/004.subscriptions.stories.tsx
+++ b/packages/docs/stories/examples/customer/004.subscriptions.stories.tsx
@@ -1,83 +1,79 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../../_internals/CommerceLayer'
-import CustomerContainer from '#components/customers/CustomerContainer'
-import OrderList from '#components/orders/OrderList'
-import OrderListEmpty from '#components/orders/OrderListEmpty'
-import OrderListRow from '#components/orders/OrderListRow'
-import OrderListPaginationButtons from '#components/orders/OrderListPaginationButtons'
-import OrderListPaginationInfo from '#components/orders/OrderListPaginationInfo'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../../_internals/CommerceLayer"
+import CustomerContainer from "#components/customers/CustomerContainer"
+import OrderList from "#components/orders/OrderList"
+import OrderListEmpty from "#components/orders/OrderListEmpty"
+import OrderListRow from "#components/orders/OrderListRow"
+import OrderListPaginationButtons from "#components/orders/OrderListPaginationButtons"
+import OrderListPaginationInfo from "#components/orders/OrderListPaginationInfo"
 
 const setup: Meta = {
-  title: 'Examples/Customer Account/Subscription list'
+  title: "Examples/Customer Account/Subscription list",
 }
 
 export default setup
 
 export const Default: StoryFn = (args) => {
-  const colClassName = 'uppercase text-left p-1 text-gray-400 text-sm'
-  const titleClassName = 'flex flex-row items-center gap-3 py-3'
+  const colClassName = "uppercase text-left p-1 text-gray-400 text-sm"
+  const titleClassName = "flex flex-row items-center gap-3 py-3"
 
-  const columns: React.ComponentProps<typeof OrderList>['columns'] = [
+  const columns: React.ComponentProps<typeof OrderList>["columns"] = [
     {
-      header: 'Subscription',
-      accessorKey: 'number',
+      header: "Subscription",
+      accessorKey: "number",
       className: colClassName,
-      titleClassName
+      titleClassName,
     },
     {
-      header: 'Started',
-      accessorKey: 'starts_at',
+      header: "Started",
+      accessorKey: "starts_at",
       className: colClassName,
-      titleClassName
+      titleClassName,
     },
     {
-      header: 'Status',
-      accessorKey: 'status',
+      header: "Status",
+      accessorKey: "status",
       className: colClassName,
-      titleClassName
+      titleClassName,
     },
     {
-      header: 'Frequency',
-      accessorKey: 'frequency',
+      header: "Frequency",
+      accessorKey: "frequency",
       className: colClassName,
-      titleClassName
+      titleClassName,
     },
     {
-      header: 'Next run',
-      accessorKey: 'next_run_at',
+      header: "Next run",
+      accessorKey: "next_run_at",
       className: colClassName,
-      titleClassName
-    }
+      titleClassName,
+    },
   ]
 
   return (
-    <CommerceLayer accessToken='customer-orders-access-token'>
+    <CommerceLayer accessToken="customer-orders-access-token">
       <CustomerContainer>
         <OrderList
-          type='subscriptions'
-          className='table-fixed w-full border-collapse'
+          type="subscriptions"
+          className="table-fixed w-full border-collapse"
           columns={columns}
-          theadClassName='thead-class bg-gray-100'
-          rowTrClassName='row-tr-class border-b'
+          theadClassName="thead-class bg-gray-100"
+          rowTrClassName="row-tr-class border-b"
           showPagination
           pageSize={15}
-          paginationContainerClassName='flex justify-between items-center'
+          paginationContainerClassName="flex justify-between items-center"
         >
-          <OrderListEmpty emptyText='No subscriptions available' />
+          <OrderListEmpty emptyText="No subscriptions available" />
 
-          <OrderListRow field='number'>
+          <OrderListRow field="number">
             {({ cell, order, ...p }) => {
               return (
                 <>
                   {cell?.map((cell) => (
-                    <div {...p} key={cell.id} className='py-5'>
-                      <p className='font-bold'>
-                        Subscription # {cell.renderValue<string>()}
-                      </p>
-                      {order.type === 'order_subscriptions' ? null : (
-                        <p className='text-xs text-gray-500'>
-                          contains {order.skus_count} items
-                        </p>
+                    <div {...p} key={cell.id} className="py-5">
+                      <p className="font-bold">Subscription # {cell.renderValue<string>()}</p>
+                      {order.type === "order_subscriptions" ? null : (
+                        <p className="text-xs text-gray-500">contains {order.skus_count} items</p>
                       )}
                     </div>
                   ))}
@@ -85,34 +81,27 @@ export const Default: StoryFn = (args) => {
               )
             }}
           </OrderListRow>
-          <OrderListRow field='starts_at' className='align-top py-5 border-b' />
-          <OrderListRow field='status' className='align-top py-5 border-b' />
-          <OrderListRow field='frequency' className='align-top py-5 border-b' />
-          <OrderListRow
-            field='next_run_at'
-            className='align-top py-5 border-b'
-          />
-          <OrderListPaginationInfo className='text-sm text-gray-500' />
+          <OrderListRow field="starts_at" className="align-top py-5 border-b" />
+          <OrderListRow field="status" className="align-top py-5 border-b" />
+          <OrderListRow field="frequency" className="align-top py-5 border-b" />
+          <OrderListRow field="next_run_at" className="align-top py-5 border-b" />
+          <OrderListPaginationInfo className="text-sm text-gray-500" />
           <OrderListPaginationButtons
             previousPageButton={{
-              className:
-                'w-[46px] h-[38px] mr-2 border rounded text-sm text-gray-500',
+              className: "w-[46px] h-[38px] mr-2 border rounded text-sm text-gray-500",
               show: true,
-              hideWhenDisabled: true
+              hideWhenDisabled: true,
             }}
             nextPageButton={{
-              className:
-                'w-[46px] h-[38px] mr-2 border rounded text-sm text-gray-500',
+              className: "w-[46px] h-[38px] mr-2 border rounded text-sm text-gray-500",
               show: true,
-              hideWhenDisabled: true
+              hideWhenDisabled: true,
             }}
             navigationButtons={{
-              className:
-                'w-[46px] h-[38px] mr-2 border rounded text-sm text-gray-500',
-              activeClassName:
-                'text-primary font-semibold border-primary border-2'
+              className: "w-[46px] h-[38px] mr-2 border rounded text-sm text-gray-500",
+              activeClassName: "text-primary font-semibold border-primary border-2",
             }}
-            className='p-2'
+            className="p-2"
           />
         </OrderList>
       </CustomerContainer>
@@ -123,7 +112,7 @@ export const Default: StoryFn = (args) => {
 Default.parameters = {
   docs: {
     source: {
-      type: 'code'
-    }
-  }
+      type: "code",
+    },
+  },
 }
diff --git a/packages/docs/stories/examples/listing-page/000.ListingPage.stories.tsx b/packages/docs/stories/examples/listing-page/000.ListingPage.stories.tsx
index 6058f29c..33e72901 100644
--- a/packages/docs/stories/examples/listing-page/000.ListingPage.stories.tsx
+++ b/packages/docs/stories/examples/listing-page/000.ListingPage.stories.tsx
@@ -1,68 +1,55 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../../_internals/CommerceLayer'
-import { Skus } from '#components/skus/Skus'
-import { SkusContainer } from '#components/skus/SkusContainer'
-import { SkuField } from '#components/skus/SkuField'
-import { AvailabilityContainer } from '#components/skus/AvailabilityContainer'
-import AvailabilityTemplate from '#components/skus/AvailabilityTemplate'
-import Price from '#components/prices/Price'
-import PricesContainer from '#components/prices/PricesContainer'
-import OrderContainer from '#components/orders/OrderContainer'
-import AddToCartButton from '#components/orders/AddToCartButton'
-import { HostedCart } from '#components/orders/HostedCart'
-import OrderStorage from '#components/orders/OrderStorage'
-import LineItemsContainer from '#components/line_items/LineItemsContainer'
-import Errors from '#components/errors/Errors'
-import LineItemName from '#components/line_items/LineItemName'
-import LineItem from '#components/line_items/LineItem'
-import LineItemQuantity from '#components/line_items/LineItemQuantity'
-import LineItemRemoveLink from '#components/line_items/LineItemRemoveLink'
-import LineItemsEmpty from '#components/line_items/LineItemsEmpty'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../../_internals/CommerceLayer"
+import { Skus } from "#components/skus/Skus"
+import { SkusContainer } from "#components/skus/SkusContainer"
+import { SkuField } from "#components/skus/SkuField"
+import { AvailabilityContainer } from "#components/skus/AvailabilityContainer"
+import AvailabilityTemplate from "#components/skus/AvailabilityTemplate"
+import Price from "#components/prices/Price"
+import PricesContainer from "#components/prices/PricesContainer"
+import OrderContainer from "#components/orders/OrderContainer"
+import AddToCartButton from "#components/orders/AddToCartButton"
+import { HostedCart } from "#components/orders/HostedCart"
+import OrderStorage from "#components/orders/OrderStorage"
+import LineItemsContainer from "#components/line_items/LineItemsContainer"
+import Errors from "#components/errors/Errors"
+import LineItemName from "#components/line_items/LineItemName"
+import LineItem from "#components/line_items/LineItem"
+import LineItemQuantity from "#components/line_items/LineItemQuantity"
+import LineItemRemoveLink from "#components/line_items/LineItemRemoveLink"
+import LineItemsEmpty from "#components/line_items/LineItemsEmpty"
 
 const setup: Meta = {
-  title: 'Examples/Listing Page/Introduction'
+  title: "Examples/Listing Page/Introduction",
 }
 
 export default setup
 
 export const Default: StoryFn = (args) => {
   return (
-    <CommerceLayer
-      accessToken='my-access-token'
-      endpoint='https://demo-store.commercelayer.io'
-    >
-      <OrderStorage persistKey='cl-examples-skus-orderId'>
+    <CommerceLayer accessToken="my-access-token" endpoint="https://demo-store.commercelayer.io">
+      <OrderStorage persistKey="cl-examples-skus-orderId">
         <OrderContainer>
-          <SkusContainer
-            skus={['CROPTOPWFFFFFF000000XSXX', 'POLOMXXX000000FFFFFFLXXX']}
-          >
+          <SkusContainer skus={["CROPTOPWFFFFFF000000XSXX", "POLOMXXX000000FFFFFFLXXX"]}>
             <Skus>
-              <div className='flex gap-4 mb-8 pb-8 border-b items-start'>
-                <SkuField attribute='image_url' tagElement='img' width={100} />
+              <div className="flex gap-4 mb-8 pb-8 border-b items-start">
+                <SkuField attribute="image_url" tagElement="img" width={100} />
                 <div>
-                  <SkuField
-                    attribute='name'
-                    tagElement='h1'
-                    className='block font-bold'
-                  />
-                  <SkuField
-                    attribute='description'
-                    tagElement='p'
-                    className='mb-2'
-                  />
+                  <SkuField attribute="name" tagElement="h1" className="block font-bold" />
+                  <SkuField attribute="description" tagElement="p" className="mb-2" />
 
                   <PricesContainer>
-                    <Price compareClassName='line-through ml-2' />
+                    <Price compareClassName="line-through ml-2" />
                   </PricesContainer>
 
-                  <div className='my-2'>
-                    <AddToCartButton className='px-3 py-2 bg-black text-white rounded disabled:opacity-50' />
+                  <div className="my-2">
+                    <AddToCartButton className="px-3 py-2 bg-black text-white rounded disabled:opacity-50" />
                   </div>
 
                   <AvailabilityContainer>
                     <AvailabilityTemplate
-                      timeFormat='days'
-                      className='text-sm'
+                      timeFormat="days"
+                      className="text-sm"
                       showShippingMethodName
                     />
                   </AvailabilityContainer>
@@ -72,24 +59,21 @@ export const Default: StoryFn = (args) => {
           </SkusContainer>
 
           {/* cart */}
-          <div
-            id='cart-recap'
-            className='p-8 border rounded bg-gray-100 max-w-md'
-          >
+          <div id="cart-recap" className="p-8 border rounded bg-gray-100 max-w-md">
             <LineItemsContainer>
-              <LineItemsEmpty text='Cart is empty' />
-              <LineItem type='skus'>
-                <div className='flex gap-4 items-center mb-4 last:mb-0'>
-                  <div className='flex' />
+              <LineItemsEmpty text="Cart is empty" />
+              <LineItem type="skus">
+                <div className="flex gap-4 items-center mb-4 last:mb-0">
+                  <div className="flex" />
                   <LineItemName />
                   <div>
                     &times;
                     <LineItemQuantity readonly />
                   </div>
-                  <LineItemRemoveLink className='ml-auto px-2 text-sm rounded bg-red-500 text-white' />
+                  <LineItemRemoveLink className="ml-auto px-2 text-sm rounded bg-red-500 text-white" />
                 </div>
               </LineItem>
-              <Errors resource='orders' />
+              <Errors resource="orders" />
             </LineItemsContainer>
           </div>
         </OrderContainer>
@@ -100,42 +84,29 @@ export const Default: StoryFn = (args) => {
 
 export const WithMiniCart: StoryFn = (args) => {
   return (
-    <CommerceLayer
-      accessToken='my-access-token'
-      endpoint='https://demo-store.commercelayer.io'
-    >
-      <OrderStorage persistKey='cl-examples-skus-orderId'>
+    <CommerceLayer accessToken="my-access-token" endpoint="https://demo-store.commercelayer.io">
+      <OrderStorage persistKey="cl-examples-skus-orderId">
         <OrderContainer>
-          <SkusContainer
-            skus={['CROPTOPWFFFFFF000000XSXX', 'POLOMXXX000000FFFFFFLXXX']}
-          >
+          <SkusContainer skus={["CROPTOPWFFFFFF000000XSXX", "POLOMXXX000000FFFFFFLXXX"]}>
             <Skus>
-              <div className='flex gap-4 mb-8 pb-8 border-b items-start'>
-                <SkuField attribute='image_url' tagElement='img' width={100} />
+              <div className="flex gap-4 mb-8 pb-8 border-b items-start">
+                <SkuField attribute="image_url" tagElement="img" width={100} />
                 <div>
-                  <SkuField
-                    attribute='name'
-                    tagElement='h1'
-                    className='block font-bold'
-                  />
-                  <SkuField
-                    attribute='description'
-                    tagElement='p'
-                    className='mb-2'
-                  />
+                  <SkuField attribute="name" tagElement="h1" className="block font-bold" />
+                  <SkuField attribute="description" tagElement="p" className="mb-2" />
 
                   <PricesContainer>
-                    <Price compareClassName='line-through ml-2' />
+                    <Price compareClassName="line-through ml-2" />
                   </PricesContainer>
 
-                  <div className='my-2'>
-                    <AddToCartButton className='px-3 py-2 bg-black text-white rounded disabled:opacity-50' />
+                  <div className="my-2">
+                    <AddToCartButton className="px-3 py-2 bg-black text-white rounded disabled:opacity-50" />
                   </div>
 
                   <AvailabilityContainer>
                     <AvailabilityTemplate
-                      timeFormat='days'
-                      className='text-sm'
+                      timeFormat="days"
+                      className="text-sm"
                       showShippingMethodName
                     />
                   </AvailabilityContainer>
@@ -145,12 +116,12 @@ export const WithMiniCart: StoryFn = (args) => {
           </SkusContainer>
 
           <HostedCart
-            type='mini'
+            type="mini"
             openAdd
             style={{
               container: {
-                backgroundColor: 'white'
-              }
+                backgroundColor: "white",
+              },
             }}
           />
         </OrderContainer>
diff --git a/packages/docs/stories/examples/listing-page/001.MiniCart.stories.tsx b/packages/docs/stories/examples/listing-page/001.MiniCart.stories.tsx
index 26176644..9fb1ea89 100644
--- a/packages/docs/stories/examples/listing-page/001.MiniCart.stories.tsx
+++ b/packages/docs/stories/examples/listing-page/001.MiniCart.stories.tsx
@@ -1,61 +1,48 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../../_internals/CommerceLayer'
-import { Skus } from '#components/skus/Skus'
-import { SkusContainer } from '#components/skus/SkusContainer'
-import { SkuField } from '#components/skus/SkuField'
-import { AvailabilityContainer } from '#components/skus/AvailabilityContainer'
-import AvailabilityTemplate from '#components/skus/AvailabilityTemplate'
-import Price from '#components/prices/Price'
-import PricesContainer from '#components/prices/PricesContainer'
-import OrderContainer from '#components/orders/OrderContainer'
-import AddToCartButton from '#components/orders/AddToCartButton'
-import { HostedCart } from '#components/orders/HostedCart'
-import OrderStorage from '#components/orders/OrderStorage'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../../_internals/CommerceLayer"
+import { Skus } from "#components/skus/Skus"
+import { SkusContainer } from "#components/skus/SkusContainer"
+import { SkuField } from "#components/skus/SkuField"
+import { AvailabilityContainer } from "#components/skus/AvailabilityContainer"
+import AvailabilityTemplate from "#components/skus/AvailabilityTemplate"
+import Price from "#components/prices/Price"
+import PricesContainer from "#components/prices/PricesContainer"
+import OrderContainer from "#components/orders/OrderContainer"
+import AddToCartButton from "#components/orders/AddToCartButton"
+import { HostedCart } from "#components/orders/HostedCart"
+import OrderStorage from "#components/orders/OrderStorage"
 
 const setup: Meta = {
-  title: 'Examples/Listing Page/Mini Cart'
+  title: "Examples/Listing Page/Mini Cart",
 }
 
 export default setup
 
 export const WithMiniCart: StoryFn = (args) => {
   return (
-    <CommerceLayer
-      accessToken='my-access-token'
-      endpoint='https://demo-store.commercelayer.io'
-    >
-      <OrderStorage persistKey='cl-examples-skus-orderId'>
+    <CommerceLayer accessToken="my-access-token" endpoint="https://demo-store.commercelayer.io">
+      <OrderStorage persistKey="cl-examples-skus-orderId">
         <OrderContainer>
-          <SkusContainer
-            skus={['CROPTOPWFFFFFF000000XSXX', 'POLOMXXX000000FFFFFFLXXX']}
-          >
+          <SkusContainer skus={["CROPTOPWFFFFFF000000XSXX", "POLOMXXX000000FFFFFFLXXX"]}>
             <Skus>
-              <div className='flex gap-4 mb-8 pb-8 border-b items-start'>
-                <SkuField attribute='image_url' tagElement='img' width={100} />
+              <div className="flex gap-4 mb-8 pb-8 border-b items-start">
+                <SkuField attribute="image_url" tagElement="img" width={100} />
                 <div>
-                  <SkuField
-                    attribute='name'
-                    tagElement='h1'
-                    className='block font-bold'
-                  />
-                  <SkuField
-                    attribute='description'
-                    tagElement='p'
-                    className='mb-2'
-                  />
+                  <SkuField attribute="name" tagElement="h1" className="block font-bold" />
+                  <SkuField attribute="description" tagElement="p" className="mb-2" />
 
                   <PricesContainer>
-                    <Price compareClassName='line-through ml-2' />
+                    <Price compareClassName="line-through ml-2" />
                   </PricesContainer>
 
-                  <div className='my-2'>
-                    <AddToCartButton className='px-3 py-2 bg-black text-white rounded disabled:opacity-50' />
+                  <div className="my-2">
+                    <AddToCartButton className="px-3 py-2 bg-black text-white rounded disabled:opacity-50" />
                   </div>
 
                   <AvailabilityContainer>
                     <AvailabilityTemplate
-                      timeFormat='days'
-                      className='text-sm'
+                      timeFormat="days"
+                      className="text-sm"
                       showShippingMethodName
                     />
                   </AvailabilityContainer>
@@ -65,12 +52,12 @@ export const WithMiniCart: StoryFn = (args) => {
           </SkusContainer>
 
           <HostedCart
-            type='mini'
+            type="mini"
             openAdd
             style={{
               container: {
-                backgroundColor: 'white'
-              }
+                backgroundColor: "white",
+              },
             }}
           />
         </OrderContainer>
diff --git a/packages/docs/stories/orders/CheckoutLink.stories.tsx b/packages/docs/stories/orders/CheckoutLink.stories.tsx
index 339ee3cb..ed05610a 100644
--- a/packages/docs/stories/orders/CheckoutLink.stories.tsx
+++ b/packages/docs/stories/orders/CheckoutLink.stories.tsx
@@ -1,11 +1,11 @@
-import type { Meta, StoryFn, StoryObj } from '@storybook/react'
-import CommerceLayer from '../_internals/CommerceLayer'
-import Order from '#components/orders/Order'
-import CheckoutLink from '#components/orders/CheckoutLink'
-import { OrderStorage } from '../_internals/OrderStorage'
+import type { Meta, StoryFn, StoryObj } from "@storybook/react"
+import CommerceLayer from "../_internals/CommerceLayer"
+import Order from "#components/orders/Order"
+import CheckoutLink from "#components/orders/CheckoutLink"
+import { OrderStorage } from "../_internals/OrderStorage"
 
 const setup: Meta<typeof CheckoutLink> = {
-  title: 'Components/Orders/CheckoutLink',
+  title: "Components/Orders/CheckoutLink",
   component: CheckoutLink,
 }
 
@@ -13,8 +13,8 @@ export default setup
 
 const Template: StoryFn<typeof CheckoutLink> = (args) => {
   return (
-    <CommerceLayer accessToken='my-access-token'>
-      <OrderStorage persistKey='cl-examples-checkoutLink'>
+    <CommerceLayer accessToken="my-access-token">
+      <OrderStorage persistKey="cl-examples-checkoutLink">
         <Order>
           <CheckoutLink {...args} />
         </Order>
@@ -29,13 +29,13 @@ const Template: StoryFn<typeof CheckoutLink> = (args) => {
  */
 export const Default = Template.bind({})
 Default.args = {
-  label: 'Go to checkout',
-  className: 'text-blue-600 underline hover:text-blue-800',
+  label: "Go to checkout",
+  className: "text-blue-600 underline hover:text-blue-800",
 }
 Default.parameters = {
   docs: {
     canvas: {
-      sourceState: 'shown',
+      sourceState: "shown",
     },
   },
 }
@@ -47,9 +47,9 @@ Default.parameters = {
  */
 export const WithOrderCheckoutUrl = Template.bind({})
 WithOrderCheckoutUrl.args = {
-  label: 'Checkout via order URL',
+  label: "Checkout via order URL",
   hostedCheckout: false,
-  className: 'text-blue-600 underline hover:text-blue-800',
+  className: "text-blue-600 underline hover:text-blue-800",
 }
 
 /**
@@ -63,7 +63,7 @@ export const ChildrenProps: StoryObj = () => {
         <a
           href={href}
           onClick={handleClick}
-          className='inline-flex items-center gap-2 rounded bg-black px-4 py-2 text-sm text-white hover:bg-gray-800'
+          className="inline-flex items-center gap-2 rounded bg-black px-4 py-2 text-sm text-white hover:bg-gray-800"
         >
           Proceed to checkout →
         </a>
@@ -73,8 +73,8 @@ export const ChildrenProps: StoryObj = () => {
 }
 ChildrenProps.decorators = [
   (Story) => (
-    <CommerceLayer accessToken='my-access-token'>
-      <OrderStorage persistKey='cl-examples-checkoutLink'>
+    <CommerceLayer accessToken="my-access-token">
+      <OrderStorage persistKey="cl-examples-checkoutLink">
         <Order>
           <Story />
         </Order>
diff --git a/packages/docs/stories/orders/OrderContainer.stories.tsx b/packages/docs/stories/orders/OrderContainer.stories.tsx
index 963e6eff..2e8afb1b 100644
--- a/packages/docs/stories/orders/OrderContainer.stories.tsx
+++ b/packages/docs/stories/orders/OrderContainer.stories.tsx
@@ -1,19 +1,19 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../_internals/CommerceLayer'
-import OrderContainer from '#components/orders/OrderContainer'
-import OrderNumber from '#components/orders/OrderNumber'
-import TotalAmount from '#components/orders/TotalAmount'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../_internals/CommerceLayer"
+import OrderContainer from "#components/orders/OrderContainer"
+import OrderNumber from "#components/orders/OrderNumber"
+import TotalAmount from "#components/orders/TotalAmount"
 
 const setup: Meta<typeof OrderContainer> = {
-  title: 'Components/Orders/OrderContainer',
-  component: OrderContainer
+  title: "Components/Orders/OrderContainer",
+  component: OrderContainer,
 }
 
 export default setup
 
 const Template: StoryFn<typeof OrderContainer> = (args) => {
   return (
-    <CommerceLayer accessToken='my-access-token'>
+    <CommerceLayer accessToken="my-access-token">
       <OrderContainer {...args}>
         <div>
           Order number: <OrderNumber />
@@ -28,15 +28,15 @@ const Template: StoryFn<typeof OrderContainer> = (args) => {
 
 export const Default = Template.bind({})
 Default.args = {
-  orderId: 'KaeheROdbp',
+  orderId: "KaeheROdbp",
   fetchOrder: (order) => {
-    console.log('fetchOrder: ', order)
-  }
+    console.log("fetchOrder: ", order)
+  },
 }
 Default.parameters = {
   docs: {
     canvas: {
-      sourceState: 'shown'
-    }
-  }
+      sourceState: "shown",
+    },
+  },
 }
diff --git a/packages/docs/stories/orders/OrderStorage.stories.tsx b/packages/docs/stories/orders/OrderStorage.stories.tsx
index 9c0586d3..753843fc 100644
--- a/packages/docs/stories/orders/OrderStorage.stories.tsx
+++ b/packages/docs/stories/orders/OrderStorage.stories.tsx
@@ -1,17 +1,17 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../_internals/CommerceLayer'
-import OrderStorage from '#components/orders/OrderStorage'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../_internals/CommerceLayer"
+import OrderStorage from "#components/orders/OrderStorage"
 
 const setup: Meta<typeof OrderStorage> = {
-  title: 'Components/Orders/OrderStorage',
-  component: OrderStorage
+  title: "Components/Orders/OrderStorage",
+  component: OrderStorage,
 }
 
 export default setup
 
 const Template: StoryFn<typeof OrderStorage> = (args) => {
   return (
-    <CommerceLayer accessToken='my-access-token'>
+    <CommerceLayer accessToken="my-access-token">
       <OrderStorage {...args}>...</OrderStorage>
     </CommerceLayer>
   )
@@ -20,12 +20,12 @@ const Template: StoryFn<typeof OrderStorage> = (args) => {
 export const Default = Template.bind({})
 Default.args = {
   clearWhenPlaced: true,
-  persistKey: 'myLocalStorageKey'
+  persistKey: "myLocalStorageKey",
 }
 Default.parameters = {
   docs: {
     canvas: {
-      sourceState: 'shown'
-    }
-  }
+      sourceState: "shown",
+    },
+  },
 }
diff --git a/packages/docs/stories/prices/Price.stories.tsx b/packages/docs/stories/prices/Price.stories.tsx
index 3044c49c..362c7d8f 100644
--- a/packages/docs/stories/prices/Price.stories.tsx
+++ b/packages/docs/stories/prices/Price.stories.tsx
@@ -1,18 +1,18 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../_internals/CommerceLayer'
-import Price from '#components/prices/Price'
-import PricesContainer from '#components/prices/PricesContainer'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../_internals/CommerceLayer"
+import Price from "#components/prices/Price"
+import PricesContainer from "#components/prices/PricesContainer"
 
 const setup: Meta<typeof Price> = {
-  title: 'Components/Prices/Price',
-  component: Price
+  title: "Components/Prices/Price",
+  component: Price,
 }
 
 export default setup
 
 const Template: StoryFn<typeof Price> = (args) => {
   return (
-    <CommerceLayer accessToken='my-access-token'>
+    <CommerceLayer accessToken="my-access-token">
       <PricesContainer>
         <Price {...args} />
       </PricesContainer>
@@ -22,9 +22,9 @@ const Template: StoryFn<typeof Price> = (args) => {
 
 export const Default = Template.bind({})
 Default.args = {
-  skuCode: 'POST6191FFFFFF000000XXXX',
-  compareClassName: 'line-through ml-2',
-  className: 'font-bold'
+  skuCode: "POST6191FFFFFF000000XXXX",
+  compareClassName: "line-through ml-2",
+  className: "font-bold",
 }
 
 /**
@@ -35,8 +35,8 @@ Default.args = {
  */
 export const NoComparePrice = Template.bind({})
 NoComparePrice.args = {
-  skuCode: 'POST6191FFFFFF000000XXXX',
-  showCompare: false
+  skuCode: "POST6191FFFFFF000000XXXX",
+  showCompare: false,
 }
 
 /**
@@ -44,14 +44,11 @@ NoComparePrice.args = {
  */
 export const MultiplePrices: StoryFn<typeof Price> = (args) => {
   return (
-    <CommerceLayer
-      accessToken='my-access-token'
-      endpoint='https://demo-store.commercelayer.io'
-    >
+    <CommerceLayer accessToken="my-access-token" endpoint="https://demo-store.commercelayer.io">
       <PricesContainer>
-        <div className='grid'>
-          <Price skuCode='POST6191FFFFFF000000XXXX' showCompare={false} />
-          <Price skuCode='POLOMXXX000000FFFFFFLXXX' showCompare={false} />
+        <div className="grid">
+          <Price skuCode="POST6191FFFFFF000000XXXX" showCompare={false} />
+          <Price skuCode="POLOMXXX000000FFFFFFLXXX" showCompare={false} />
         </div>
       </PricesContainer>
     </CommerceLayer>
@@ -88,26 +85,23 @@ export const ChildrenProps: StoryFn<typeof Price> = (args) => {
 }
 
 ChildrenProps.args = {
-  skuCode: 'POST6191FFFFFF000000XXXX'
+  skuCode: "POST6191FFFFFF000000XXXX",
 }
 ChildrenProps.decorators = [
   (Story) => {
     return (
-      <CommerceLayer
-        accessToken='my-access-token'
-        endpoint='https://demo-store.commercelayer.io'
-      >
+      <CommerceLayer accessToken="my-access-token" endpoint="https://demo-store.commercelayer.io">
         <PricesContainer>
           <Story />
         </PricesContainer>
       </CommerceLayer>
     )
-  }
+  },
 ]
 ChildrenProps.parameters = {
   docs: {
     source: {
-      type: 'code'
-    }
-  }
+      type: "code",
+    },
+  },
 }
diff --git a/packages/docs/stories/prices/PricesContainer.stories.tsx b/packages/docs/stories/prices/PricesContainer.stories.tsx
index 9e773be1..c4b2aa25 100644
--- a/packages/docs/stories/prices/PricesContainer.stories.tsx
+++ b/packages/docs/stories/prices/PricesContainer.stories.tsx
@@ -1,18 +1,18 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../_internals/CommerceLayer'
-import PricesContainer from '#components/prices/PricesContainer'
-import Price from '#components/prices/Price'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../_internals/CommerceLayer"
+import PricesContainer from "#components/prices/PricesContainer"
+import Price from "#components/prices/Price"
 
 const setup: Meta<typeof PricesContainer> = {
-  title: 'Components/Prices/PricesContainer',
-  component: PricesContainer
+  title: "Components/Prices/PricesContainer",
+  component: PricesContainer,
 }
 
 export default setup
 
 const Template: StoryFn<typeof PricesContainer> = (args) => {
   return (
-    <CommerceLayer accessToken='my-access-token'>
+    <CommerceLayer accessToken="my-access-token">
       <PricesContainer {...args}>
         <Price />
       </PricesContainer>
@@ -22,5 +22,5 @@ const Template: StoryFn<typeof PricesContainer> = (args) => {
 
 export const Default = Template.bind({})
 Default.args = {
-  skuCode: 'POST6191FFFFFF000000XXXX'
+  skuCode: "POST6191FFFFFF000000XXXX",
 }
diff --git a/packages/docs/stories/skus/Skus.stories.tsx b/packages/docs/stories/skus/Skus.stories.tsx
index dff99239..d1798786 100644
--- a/packages/docs/stories/skus/Skus.stories.tsx
+++ b/packages/docs/stories/skus/Skus.stories.tsx
@@ -1,22 +1,20 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../_internals/CommerceLayer'
-import { Skus } from '#components/skus/Skus'
-import { SkusContainer } from '#components/skus/SkusContainer'
-import { Code } from 'stories/_internals/Code'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../_internals/CommerceLayer"
+import { Skus } from "#components/skus/Skus"
+import { SkusContainer } from "#components/skus/SkusContainer"
+import { Code } from "stories/_internals/Code"
 
 const setup: Meta<typeof Skus> = {
-  title: 'Components/Skus/Skus',
-  component: Skus
+  title: "Components/Skus/Skus",
+  component: Skus,
 }
 
 export default setup
 
 export const Default: StoryFn<typeof Skus> = () => {
   return (
-    <CommerceLayer accessToken='my-access-token'>
-      <SkusContainer
-        skus={['POLOMXXX000000FFFFFFLXXX', 'CROPTOPWFFFFFF000000XSXX']}
-      >
+    <CommerceLayer accessToken="my-access-token">
+      <SkusContainer skus={["POLOMXXX000000FFFFFFLXXX", "CROPTOPWFFFFFF000000XSXX"]}>
         <Skus>
           <div>
             I am <Code>Skus</Code> child
diff --git a/packages/docs/stories/skus/SkusContainer.stories.tsx b/packages/docs/stories/skus/SkusContainer.stories.tsx
index b74dc4f8..fee4a409 100644
--- a/packages/docs/stories/skus/SkusContainer.stories.tsx
+++ b/packages/docs/stories/skus/SkusContainer.stories.tsx
@@ -1,25 +1,22 @@
-import type { Meta, StoryFn } from '@storybook/react'
-import CommerceLayer from '../_internals/CommerceLayer'
-import { SkusContainer } from '#components/skus/SkusContainer'
-import { Code } from '../_internals/Code'
+import type { Meta, StoryFn } from "@storybook/react"
+import CommerceLayer from "../_internals/CommerceLayer"
+import { SkusContainer } from "#components/skus/SkusContainer"
+import { Code } from "../_internals/Code"
 
 const setup: Meta<typeof SkusContainer> = {
-  title: 'Components/Skus/SkusContainer',
-  component: SkusContainer
+  title: "Components/Skus/SkusContainer",
+  component: SkusContainer,
 }
 
 export default setup
 
 const Template: StoryFn<typeof SkusContainer> = (args) => {
   return (
-    <CommerceLayer
-      accessToken='my-access-token'
-      endpoint='https://demo-store.commercelayer.io'
-    >
+    <CommerceLayer accessToken="my-access-token" endpoint="https://demo-store.commercelayer.io">
       <SkusContainer {...args}>
         <div>
-          I am the skus container, responsible to fetch alls <Code>skus</Code>{' '}
-          details and make them available to the children components.
+          I am the skus container, responsible to fetch alls <Code>skus</Code> details and make them
+          available to the children components.
         </div>
       </SkusContainer>
     </CommerceLayer>
@@ -28,13 +25,13 @@ const Template: StoryFn<typeof SkusContainer> = (args) => {
 
 export const Default = Template.bind({})
 Default.args = {
-  skus: ['POLOMXXX000000FFFFFFLXXX', 'CROPTOPWFFFFFF000000XSXX'],
+  skus: ["POLOMXXX000000FFFFFFLXXX", "CROPTOPWFFFFFF000000XSXX"],
   queryParams: {
     pageSize: 25,
     pageNumber: 1,
-    fields: ['name', 'description', 'image_url', 'reference'],
+    fields: ["name", "description", "image_url", "reference"],
     sort: {
-      name: 'asc'
-    }
-  }
+      name: "asc",
+    },
+  },
 }
diff --git a/packages/docs/stories/skus/SkusField.stories.tsx b/packages/docs/stories/skus/SkusField.stories.tsx
index 90a5e48b..c0cc82c9 100644
--- a/packages/docs/stories/skus/SkusField.stories.tsx
+++ b/packages/docs/stories/skus/SkusField.stories.tsx
@@ -1,36 +1,33 @@
-import { type Meta, type StoryFn, type StoryObj } from '@storybook/react'
-import CommerceLayer from '../_internals/CommerceLayer'
-import { Skus } from '#components/skus/Skus'
-import { SkusContainer } from '#components/skus/SkusContainer'
-import { SkuField } from '#components/skus/SkuField'
+import { type Meta, type StoryFn, type StoryObj } from "@storybook/react"
+import CommerceLayer from "../_internals/CommerceLayer"
+import { Skus } from "#components/skus/Skus"
+import { SkusContainer } from "#components/skus/SkusContainer"
+import { SkuField } from "#components/skus/SkuField"
 
 const setup: Meta<typeof SkuField> = {
-  title: 'Components/Skus/SkuField',
+  title: "Components/Skus/SkuField",
   component: SkuField,
   argTypes: {
     attribute: {
-      control: 'select',
-      options: ['name', 'code', 'description', 'image_url', 'weight'],
-      description: 'Resource attribute to display'
+      control: "select",
+      options: ["name", "code", "description", "image_url", "weight"],
+      description: "Resource attribute to display",
     },
     tagElement: {
-      control: 'select',
-      options: ['div', 'p', 'span', 'img', 'section'],
+      control: "select",
+      options: ["div", "p", "span", "img", "section"],
       description:
-        'Resource attribute to displayHtml tag to render. When tag is `img` the value will be used to fill the `src` attribute.'
-    }
-  }
+        "Resource attribute to displayHtml tag to render. When tag is `img` the value will be used to fill the `src` attribute.",
+    },
+  },
 }
 
 export default setup
 
 const Template: StoryFn<typeof SkuField> = (args) => {
   return (
-    <CommerceLayer
-      accessToken='my-access-token'
-      endpoint='https://demo-store.commercelayer.io'
-    >
-      <SkusContainer skus={['POLOMXXX000000FFFFFFLXXX']}>
+    <CommerceLayer accessToken="my-access-token" endpoint="https://demo-store.commercelayer.io">
+      <SkusContainer skus={["POLOMXXX000000FFFFFFLXXX"]}>
         <Skus>
           <SkuField {...args} />
         </Skus>
@@ -41,8 +38,8 @@ const Template: StoryFn<typeof SkuField> = (args) => {
 
 export const Default = Template.bind({})
 Default.args = {
-  attribute: 'name',
-  tagElement: 'div'
+  attribute: "name",
+  tagElement: "div",
 }
 
 /**
@@ -51,9 +48,9 @@ Default.args = {
  */
 export const SkuImageAsImgTag = Template.bind({})
 SkuImageAsImgTag.args = {
-  attribute: 'image_url',
-  tagElement: 'img',
-  width: 100
+  attribute: "image_url",
+  tagElement: "img",
+  width: 100,
 }
 
 /**
@@ -66,7 +63,7 @@ SkuImageAsImgTag.args = {
  */
 export const ChildrenProps: StoryObj = () => {
   return (
-    <SkuField attribute='metadata' tagElement='div'>
+    <SkuField attribute="metadata" tagElement="div">
       {(childrenProps: any) => {
         return <pre>{JSON.stringify(childrenProps, null, 2)}</pre>
       }}
@@ -76,23 +73,20 @@ export const ChildrenProps: StoryObj = () => {
 ChildrenProps.decorators = [
   (Story) => {
     return (
-      <CommerceLayer
-        accessToken='my-access-token'
-        endpoint='https://demo-store.commercelayer.io'
-      >
-        <SkusContainer skus={['5PANECAP9D9CA1FFFFFFXXXX']}>
+      <CommerceLayer accessToken="my-access-token" endpoint="https://demo-store.commercelayer.io">
+        <SkusContainer skus={["5PANECAP9D9CA1FFFFFFXXXX"]}>
           <Skus>
             <Story />
           </Skus>
         </SkusContainer>
       </CommerceLayer>
     )
-  }
+  },
 ]
 ChildrenProps.parameters = {
   docs: {
     source: {
-      type: 'code'
-    }
-  }
+      type: "code",
+    },
+  },
 }
diff --git a/packages/docs/tsconfig.json b/packages/docs/tsconfig.json
index 345d10d0..a641010b 100644
--- a/packages/docs/tsconfig.json
+++ b/packages/docs/tsconfig.json
@@ -2,11 +2,7 @@
   "compilerOptions": {
     "jsx": "react-jsx",
     "target": "ESNext",
-    "lib": [
-      "dom",
-      "dom.iterable",
-      "esnext"
-    ],
+    "lib": ["dom", "dom.iterable", "esnext"],
     "allowJs": true,
     "skipLibCheck": true,
     "esModuleInterop": false,
@@ -19,39 +15,16 @@
     "isolatedModules": true,
     "noEmit": true,
     "paths": {
-      "#components/*": [
-        "../react-components/src/components/*"
-      ],
-      "#components-utils/*": [
-        "../react-components/src/components/utils/*"
-      ],
-      "#reducers/*": [
-        "../react-components/src/reducers/*"
-      ],
-      "#context/*": [
-        "../react-components/src/context/*"
-      ],
-      "#typings/*": [
-        "../react-components/src/typings/*"
-      ],
-      "#typings": [
-        "../react-components/src/typings/index"
-      ],
-      "#utils/*": [
-        "../react-components/src/utils/*"
-      ],
-      "#config/*": [
-        "../react-components/src/config/*"
-      ],
-      "#hooks/*": [
-        "../react-components/src/hooks/*"
-      ]
+      "#components/*": ["../react-components/src/components/*"],
+      "#components-utils/*": ["../react-components/src/components/utils/*"],
+      "#reducers/*": ["../react-components/src/reducers/*"],
+      "#context/*": ["../react-components/src/context/*"],
+      "#typings/*": ["../react-components/src/typings/*"],
+      "#typings": ["../react-components/src/typings/index"],
+      "#utils/*": ["../react-components/src/utils/*"],
+      "#config/*": ["../react-components/src/config/*"],
+      "#hooks/*": ["../react-components/src/hooks/*"]
     }
   },
-  "include": [
-    ".storybook/**/*",
-    "stories",
-    "mocks",
-    ".eslintrc.cjs"
-  ]
+  "include": [".storybook/**/*", "stories", "mocks", ".eslintrc.cjs"]
 }
diff --git a/packages/document/.storybook/addon-gh-repository/Tool.tsx b/packages/document/.storybook/addon-gh-repository/Tool.tsx
index f7de5a97..6d0dde99 100644
--- a/packages/document/.storybook/addon-gh-repository/Tool.tsx
+++ b/packages/document/.storybook/addon-gh-repository/Tool.tsx
@@ -1,14 +1,14 @@
-import React from 'react'
-import { GithubIcon } from '@storybook/icons'
-import { A, IconButton, Separator } from 'storybook/internal/components'
-import { ADDON_NAME, REPOSITORY_URL, TOOL_ID } from './constants'
+import React from "react"
+import { GithubIcon } from "@storybook/icons"
+import { A, IconButton, Separator } from "storybook/internal/components"
+import { ADDON_NAME, REPOSITORY_URL, TOOL_ID } from "./constants"
 
 export const Tool = () => {
   return (
     <>
       <Separator />
       <IconButton key={TOOL_ID} active={false} title={ADDON_NAME}>
-        <A target='_blank' href={REPOSITORY_URL}>
+        <A target="_blank" href={REPOSITORY_URL}>
           <GithubIcon />
           &nbsp;&nbsp;repository
         </A>
diff --git a/packages/document/.storybook/addon-gh-repository/constants.ts b/packages/document/.storybook/addon-gh-repository/constants.ts
index da0fb807..27ee6679 100644
--- a/packages/document/.storybook/addon-gh-repository/constants.ts
+++ b/packages/document/.storybook/addon-gh-repository/constants.ts
@@ -1,5 +1,4 @@
-export const ADDON_ID = 'addon-gh-repository'
-export const ADDON_NAME = 'View repository'
+export const ADDON_ID = "addon-gh-repository"
+export const ADDON_NAME = "View repository"
 export const TOOL_ID = `${ADDON_ID}/tool`
-export const REPOSITORY_URL =
-  'https://github.com/commercelayer/commercelayer-react-components'
+export const REPOSITORY_URL = "https://github.com/commercelayer/commercelayer-react-components"
diff --git a/packages/document/.storybook/commercelayer.theme.ts b/packages/document/.storybook/commercelayer.theme.ts
index f7ceed75..d04d717d 100644
--- a/packages/document/.storybook/commercelayer.theme.ts
+++ b/packages/document/.storybook/commercelayer.theme.ts
@@ -1,11 +1,11 @@
-import { create } from 'storybook/theming'
+import { create } from "storybook/theming"
 
 export default create({
-  base: 'light',
-  brandTitle: 'Commerce Layer',
+  base: "light",
+  brandTitle: "Commerce Layer",
   // brandUrl: 'https://example.com',
-  brandImage: './app-logo.png',
-  brandTarget: '_self',
+  brandImage: "./app-logo.png",
+  brandTarget: "_self",
 
-  textColor: '#101111'
+  textColor: "#101111",
 })
diff --git a/packages/document/.storybook/main.ts b/packages/document/.storybook/main.ts
index dc921475..1503c4c9 100644
--- a/packages/document/.storybook/main.ts
+++ b/packages/document/.storybook/main.ts
@@ -37,10 +37,7 @@ const storybookConfig: StorybookConfig = {
   async viteFinal(config) {
     return mergeConfig(config, viteOverrides)
   },
-  stories: [
-    "../src/stories/**/*.mdx",
-    "../src/stories/**/*.stories.@(js|jsx|ts|tsx)",
-  ],
+  stories: ["../src/stories/**/*.mdx", "../src/stories/**/*.stories.@(js|jsx|ts|tsx)"],
   addons: [
     "@storybook/addon-mcp",
     "@storybook/addon-links",
@@ -56,9 +53,7 @@ const storybookConfig: StorybookConfig = {
     },
   ],
   // @ts-expect-error This 'managerEntries' exists.
-  managerEntries: [
-    resolve(import.meta.dirname, "./addon-gh-repository/manager.tsx"),
-  ],
+  managerEntries: [resolve(import.meta.dirname, "./addon-gh-repository/manager.tsx")],
   framework: {
     name: "@storybook/react-vite",
     options: {},
diff --git a/packages/document/.storybook/manager.ts b/packages/document/.storybook/manager.ts
index e1c8afc5..cbb702b5 100644
--- a/packages/document/.storybook/manager.ts
+++ b/packages/document/.storybook/manager.ts
@@ -1,6 +1,6 @@
-import { addons } from 'storybook/manager-api'
-import commercelayerTheme from './commercelayer.theme'
+import { addons } from "storybook/manager-api"
+import commercelayerTheme from "./commercelayer.theme"
 
 addons.setConfig({
-  theme: commercelayerTheme
+  theme: commercelayerTheme,
 })
diff --git a/packages/document/.storybook/preview.tsx b/packages/document/.storybook/preview.tsx
index 28bad284..c2bf62cb 100644
--- a/packages/document/.storybook/preview.tsx
+++ b/packages/document/.storybook/preview.tsx
@@ -28,16 +28,16 @@ export const parameters: Parameters = {
   options: {
     storySort: {
       order: [
-        'Getting Started',
-        'Components',
-        ['Availability', 'Price', 'Order'],
-        'Skus',
-        ['Sku'],
-        'Examples',
-        ['Listing Page', 'Shopping Cart', 'Checkout Page', 'My Account'],
-        'Hooks'
-      ]
-    }
+        "Getting Started",
+        "Components",
+        ["Availability", "Price", "Order"],
+        "Skus",
+        ["Sku"],
+        "Examples",
+        ["Listing Page", "Shopping Cart", "Checkout Page", "My Account"],
+        "Hooks",
+      ],
+    },
   },
   docs: {
     page: () => (
@@ -92,12 +92,8 @@ const argTypesEnhancers: Preview["argTypesEnhancers"] = [
   (context) => {
     // when the className prop comes from `JSX.IntrinsicElements['div' | 'span']`
     // and is not documented, we add a default description
-    if (
-      "className" in context.argTypes &&
-      context.argTypes.className.description === ""
-    ) {
-      context.argTypes.className.description =
-        "CSS class name for the base component"
+    if ("className" in context.argTypes && context.argTypes.className.description === "") {
+      context.argTypes.className.description = "CSS class name for the base component"
     }
 
     return context.argTypes
diff --git a/packages/document/package.json b/packages/document/package.json
index 336d98c5..4a8667f5 100644
--- a/packages/document/package.json
+++ b/packages/document/package.json
@@ -38,4 +38,4 @@
     "vite": "^8.0.11",
     "vite-tsconfig-paths": "^6.1.1"
   }
-}
\ No newline at end of file
+}
diff --git a/packages/document/public/storybook-manager.css b/packages/document/public/storybook-manager.css
index 0b22c285..07ac4e7f 100644
--- a/packages/document/public/storybook-manager.css
+++ b/packages/document/public/storybook-manager.css
@@ -1,6 +1,6 @@
 :root {
   --color-primary: #101111;
-  --icon-carret-right: url('data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHZpZXdCb3g9IjAgMCAzMiAzMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IkNhcmV0UmlnaHQiPgo8cGF0aCBpZD0iVmVjdG9yIiBkPSJNMTIgNkwyMiAxNkwxMiAyNiIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9nPgo8L3N2Zz4K');
+  --icon-carret-right: url("data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzIiIGhlaWdodD0iMzIiIHZpZXdCb3g9IjAgMCAzMiAzMiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPGcgaWQ9IkNhcmV0UmlnaHQiPgo8cGF0aCBpZD0iVmVjdG9yIiBkPSJNMTIgNkwyMiAxNkwxMiAyNiIgc3Ryb2tlPSJibGFjayIgc3Ryb2tlLXdpZHRoPSIyIiBzdHJva2UtbGluZWNhcD0icm91bmQiIHN0cm9rZS1saW5lam9pbj0icm91bmQiLz4KPC9nPgo8L3N2Zz4K");
 }
 
 * {
@@ -12,7 +12,7 @@
   margin: 16px 0;
   max-height: 29px;
 }
-.sidebar-container .sidebar-header button[title='Shortcuts'] {
+.sidebar-container .sidebar-header button[title="Shortcuts"] {
   display: none;
 }
 .sidebar-container .sidebar-header div:first-of-type {
@@ -83,7 +83,7 @@
   display: none;
 }
 .sidebar-container .sidebar-item > button:not([data-testid="context-menu"])::before {
-  content: '';
+  content: "";
   background-image: var(--icon-carret-right);
   background-size: 100%;
   background-repeat: no-repeat;
@@ -95,7 +95,9 @@
   flex-shrink: 0;
   transition: transform 0.2s ease;
 }
-.sidebar-container .sidebar-item > button[aria-expanded='true']:not([data-testid="context-menu"])::before {
+.sidebar-container
+  .sidebar-item
+  > button[aria-expanded="true"]:not([data-testid="context-menu"])::before {
   transform: rotate(90deg);
 }
 
@@ -115,9 +117,9 @@ div.sidebar-item > a {
 div.sidebar-item:hover {
   background-color: #eceff1;
 }
-div.sidebar-item[data-selected='true'],
-div.sidebar-item[data-selected='true']:focus,
-div.sidebar-item[data-selected='true']:hover {
+div.sidebar-item[data-selected="true"],
+div.sidebar-item[data-selected="true"]:focus,
+div.sidebar-item[data-selected="true"]:hover {
   color: var(--color-primary);
   background: #f3f3fc;
 }
diff --git a/packages/document/public/storybook-preview.css b/packages/document/public/storybook-preview.css
index 4eca96b0..bdf0a7e5 100644
--- a/packages/document/public/storybook-preview.css
+++ b/packages/document/public/storybook-preview.css
@@ -1,51 +1,51 @@
-/* Global */
-.sbdocs-wrapper ol {
-  list-style: decimal;
-}
-
-/** Blockquote */
-blockquote {
-  display: block;
-  padding: 16px !important;
-  font-size: 14px !important;
-  color: #2e3438 !important;
-  margin: 16px 0 !important;
-  border-left: 4px solid #3b82f6 !important;
-  background-color: #dbebfe;
-  border-radius: 0 4px 4px 0;
-}
-blockquote > p {
-  margin: 0;
-}
-span[type] {
-  display: block;
-  padding: 16px !important;
-  font-size: 14px !important;
-  color: #2e3438 !important;
-  margin: 16px 0;
-  border-left: 4px solid;
-}
-span[type]::before {
-  content: attr(title);
-  display: block;
-  font-weight: bold;
-}
-span[type] > p {
-  margin: 0;
-}
-span[type="info"] {
-  border-color: #3b82f6;
-  background-color: #dbebfe;
-}
-span[type="warning"] {
-  border-color: #f97317;
-  background-color: #ffedd5;
-}
-span[type="success"] {
-  border-color: #22c55f;
-  background-color: #ddfce7;
-}
-span[type="danger"] {
-  border-color: #ef4544;
-  background-color: #fee2e3;
-}
+/* Global */
+.sbdocs-wrapper ol {
+  list-style: decimal;
+}
+
+/** Blockquote */
+blockquote {
+  display: block;
+  padding: 16px !important;
+  font-size: 14px !important;
+  color: #2e3438 !important;
+  margin: 16px 0 !important;
+  border-left: 4px solid #3b82f6 !important;
+  background-color: #dbebfe;
+  border-radius: 0 4px 4px 0;
+}
+blockquote > p {
+  margin: 0;
+}
+span[type] {
+  display: block;
+  padding: 16px !important;
+  font-size: 14px !important;
+  color: #2e3438 !important;
+  margin: 16px 0;
+  border-left: 4px solid;
+}
+span[type]::before {
+  content: attr(title);
+  display: block;
+  font-weight: bold;
+}
+span[type] > p {
+  margin: 0;
+}
+span[type="info"] {
+  border-color: #3b82f6;
+  background-color: #dbebfe;
+}
+span[type="warning"] {
+  border-color: #f97317;
+  background-color: #ffedd5;
+}
+span[type="success"] {
+  border-color: #22c55f;
+  background-color: #ddfce7;
+}
+span[type="danger"] {
+  border-color: #ef4544;
+  background-color: #fee2e3;
+}
diff --git a/packages/document/src/App.tsx b/packages/document/src/App.tsx
index 3d7ded3f..70848acb 100644
--- a/packages/document/src/App.tsx
+++ b/packages/document/src/App.tsx
@@ -1,7 +1,7 @@
-import { useState } from 'react'
-import reactLogo from './assets/react.svg'
-import viteLogo from '/vite.svg'
-import './App.css'
+import { useState } from "react"
+import reactLogo from "./assets/react.svg"
+import viteLogo from "/vite.svg"
+import "./App.css"
 
 function App() {
   const [count, setCount] = useState(0)
@@ -18,16 +18,12 @@ function App() {
       </div>
       <h1>Vite + React</h1>
       <div className="card">
-        <button onClick={() => setCount((count) => count + 1)}>
-          count is {count}
-        </button>
+        <button onClick={() => setCount((count) => count + 1)}>count is {count}</button>
         <p>
           Edit <code>src/App.tsx</code> and save to test HMR
         </p>
       </div>
-      <p className="read-the-docs">
-        Click on the Vite and React logos to learn more
-      </p>
+      <p className="read-the-docs">Click on the Vite and React logos to learn more</p>
     </>
   )
 }
diff --git a/packages/document/src/main.tsx b/packages/document/src/main.tsx
index 86e0ef88..578a7bdc 100644
--- a/packages/document/src/main.tsx
+++ b/packages/document/src/main.tsx
@@ -6,5 +6,5 @@ import App from "./App.tsx"
 createRoot(document.getElementById("root")!).render(
   <StrictMode>
     <App />
-  </StrictMode>,
+  </StrictMode>
 )
diff --git a/packages/document/src/stories/_internals/Code.tsx b/packages/document/src/stories/_internals/Code.tsx
index 383c69b0..d048bd41 100644
--- a/packages/document/src/stories/_internals/Code.tsx
+++ b/packages/document/src/stories/_internals/Code.tsx
@@ -1,3 +1,3 @@
 export const Code: React.FC<{ children?: string }> = ({ children }) => {
-  return <code className='bg-gray-100 px-2'>{children}</code>
+  return <code className="bg-gray-100 px-2">{children}</code>
 }
diff --git a/packages/document/src/stories/_internals/CommerceLayer.tsx b/packages/document/src/stories/_internals/CommerceLayer.tsx
index c947e1bd..a2073368 100644
--- a/packages/document/src/stories/_internals/CommerceLayer.tsx
+++ b/packages/document/src/stories/_internals/CommerceLayer.tsx
@@ -1,14 +1,11 @@
-import { CommerceLayer as CommerceLayerComponent } from '@commercelayer/react-components'
-import { useGetToken } from './useGetToken'
+import { CommerceLayer as CommerceLayerComponent } from "@commercelayer/react-components"
+import { useGetToken } from "./useGetToken"
 
 type DefaultChildrenType = JSX.Element[] | JSX.Element | null
 
 interface Props {
   children: DefaultChildrenType
-  accessToken:
-    | 'customer-access-token'
-    | 'customer-orders-access-token'
-    | 'my-access-token' // guest token
+  accessToken: "customer-access-token" | "customer-orders-access-token" | "my-access-token" // guest token
   endpoint?: string
 }
 
@@ -19,11 +16,11 @@ interface Props {
 function CommerceLayer({ children, ...props }: Props): JSX.Element {
   const { accessToken, endpoint } = useGetToken({
     mode:
-      props.accessToken === 'customer-access-token'
-        ? 'customer'
-        : props.accessToken === 'customer-orders-access-token'
-        ? 'customer-orders'
-        : 'guest'
+      props.accessToken === "customer-access-token"
+        ? "customer"
+        : props.accessToken === "customer-orders-access-token"
+          ? "customer-orders"
+          : "guest",
   })
 
   return (
diff --git a/packages/document/src/stories/_internals/OrderStorage.tsx b/packages/document/src/stories/_internals/OrderStorage.tsx
index 41df3c7b..bfd6579f 100644
--- a/packages/document/src/stories/_internals/OrderStorage.tsx
+++ b/packages/document/src/stories/_internals/OrderStorage.tsx
@@ -1,96 +1,91 @@
 /* eslint-disable @typescript-eslint/no-misused-promises */
-import OrderStorageComponent from "#components/orders/OrderStorage";
-import useCommerceLayer from "#hooks/useCommerceLayer";
-import { useState, useEffect } from "react";
-import useOrderContainer from "#hooks/useOrderContainer";
-import type { CommerceLayerClient } from "@commercelayer/sdk";
+import OrderStorageComponent from "#components/orders/OrderStorage"
+import useCommerceLayer from "#hooks/useCommerceLayer"
+import { useState, useEffect } from "react"
+import useOrderContainer from "#hooks/useOrderContainer"
+import type { CommerceLayerClient } from "@commercelayer/sdk"
 
 export const OrderStorage = ({
-	persistKey,
-	children,
+  persistKey,
+  children,
 }: {
-	persistKey: string;
-	children: React.ReactNode;
+  persistKey: string
+  children: React.ReactNode
 }): JSX.Element => {
-	const [orderId, setOrderId] = useState(localStorage.getItem(persistKey));
-	const { sdkClient, accessToken } = useCommerceLayer();
-	const cl =
-		accessToken != null && accessToken !== "" && sdkClient != null
-			? sdkClient()
-			: undefined;
+  const [orderId, setOrderId] = useState(localStorage.getItem(persistKey))
+  const { sdkClient, accessToken } = useCommerceLayer()
+  const cl =
+    accessToken != null && accessToken !== "" && sdkClient != null ? sdkClient() : undefined
 
-	useEffect(() => {
-		if (cl != null && orderId == null) {
-			createOrderWithItems(cl).then((orderId) => {
-				setOrderId(orderId);
-				localStorage.setItem(persistKey, orderId);
-			});
-		}
-	}, [cl, persistKey]);
+  useEffect(() => {
+    if (cl != null && orderId == null) {
+      createOrderWithItems(cl).then((orderId) => {
+        setOrderId(orderId)
+        localStorage.setItem(persistKey, orderId)
+      })
+    }
+  }, [cl, persistKey])
 
-	if (cl == null || orderId == null) {
-		return <div />;
-	}
+  if (cl == null || orderId == null) {
+    return <div />
+  }
 
-	return (
-		<OrderStorageComponent persistKey={persistKey}>
-			{children}
-		</OrderStorageComponent>
-	);
-};
+  return <OrderStorageComponent persistKey={persistKey}>{children}</OrderStorageComponent>
+}
 
 export const AddSampleItems = (): JSX.Element => {
-	const { sdkClient, accessToken } = useCommerceLayer();
-	const { order, addToCart } = useOrderContainer();
-	const cl = accessToken != null && accessToken !== "" && sdkClient();
+  const { sdkClient, accessToken } = useCommerceLayer()
+  const { order, addToCart } = useOrderContainer()
+  const cl = accessToken != null && accessToken !== "" && sdkClient()
 
-	if (cl == null || cl === false || order == null) return <div>loading...</div>;
+  if (cl == null || cl === false || order == null) return <div>loading...</div>
 
-	return (
-		<div>
-			<p className="mb-4">Cart is empty</p>
-			<button
-				onClick={async () => {
-					await addToCart({
-						skuCode: "5PANECAP9D9CA1FFFFFFXXXX",
-						quantity: 2,
-					});
-					await addToCart({
-						skuCode: "BACKPACK000000FFFFFFXXXX",
-						quantity: 3,
-					});
-				}}
-				className="py-2 px-4 bg-black text-white rounded text-sm"
-			>
-				Click me to fill cart with sample items
-			</button>
-		</div>
-	);
-};
+  return (
+    <div
+      style={{
+        minHeight: 600,
+      }}
+    >
+      <p className="mb-4">Cart is empty</p>
+      <button
+        onClick={async () => {
+          await addToCart({
+            skuCode: "5PANECAP9D9CA1FFFFFFXXXX",
+            quantity: 2,
+          })
+          await addToCart({
+            skuCode: "BACKPACK000000FFFFFFXXXX",
+            quantity: 3,
+          })
+        }}
+        className="py-2 px-4 bg-black text-white rounded text-sm"
+      >
+        Click me to fill cart with sample items
+      </button>
+    </div>
+  )
+}
 
 async function createOrderWithItems(cl: CommerceLayerClient): Promise<string> {
-	const order = await cl.orders.create({
-		language_code: "en",
-	});
-	await fillOrder(order.id, cl);
-	return order.id;
+  const order = await cl.orders.create({
+    language_code: "en",
+  })
+  await fillOrder(order.id, cl)
+  return order.id
 }
 
-async function fillOrder(
-	orderId: string,
-	cl: CommerceLayerClient,
-): Promise<void> {
-	await cl.line_items.create({
-		item_type: "skus",
-		sku_code: "5PANECAP9D9CA1FFFFFFXXXX",
-		quantity: 2,
-		order: cl.orders.relationship(orderId),
-	});
+async function fillOrder(orderId: string, cl: CommerceLayerClient): Promise<void> {
+  await cl.line_items.create({
+    item_type: "skus",
+    sku_code: "5PANECAP9D9CA1FFFFFFXXXX",
+    quantity: 2,
+    order: cl.orders.relationship(orderId),
+  })
 
-	await cl.line_items.create({
-		item_type: "skus",
-		sku_code: "BACKPACK000000FFFFFFXXXX",
-		quantity: 3,
-		order: cl.orders.relationship(orderId),
-	});
+  await cl.line_items.create({
+    item_type: "skus",
+    sku_code: "BACKPACK000000FFFFFFXXXX",
+    quantity: 3,
+    order: cl.orders.relationship(orderId),
+  })
 }
diff --git a/packages/document/src/stories/_internals/useGetToken.ts b/packages/document/src/stories/_internals/useGetToken.ts
index 966dd14f..fe93b6d3 100644
--- a/packages/document/src/stories/_internals/useGetToken.ts
+++ b/packages/document/src/stories/_internals/useGetToken.ts
@@ -1,29 +1,27 @@
-import { authenticate } from '@commercelayer/js-auth'
-import { useEffect, useMemo, useState } from 'react'
-import Cookie from 'js-cookie'
-import { jwtDecode } from 'jwt-decode'
+import { authenticate } from "@commercelayer/js-auth"
+import { useEffect, useMemo, useState } from "react"
+import Cookie from "js-cookie"
+import { jwtDecode } from "jwt-decode"
 
 const salesChannel = {
-  clientId: 'Z5ypiDlsqgV8twWRz0GabrJvTKXad4U-PMoVAU-XvV0',
-  slug: 'react-components-store',
-  scope: 'market:15283',
-  domain: 'commercelayer.io'
+  clientId: "Z5ypiDlsqgV8twWRz0GabrJvTKXad4U-PMoVAU-XvV0",
+  slug: "react-components-store",
+  scope: "market:15283",
+  domain: "commercelayer.io",
 }
 const savedCustomerWithOrders = {
-  username: 'bruce@wayne.com',
-  password: '123456'
+  username: "bruce@wayne.com",
+  password: "123456",
 }
 
-type UserMode = 'customer' | 'customer-orders' | 'guest'
+type UserMode = "customer" | "customer-orders" | "guest"
 interface UseGetTokenOptions {
   mode?: UserMode
 }
 
-const getAccessTokenCookieName = (mode: UserMode): string =>
-  `clToken.${salesChannel.slug}.${mode}`
+const getAccessTokenCookieName = (mode: UserMode): string => `clToken.${salesChannel.slug}.${mode}`
 
-const getCustomerLoginCookieName = (mode: UserMode): string =>
-  `clToken.customerLogin.${mode}`
+const getCustomerLoginCookieName = (mode: UserMode): string => `clToken.customerLogin.${mode}`
 
 export function useGetToken<T extends UseGetTokenOptions>(
   options?: T
@@ -31,10 +29,8 @@ export function useGetToken<T extends UseGetTokenOptions>(
   accessToken: string
   endpoint: string
 } {
-  const mode = options?.mode ?? 'guest'
-  const [accessToken, setAccessToken] = useState(
-    Cookie.get(getAccessTokenCookieName(mode)) ?? ''
-  )
+  const mode = options?.mode ?? "guest"
+  const [accessToken, setAccessToken] = useState(Cookie.get(getAccessTokenCookieName(mode)) ?? "")
   const clientId = salesChannel.clientId
   const slug = salesChannel.slug
   const scope = salesChannel.scope
@@ -43,15 +39,15 @@ export function useGetToken<T extends UseGetTokenOptions>(
   const initToken = useMemo(() => {
     return async () => {
       const user =
-        mode === 'customer'
+        mode === "customer"
           ? await retrieveCustomerData({
               clientId,
               slug,
               scope,
               domain,
-              mode
+              mode,
             })
-          : mode === 'customer-orders'
+          : mode === "customer-orders"
             ? savedCustomerWithOrders
             : undefined
 
@@ -61,7 +57,7 @@ export function useGetToken<T extends UseGetTokenOptions>(
         scope,
         domain,
         user,
-        mode
+        mode,
       }).then(({ accessToken, expires }) => {
         setAccessToken(accessToken)
         Cookie.set(getAccessTokenCookieName(mode), accessToken, { expires })
@@ -72,7 +68,7 @@ export function useGetToken<T extends UseGetTokenOptions>(
   useEffect(() => {
     if (
       accessToken == null ||
-      accessToken === '' ||
+      accessToken === "" ||
       isTokenExpired({ accessToken, compareTo: new Date() })
     ) {
       initToken()
@@ -81,7 +77,7 @@ export function useGetToken<T extends UseGetTokenOptions>(
 
   return {
     accessToken,
-    endpoint: `https://${slug}.${domain}`
+    endpoint: `https://${slug}.${domain}`,
   }
 }
 
@@ -90,7 +86,7 @@ async function retrieveCustomerData({
   slug,
   scope,
   domain,
-  mode
+  mode,
 }: {
   clientId: string
   slug: string
@@ -102,19 +98,17 @@ async function retrieveCustomerData({
   password: string
 }> {
   const existingUser = Cookie.get(getCustomerLoginCookieName(mode))
-  const savedEmail = parseEmailAddress(existingUser?.split(':')[0])
-  const savedPassword = parsePassword(existingUser?.split(':')[1])
+  const savedEmail = parseEmailAddress(existingUser?.split(":")[0])
+  const savedPassword = parsePassword(existingUser?.split(":")[1])
 
   if (savedEmail != null && savedPassword != null) {
     return {
       username: savedEmail,
-      password: savedPassword
+      password: savedPassword,
     }
   }
 
-  const newEmail = `user-${generateRandomString(5)}-${generateRandomString(
-    5
-  )}@domain.com`
+  const newEmail = `user-${generateRandomString(5)}-${generateRandomString(5)}@domain.com`
   const newPassword = generateRandomString(10)
 
   const guestToken = await generateNewToken({
@@ -122,7 +116,7 @@ async function retrieveCustomerData({
     slug,
     scope,
     domain,
-    mode
+    mode,
   })
 
   await createNewCustomer({
@@ -130,14 +124,14 @@ async function retrieveCustomerData({
     password: newPassword,
     salesChannelToken: guestToken.accessToken,
     slug,
-    domain
+    domain,
   })
 
   Cookie.set(getCustomerLoginCookieName(mode), `${newEmail}:${newPassword}`)
 
   return {
     username: newEmail,
-    password: newPassword
+    password: newPassword,
   }
 }
 
@@ -148,7 +142,7 @@ async function generateNewToken({
   scope,
   domain,
   user,
-  mode
+  mode,
 }: {
   clientId: string
   slug: string
@@ -158,20 +152,20 @@ async function generateNewToken({
   mode: UserMode
 }) {
   return user == null
-    ? await authenticate('client_credentials', {
+    ? await authenticate("client_credentials", {
         clientId,
         scope,
-        domain
+        domain,
       })
-    : await authenticate('password', {
+    : await authenticate("password", {
         clientId,
         scope,
         domain,
-        ...user
+        ...user,
       }).then((res) => {
-        if (res != null && 'error' in res) {
-          Cookie.remove(getCustomerLoginCookieName('customer'))
-          Cookie.remove(getCustomerLoginCookieName('customer-orders'))
+        if (res != null && "error" in res) {
+          Cookie.remove(getCustomerLoginCookieName("customer"))
+          Cookie.remove(getCustomerLoginCookieName("customer-orders"))
           Cookie.remove(getAccessTokenCookieName(mode))
         }
         return res
@@ -180,12 +174,12 @@ async function generateNewToken({
 
 function isTokenExpired({
   accessToken,
-  compareTo
+  compareTo,
 }: {
   accessToken?: string
   compareTo: Date
 }): boolean {
-  if (accessToken == null || accessToken === '') {
+  if (accessToken == null || accessToken === "") {
     return true
   }
 
@@ -204,8 +198,8 @@ function isTokenExpired({
 }
 
 function generateRandomString(length = 10): string {
-  const chars = 'ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789'
-  let result = ''
+  const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789"
+  let result = ""
   for (let i = 0; i < length; i++) {
     result += chars.charAt(Math.floor(Math.random() * chars.length))
   }
@@ -229,7 +223,7 @@ async function createNewCustomer({
   password,
   salesChannelToken,
   slug,
-  domain
+  domain,
 }: {
   email: string
   password: string
@@ -238,24 +232,24 @@ async function createNewCustomer({
   domain: string
 }): Promise<void> {
   const newCustomer = await fetch(`https://${slug}.${domain}/api/customers`, {
-    method: 'POST',
+    method: "POST",
     headers: {
-      Accept: 'application/vnd.api+json',
-      'Content-Type': 'application/vnd.api+json',
-      Authorization: `Bearer ${salesChannelToken}`
+      Accept: "application/vnd.api+json",
+      "Content-Type": "application/vnd.api+json",
+      Authorization: `Bearer ${salesChannelToken}`,
     },
     body: JSON.stringify({
       data: {
-        type: 'customers',
+        type: "customers",
         attributes: {
           email,
-          password
-        }
-      }
-    })
+          password,
+        },
+      },
+    }),
   })
 
   if (newCustomer.status !== 201) {
-    throw new Error('Error creating customer')
+    throw new Error("Error creating customer")
   }
 }
diff --git a/packages/document/src/stories/availability/AvailabilityTemplate.stories.tsx b/packages/document/src/stories/availability/AvailabilityTemplate.stories.tsx
index f69ed080..82ebc3a0 100644
--- a/packages/document/src/stories/availability/AvailabilityTemplate.stories.tsx
+++ b/packages/document/src/stories/availability/AvailabilityTemplate.stories.tsx
@@ -1,7 +1,4 @@
-import {
-  Availability,
-  AvailabilityTemplate,
-} from "@commercelayer/react-components"
+import { Availability, AvailabilityTemplate } from "@commercelayer/react-components"
 import { ArgTypes, Canvas, Source } from "@storybook/addon-docs/blocks"
 import type { Meta, StoryObj } from "@storybook/react-vite"
 import CommerceLayer from "../_internals/CommerceLayer"
@@ -166,14 +163,12 @@ const meta = {
   argTypes: {
     labels: {
       control: "object",
-      description:
-        "Text labels for each stock state: `available`, `outOfStock`, `negativeStock`.",
+      description: "Text labels for each stock state: `available`, `outOfStock`, `negativeStock`.",
     },
     timeFormat: {
       control: "select",
       options: ["days", "hours"],
-      description:
-        "When set, delivery lead time is appended to the availability label.",
+      description: "When set, delivery lead time is appended to the availability label.",
     },
     showShippingMethodName: {
       control: "boolean",
diff --git a/packages/document/src/stories/availability/availability.stories.tsx b/packages/document/src/stories/availability/availability.stories.tsx
index f1a99236..2ce395e0 100644
--- a/packages/document/src/stories/availability/availability.stories.tsx
+++ b/packages/document/src/stories/availability/availability.stories.tsx
@@ -1,9 +1,4 @@
-import {
-  Availability,
-  AvailabilityTemplate,
-  Sku,
-  SkuField,
-} from "@commercelayer/react-components"
+import { Availability, AvailabilityTemplate, Sku, SkuField } from "@commercelayer/react-components"
 import { ArgTypes, Canvas, Source } from "@storybook/addon-docs/blocks"
 import type { Meta, StoryObj } from "@storybook/react-vite"
 import CommerceLayer from "../_internals/CommerceLayer"
@@ -13,19 +8,17 @@ function AvailabilityDocsPage(): JSX.Element {
     <>
       <h1>Availability</h1>
       <p>
-        The Availability components let you display real-time stock quantity and
-        delivery lead times for any SKU. They are powered by the Commerce Layer
-        inventory model and work by fetching availability data through the{" "}
-        <code>useAvailability</code> hook from <code>@commercelayer/hooks</code>
-        . All Availability components must be nested inside the{" "}
+        The Availability components let you display real-time stock quantity and delivery lead times
+        for any SKU. They are powered by the Commerce Layer inventory model and work by fetching
+        availability data through the <code>useAvailability</code> hook from{" "}
+        <code>@commercelayer/hooks</code>. All Availability components must be nested inside the{" "}
         <code>{"<CommerceLayer>"}</code> context.
       </p>
       <hr />
       <h2>Availability (standalone)</h2>
       <p>
-        The preferred way to display availability.{" "}
-        <code>{"<Availability>"}</code> fetches inventory data on its own — no
-        container wrapper needed. Picks up <code>skuCode</code> from a parent{" "}
+        The preferred way to display availability. <code>{"<Availability>"}</code> fetches inventory
+        data on its own — no container wrapper needed. Picks up <code>skuCode</code> from a parent{" "}
         <code>{"<Sku>"}</code> or line-item context when no prop is given.
       </p>
       <blockquote>
@@ -52,11 +45,10 @@ import { CommerceLayer, Availability, AvailabilityTemplate } from '@commercelaye
       <hr />
       <h2>Usage inside Skus</h2>
       <p>
-        When used inside a <code>{"<Sku>"}</code> or{" "}
-        <code>{"<SkusContainer>"}</code> → <code>{"<Skus>"}</code> tree,{" "}
-        <code>{"<Availability>"}</code> automatically inherits the{" "}
-        <code>skuCode</code> from the current SKU context — no need to pass{" "}
-        <code>skuCode</code> explicitly.
+        When used inside a <code>{"<Sku>"}</code> or <code>{"<SkusContainer>"}</code> →{" "}
+        <code>{"<Skus>"}</code> tree, <code>{"<Availability>"}</code> automatically inherits the{" "}
+        <code>skuCode</code> from the current SKU context — no need to pass <code>skuCode</code>{" "}
+        explicitly.
       </p>
       <Canvas of={InsideSku} />
     </>
@@ -108,9 +100,7 @@ export const StandaloneAvailability: Story = {
   render: () => (
     <CommerceLayer accessToken="my-access-token">
       <Availability skuCode="POLOMXXX000000FFFFFFLXXX">
-        <AvailabilityTemplate
-          labels={{ available: "In stock", outOfStock: "Out of stock" }}
-        />
+        <AvailabilityTemplate labels={{ available: "In stock", outOfStock: "Out of stock" }} />
       </Availability>
     </CommerceLayer>
   ),
@@ -137,11 +127,7 @@ export const InsideSku: Story = {
   render: () => (
     <CommerceLayer accessToken="my-access-token">
       <Sku skuCode="POLOMXXX000000FFFFFFLXXX">
-        <SkuField
-          attribute="name"
-          tagElement="h3"
-          style={{ marginBottom: 4 }}
-        />
+        <SkuField attribute="name" tagElement="h3" style={{ marginBottom: 4 }} />
         <Availability>
           <AvailabilityTemplate />
         </Availability>
diff --git a/packages/document/src/stories/cart/AddToCartButton.stories.tsx b/packages/document/src/stories/cart/AddToCartButton.stories.tsx
index be7253db..77be0e69 100644
--- a/packages/document/src/stories/cart/AddToCartButton.stories.tsx
+++ b/packages/document/src/stories/cart/AddToCartButton.stories.tsx
@@ -23,16 +23,15 @@ function AddToCartButtonDocsPage(): JSX.Element {
     <>
       <h1>AddToCartButton</h1>
       <p>
-        <code>{"<AddToCartButton>"}</code> adds a SKU, bundle, or SKU list to
-        the cart (draft order). It must be a descendant of{" "}
-        <code>{"<Order>"}</code>. When nested inside <code>{"<Skus>"}</code> or{" "}
-        <code>{"<SkuList>"}</code>, the <code>skuCode</code> is inherited from
-        context automatically.
+        <code>{"<AddToCartButton>"}</code> adds a SKU, bundle, or SKU list to the cart (draft
+        order). It must be a descendant of <code>{"<Order>"}</code>. When nested inside{" "}
+        <code>{"<Skus>"}</code> or <code>{"<SkuList>"}</code>, the <code>skuCode</code> is inherited
+        from context automatically.
       </p>
       <span title="Usage" type="info">
         <p>
-          Must be a child of <code>{"<Order>"}</code> (or{" "}
-          <code>{"<OrderContainer>"}</code>). See the{" "}
+          Must be a child of <code>{"<Order>"}</code> (or <code>{"<OrderContainer>"}</code>). See
+          the{" "}
           <a href="https://docs.commercelayer.io/core/v/how-tos/placing-orders/shopping-cart/create-a-shopping-cart">
             shopping cart how-to
           </a>{" "}
@@ -69,22 +68,22 @@ import {
       <hr />
       <h2>Disabled when out of stock</h2>
       <p>
-        Combine with <code>{"<AvailabilityTemplate>"}</code> to disable the
-        button when the SKU has no stock.
+        Combine with <code>{"<AvailabilityTemplate>"}</code> to disable the button when the SKU has
+        no stock.
       </p>
       <Canvas of={DisabledWhenOutOfStock} />
       <hr />
       <h2>Custom attributes / external price</h2>
       <p>
-        Pass a <code>lineItem</code> prop to customise the created line item
-        (e.g. custom name, external price).
+        Pass a <code>lineItem</code> prop to customise the created line item (e.g. custom name,
+        external price).
       </p>
       <Canvas of={UseCustomAttributesOrExternalPrice} />
       <hr />
       <h2>Children render prop</h2>
       <p>
-        Pass a function as <code>children</code> to take full control of the
-        button UI. The <code>disabled</code> flag reflects the loading state.
+        Pass a function as <code>children</code> to take full control of the button UI. The{" "}
+        <code>disabled</code> flag reflects the loading state.
       </p>
       <Canvas of={ChildrenProps} />
     </>
@@ -111,8 +110,7 @@ const meta = {
     },
     skuListId: {
       control: "text",
-      description:
-        "SKU list ID — adds all SKUs in the list to the cart at once.",
+      description: "SKU list ID — adds all SKUs in the list to the cart at once.",
     },
     quantity: {
       control: "text",
@@ -128,8 +126,7 @@ const meta = {
     },
     buyNowMode: {
       control: "boolean",
-      description:
-        "When `true`, redirects to the hosted checkout after adding the item.",
+      description: "When `true`, redirects to the hosted checkout after adding the item.",
     },
     checkoutUrl: {
       control: "text",
@@ -137,13 +134,11 @@ const meta = {
     },
     redirectToHostedCart: {
       control: "boolean",
-      description:
-        "When `true`, redirects to the hosted cart after adding the item.",
+      description: "When `true`, redirects to the hosted cart after adding the item.",
     },
     hostedCartUrl: {
       control: "text",
-      description:
-        "Self-hosted cart URL used when `redirectToHostedCart` is `true`.",
+      description: "Self-hosted cart URL used when `redirectToHostedCart` is `true`.",
     },
     lineItem: {
       control: "object",
@@ -236,9 +231,7 @@ export const DisabledWhenOutOfStock: Story = {
   name: "Disabled when out of stock",
   render: () => (
     <Wrapper>
-      <SkusContainer
-        skus={["POLOMXXX000000FFFFFFLXXX", "TSHIRTWV000000FFFFFFSXXX"]}
-      >
+      <SkusContainer skus={["POLOMXXX000000FFFFFFLXXX", "TSHIRTWV000000FFFFFFSXXX"]}>
         <Skus>
           <AvailabilityContainer>
             <AvailabilityTemplate>
diff --git a/packages/document/src/stories/cart/CartLink.stories.tsx b/packages/document/src/stories/cart/CartLink.stories.tsx
index 295ce8f0..7f4127c5 100644
--- a/packages/document/src/stories/cart/CartLink.stories.tsx
+++ b/packages/document/src/stories/cart/CartLink.stories.tsx
@@ -12,14 +12,13 @@ function CartLinkDocsPage(): JSX.Element {
       <p>
         <code>{"<CartLink>"}</code> generates a link to the Commerce Layer hosted cart
         micro-frontend. Clicking it navigates the customer to their cart, or — when{" "}
-        <code>type="mini"</code> is set — opens the{" "}
-        <code>{"<HostedCart type=\"mini\">"}</code> slide-in panel instead.
+        <code>type="mini"</code> is set — opens the <code>{'<HostedCart type="mini">'}</code>{" "}
+        slide-in panel instead.
       </p>
       <span title="Usage" type="info">
         <p>
-          Must be a child of <code>{"<Order>"}</code> (wrapped in{" "}
-          <code>{"<OrderStorage>"}</code>). Requires a parent{" "}
-          <code>{"<CommerceLayer>"}</code> context for the access token.
+          Must be a child of <code>{"<Order>"}</code> (wrapped in <code>{"<OrderStorage>"}</code>).
+          Requires a parent <code>{"<CommerceLayer>"}</code> context for the access token.
         </p>
       </span>
       <ArgTypes />
@@ -53,9 +52,9 @@ import {
       <hr />
       <h2>Mini cart trigger</h2>
       <p>
-        Set <code>type="mini"</code> to publish the <code>"open-cart"</code> event on click
-        instead of navigating. Place a <code>{'<HostedCart type="mini">'}</code> on the same page
-        to receive the event and open the slide-in panel.
+        Set <code>type="mini"</code> to publish the <code>"open-cart"</code> event on click instead
+        of navigating. Place a <code>{'<HostedCart type="mini">'}</code> on the same page to receive
+        the event and open the slide-in panel.
       </p>
       <Canvas of={MiniCartTrigger} />
       <hr />
@@ -98,7 +97,7 @@ const meta = {
       control: "select",
       options: ["_self", "_blank", "_parent", "_top"],
       description:
-        "Specifies where to open the linked URL. Defaults to `_self`. Only applies when navigating (not when `type=\"mini\"`).",
+        'Specifies where to open the linked URL. Defaults to `_self`. Only applies when navigating (not when `type="mini"`).',
     },
     children: {
       control: false,
@@ -161,11 +160,7 @@ export const MiniCartTrigger: Story = {
           label="Open mini cart"
           className="px-4 py-2 bg-black text-white rounded text-sm"
         />
-        <HostedCart
-          type="mini"
-          open={isOpen}
-          handleOpen={() => setIsOpen((o) => !o)}
-        />
+        <HostedCart type="mini" open={isOpen} handleOpen={() => setIsOpen((o) => !o)} />
       </Wrapper>
     )
   },
diff --git a/packages/document/src/stories/cart/HostedCart.stories.tsx b/packages/document/src/stories/cart/HostedCart.stories.tsx
index a17263ac..018c7adb 100644
--- a/packages/document/src/stories/cart/HostedCart.stories.tsx
+++ b/packages/document/src/stories/cart/HostedCart.stories.tsx
@@ -9,22 +9,19 @@ function HostedCartDocsPage(): JSX.Element {
     <>
       <h1>HostedCart</h1>
       <p>
-        <code>{"<HostedCart>"}</code> embeds the Commerce Layer hosted cart
-        micro-frontend as an <code>{"<iframe>"}</code> inside your page. It
-        automatically resolves the cart URL from the access token and the current
-        order.
+        <code>{"<HostedCart>"}</code> embeds the Commerce Layer hosted cart micro-frontend as an{" "}
+        <code>{"<iframe>"}</code> inside your page. It automatically resolves the cart URL from the
+        access token and the current order.
       </p>
       <p>
-        By default it renders as an <strong>inline cart</strong> — the iframe
-        fills the available container width while the height adjusts to its
-        content. For the slide-in panel variant, see{" "}
+        By default it renders as an <strong>inline cart</strong> — the iframe fills the available
+        container width while the height adjusts to its content. For the slide-in panel variant, see{" "}
         <strong>Components/Cart/MiniCart</strong>.
       </p>
       <span title="Usage" type="info">
         <p>
-          Must be a child of <code>{"<Order>"}</code> (wrapped in{" "}
-          <code>{"<OrderStorage>"}</code>). Requires a parent{" "}
-          <code>{"<CommerceLayer>"}</code> context for the access token.
+          Must be a child of <code>{"<Order>"}</code> (wrapped in <code>{"<OrderStorage>"}</code>).
+          Requires a parent <code>{"<CommerceLayer>"}</code> context for the access token.
         </p>
       </span>
       <ArgTypes />
@@ -51,16 +48,15 @@ import {
       <hr />
       <h2>Default — inline cart</h2>
       <p>
-        Renders as an inline <code>{"<iframe>"}</code> that fills the container
-        width. The height adjusts automatically to the cart content via{" "}
-        <code>iframe-resizer</code>.
+        Renders as an inline <code>{"<iframe>"}</code> that fills the container width. The height
+        adjusts automatically to the cart content via <code>iframe-resizer</code>.
       </p>
       <Canvas of={Default} />
       <hr />
       <h2>Custom domain</h2>
       <p>
-        Use <code>customDomain</code> to point to a forked cart application
-        instead of the default Commerce Layer hosted micro-frontend.
+        Use <code>customDomain</code> to point to a forked cart application instead of the default
+        Commerce Layer hosted micro-frontend.
       </p>
       <Canvas of={CustomDomain} />
     </>
diff --git a/packages/document/src/stories/cart/MiniCart.stories.tsx b/packages/document/src/stories/cart/MiniCart.stories.tsx
index f366a26b..3afec48d 100644
--- a/packages/document/src/stories/cart/MiniCart.stories.tsx
+++ b/packages/document/src/stories/cart/MiniCart.stories.tsx
@@ -1,9 +1,4 @@
-import {
-  AddToCartButton,
-  CartLink,
-  HostedCart,
-  Order,
-} from "@commercelayer/react-components"
+import { AddToCartButton, CartLink, HostedCart, Order } from "@commercelayer/react-components"
 import { ArgTypes, Canvas, Source } from "@storybook/addon-docs/blocks"
 import type { Meta, StoryObj } from "@storybook/react-vite"
 import { useState, type JSX } from "react"
@@ -63,18 +58,16 @@ function App() {
       <hr />
       <h2>Mini cart</h2>
       <p>
-        Click the button to open the slide-in panel. The{" "}
-        <code>handleOpen</code> callback keeps external state in sync when the
-        overlay or close icon is clicked inside the cart.
+        Click the button to open the slide-in panel. The <code>handleOpen</code> callback keeps
+        external state in sync when the overlay or close icon is clicked inside the cart.
       </p>
       <Canvas of={Default} />
       <hr />
       <h2>Auto-open on add to cart</h2>
       <p>
-        Set <code>openAdd</code> to <code>true</code> so the panel opens
-        automatically after <code>{"<AddToCartButton>"}</code> successfully adds
-        an item to the order. Click <strong>Add to cart</strong> below to
-        trigger the flow.
+        Set <code>openAdd</code> to <code>true</code> so the panel opens automatically after{" "}
+        <code>{"<AddToCartButton>"}</code> successfully adds an item to the order. Click{" "}
+        <strong>Add to cart</strong> below to trigger the flow.
       </p>
       <Canvas of={OpenOnAdd} />
     </>
@@ -152,11 +145,7 @@ export const Default: Story = {
           label="Open mini cart"
           className="px-4 py-2 bg-black text-white rounded text-sm"
         />
-        <HostedCart
-          type="mini"
-          open={isOpen}
-          handleOpen={() => setIsOpen((o) => !o)}
-        />
+        <HostedCart type="mini" open={isOpen} handleOpen={() => setIsOpen((o) => !o)} />
       </Wrapper>
     )
   },
diff --git a/packages/document/src/stories/orders/Order.stories.tsx b/packages/document/src/stories/orders/Order.stories.tsx
index eccf9d83..8d067ce2 100644
--- a/packages/document/src/stories/orders/Order.stories.tsx
+++ b/packages/document/src/stories/orders/Order.stories.tsx
@@ -16,10 +16,9 @@ function OrderDocsPage(): JSX.Element {
     <>
       <h1>Orders</h1>
       <p>
-        The Order components let you fetch and display order data from the
-        Commerce Layer API. All order components must be nested inside the{" "}
-        <code>{"<CommerceLayer>"}</code> context that handles API
-        authentication.
+        The Order components let you fetch and display order data from the Commerce Layer API. All
+        order components must be nested inside the <code>{"<CommerceLayer>"}</code> context that
+        handles API authentication.
       </p>
       <p>
         Refer to the{" "}
@@ -31,18 +30,15 @@ function OrderDocsPage(): JSX.Element {
       <hr />
       <h2>Order (standalone)</h2>
       <p>
-        <code>{"<Order>"}</code> is the recommended way to fetch an order and
-        make it available to its children via context. Pass the{" "}
-        <code>orderId</code> prop to load an existing order, or omit it to
-        create a new one on demand. It can optionally receive the{" "}
-        <code>orderId</code> from a parent <code>{"<OrderStorage>"}</code>{" "}
-        component.
+        <code>{"<Order>"}</code> is the recommended way to fetch an order and make it available to
+        its children via context. Pass the <code>orderId</code> prop to load an existing order, or
+        omit it to create a new one on demand. It can optionally receive the <code>orderId</code>{" "}
+        from a parent <code>{"<OrderStorage>"}</code> component.
       </p>
       <span title="Usage" type="info">
         <p>
-          Must be a child of <code>{"<CommerceLayer>"}</code>. Can optionally be
-          a child of <code>{"<OrderStorage>"}</code> to receive the{" "}
-          <code>orderId</code> automatically.
+          Must be a child of <code>{"<CommerceLayer>"}</code>. Can optionally be a child of{" "}
+          <code>{"<OrderStorage>"}</code> to receive the <code>orderId</code> automatically.
         </p>
       </span>
       <ArgTypes />
@@ -71,9 +67,8 @@ import {
       <hr />
       <h2>Order — with fetchOrder callback</h2>
       <p>
-        Use the <code>fetchOrder</code> callback to react to order updates in
-        your application — for example to sync the cart badge count or trigger
-        analytics events.
+        Use the <code>fetchOrder</code> callback to react to order updates in your application — for
+        example to sync the cart badge count or trigger analytics events.
       </p>
       <Source
         language="jsx"
@@ -109,13 +104,11 @@ const meta = {
   argTypes: {
     orderId: {
       control: "text",
-      description:
-        "ID of the order to fetch. Omit to create a new draft order on demand.",
+      description: "ID of the order to fetch. Omit to create a new draft order on demand.",
     },
     metadata: {
       control: "object",
-      description:
-        "Metadata key-value pairs added when a new order is created.",
+      description: "Metadata key-value pairs added when a new order is created.",
     },
     attributes: {
       control: "object",
diff --git a/packages/document/src/stories/orders/OrderContainer.stories.tsx b/packages/document/src/stories/orders/OrderContainer.stories.tsx
index 381ad00b..3fa81a48 100644
--- a/packages/document/src/stories/orders/OrderContainer.stories.tsx
+++ b/packages/document/src/stories/orders/OrderContainer.stories.tsx
@@ -1,9 +1,4 @@
-import {
-  Order,
-  OrderContainer,
-  OrderNumber,
-  TotalAmount,
-} from "@commercelayer/react-components"
+import { Order, OrderContainer, OrderNumber, TotalAmount } from "@commercelayer/react-components"
 import { ArgTypes, Canvas, Source } from "@storybook/addon-docs/blocks"
 import type { Meta, StoryObj } from "@storybook/react-vite"
 import CommerceLayer from "../_internals/CommerceLayer"
diff --git a/packages/document/src/stories/prices/PricesContainer.stories.tsx b/packages/document/src/stories/prices/PricesContainer.stories.tsx
index 15406d06..2a92935d 100644
--- a/packages/document/src/stories/prices/PricesContainer.stories.tsx
+++ b/packages/document/src/stories/prices/PricesContainer.stories.tsx
@@ -10,8 +10,8 @@ function PricesContainerDocsPage(): JSX.Element {
       <span title="Deprecated" type="warning">
         <p>
           <code>{"<PricesContainer>"}</code> is deprecated and will be removed in a future major
-          release. Use <code>{'<Price skuCode="…" />'}</code> as a standalone component instead —
-          it handles batching automatically. See <strong>Prices/Price</strong> for the recommended
+          release. Use <code>{'<Price skuCode="…" />'}</code> as a standalone component instead — it
+          handles batching automatically. See <strong>Prices/Price</strong> for the recommended
           pattern.
         </p>
       </span>
diff --git a/packages/document/src/stories/prices/prices.stories.tsx b/packages/document/src/stories/prices/prices.stories.tsx
index 661d77a2..cc47dbc8 100644
--- a/packages/document/src/stories/prices/prices.stories.tsx
+++ b/packages/document/src/stories/prices/prices.stories.tsx
@@ -8,10 +8,9 @@ function PricesDocsPage(): JSX.Element {
     <>
       <h1>Prices</h1>
       <p>
-        The Prices components let you fetch and display product prices from the
-        Commerce Layer API. All price components must be nested inside the{" "}
-        <code>{"<CommerceLayer>"}</code> context that handles API
-        authentication.
+        The Prices components let you fetch and display product prices from the Commerce Layer API.
+        All price components must be nested inside the <code>{"<CommerceLayer>"}</code> context that
+        handles API authentication.
       </p>
       <p>
         Refer to the{" "}
@@ -27,15 +26,13 @@ function PricesDocsPage(): JSX.Element {
         <strong>
           directly under <code>{"<CommerceLayer>"}</code>
         </strong>{" "}
-        without any container. It automatically registers its{" "}
-        <code>skuCode</code> in a module-level batch store and a 50 ms debounce
-        collects all sibling registrations into{" "}
+        without any container. It automatically registers its <code>skuCode</code> in a module-level
+        batch store and a 50 ms debounce collects all sibling registrations into{" "}
         <strong>one SWR-deduplicated API request</strong>.
       </p>
       <span title="Note" type="info">
         <p>
-          No provider or wrapper needed. Drop{" "}
-          <code>{'<Price skuCode="…" />'}</code> anywhere inside{" "}
+          No provider or wrapper needed. Drop <code>{'<Price skuCode="…" />'}</code> anywhere inside{" "}
           <code>{"<CommerceLayer>"}</code> and batching happens automatically.
         </p>
       </span>
@@ -58,9 +55,9 @@ import { CommerceLayer, Price } from '@commercelayer/react-components'
       <hr />
       <h2>Render prop</h2>
       <p>
-        Use the <code>children</code> render prop to access the raw{" "}
-        <code>prices</code> array and <code>loading</code> state for a fully
-        custom price UI. Works in both standalone and container modes.
+        Use the <code>children</code> render prop to access the raw <code>prices</code> array and{" "}
+        <code>loading</code> state for a fully custom price UI. Works in both standalone and
+        container modes.
       </p>
       <Source
         language="jsx"
@@ -107,8 +104,7 @@ const meta = {
     },
     showCompare: {
       control: "boolean",
-      description:
-        "When `false`, the `compare_at` (strike-through) price is not displayed.",
+      description: "When `false`, the `compare_at` (strike-through) price is not displayed.",
     },
     compareClassName: {
       control: "text",
@@ -116,8 +112,7 @@ const meta = {
     },
     loader: {
       control: "text",
-      description:
-        "Content displayed while the price is loading in standalone mode.",
+      description: "Content displayed while the price is loading in standalone mode.",
     },
     children: {
       control: false,
@@ -137,18 +132,13 @@ export const RenderPropStory: Story = {
       <Price skuCode="POST6191FFFFFF000000XXXX">
         {({ prices, loading }) => {
           if (loading) return <span style={{ color: "#999" }}>Loading…</span>
-          if (prices.length === 0)
-            return <span style={{ color: "red" }}>No price available</span>
+          if (prices.length === 0) return <span style={{ color: "red" }}>No price available</span>
           const [p] = prices
           return (
             <div>
-              <strong style={{ fontSize: "1.25rem" }}>
-                {p.formatted_amount}
-              </strong>
+              <strong style={{ fontSize: "1.25rem" }}>{p.formatted_amount}</strong>
               {p.formatted_compare_at_amount != null && (
-                <s style={{ marginLeft: 8, color: "#999" }}>
-                  {p.formatted_compare_at_amount}
-                </s>
+                <s style={{ marginLeft: 8, color: "#999" }}>{p.formatted_compare_at_amount}</s>
               )}
             </div>
           )
@@ -170,9 +160,7 @@ export const StandalonePrice: Story = {
           <Price
             skuCode="POST6191FFFFFF000000XXXX"
             style={{ fontWeight: "bold" }}
-            loader={
-              <span style={{ color: "#bbb", fontSize: "0.8rem" }}>…</span>
-            }
+            loader={<span style={{ color: "#bbb", fontSize: "0.8rem" }}>…</span>}
           />
         </div>
         <div style={{ display: "flex", gap: 16, alignItems: "center" }}>
@@ -182,9 +170,7 @@ export const StandalonePrice: Story = {
           <Price
             skuCode="POLOMXXX000000FFFFFFLXXX"
             style={{ fontWeight: "bold" }}
-            loader={
-              <span style={{ color: "#bbb", fontSize: "0.8rem" }}>…</span>
-            }
+            loader={<span style={{ color: "#bbb", fontSize: "0.8rem" }}>…</span>}
           />
         </div>
       </div>
diff --git a/packages/document/src/stories/skus/SkuList.stories.tsx b/packages/document/src/stories/skus/SkuList.stories.tsx
index fae9a904..9555b38b 100644
--- a/packages/document/src/stories/skus/SkuList.stories.tsx
+++ b/packages/document/src/stories/skus/SkuList.stories.tsx
@@ -59,7 +59,7 @@ const meta = {
     params: {
       control: "object",
       description:
-        "Optional query parameters forwarded to the SKU list retrieval call. `include: [\"skus\"]` is always enforced. Use `fields.skus` to request additional SKU attributes.",
+        'Optional query parameters forwarded to the SKU list retrieval call. `include: ["skus"]` is always enforced. Use `fields.skus` to request additional SKU attributes.',
     },
     loader: {
       control: "text",
diff --git a/packages/document/src/stories/skus/SkuListsContainer.stories.tsx b/packages/document/src/stories/skus/SkuListsContainer.stories.tsx
index 0313dc4a..f4c41d93 100644
--- a/packages/document/src/stories/skus/SkuListsContainer.stories.tsx
+++ b/packages/document/src/stories/skus/SkuListsContainer.stories.tsx
@@ -89,7 +89,7 @@ const meta = {
     params: {
       control: "object",
       description:
-        "Optional query parameters forwarded to each SKU list retrieval call. `include: [\"skus\"]` is always enforced. Use `fields.skus` to request additional SKU attributes.",
+        'Optional query parameters forwarded to each SKU list retrieval call. `include: ["skus"]` is always enforced. Use `fields.skus` to request additional SKU attributes.',
     },
     children: {
       control: false,
diff --git a/packages/document/src/stories/skus/SkusField.stories.tsx b/packages/document/src/stories/skus/SkusField.stories.tsx
index 07393b03..961595e8 100644
--- a/packages/document/src/stories/skus/SkusField.stories.tsx
+++ b/packages/document/src/stories/skus/SkusField.stories.tsx
@@ -6,10 +6,7 @@ import CommerceLayer from "../_internals/CommerceLayer"
 
 function Wrapper({ children }: { children: ReactNode }): JSX.Element {
   return (
-    <CommerceLayer
-      accessToken="my-access-token"
-      endpoint="https://demo-store.commercelayer.io"
-    >
+    <CommerceLayer accessToken="my-access-token" endpoint="https://demo-store.commercelayer.io">
       <Sku skuCode="POLOMXXX000000FFFFFFLXXX">{children}</Sku>
     </CommerceLayer>
   )
@@ -20,25 +17,22 @@ function SkuFieldDocsPage(): JSX.Element {
     <>
       <h1>SkuField</h1>
       <p>
-        <code>{"<SkuField>"}</code> renders any attribute of the current SKU
-        provided by a parent <code>{"<Sku>"}</code> (or the deprecated{" "}
-        <code>{"<SkusContainer>"}</code>) context. Use the{" "}
-        <code>attribute</code> prop to select which field to display and{" "}
-        <code>tagElement</code> to choose the HTML tag (defaults to{" "}
-        <code>span</code>). When <code>{'tagElement="img"'}</code>, the value is
-        used as the <code>src</code> and standard <code>{"<img>"}</code> props (
+        <code>{"<SkuField>"}</code> renders any attribute of the current SKU provided by a parent{" "}
+        <code>{"<Sku>"}</code> (or the deprecated <code>{"<SkusContainer>"}</code>) context. Use the{" "}
+        <code>attribute</code> prop to select which field to display and <code>tagElement</code> to
+        choose the HTML tag (defaults to <code>span</code>). When <code>{'tagElement="img"'}</code>,
+        the value is used as the <code>src</code> and standard <code>{"<img>"}</code> props (
         <code>width</code>, <code>height</code>, etc.) are forwarded.
       </p>
       <span title="Usage" type="info">
         <p>
-          Must be a descendant of <code>{"<Sku>"}</code> or{" "}
-          <code>{"<SkusContainer>"}</code>. See the{" "}
+          Must be a descendant of <code>{"<Sku>"}</code> or <code>{"<SkusContainer>"}</code>. See
+          the{" "}
           <a href="https://docs.commercelayer.io/core/v/api-reference/skus/object">
             SKUs API object
           </a>{" "}
-          for all available attributes (e.g. <code>name</code>,{" "}
-          <code>description</code>, <code>image_url</code>, <code>code</code>,{" "}
-          <code>metadata</code>).
+          for all available attributes (e.g. <code>name</code>, <code>description</code>,{" "}
+          <code>image_url</code>, <code>code</code>, <code>metadata</code>).
         </p>
       </span>
       <ArgTypes />
@@ -60,25 +54,24 @@ import { CommerceLayer, Sku, SkuField } from '@commercelayer/react-components'
       <hr />
       <h2>Text attribute</h2>
       <p>
-        Any string attribute (e.g. <code>name</code>, <code>code</code>,{" "}
-        <code>description</code>) is rendered as the text content of the chosen
-        tag.
+        Any string attribute (e.g. <code>name</code>, <code>code</code>, <code>description</code>)
+        is rendered as the text content of the chosen tag.
       </p>
       <Canvas of={Default} />
       <hr />
       <h2>Image attribute</h2>
       <p>
-        Set <code>{'tagElement="img"'}</code> to render <code>image_url</code>{" "}
-        as an <code>{"<img>"}</code> element. Pass standard image props like{" "}
-        <code>width</code> and <code>height</code> directly.
+        Set <code>{'tagElement="img"'}</code> to render <code>image_url</code> as an{" "}
+        <code>{"<img>"}</code> element. Pass standard image props like <code>width</code> and{" "}
+        <code>height</code> directly.
       </p>
       <Canvas of={SkuImageAsImgTag} />
       <hr />
       <h2>Children render prop</h2>
       <p>
-        Pass a function as <code>children</code> to receive the raw attribute
-        value and apply your own rendering logic — useful for complex types like{" "}
-        <code>metadata</code> (JSON objects or arrays).
+        Pass a function as <code>children</code> to receive the raw attribute value and apply your
+        own rendering logic — useful for complex types like <code>metadata</code> (JSON objects or
+        arrays).
       </p>
       <Canvas of={ChildrenProps} />
     </>
@@ -103,8 +96,7 @@ const meta = {
     tagElement: {
       control: "select",
       options: ["div", "p", "span", "img", "section"],
-      description:
-        "HTML tag to render. When set to `img`, the value fills the `src` attribute.",
+      description: "HTML tag to render. When set to `img`, the value fills the `src` attribute.",
     },
   },
 } satisfies Meta<typeof SkuField>
@@ -146,16 +138,11 @@ export const SkuImageAsImgTag: Story = {
 export const ChildrenProps: Story = {
   name: "SkuField — children render prop",
   render: () => (
-    <CommerceLayer
-      accessToken="my-access-token"
-      endpoint="https://demo-store.commercelayer.io"
-    >
+    <CommerceLayer accessToken="my-access-token" endpoint="https://demo-store.commercelayer.io">
       <Sku skuCode="5PANECAP9D9CA1FFFFFFXXXX">
         <SkuField attribute="metadata" tagElement="div">
           {(childrenProps: any) => (
-            <pre style={{ fontSize: "0.75rem" }}>
-              {JSON.stringify(childrenProps, null, 2)}
-            </pre>
+            <pre style={{ fontSize: "0.75rem" }}>{JSON.stringify(childrenProps, null, 2)}</pre>
           )}
         </SkuField>
       </Sku>
diff --git a/packages/document/src/stories/skus/skus.stories.tsx b/packages/document/src/stories/skus/skus.stories.tsx
index 56f13ec2..b02882f6 100644
--- a/packages/document/src/stories/skus/skus.stories.tsx
+++ b/packages/document/src/stories/skus/skus.stories.tsx
@@ -13,8 +13,8 @@ function SkusDocsPage(): JSX.Element {
       </p>
       <span title="Usage" type="info">
         <p>
-          Must be a direct child of <code>{"<SkuList>"}</code>. Accepts{" "}
-          <code>{"<SkuField>"}</code> as children.
+          Must be a direct child of <code>{"<SkuList>"}</code>. Accepts <code>{"<SkuField>"}</code>{" "}
+          as children.
         </p>
       </span>
       <ArgTypes />
diff --git a/packages/document/src/vite-env.d.ts b/packages/document/src/vite-env.d.ts
index 8a946cb0..5a88bb69 100644
--- a/packages/document/src/vite-env.d.ts
+++ b/packages/document/src/vite-env.d.ts
@@ -4,7 +4,7 @@ export {}
 
 // Allow `type` on any HTML element — used as CSS hooks for callout spans
 // (e.g. <span type="warning"> / <span type="info">) in story docs pages.
-declare module 'react' {
+declare module "react" {
   interface HTMLAttributes<T> {
     type?: string
   }
diff --git a/packages/document/tsconfig.app.json b/packages/document/tsconfig.app.json
index 8880ba6d..b4003cfc 100644
--- a/packages/document/tsconfig.app.json
+++ b/packages/document/tsconfig.app.json
@@ -22,9 +22,7 @@
     "noFallthroughCasesInSwitch": true,
     "noUncheckedSideEffectImports": true,
     "paths": {
-      "@commercelayer/react-components": [
-        "../react-components/src/index.ts"
-      ]
+      "@commercelayer/react-components": ["../react-components/src/index.ts"]
     }
   },
   "include": ["src", ".storybook/**/*"]
diff --git a/packages/document/tsconfig.json b/packages/document/tsconfig.json
index 1ffef600..d32ff682 100644
--- a/packages/document/tsconfig.json
+++ b/packages/document/tsconfig.json
@@ -1,7 +1,4 @@
 {
   "files": [],
-  "references": [
-    { "path": "./tsconfig.app.json" },
-    { "path": "./tsconfig.node.json" }
-  ]
+  "references": [{ "path": "./tsconfig.app.json" }, { "path": "./tsconfig.node.json" }]
 }
diff --git a/packages/document/vite.config.ts b/packages/document/vite.config.ts
index 8b0f57b9..afe0e3d8 100644
--- a/packages/document/vite.config.ts
+++ b/packages/document/vite.config.ts
@@ -1,5 +1,5 @@
-import { defineConfig } from 'vite'
-import react from '@vitejs/plugin-react'
+import { defineConfig } from "vite"
+import react from "@vitejs/plugin-react"
 
 // https://vite.dev/config/
 export default defineConfig({
diff --git a/packages/hooks/src/availability/useAvailability.interceptors.test.ts b/packages/hooks/src/availability/useAvailability.interceptors.test.ts
index 603f9a3a..817dad62 100644
--- a/packages/hooks/src/availability/useAvailability.interceptors.test.ts
+++ b/packages/hooks/src/availability/useAvailability.interceptors.test.ts
@@ -30,19 +30,16 @@ describe("useAvailability — interceptors", () => {
   })
 
   it("passes interceptors to getSkuAvailability via fetchAvailability", async () => {
-    const { result } = renderHook(
-      () => useAvailability(accessToken, interceptors),
-      { wrapper: ({ children }) => swrWrapper({ children }) },
-    )
+    const { result } = renderHook(() => useAvailability(accessToken, interceptors), {
+      wrapper: ({ children }) => swrWrapper({ children }),
+    })
 
     act(() => {
       result.current.fetchAvailability({ skuCode: "MY-SKU" })
     })
 
     await waitFor(() => {
-      expect(mockGetSkuAvailability).toHaveBeenCalledWith(
-        expect.objectContaining({ interceptors }),
-      )
+      expect(mockGetSkuAvailability).toHaveBeenCalledWith(expect.objectContaining({ interceptors }))
     })
   })
 
@@ -56,9 +53,7 @@ describe("useAvailability — interceptors", () => {
     })
 
     await waitFor(() => {
-      expect(mockGetSkuAvailability).toHaveBeenCalledWith(
-        expect.objectContaining({ accessToken }),
-      )
+      expect(mockGetSkuAvailability).toHaveBeenCalledWith(expect.objectContaining({ accessToken }))
     })
   })
 })
diff --git a/packages/hooks/src/availability/useAvailability.test.ts b/packages/hooks/src/availability/useAvailability.test.ts
index e1466320..28a959af 100644
--- a/packages/hooks/src/availability/useAvailability.test.ts
+++ b/packages/hooks/src/availability/useAvailability.test.ts
@@ -61,9 +61,7 @@ describe("useAvailability", () => {
     expect(result.current.availability?.quantity).toBe(5)
     expect(result.current.availability?.skuCode).toBe(SKU_CODE)
     expect(result.current.error).toBeNull()
-    expect(mock).toHaveBeenCalledWith(
-      expect.objectContaining({ skuCode: SKU_CODE }),
-    )
+    expect(mock).toHaveBeenCalledWith(expect.objectContaining({ skuCode: SKU_CODE }))
   })
 
   it("should clear availability after fetch", async () => {
@@ -126,7 +124,7 @@ describe("useAvailability", () => {
     mock.mockReturnValueOnce(
       new Promise<typeof mockAvailability>((res) => {
         resolve = res
-      }),
+      })
     )
 
     const { result } = renderHook(() => useAvailability("test-token"), {
diff --git a/packages/hooks/src/availability/useAvailability.ts b/packages/hooks/src/availability/useAvailability.ts
index d39a552d..38a87f42 100644
--- a/packages/hooks/src/availability/useAvailability.ts
+++ b/packages/hooks/src/availability/useAvailability.ts
@@ -25,39 +25,35 @@ interface UseAvailabilityReturn {
  */
 export function useAvailability(
   accessToken: string,
-  interceptors?: InterceptorManager,
+  interceptors?: InterceptorManager
 ): UseAvailabilityReturn {
   const [fetchParams, setFetchParams] = useState<{
     skuCode?: string
     skuId?: string
   } | null>(null)
 
-  const { data, error, isLoading, isValidating, mutate } =
-    useSWR<SkuAvailability | null>(
-      fetchParams && accessToken
-        ? ["availability", accessToken, fetchParams.skuCode, fetchParams.skuId]
-        : null,
-      async (): Promise<SkuAvailability | null> => {
-        return await getSkuAvailability({
-          accessToken,
-          skuCode: fetchParams?.skuCode,
-          skuId: fetchParams?.skuId,
-          interceptors,
-        })
-      },
-      {
-        revalidateOnFocus: false,
-        revalidateOnReconnect: false,
-      },
-    )
-
-  const fetchAvailability = useCallback(
-    (params: { skuCode?: string; skuId?: string }) => {
-      setFetchParams(params)
+  const { data, error, isLoading, isValidating, mutate } = useSWR<SkuAvailability | null>(
+    fetchParams && accessToken
+      ? ["availability", accessToken, fetchParams.skuCode, fetchParams.skuId]
+      : null,
+    async (): Promise<SkuAvailability | null> => {
+      return await getSkuAvailability({
+        accessToken,
+        skuCode: fetchParams?.skuCode,
+        skuId: fetchParams?.skuId,
+        interceptors,
+      })
     },
-    [],
+    {
+      revalidateOnFocus: false,
+      revalidateOnReconnect: false,
+    }
   )
 
+  const fetchAvailability = useCallback((params: { skuCode?: string; skuId?: string }) => {
+    setFetchParams(params)
+  }, [])
+
   const clearAvailability = useCallback(() => {
     setFetchParams(null)
     // c8 ignore start
diff --git a/packages/hooks/src/orders/useOrder.ts b/packages/hooks/src/orders/useOrder.ts
index a358e980..60796ba1 100644
--- a/packages/hooks/src/orders/useOrder.ts
+++ b/packages/hooks/src/orders/useOrder.ts
@@ -24,10 +24,7 @@ interface UseOrderReturn {
     metadata?: BaseMetadataObject
     attributes?: Omit<OrderCreate, "id">
   }) => Promise<Order | undefined>
-  updateOrder: (
-    id: string,
-    attributes: Omit<OrderUpdate, "id">,
-  ) => Promise<Order | undefined>
+  updateOrder: (id: string, attributes: Omit<OrderUpdate, "id">) => Promise<Order | undefined>
   reloadOrder: () => Promise<Order | undefined>
   mutate: KeyedMutator<Order>
 }
@@ -50,15 +47,10 @@ interface UseOrderReturn {
  * })
  * ```
  */
-export function useOrder({
-  accessToken,
-  orderId,
-  interceptors,
-}: UseOrderParams): UseOrderReturn {
+export function useOrder({ accessToken, orderId, interceptors }: UseOrderParams): UseOrderReturn {
   const [isCreating, setIsCreating] = useState(false)
 
-  const swrKey =
-    accessToken && orderId ? ["order", "retrieve", accessToken, orderId] : null
+  const swrKey = accessToken && orderId ? ["order", "retrieve", accessToken, orderId] : null
 
   const { data, error, isLoading, isValidating, mutate } = useSWR<Order>(
     swrKey,
@@ -66,7 +58,7 @@ export function useOrder({
       if (!orderId) throw new Error("orderId is required")
       return retrieveOrder({ accessToken, interceptors, id: orderId })
     },
-    { revalidateOnFocus: false, revalidateOnReconnect: false },
+    { revalidateOnFocus: false, revalidateOnReconnect: false }
   )
 
   const createOrder = useCallback(
@@ -86,14 +78,11 @@ export function useOrder({
         setIsCreating(false)
       }
     },
-    [accessToken, interceptors],
+    [accessToken, interceptors]
   )
 
   const updateOrder = useCallback(
-    async (
-      id: string,
-      attributes: Omit<OrderUpdate, "id">,
-    ): Promise<Order | undefined> => {
+    async (id: string, attributes: Omit<OrderUpdate, "id">): Promise<Order | undefined> => {
       const updated = await coreUpdateOrder({
         accessToken,
         interceptors,
@@ -103,7 +92,7 @@ export function useOrder({
       await mutate(updated, { revalidate: false })
       return updated
     },
-    [accessToken, interceptors, mutate],
+    [accessToken, interceptors, mutate]
   )
 
   const reloadOrder = useCallback(async (): Promise<Order | undefined> => {
diff --git a/packages/hooks/src/prices/pricesBatchStore.test.ts b/packages/hooks/src/prices/pricesBatchStore.test.ts
index 930761d2..366d7257 100644
--- a/packages/hooks/src/prices/pricesBatchStore.test.ts
+++ b/packages/hooks/src/prices/pricesBatchStore.test.ts
@@ -2,13 +2,7 @@
  * @vitest-environment jsdom
  */
 import { afterEach, describe, expect, it, vi } from "vitest"
-import {
-  EMPTY,
-  getSnapshot,
-  registerSku,
-  subscribe,
-  unregisterSku,
-} from "./pricesBatchStore"
+import { EMPTY, getSnapshot, registerSku, subscribe, unregisterSku } from "./pricesBatchStore"
 
 describe("pricesBatchStore", () => {
   afterEach(() => {
diff --git a/packages/hooks/src/prices/usePrices.interceptors.test.ts b/packages/hooks/src/prices/usePrices.interceptors.test.ts
index cdcfaefd..a3fbde3a 100644
--- a/packages/hooks/src/prices/usePrices.interceptors.test.ts
+++ b/packages/hooks/src/prices/usePrices.interceptors.test.ts
@@ -16,9 +16,7 @@ const mockPrices = [{ id: "price_1", amount_cents: 1000 }]
 
 const mockGetPrices = vi.fn().mockResolvedValue(mockPrices)
 const mockRetrievePrice = vi.fn().mockResolvedValue(mockPrices[0])
-const mockUpdatePrice = vi
-  .fn()
-  .mockResolvedValue({ ...mockPrices[0], amount_cents: 2000 })
+const mockUpdatePrice = vi.fn().mockResolvedValue({ ...mockPrices[0], amount_cents: 2000 })
 
 vi.mock("@commercelayer/core", async (importOriginal) => {
   const actual = await importOriginal<typeof import("@commercelayer/core")>()
@@ -52,9 +50,7 @@ describe("usePrices — interceptors", () => {
     })
 
     await waitFor(() => {
-      expect(mockGetPrices).toHaveBeenCalledWith(
-        expect.objectContaining({ interceptors }),
-      )
+      expect(mockGetPrices).toHaveBeenCalledWith(expect.objectContaining({ interceptors }))
     })
   })
 
@@ -67,9 +63,7 @@ describe("usePrices — interceptors", () => {
       await result.current.retrievePrice("price_1")
     })
 
-    expect(mockRetrievePrice).toHaveBeenCalledWith(
-      expect.objectContaining({ interceptors }),
-    )
+    expect(mockRetrievePrice).toHaveBeenCalledWith(expect.objectContaining({ interceptors }))
   })
 
   it("passes interceptors to updatePrice", async () => {
@@ -81,9 +75,7 @@ describe("usePrices — interceptors", () => {
       await result.current.updatePrice({ id: "price_1", amount_cents: 2000 })
     })
 
-    expect(mockUpdatePrice).toHaveBeenCalledWith(
-      expect.objectContaining({ interceptors }),
-    )
+    expect(mockUpdatePrice).toHaveBeenCalledWith(expect.objectContaining({ interceptors }))
   })
 
   it("works without interceptors", async () => {
@@ -96,9 +88,7 @@ describe("usePrices — interceptors", () => {
     })
 
     await waitFor(() => {
-      expect(mockGetPrices).toHaveBeenCalledWith(
-        expect.objectContaining({ accessToken }),
-      )
+      expect(mockGetPrices).toHaveBeenCalledWith(expect.objectContaining({ accessToken }))
     })
   })
 })
diff --git a/packages/hooks/src/prices/usePrices.test.ts b/packages/hooks/src/prices/usePrices.test.ts
index eacb1712..e61681e2 100644
--- a/packages/hooks/src/prices/usePrices.test.ts
+++ b/packages/hooks/src/prices/usePrices.test.ts
@@ -115,7 +115,7 @@ describe("usePrices", () => {
         expect(result.current.prices.length).toBeGreaterThan(0)
         expect(result.current.error).toBeNull()
       })
-    },
+    }
   )
 
   coreTest("should handle errors gracefully", async () => {
@@ -131,7 +131,7 @@ describe("usePrices", () => {
         expect(result.current.error).toBeDefined()
         expect(result.current.prices).toEqual([])
       },
-      { timeout: 5000 },
+      { timeout: 5000 }
     )
   })
 
@@ -171,7 +171,7 @@ describe("usePrices", () => {
       () => {
         expect(result.current.error).toBeDefined()
       },
-      { timeout: 5000 },
+      { timeout: 5000 }
     )
 
     // Clear the error
@@ -214,7 +214,7 @@ describe("usePrices", () => {
       () => {
         expect(result.current.error).toBeDefined()
       },
-      { timeout: 5000 },
+      { timeout: 5000 }
     )
 
     const errorMessage = result.current.error
@@ -288,80 +288,66 @@ describe("usePrices", () => {
     })
   })
 
-  coreTest(
-    "should throw error when retrieving price with empty ID",
-    async ({ accessToken }) => {
-      const token = accessToken?.accessToken
-      const { result } = renderHook(() => usePrices(token), {
-        wrapper: swrWrapper,
+  coreTest("should throw error when retrieving price with empty ID", async ({ accessToken }) => {
+    const token = accessToken?.accessToken
+    const { result } = renderHook(() => usePrices(token), {
+      wrapper: swrWrapper,
+    })
+
+    await expect(
+      act(async () => {
+        await result.current.retrievePrice("")
       })
+    ).rejects.toThrow("Price ID is required for retrieve")
+  })
 
-      await expect(
-        act(async () => {
-          await result.current.retrievePrice("")
-        }),
-      ).rejects.toThrow("Price ID is required for retrieve")
-    },
-  )
+  coreTest("should throw error when updating price without an ID", async ({ accessToken }) => {
+    const token = accessToken?.accessToken
+    const { result } = renderHook(() => usePrices(token), {
+      wrapper: swrWrapper,
+    })
 
-  coreTest(
-    "should throw error when updating price without an ID",
-    async ({ accessToken }) => {
-      const token = accessToken?.accessToken
-      const { result } = renderHook(() => usePrices(token), {
-        wrapper: swrWrapper,
+    await expect(
+      act(async () => {
+        await result.current.updatePrice({} as Parameters<typeof result.current.updatePrice>[0])
       })
+    ).rejects.toThrow("Price resource ID is required for update")
+  })
 
-      await expect(
-        act(async () => {
-          await result.current.updatePrice(
-            {} as Parameters<typeof result.current.updatePrice>[0],
-          )
-        }),
-      ).rejects.toThrow("Price resource ID is required for update")
-    },
-  )
-
-  coreTest(
-    "should batch-fetch prices via registerSku",
-    async ({ accessToken }) => {
-      const token = accessToken?.accessToken
-      const { result } = renderHook(() => usePrices(token))
+  coreTest("should batch-fetch prices via registerSku", async ({ accessToken }) => {
+    const token = accessToken?.accessToken
+    const { result } = renderHook(() => usePrices(token))
 
-      act(() => {
-        result.current.registerSku("DIGITALPRODUCT")
-      })
+    act(() => {
+      result.current.registerSku("DIGITALPRODUCT")
+    })
 
-      await waitFor(
-        () => {
-          expect(result.current.prices.length).toBeGreaterThan(0)
-          expect(result.current.action).toBe("get")
-        },
-        { timeout: 10000 },
-      )
-    },
-  )
+    await waitFor(
+      () => {
+        expect(result.current.prices.length).toBeGreaterThan(0)
+        expect(result.current.action).toBe("get")
+      },
+      { timeout: 10000 }
+    )
+  })
 
-  coreTest(
-    "should ignore duplicate registerSku calls (idempotent)",
-    async ({ accessToken }) => {
-      const token = accessToken?.accessToken
-      const { result } = renderHook(() => usePrices(token))
+  coreTest("should ignore duplicate registerSku calls (idempotent)", async ({ accessToken }) => {
+    const token = accessToken?.accessToken
+    const { result } = renderHook(() => usePrices(token))
 
-      act(() => {
-        result.current.registerSku("DIGITALPRODUCT")
-        result.current.registerSku("DIGITALPRODUCT") // duplicate — no-op
-      })
+    act(() => {
+      result.current.registerSku("DIGITALPRODUCT")
+      result.current.registerSku("DIGITALPRODUCT") // duplicate — no-op
+    })
 
-      await waitFor(
-        () => {
-          expect(result.current.prices).toBeDefined()
-          expect(result.current.error).toBeNull()
-        },
-        { timeout: 10000 },
-      )
-    },
-  )
+    await waitFor(
+      () => {
+        expect(result.current.prices).toBeDefined()
+        expect(result.current.error).toBeNull()
+      },
+      { timeout: 10000 }
+    )
+  })
 
   coreTest(
     "should cancel pending debounce when a second registerSku fires",
@@ -382,39 +368,36 @@ describe("usePrices", () => {
           expect(result.current.prices).toBeDefined()
           expect(result.current.error).toBeNull()
         },
-        { timeout: 10000 },
+        { timeout: 10000 }
       )
-    },
+    }
   )
 
-  coreTest(
-    "should unregisterSku remove a registered code",
-    async ({ accessToken }) => {
-      const token = accessToken?.accessToken
-      const { result } = renderHook(() => usePrices(token))
+  coreTest("should unregisterSku remove a registered code", async ({ accessToken }) => {
+    const token = accessToken?.accessToken
+    const { result } = renderHook(() => usePrices(token))
 
-      act(() => {
-        result.current.registerSku("DIGITALPRODUCT")
-      })
+    act(() => {
+      result.current.registerSku("DIGITALPRODUCT")
+    })
 
-      await waitFor(
-        () => {
-          expect(result.current.prices.length).toBeGreaterThan(0)
-        },
-        { timeout: 10000 },
-      )
+    await waitFor(
+      () => {
+        expect(result.current.prices.length).toBeGreaterThan(0)
+      },
+      { timeout: 10000 }
+    )
 
-      // unregister existing code
-      act(() => {
-        result.current.unregisterSku("DIGITALPRODUCT")
-      })
+    // unregister existing code
+    act(() => {
+      result.current.unregisterSku("DIGITALPRODUCT")
+    })
 
-      // unregister non-existent code — no-op branch
-      act(() => {
-        result.current.unregisterSku("NON-EXISTENT-SKU")
-      })
-    },
-  )
+    // unregister non-existent code — no-op branch
+    act(() => {
+      result.current.unregisterSku("NON-EXISTENT-SKU")
+    })
+  })
 
   coreTest("should not fetch when accessToken is empty", async () => {
     const { result } = renderHook(() => usePrices(""))
@@ -429,7 +412,7 @@ describe("usePrices", () => {
         expect(result.current.prices).toEqual([])
         expect(result.current.action).toBeNull()
       },
-      { timeout: 500 },
+      { timeout: 500 }
     )
   })
 
@@ -468,6 +451,6 @@ describe("usePrices", () => {
 
       expect(updatedPrice).toBeDefined()
       expect(updatedPrice?.id).toBe(priceId)
-    },
+    }
   )
 })
diff --git a/packages/hooks/src/prices/usePrices.ts b/packages/hooks/src/prices/usePrices.ts
index 4c74979c..9004798a 100644
--- a/packages/hooks/src/prices/usePrices.ts
+++ b/packages/hooks/src/prices/usePrices.ts
@@ -51,12 +51,8 @@ type UseAction = "get" | "retrieve" | "update" | null
  * @param interceptors - Optional SDK interceptors for request/response customization
  * @returns Object containing prices data, loading states, and action methods
  */
-export function usePrices(
-  accessToken: string,
-  interceptors?: InterceptorManager,
-): UsePricesReturn {
-  const [fetchParams, setFetchParams] =
-    useState<Parameters<typeof getPrices>[0]["params"]>()
+export function usePrices(accessToken: string, interceptors?: InterceptorManager): UsePricesReturn {
+  const [fetchParams, setFetchParams] = useState<Parameters<typeof getPrices>[0]["params"]>()
   const [shouldFetch, setShouldFetch] = useState(false)
   const [action, setAction] = useState<UseAction>(null)
 
@@ -64,36 +60,27 @@ export function usePrices(
   // All usePrices instances with the same token share the same store entry.
   const stableSubscribe = useCallback(
     (listener: () => void) => subscribe(accessToken, listener),
-    [accessToken],
-  )
-  const stableSnapshot = useCallback(
-    () => getSnapshot(accessToken),
-    [accessToken],
+    [accessToken]
   )
+  const stableSnapshot = useCallback(() => getSnapshot(accessToken), [accessToken])
   const skuCodesList = useSyncExternalStore(
     stableSubscribe,
     stableSnapshot,
     // c8 ignore next — server snapshot only used during SSR hydration
-    () => EMPTY,
+    () => EMPTY
   )
 
   const { data, error, isLoading, isValidating, mutate } = useSWR<Price[]>(
-    shouldFetch && accessToken
-      ? ["prices", "get", accessToken, fetchParams]
-      : null,
-    async (): Promise<Price[]> =>
-      getPrices({ accessToken, params: fetchParams, interceptors }),
-    { revalidateOnFocus: false, revalidateOnReconnect: false },
+    shouldFetch && accessToken ? ["prices", "get", accessToken, fetchParams] : null,
+    async (): Promise<Price[]> => getPrices({ accessToken, params: fetchParams, interceptors }),
+    { revalidateOnFocus: false, revalidateOnReconnect: false }
   )
 
-  const fetchPrices = useCallback(
-    (newParams?: Parameters<typeof getPrices>[0]["params"]) => {
-      setFetchParams(newParams)
-      setShouldFetch(true)
-      setAction("get")
-    },
-    [],
-  )
+  const fetchPrices = useCallback((newParams?: Parameters<typeof getPrices>[0]["params"]) => {
+    setFetchParams(newParams)
+    setShouldFetch(true)
+    setAction("get")
+  }, [])
 
   // Auto-fetch whenever the batch store snapshot changes (new SKU codes registered).
   // All instances with the same token call fetchPrices with the same params —
@@ -106,12 +93,12 @@ export function usePrices(
 
   const registerSku = useCallback(
     (code: string) => storeRegisterSku(accessToken, code),
-    [accessToken],
+    [accessToken]
   )
 
   const unregisterSku = useCallback(
     (code: string) => storeUnregisterSku(accessToken, code),
-    [accessToken],
+    [accessToken]
   )
 
   const handleRetrievePrice = useCallback(
@@ -120,25 +107,21 @@ export function usePrices(
       setAction("retrieve")
       return retrievePrice({ accessToken, id, interceptors })
     },
-    [accessToken, interceptors],
+    [accessToken, interceptors]
   )
 
   const handleUpdatePrice = useCallback(
     async (resource: PriceUpdate): Promise<Price | undefined> => {
-      if (!resource?.id)
-        throw new Error("Price resource ID is required for update")
+      if (!resource?.id) throw new Error("Price resource ID is required for update")
       setAction("update")
       const result = await updatePrice({ accessToken, resource, interceptors })
       await mutate(
-        (current) =>
-          current?.map((p: Price) => (p.id === result.id ? result : p)) ?? [
-            result,
-          ],
-        { revalidate: false },
+        (current) => current?.map((p: Price) => (p.id === result.id ? result : p)) ?? [result],
+        { revalidate: false }
       )
       return result
     },
-    [accessToken, mutate, interceptors],
+    [accessToken, mutate, interceptors]
   )
 
   const clearPrices = useCallback(() => {
diff --git a/packages/hooks/src/sku_lists/useSkuList.ts b/packages/hooks/src/sku_lists/useSkuList.ts
index 8e993c35..bda386c2 100644
--- a/packages/hooks/src/sku_lists/useSkuList.ts
+++ b/packages/hooks/src/sku_lists/useSkuList.ts
@@ -19,17 +19,15 @@ export function useSkuList(
   id: string,
   accessToken: string,
   interceptors?: InterceptorManager,
-  params?: QueryParamsRetrieve<SkuList>,
+  params?: QueryParamsRetrieve<SkuList>
 ): UseSkuListReturn {
   const { data, isLoading } = useSWR<SkuList>(
-    id && accessToken
-      ? ["sku_list", "retrieve", id, accessToken, params]
-      : null,
+    id && accessToken ? ["sku_list", "retrieve", id, accessToken, params] : null,
     async () => coreRetrieveSkuList({ accessToken, id, params, interceptors }),
     {
       revalidateOnFocus: false,
       revalidateOnReconnect: false,
-    },
+    }
   )
 
   return { skuList: data, isLoading }
diff --git a/packages/hooks/src/sku_lists/useSkuLists.interceptors.test.ts b/packages/hooks/src/sku_lists/useSkuLists.interceptors.test.ts
index 5643262d..d6e61374 100644
--- a/packages/hooks/src/sku_lists/useSkuLists.interceptors.test.ts
+++ b/packages/hooks/src/sku_lists/useSkuLists.interceptors.test.ts
@@ -33,35 +33,29 @@ describe("useSkuLists — interceptors", () => {
   })
 
   it("passes interceptors to getSkuLists", async () => {
-    const { result } = renderHook(
-      () => useSkuLists(accessToken, interceptors),
-      { wrapper: ({ children }) => swrWrapper({ children }) },
-    )
+    const { result } = renderHook(() => useSkuLists(accessToken, interceptors), {
+      wrapper: ({ children }) => swrWrapper({ children }),
+    })
 
     act(() => {
       result.current.fetchSkuLists()
     })
 
     await waitFor(() => {
-      expect(mockGetSkuLists).toHaveBeenCalledWith(
-        expect.objectContaining({ interceptors }),
-      )
+      expect(mockGetSkuLists).toHaveBeenCalledWith(expect.objectContaining({ interceptors }))
     })
   })
 
   it("passes interceptors to retrieveSkuList", async () => {
-    const { result } = renderHook(
-      () => useSkuLists(accessToken, interceptors),
-      { wrapper: ({ children }) => swrWrapper({ children }) },
-    )
+    const { result } = renderHook(() => useSkuLists(accessToken, interceptors), {
+      wrapper: ({ children }) => swrWrapper({ children }),
+    })
 
     await act(async () => {
       await result.current.retrieveSkuList("list_1")
     })
 
-    expect(mockRetrieveSkuList).toHaveBeenCalledWith(
-      expect.objectContaining({ interceptors }),
-    )
+    expect(mockRetrieveSkuList).toHaveBeenCalledWith(expect.objectContaining({ interceptors }))
   })
 
   it("works without interceptors", async () => {
@@ -74,17 +68,14 @@ describe("useSkuLists — interceptors", () => {
     })
 
     await waitFor(() => {
-      expect(mockGetSkuLists).toHaveBeenCalledWith(
-        expect.objectContaining({ accessToken }),
-      )
+      expect(mockGetSkuLists).toHaveBeenCalledWith(expect.objectContaining({ accessToken }))
     })
   })
 
   it("clearSkuLists resets fetch state and clears cached data", async () => {
-    const { result } = renderHook(
-      () => useSkuLists(accessToken, interceptors),
-      { wrapper: ({ children }) => swrWrapper({ children }) },
-    )
+    const { result } = renderHook(() => useSkuLists(accessToken, interceptors), {
+      wrapper: ({ children }) => swrWrapper({ children }),
+    })
 
     act(() => {
       result.current.fetchSkuLists()
@@ -104,15 +95,14 @@ describe("useSkuLists — interceptors", () => {
   })
 
   it("throws when retrieveSkuList is called with an empty id", async () => {
-    const { result } = renderHook(
-      () => useSkuLists(accessToken, interceptors),
-      { wrapper: ({ children }) => swrWrapper({ children }) },
-    )
+    const { result } = renderHook(() => useSkuLists(accessToken, interceptors), {
+      wrapper: ({ children }) => swrWrapper({ children }),
+    })
 
     await expect(
       act(async () => {
         await result.current.retrieveSkuList("")
-      }),
+      })
     ).rejects.toThrow("SKU list ID is required for retrieve")
   })
 })
diff --git a/packages/hooks/src/sku_lists/useSkuLists.ts b/packages/hooks/src/sku_lists/useSkuLists.ts
index 275446ec..961f2b2d 100644
--- a/packages/hooks/src/sku_lists/useSkuLists.ts
+++ b/packages/hooks/src/sku_lists/useSkuLists.ts
@@ -16,7 +16,7 @@ interface UseSkuListsReturn {
   fetchSkuLists: (params?: QueryParamsList<SkuList>) => void
   retrieveSkuList: (
     id: string,
-    params?: QueryParamsRetrieve<SkuList>,
+    params?: QueryParamsRetrieve<SkuList>
   ) => Promise<SkuList | undefined>
   clearSkuLists: () => void
   mutate: KeyedMutator<SkuList[]>
@@ -31,15 +31,13 @@ interface UseSkuListsReturn {
  */
 export function useSkuLists(
   accessToken: string,
-  interceptors?: InterceptorManager,
+  interceptors?: InterceptorManager
 ): UseSkuListsReturn {
   const [params, setParams] = useState<QueryParamsList<SkuList>>()
   const [shouldFetch, setShouldFetch] = useState(false)
 
   const { data, error, isLoading, isValidating, mutate } = useSWR<SkuList[]>(
-    shouldFetch && accessToken
-      ? ["sku_lists", "get", accessToken, params]
-      : null,
+    shouldFetch && accessToken ? ["sku_lists", "get", accessToken, params] : null,
     async (): Promise<SkuList[]> => {
       const result = await getSkuLists({ accessToken, params, interceptors })
       return result
@@ -47,7 +45,7 @@ export function useSkuLists(
     {
       revalidateOnFocus: false,
       revalidateOnReconnect: false,
-    },
+    }
   )
 
   const fetchSkuLists = useCallback((newParams?: QueryParamsList<SkuList>) => {
@@ -56,14 +54,11 @@ export function useSkuLists(
   }, [])
 
   const handleRetrieveSkuList = useCallback(
-    async (
-      id: string,
-      params?: QueryParamsRetrieve<SkuList>,
-    ): Promise<SkuList | undefined> => {
+    async (id: string, params?: QueryParamsRetrieve<SkuList>): Promise<SkuList | undefined> => {
       if (!id) throw new Error("SKU list ID is required for retrieve")
       return await retrieveSkuList({ accessToken, id, params, interceptors })
     },
-    [accessToken, interceptors],
+    [accessToken, interceptors]
   )
 
   const clearSkuLists = useCallback(() => {
diff --git a/packages/hooks/src/skus/skusBatchStore.test.ts b/packages/hooks/src/skus/skusBatchStore.test.ts
index 1d936572..2d25aaa9 100644
--- a/packages/hooks/src/skus/skusBatchStore.test.ts
+++ b/packages/hooks/src/skus/skusBatchStore.test.ts
@@ -2,13 +2,7 @@
  * @vitest-environment jsdom
  */
 import { afterEach, describe, expect, it, vi } from "vitest"
-import {
-  EMPTY,
-  getSnapshot,
-  registerSku,
-  subscribe,
-  unregisterSku,
-} from "./skusBatchStore"
+import { EMPTY, getSnapshot, registerSku, subscribe, unregisterSku } from "./skusBatchStore"
 
 describe("skusBatchStore", () => {
   afterEach(() => {
diff --git a/packages/hooks/src/skus/useSkus.interceptors.test.ts b/packages/hooks/src/skus/useSkus.interceptors.test.ts
index e31559ff..0f1181d5 100644
--- a/packages/hooks/src/skus/useSkus.interceptors.test.ts
+++ b/packages/hooks/src/skus/useSkus.interceptors.test.ts
@@ -18,9 +18,7 @@ const mockSkus = [{ id: "sku_1", code: "TEST-SKU" }]
 
 const mockGetSkus = vi.fn().mockResolvedValue(mockSkus)
 const mockRetrieveSku = vi.fn().mockResolvedValue(mockSkus[0])
-const mockUpdateSku = vi
-  .fn()
-  .mockResolvedValue({ ...mockSkus[0], reference: "updated" })
+const mockUpdateSku = vi.fn().mockResolvedValue({ ...mockSkus[0], reference: "updated" })
 
 vi.mock("@commercelayer/core", async (importOriginal) => {
   const actual = await importOriginal<typeof import("@commercelayer/core")>()
@@ -54,9 +52,7 @@ describe("useSkus — interceptors", () => {
     })
 
     await waitFor(() => {
-      expect(mockGetSkus).toHaveBeenCalledWith(
-        expect.objectContaining({ interceptors }),
-      )
+      expect(mockGetSkus).toHaveBeenCalledWith(expect.objectContaining({ interceptors }))
     })
   })
 
@@ -69,9 +65,7 @@ describe("useSkus — interceptors", () => {
       await result.current.retrieveSku("sku_1")
     })
 
-    expect(mockRetrieveSku).toHaveBeenCalledWith(
-      expect.objectContaining({ interceptors }),
-    )
+    expect(mockRetrieveSku).toHaveBeenCalledWith(expect.objectContaining({ interceptors }))
   })
 
   it("passes interceptors to updateSku", async () => {
@@ -83,9 +77,7 @@ describe("useSkus — interceptors", () => {
       await result.current.updateSku({ id: "sku_1", reference: "new-ref" })
     })
 
-    expect(mockUpdateSku).toHaveBeenCalledWith(
-      expect.objectContaining({ interceptors }),
-    )
+    expect(mockUpdateSku).toHaveBeenCalledWith(expect.objectContaining({ interceptors }))
   })
 
   it("works without interceptors", async () => {
@@ -98,9 +90,7 @@ describe("useSkus — interceptors", () => {
     })
 
     await waitFor(() => {
-      expect(mockGetSkus).toHaveBeenCalledWith(
-        expect.objectContaining({ accessToken }),
-      )
+      expect(mockGetSkus).toHaveBeenCalledWith(expect.objectContaining({ accessToken }))
     })
   })
 
@@ -119,10 +109,7 @@ describe("useSkus — interceptors", () => {
 
     // Pre-populate cache with two SKUs via the bound mutate (same key)
     await act(async () => {
-      await result.current.mutate(
-        [...mockSkus, sku2] as unknown as Sku[],
-        false,
-      )
+      await result.current.mutate([...mockSkus, sku2] as unknown as Sku[], false)
     })
 
     await act(async () => {
diff --git a/packages/hooks/src/skus/useSkus.test.ts b/packages/hooks/src/skus/useSkus.test.ts
index d62f8b1a..c4648eea 100644
--- a/packages/hooks/src/skus/useSkus.test.ts
+++ b/packages/hooks/src/skus/useSkus.test.ts
@@ -13,59 +13,53 @@ const swrWrapper = ({ children }: { children: ReactNode }) =>
   createElement(SWRConfig, { value: { provider: () => new Map() } }, children)
 
 describe("useSkus", () => {
-  coreIntegrationTest(
-    "should return a list of SKUs",
-    async ({ accessToken }) => {
-      const token = accessToken?.accessToken
-      const { result } = renderHook(() => useSkus(token))
+  coreIntegrationTest("should return a list of SKUs", async ({ accessToken }) => {
+    const token = accessToken?.accessToken
+    const { result } = renderHook(() => useSkus(token))
 
-      expect(result.current.skus).toEqual([])
-      expect(result.current.isLoading).toBe(false)
-      expect(result.current.action).toBeNull()
+    expect(result.current.skus).toEqual([])
+    expect(result.current.isLoading).toBe(false)
+    expect(result.current.action).toBeNull()
 
-      act(() => {
-        result.current.fetchSkus()
-      })
+    act(() => {
+      result.current.fetchSkus()
+    })
 
-      await waitFor(() => {
-        expect(result.current.skus.length).toBeGreaterThan(0)
-        expect(result.current.error).toBeNull()
-        expect(result.current.action).toBe("get")
-      })
-    },
-  )
+    await waitFor(() => {
+      expect(result.current.skus.length).toBeGreaterThan(0)
+      expect(result.current.error).toBeNull()
+      expect(result.current.action).toBe("get")
+    })
+  })
 
-  coreIntegrationTest(
-    "should retrieve a single SKU",
-    async ({ accessToken }) => {
-      const token = accessToken?.accessToken
-      const { result } = renderHook(() => useSkus(token))
+  coreIntegrationTest("should retrieve a single SKU", async ({ accessToken }) => {
+    const token = accessToken?.accessToken
+    const { result } = renderHook(() => useSkus(token))
 
-      act(() => {
-        result.current.fetchSkus()
-      })
+    act(() => {
+      result.current.fetchSkus()
+    })
 
-      await waitFor(() => {
-        expect(result.current.skus.length).toBeGreaterThan(0)
-      })
+    await waitFor(() => {
+      expect(result.current.skus.length).toBeGreaterThan(0)
+    })
 
-      const testSkuId = result.current.skus[0]?.id
-      if (!testSkuId) {
-        throw new Error("No SKU available to retrieve")
-      }
+    const testSkuId = result.current.skus[0]?.id
+    if (!testSkuId) {
+      throw new Error("No SKU available to retrieve")
+    }
 
-      let retrievedSku: Awaited<ReturnType<typeof result.current.retrieveSku>>
-      await act(async () => {
-        retrievedSku = await result.current.retrieveSku(testSkuId)
-      })
+    let retrievedSku: Awaited<ReturnType<typeof result.current.retrieveSku>>
+    await act(async () => {
+      retrievedSku = await result.current.retrieveSku(testSkuId)
+    })
 
-      await waitFor(() => {
-        expect(result.current.action).toBe("retrieve")
-        expect(retrievedSku).toBeDefined()
-        expect(retrievedSku?.id).toBe(testSkuId)
-      })
-    },
-  )
+    await waitFor(() => {
+      expect(result.current.action).toBe("retrieve")
+      expect(retrievedSku).toBeDefined()
+      expect(retrievedSku?.id).toBe(testSkuId)
+    })
+  })
 
   coreIntegrationTest("should update a SKU", async ({ accessToken }) => {
     const token = accessToken?.accessToken
@@ -115,7 +109,7 @@ describe("useSkus", () => {
         expect(result.current.skus.length).toBeGreaterThan(0)
         expect(result.current.error).toBeNull()
       })
-    },
+    }
   )
 
   coreTest("should handle errors gracefully", async () => {
@@ -131,7 +125,7 @@ describe("useSkus", () => {
         expect(result.current.error).toBeDefined()
         expect(result.current.skus).toEqual([])
       },
-      { timeout: 5000 },
+      { timeout: 5000 }
     )
   })
 
@@ -168,7 +162,7 @@ describe("useSkus", () => {
       () => {
         expect(result.current.error).toBeDefined()
       },
-      { timeout: 5000 },
+      { timeout: 5000 }
     )
 
     act(() => {
@@ -249,9 +243,9 @@ describe("useSkus", () => {
       await expect(
         act(async () => {
           await result.current.retrieveSku("")
-        }),
+        })
       ).rejects.toThrow("SKU ID is required for retrieve")
-    },
+    }
   )
 
   coreIntegrationTest(
@@ -264,12 +258,10 @@ describe("useSkus", () => {
 
       await expect(
         act(async () => {
-          await result.current.updateSku(
-            {} as Parameters<typeof result.current.updateSku>[0],
-          )
-        }),
+          await result.current.updateSku({} as Parameters<typeof result.current.updateSku>[0])
+        })
       ).rejects.toThrow("SKU resource ID is required for update")
-    },
+    }
   )
 
   coreIntegrationTest(
@@ -288,7 +280,7 @@ describe("useSkus", () => {
           () => {
             expect(sharedResult.current.skus.length).toBeGreaterThan(0)
           },
-          { timeout: 10000 },
+          { timeout: 10000 }
         )
       } catch {
         return // graceful skip if API is rate-limited or unavailable
@@ -309,6 +301,6 @@ describe("useSkus", () => {
       expect(updatedSku).toBeDefined()
       expect(updatedSku?.id).toBe(skuId)
     },
-    15000,
+    15000
   )
 })
diff --git a/packages/hooks/src/skus/useSkus.ts b/packages/hooks/src/skus/useSkus.ts
index 89ad5487..a0c15814 100644
--- a/packages/hooks/src/skus/useSkus.ts
+++ b/packages/hooks/src/skus/useSkus.ts
@@ -58,12 +58,8 @@ type UseAction = "get" | "retrieve" | "update" | null
  * });
  * ```
  */
-export function useSkus(
-  accessToken: string,
-  interceptors?: InterceptorManager,
-): UseSkusReturn {
-  const [params, setParams] =
-    useState<Parameters<typeof getSkus>[0]["params"]>()
+export function useSkus(accessToken: string, interceptors?: InterceptorManager): UseSkusReturn {
+  const [params, setParams] = useState<Parameters<typeof getSkus>[0]["params"]>()
   const [shouldFetch, setShouldFetch] = useState(false)
   const [action, setAction] = useState<UseAction>(null)
 
@@ -71,17 +67,14 @@ export function useSkus(
   // All useSkus instances with the same token share the same store entry.
   const stableSubscribe = useCallback(
     (listener: () => void) => subscribe(accessToken, listener),
-    [accessToken],
-  )
-  const stableSnapshot = useCallback(
-    () => getSnapshot(accessToken),
-    [accessToken],
+    [accessToken]
   )
+  const stableSnapshot = useCallback(() => getSnapshot(accessToken), [accessToken])
   const skuCodesList = useSyncExternalStore(
     stableSubscribe,
     stableSnapshot,
     // c8 ignore next — server snapshot only used during SSR hydration
-    () => EMPTY,
+    () => EMPTY
   )
 
   const { data, error, isLoading, isValidating, mutate } = useSWR<Sku[]>(
@@ -92,17 +85,14 @@ export function useSkus(
     {
       revalidateOnFocus: false,
       revalidateOnReconnect: false,
-    },
+    }
   )
 
-  const fetchSkus = useCallback(
-    (newParams?: Parameters<typeof getSkus>[0]["params"]) => {
-      setParams(newParams)
-      setShouldFetch(true)
-      setAction("get")
-    },
-    [],
-  )
+  const fetchSkus = useCallback((newParams?: Parameters<typeof getSkus>[0]["params"]) => {
+    setParams(newParams)
+    setShouldFetch(true)
+    setAction("get")
+  }, [])
 
   // Auto-fetch whenever the batch store snapshot changes (new SKU codes registered).
   // All instances with the same token call fetchSkus with the same params —
@@ -115,12 +105,12 @@ export function useSkus(
 
   const registerSku = useCallback(
     (code: string) => storeRegisterSku(accessToken, code),
-    [accessToken],
+    [accessToken]
   )
 
   const unregisterSku = useCallback(
     (code: string) => storeUnregisterSku(accessToken, code),
-    [accessToken],
+    [accessToken]
   )
 
   const handleRetrieveSku = useCallback(
@@ -130,25 +120,21 @@ export function useSkus(
       const result = await retrieveSku({ accessToken, id, interceptors })
       return result
     },
-    [accessToken, interceptors],
+    [accessToken, interceptors]
   )
 
   const handleUpdateSku = useCallback(
     async (resource: SkuUpdate): Promise<Sku | undefined> => {
-      if (!resource?.id)
-        throw new Error("SKU resource ID is required for update")
+      if (!resource?.id) throw new Error("SKU resource ID is required for update")
       setAction("update")
       const result = await updateSku({ accessToken, resource, interceptors })
       await mutate(
-        (current) =>
-          current?.map((s: Sku) => (s.id === result.id ? result : s)) ?? [
-            result,
-          ],
-        { revalidate: false },
+        (current) => current?.map((s: Sku) => (s.id === result.id ? result : s)) ?? [result],
+        { revalidate: false }
       )
       return result
     },
-    [accessToken, mutate, interceptors],
+    [accessToken, mutate, interceptors]
   )
 
   const clearSkus = useCallback(() => {
diff --git a/packages/react-components/.nx/workspace-data/file-map.json b/packages/react-components/.nx/workspace-data/file-map.json
index 43c72b0e..72393138 100644
--- a/packages/react-components/.nx/workspace-data/file-map.json
+++ b/packages/react-components/.nx/workspace-data/file-map.json
@@ -2,36 +2,16 @@
   "version": "6.0",
   "nxVersion": "20.6.0",
   "pathMappings": {
-    "@commercelayer/react-components": [
-      "src/index"
-    ],
-    "#components/*": [
-      "src/components/*"
-    ],
-    "#components-utils/*": [
-      "src/components/utils/*"
-    ],
-    "#reducers/*": [
-      "src/reducers/*"
-    ],
-    "#context/*": [
-      "src/context/*"
-    ],
-    "#typings/*": [
-      "src/typings/*"
-    ],
-    "#typings": [
-      "src/typings/index"
-    ],
-    "#utils/*": [
-      "src/utils/*"
-    ],
-    "#config/*": [
-      "src/config/*"
-    ],
-    "#hooks/*": [
-      "src/hooks/*"
-    ]
+    "@commercelayer/react-components": ["src/index"],
+    "#components/*": ["src/components/*"],
+    "#components-utils/*": ["src/components/utils/*"],
+    "#reducers/*": ["src/reducers/*"],
+    "#context/*": ["src/context/*"],
+    "#typings/*": ["src/typings/*"],
+    "#typings": ["src/typings/index"],
+    "#utils/*": ["src/utils/*"],
+    "#config/*": ["src/config/*"],
+    "#hooks/*": ["src/hooks/*"]
   },
   "nxJsonPlugins": [],
   "fileMap": {
@@ -1291,4 +1271,4 @@
       }
     ]
   }
-}
\ No newline at end of file
+}
diff --git a/packages/react-components/.nx/workspace-data/project-graph.json b/packages/react-components/.nx/workspace-data/project-graph.json
index 992e9100..bf3ade8a 100644
--- a/packages/react-components/.nx/workspace-data/project-graph.json
+++ b/packages/react-components/.nx/workspace-data/project-graph.json
@@ -5,4 +5,4 @@
   "version": "6.0",
   "errors": [],
   "computedAt": 1753282603613
-}
\ No newline at end of file
+}
diff --git a/packages/react-components/.nx/workspace-data/source-maps.json b/packages/react-components/.nx/workspace-data/source-maps.json
index 9e26dfee..0967ef42 100644
--- a/packages/react-components/.nx/workspace-data/source-maps.json
+++ b/packages/react-components/.nx/workspace-data/source-maps.json
@@ -1 +1 @@
-{}
\ No newline at end of file
+{}
diff --git a/packages/react-components/_vitest.config.mts b/packages/react-components/_vitest.config.mts
index 62d3ba1d..b5909b90 100644
--- a/packages/react-components/_vitest.config.mts
+++ b/packages/react-components/_vitest.config.mts
@@ -1,78 +1,81 @@
-  // File-level aliases for test imports
-  '#components/auth/CommerceLayer': path.resolve(__dirname, 'src/components/auth/CommerceLayer.tsx'),
-  '#components/skus/AvailabilityTemplate': path.resolve(__dirname, 'src/components/skus/AvailabilityTemplate.tsx'),
-import { defineConfig } from 'vitest/config'
-import tsconfigPaths from 'vite-tsconfig-paths'
-import react from '@vitejs/plugin-react'
-import path from 'node:path'
+import { defineConfig } from "vitest/config"
+import tsconfigPaths from "vite-tsconfig-paths"
+import react from "@vitejs/plugin-react"
+import path from "node:path"
 
 export default defineConfig({
   resolve: {
     alias: {
-      '@commercelayer/hooks': path.resolve('../hooks/src/index.ts'),
-      '@commercelayer/core': path.resolve('../core/src/index.ts'),
-      '#components': path.resolve(__dirname, 'src/components'),
-      '#components/auth': path.resolve(__dirname, 'src/components/auth'),
-      '#components/auth/*': path.resolve(__dirname, 'src/components/auth/*'),
-      '#components/skus': path.resolve(__dirname, 'src/components/skus'),
-      '#components/skus/*': path.resolve(__dirname, 'src/components/skus/*'),
-      '#components/utils': path.resolve(__dirname, 'src/components/utils'),
-      '#components/utils/*': path.resolve(__dirname, 'src/components/utils/*'),
-      '#components/errors': path.resolve(__dirname, 'src/components/errors'),
-      '#components/errors/*': path.resolve(__dirname, 'src/components/errors/*'),
-      '#components/orders': path.resolve(__dirname, 'src/components/orders'),
-      '#components/orders/*': path.resolve(__dirname, 'src/components/orders/*'),
-      '#components/addresses': path.resolve(__dirname, 'src/components/addresses'),
-      '#components/addresses/*': path.resolve(__dirname, 'src/components/addresses/*'),
-      '#components/gift_cards': path.resolve(__dirname, 'src/components/gift_cards'),
-      '#components/gift_cards/*': path.resolve(__dirname, 'src/components/gift_cards/*'),
-      '#components/payment_methods': path.resolve(__dirname, 'src/components/payment_methods'),
-      '#components/payment_methods/*': path.resolve(__dirname, 'src/components/payment_methods/*'),
-      '#components/payment_source': path.resolve(__dirname, 'src/components/payment_source'),
-      '#components/payment_source/*': path.resolve(__dirname, 'src/components/payment_source/*'),
-      '#components/customers': path.resolve(__dirname, 'src/components/customers'),
-      '#components/customers/*': path.resolve(__dirname, 'src/components/customers/*'),
-      '#components/in_stock_subscriptions': path.resolve(__dirname, 'src/components/in_stock_subscriptions'),
-      '#components/in_stock_subscriptions/*': path.resolve(__dirname, 'src/components/in_stock_subscriptions/*'),
-      '#components/line_items': path.resolve(__dirname, 'src/components/line_items'),
-      '#components/line_items/*': path.resolve(__dirname, 'src/components/line_items/*'),
-      '#components/parcels': path.resolve(__dirname, 'src/components/parcels'),
-      '#components/parcels/*': path.resolve(__dirname, 'src/components/parcels/*'),
-      '#components/stock_items': path.resolve(__dirname, 'src/components/stock_items'),
-      '#components/stock_items/*': path.resolve(__dirname, 'src/components/stock_items/*'),
-      '#components/subscriptions': path.resolve(__dirname, 'src/components/subscriptions'),
-      '#components/subscriptions/*': path.resolve(__dirname, 'src/components/subscriptions/*'),
-      '#components/variants': path.resolve(__dirname, 'src/components/variants'),
-      '#components/variants/*': path.resolve(__dirname, 'src/components/variants/*'),
-      '#components-utils/*': path.resolve(__dirname, 'src/components/utils/*'),
-      '#reducers/*': path.resolve(__dirname, 'src/reducers/*'),
-      '#context/*': path.resolve(__dirname, 'src/context/*'),
-      '#typings/*': path.resolve(__dirname, 'src/typings/*'),
-      '#typings': path.resolve(__dirname, 'src/typings/index'),
-      '#utils/*': path.resolve(__dirname, 'src/utils/*'),
-      '#config/*': path.resolve(__dirname, 'src/config/*'),
-      '#hooks/*': path.resolve(__dirname, 'src/hooks/*')
-    }
+      "@commercelayer/hooks": path.resolve("../hooks/src/index.ts"),
+      "@commercelayer/core": path.resolve("../core/src/index.ts"),
+      "#components": path.resolve(__dirname, "src/components"),
+      "#components/auth": path.resolve(__dirname, "src/components/auth"),
+      "#components/auth/*": path.resolve(__dirname, "src/components/auth/*"),
+      "#components/skus": path.resolve(__dirname, "src/components/skus"),
+      "#components/skus/*": path.resolve(__dirname, "src/components/skus/*"),
+      "#components/utils": path.resolve(__dirname, "src/components/utils"),
+      "#components/utils/*": path.resolve(__dirname, "src/components/utils/*"),
+      "#components/errors": path.resolve(__dirname, "src/components/errors"),
+      "#components/errors/*": path.resolve(__dirname, "src/components/errors/*"),
+      "#components/orders": path.resolve(__dirname, "src/components/orders"),
+      "#components/orders/*": path.resolve(__dirname, "src/components/orders/*"),
+      "#components/addresses": path.resolve(__dirname, "src/components/addresses"),
+      "#components/addresses/*": path.resolve(__dirname, "src/components/addresses/*"),
+      "#components/gift_cards": path.resolve(__dirname, "src/components/gift_cards"),
+      "#components/gift_cards/*": path.resolve(__dirname, "src/components/gift_cards/*"),
+      "#components/payment_methods": path.resolve(__dirname, "src/components/payment_methods"),
+      "#components/payment_methods/*": path.resolve(__dirname, "src/components/payment_methods/*"),
+      "#components/payment_source": path.resolve(__dirname, "src/components/payment_source"),
+      "#components/payment_source/*": path.resolve(__dirname, "src/components/payment_source/*"),
+      "#components/customers": path.resolve(__dirname, "src/components/customers"),
+      "#components/customers/*": path.resolve(__dirname, "src/components/customers/*"),
+      "#components/in_stock_subscriptions": path.resolve(
+        __dirname,
+        "src/components/in_stock_subscriptions"
+      ),
+      "#components/in_stock_subscriptions/*": path.resolve(
+        __dirname,
+        "src/components/in_stock_subscriptions/*"
+      ),
+      "#components/line_items": path.resolve(__dirname, "src/components/line_items"),
+      "#components/line_items/*": path.resolve(__dirname, "src/components/line_items/*"),
+      "#components/parcels": path.resolve(__dirname, "src/components/parcels"),
+      "#components/parcels/*": path.resolve(__dirname, "src/components/parcels/*"),
+      "#components/stock_items": path.resolve(__dirname, "src/components/stock_items"),
+      "#components/stock_items/*": path.resolve(__dirname, "src/components/stock_items/*"),
+      "#components/subscriptions": path.resolve(__dirname, "src/components/subscriptions"),
+      "#components/subscriptions/*": path.resolve(__dirname, "src/components/subscriptions/*"),
+      "#components/variants": path.resolve(__dirname, "src/components/variants"),
+      "#components/variants/*": path.resolve(__dirname, "src/components/variants/*"),
+      "#components-utils/*": path.resolve(__dirname, "src/components/utils/*"),
+      "#reducers/*": path.resolve(__dirname, "src/reducers/*"),
+      "#context/*": path.resolve(__dirname, "src/context/*"),
+      "#typings/*": path.resolve(__dirname, "src/typings/*"),
+      "#typings": path.resolve(__dirname, "src/typings/index"),
+      "#utils/*": path.resolve(__dirname, "src/utils/*"),
+      "#config/*": path.resolve(__dirname, "src/config/*"),
+      "#hooks/*": path.resolve(__dirname, "src/hooks/*"),
+    },
   },
   test: {
     globals: true,
-    environment: 'jsdom',
+    environment: "jsdom",
     testTimeout: 30000,
     coverage: {
-      provider: 'v8',
-      reporter: ['text', 'json', 'html'],
-      include: ['src/**'],
-      exclude: ['mocks', 'specs', 'src/**/*.spec.*']
+      provider: "v8",
+      reporter: ["text", "json", "html"],
+      include: ["src/**"],
+      exclude: ["mocks", "specs", "src/**/*.spec.*"],
     },
-    setupFiles: ['./mocks/setup.ts'],
-    exclude: ['**/e2e/**', '**/node_modules/**']
+    setupFiles: ["./mocks/setup.ts"],
+    exclude: ["**/e2e/**", "**/node_modules/**"],
   },
   plugins: [
     tsconfigPaths(),
     react({
       babel: {
-        plugins: [['babel-plugin-react-compiler']]
-      }
-    })
-  ]
+        plugins: [["babel-plugin-react-compiler"]],
+      },
+    }),
+  ],
 })
diff --git a/packages/react-components/mocks/getAccessToken.ts b/packages/react-components/mocks/getAccessToken.ts
index c6aa1cfc..81365e2a 100644
--- a/packages/react-components/mocks/getAccessToken.ts
+++ b/packages/react-components/mocks/getAccessToken.ts
@@ -1,4 +1,4 @@
-import getToken, { type TokenType } from 'specs/utils/getToken'
+import getToken, { type TokenType } from "specs/utils/getToken"
 
 let accessToken: string | undefined
 let endpoint: string | undefined
@@ -7,40 +7,40 @@ let customerEmpty: string | undefined
 let customerWithLowData: string | undefined
 
 export async function getAccessToken(
-  type: TokenType = 'sales_channel'
+  type: TokenType = "sales_channel"
 ): ReturnType<typeof getToken> {
   if (endpoint != null) {
     switch (type) {
-      case 'customer':
+      case "customer":
         if (customerAccessToken != null) {
           return {
             accessToken: customerAccessToken,
-            endpoint
+            endpoint,
           }
         }
         break
-      case 'customer_empty':
+      case "customer_empty":
         if (customerEmpty != null) {
           return {
             accessToken: customerEmpty,
-            endpoint
+            endpoint,
           }
         }
         break
-      case 'customer_with_low_data':
+      case "customer_with_low_data":
         if (customerWithLowData != null) {
           return {
             accessToken: customerWithLowData,
-            endpoint
+            endpoint,
           }
         }
         break
-      case 'sales_channel':
+      case "sales_channel":
       default:
         if (accessToken != null) {
           return {
             accessToken,
-            endpoint
+            endpoint,
           }
         }
         break
@@ -49,16 +49,16 @@ export async function getAccessToken(
   const config = await getToken(type)
   const token = config.accessToken
   switch (type) {
-    case 'customer':
+    case "customer":
       customerAccessToken = token
       break
-    case 'customer_empty':
+    case "customer_empty":
       customerEmpty = token
       break
-    case 'customer_with_low_data':
+    case "customer_with_low_data":
       customerWithLowData = token
       break
-    case 'sales_channel':
+    case "sales_channel":
     default:
       accessToken = token
       break
@@ -66,6 +66,6 @@ export async function getAccessToken(
   endpoint = config.endpoint
   return {
     accessToken: token,
-    endpoint
+    endpoint,
   }
 }
diff --git a/packages/react-components/mocks/handlers.ts b/packages/react-components/mocks/handlers.ts
index 9f227fda..bb247991 100644
--- a/packages/react-components/mocks/handlers.ts
+++ b/packages/react-components/mocks/handlers.ts
@@ -1,9 +1,9 @@
 /* eslint-disable @typescript-eslint/return-await */
-import { HttpResponse, bypass, http } from 'msw'
+import { HttpResponse, bypass, http } from "msw"
 // import { customerAddresses } from './resources/orders/customer-addresses'
 // import { customerOrdersFull } from './resources/orders/customer-orders-full'
 
-export const baseUrl = 'https://*.commercelayer.*/api'
+export const baseUrl = "https://*.commercelayer.*/api"
 
 const handlerPaths = [
   `https://*.commercelayer.*/oauth/token`,
@@ -17,7 +17,7 @@ const handlerPaths = [
   `${baseUrl}/delivery_lead_times*`,
   `${baseUrl}/customer_payment_sources*`,
   `${baseUrl}/in_stock_subscriptions*`,
-  `${baseUrl}/customers*`
+  `${baseUrl}/customers*`,
 ].map((path: string) => {
   return http.all(path, async ({ request }) => {
     const response = await fetch(bypass(request))
@@ -36,5 +36,5 @@ export const handlers = [
     const realResponse = await response.json()
     return HttpResponse.json(realResponse)
   }),
-  ...handlerPaths
+  ...handlerPaths,
 ]
diff --git a/packages/react-components/mocks/resources/orders/customer-addresses.ts b/packages/react-components/mocks/resources/orders/customer-addresses.ts
index 286ebbff..3ddabf30 100644
--- a/packages/react-components/mocks/resources/orders/customer-addresses.ts
+++ b/packages/react-components/mocks/resources/orders/customer-addresses.ts
@@ -4,44 +4,44 @@
 export const customerAddresses = {
   data: [
     {
-      id: 'mWryXhjazO',
-      type: 'customer_addresses',
+      id: "mWryXhjazO",
+      type: "customer_addresses",
       links: {
-        self: 'https://the-blue-brand-3.commercelayer.co/api/customer_addresses/mWryXhjazO'
+        self: "https://the-blue-brand-3.commercelayer.co/api/customer_addresses/mWryXhjazO",
       },
       attributes: {
-        name: 'Tony Stark, St. Avenger, 16030 Anywhere GE (IT) 3222121333312222',
-        created_at: '2022-12-02T09:42:13.437Z',
-        updated_at: '2022-12-02T09:42:13.437Z',
+        name: "Tony Stark, St. Avenger, 16030 Anywhere GE (IT) 3222121333312222",
+        created_at: "2022-12-02T09:42:13.437Z",
+        updated_at: "2022-12-02T09:42:13.437Z",
         reference: null,
         reference_origin: null,
-        metadata: {}
+        metadata: {},
       },
       relationships: {
         customer: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/customer_addresses/mWryXhjazO/relationships/customer',
+            self: "https://the-blue-brand-3.commercelayer.co/api/customer_addresses/mWryXhjazO/relationships/customer",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/customer_addresses/mWryXhjazO/customer'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/customer_addresses/mWryXhjazO/customer",
+          },
         },
         address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/customer_addresses/mWryXhjazO/relationships/address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/customer_addresses/mWryXhjazO/relationships/address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/customer_addresses/mWryXhjazO/address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/customer_addresses/mWryXhjazO/address",
+          },
         },
         events: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/customer_addresses/mWryXhjazO/relationships/events',
+            self: "https://the-blue-brand-3.commercelayer.co/api/customer_addresses/mWryXhjazO/relationships/events",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/customer_addresses/mWryXhjazO/events'
-          }
-        }
+              "https://the-blue-brand-3.commercelayer.co/api/customer_addresses/mWryXhjazO/events",
+          },
+        },
       },
-      meta: { mode: 'test', organization_id: 'enWoxFMOnp' }
-    }
+      meta: { mode: "test", organization_id: "enWoxFMOnp" },
+    },
   ],
-  meta: { record_count: 1, page_count: 1 }
+  meta: { record_count: 1, page_count: 1 },
 }
diff --git a/packages/react-components/mocks/resources/orders/customer-orders-empty.ts b/packages/react-components/mocks/resources/orders/customer-orders-empty.ts
index ce090b82..1b111baa 100644
--- a/packages/react-components/mocks/resources/orders/customer-orders-empty.ts
+++ b/packages/react-components/mocks/resources/orders/customer-orders-empty.ts
@@ -3,114 +3,109 @@
  */
 export const customerOrdersEmpty = {
   data: {
-    id: 'MQxqWhJMgk',
-    type: 'customers',
+    id: "MQxqWhJMgk",
+    type: "customers",
     links: {
-      self: 'https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk'
+      self: "https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk",
     },
     attributes: {
-      email: 'demo@commercelayer.io',
-      status: 'prospect',
+      email: "demo@commercelayer.io",
+      status: "prospect",
       has_password: true,
-      created_at: '2021-04-27T08:38:00.314Z',
-      updated_at: '2022-12-12T15:54:25.534Z',
-      reference: '',
-      reference_origin: '',
-      metadata: {}
+      created_at: "2021-04-27T08:38:00.314Z",
+      updated_at: "2022-12-12T15:54:25.534Z",
+      reference: "",
+      reference_origin: "",
+      metadata: {},
     },
     relationships: {
       customer_group: {
         links: {
-          self: 'https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/relationships/customer_group',
+          self: "https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/relationships/customer_group",
           related:
-            'https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/customer_group'
-        }
+            "https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/customer_group",
+        },
       },
       customer_addresses: {
         links: {
-          self: 'https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/relationships/customer_addresses',
+          self: "https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/relationships/customer_addresses",
           related:
-            'https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/customer_addresses'
-        }
+            "https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/customer_addresses",
+        },
       },
       customer_payment_sources: {
         links: {
-          self: 'https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/relationships/customer_payment_sources',
+          self: "https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/relationships/customer_payment_sources",
           related:
-            'https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/customer_payment_sources'
-        }
+            "https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/customer_payment_sources",
+        },
       },
       customer_subscriptions: {
         links: {
-          self: 'https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/relationships/customer_subscriptions',
+          self: "https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/relationships/customer_subscriptions",
           related:
-            'https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/customer_subscriptions'
-        }
+            "https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/customer_subscriptions",
+        },
       },
       orders: {
         links: {
-          self: 'https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/relationships/orders',
-          related:
-            'https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/orders'
+          self: "https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/relationships/orders",
+          related: "https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/orders",
         },
-        data: [{ type: 'orders', id: 'NpyAhVkBBL' }]
+        data: [{ type: "orders", id: "NpyAhVkBBL" }],
       },
       order_subscriptions: {
         links: {
-          self: 'https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/relationships/order_subscriptions',
+          self: "https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/relationships/order_subscriptions",
           related:
-            'https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/order_subscriptions'
-        }
+            "https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/order_subscriptions",
+        },
       },
       returns: {
         links: {
-          self: 'https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/relationships/returns',
-          related:
-            'https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/returns'
-        }
+          self: "https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/relationships/returns",
+          related: "https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/returns",
+        },
       },
       sku_lists: {
         links: {
-          self: 'https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/relationships/sku_lists',
-          related:
-            'https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/sku_lists'
-        }
+          self: "https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/relationships/sku_lists",
+          related: "https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/sku_lists",
+        },
       },
       attachments: {
         links: {
-          self: 'https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/relationships/attachments',
-          related:
-            'https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/attachments'
-        }
+          self: "https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/relationships/attachments",
+          related: "https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/attachments",
+        },
       },
       events: {
         links: {
-          self: 'https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/relationships/events',
-          related:
-            'https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/events'
-        }
-      }
+          self: "https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/relationships/events",
+          related: "https://the-blue-brand-3.commercelayer.co/api/customers/MQxqWhJMgk/events",
+        },
+      },
     },
-    meta: { mode: 'test', organization_id: 'enWoxFMOnp' }
+    meta: { mode: "test", organization_id: "enWoxFMOnp" },
   },
   included: [
     {
-      id: 'NpyAhVkBBL',
-      type: 'orders',
+      id: "NpyAhVkBBL",
+      type: "orders",
       links: {
-        self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL'
+        self: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL",
       },
       attributes: {
         number: 2454731,
         autorefresh: true,
-        status: 'pending',
-        payment_status: 'unpaid',
-        fulfillment_status: 'unfulfilled',
+        status: "pending",
+        payment_status: "unpaid",
+        fulfillment_status: "unfulfilled",
         guest: false,
         editable: true,
-        customer_email: 'demo@commercelayer.io',
-        language_code: 'en',
-        currency_code: 'EUR',
+        customer_email: "demo@commercelayer.io",
+        language_code: "en",
+        currency_code: "EUR",
         tax_included: true,
         tax_rate: null,
         freight_taxable: null,
@@ -122,61 +117,61 @@ export const customerOrdersEmpty = {
         gift_card_or_coupon_code: null,
         subtotal_amount_cents: 1500,
         subtotal_amount_float: 15,
-        formatted_subtotal_amount: '€15,00',
+        formatted_subtotal_amount: "€15,00",
         shipping_amount_cents: 0,
         shipping_amount_float: 0,
-        formatted_shipping_amount: '€0,00',
+        formatted_shipping_amount: "€0,00",
         payment_method_amount_cents: 0,
         payment_method_amount_float: 0,
-        formatted_payment_method_amount: '€0,00',
+        formatted_payment_method_amount: "€0,00",
         discount_amount_cents: 0,
         discount_amount_float: 0,
-        formatted_discount_amount: '€0,00',
+        formatted_discount_amount: "€0,00",
         adjustment_amount_cents: 0,
         adjustment_amount_float: 0,
-        formatted_adjustment_amount: '€0,00',
+        formatted_adjustment_amount: "€0,00",
         gift_card_amount_cents: 0,
         gift_card_amount_float: 0,
-        formatted_gift_card_amount: '€0,00',
+        formatted_gift_card_amount: "€0,00",
         total_tax_amount_cents: 0,
         total_tax_amount_float: 0,
-        formatted_total_tax_amount: '€0,00',
+        formatted_total_tax_amount: "€0,00",
         subtotal_tax_amount_cents: 0,
         subtotal_tax_amount_float: 0,
-        formatted_subtotal_tax_amount: '€0,00',
+        formatted_subtotal_tax_amount: "€0,00",
         shipping_tax_amount_cents: 0,
         shipping_tax_amount_float: 0,
-        formatted_shipping_tax_amount: '€0,00',
+        formatted_shipping_tax_amount: "€0,00",
         payment_method_tax_amount_cents: 0,
         payment_method_tax_amount_float: 0,
-        formatted_payment_method_tax_amount: '€0,00',
+        formatted_payment_method_tax_amount: "€0,00",
         adjustment_tax_amount_cents: 0,
         adjustment_tax_amount_float: 0,
-        formatted_adjustment_tax_amount: '€0,00',
+        formatted_adjustment_tax_amount: "€0,00",
         total_amount_cents: 1500,
         total_amount_float: 15,
-        formatted_total_amount: '€15,00',
+        formatted_total_amount: "€15,00",
         total_taxable_amount_cents: 1500,
         total_taxable_amount_float: 15,
-        formatted_total_taxable_amount: '€15,00',
+        formatted_total_taxable_amount: "€15,00",
         subtotal_taxable_amount_cents: 1500,
         subtotal_taxable_amount_float: 15,
-        formatted_subtotal_taxable_amount: '€15,00',
+        formatted_subtotal_taxable_amount: "€15,00",
         shipping_taxable_amount_cents: 0,
         shipping_taxable_amount_float: 0,
-        formatted_shipping_taxable_amount: '€0,00',
+        formatted_shipping_taxable_amount: "€0,00",
         payment_method_taxable_amount_cents: 0,
         payment_method_taxable_amount_float: 0,
-        formatted_payment_method_taxable_amount: '€0,00',
+        formatted_payment_method_taxable_amount: "€0,00",
         adjustment_taxable_amount_cents: 0,
         adjustment_taxable_amount_float: 0,
-        formatted_adjustment_taxable_amount: '€0,00',
+        formatted_adjustment_taxable_amount: "€0,00",
         total_amount_with_taxes_cents: 1500,
         total_amount_with_taxes_float: 15,
-        formatted_total_amount_with_taxes: '€15,00',
+        formatted_total_amount_with_taxes: "€15,00",
         fees_amount_cents: 0,
         fees_amount_float: 0,
-        formatted_fees_amount: '€0,00',
+        formatted_fees_amount: "€0,00",
         duty_amount_cents: null,
         duty_amount_float: null,
         formatted_duty_amount: null,
@@ -185,7 +180,7 @@ export const customerOrdersEmpty = {
         shipments_count: 0,
         tax_calculations_count: 0,
         payment_source_details: null,
-        token: '388631fa1b6af42e7b4801db670155f3',
+        token: "388631fa1b6af42e7b4801db670155f3",
         cart_url: null,
         return_url: null,
         terms_url: null,
@@ -199,162 +194,151 @@ export const customerOrdersEmpty = {
         refreshed_at: null,
         archived_at: null,
         expires_at: null,
-        created_at: '2022-12-01T16:39:19.454Z',
-        updated_at: '2022-12-01T16:40:01.413Z',
-        reference: '',
-        reference_origin: '',
-        metadata: {}
+        created_at: "2022-12-01T16:39:19.454Z",
+        updated_at: "2022-12-01T16:40:01.413Z",
+        reference: "",
+        reference_origin: "",
+        metadata: {},
       },
       relationships: {
         market: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/market',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/market'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/market",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/market",
+          },
         },
         customer: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/customer',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/customer'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/customer",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/customer",
+          },
         },
         shipping_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/shipping_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/shipping_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/shipping_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/shipping_address",
+          },
         },
         billing_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/billing_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/billing_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/billing_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/billing_address",
+          },
         },
         available_payment_methods: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/available_payment_methods',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/available_payment_methods",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/available_payment_methods'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/available_payment_methods",
+          },
         },
         available_customer_payment_sources: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/available_customer_payment_sources',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/available_customer_payment_sources",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/available_customer_payment_sources'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/available_customer_payment_sources",
+          },
         },
         available_free_skus: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/available_free_skus',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/available_free_skus",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/available_free_skus'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/available_free_skus",
+          },
         },
         available_free_bundles: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/available_free_bundles',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/available_free_bundles",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/available_free_bundles'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/available_free_bundles",
+          },
         },
         payment_method: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/payment_method',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/payment_method",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/payment_method'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/payment_method",
+          },
         },
         payment_source: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/payment_source',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/payment_source",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/payment_source'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/payment_source",
+          },
         },
         line_items: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/line_items',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/line_items'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/line_items",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/line_items",
+          },
         },
         shipments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/shipments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/shipments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/shipments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/shipments",
+          },
         },
         transactions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/transactions',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/transactions'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/transactions",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/transactions",
+          },
         },
         authorizations: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/authorizations',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/authorizations",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/authorizations'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/authorizations",
+          },
         },
         captures: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/captures',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/captures'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/captures",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/captures",
+          },
         },
         voids: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/voids',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/voids'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/voids",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/voids",
+          },
         },
         refunds: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/refunds',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/refunds'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/refunds",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/refunds",
+          },
         },
         order_subscriptions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/order_subscriptions',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/order_subscriptions",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/order_subscriptions'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/order_subscriptions",
+          },
         },
         order_copies: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/order_copies',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/order_copies'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/order_copies",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/order_copies",
+          },
         },
         attachments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/attachments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/attachments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/attachments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/attachments",
+          },
         },
         events: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/events',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/events'
-          }
-        }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/relationships/events",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NpyAhVkBBL/events",
+          },
+        },
       },
-      meta: { mode: 'test', organization_id: 'enWoxFMOnp' }
-    }
-  ]
+      meta: { mode: "test", organization_id: "enWoxFMOnp" },
+    },
+  ],
 }
diff --git a/packages/react-components/mocks/resources/orders/customer-orders.ts b/packages/react-components/mocks/resources/orders/customer-orders.ts
index bae3af5c..95a5b599 100644
--- a/packages/react-components/mocks/resources/orders/customer-orders.ts
+++ b/packages/react-components/mocks/resources/orders/customer-orders.ts
@@ -3,195 +3,190 @@
  */
 export const customerOrders = {
   data: {
-    id: 'kwyehmWLpO',
-    type: 'customers',
+    id: "kwyehmWLpO",
+    type: "customers",
     links: {
-      self: 'https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO'
+      self: "https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO",
     },
     attributes: {
-      email: 'tony@iron.man',
-      status: 'repeat',
+      email: "tony@iron.man",
+      status: "repeat",
       has_password: true,
-      created_at: '2022-12-02T09:29:42.173Z',
-      updated_at: '2022-12-09T17:09:46.872Z',
-      reference: '',
-      reference_origin: '',
-      metadata: {}
+      created_at: "2022-12-02T09:29:42.173Z",
+      updated_at: "2022-12-09T17:09:46.872Z",
+      reference: "",
+      reference_origin: "",
+      metadata: {},
     },
     relationships: {
       customer_group: {
         links: {
-          self: 'https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/relationships/customer_group',
+          self: "https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/relationships/customer_group",
           related:
-            'https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/customer_group'
-        }
+            "https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/customer_group",
+        },
       },
       customer_addresses: {
         links: {
-          self: 'https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/relationships/customer_addresses',
+          self: "https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/relationships/customer_addresses",
           related:
-            'https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/customer_addresses'
-        }
+            "https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/customer_addresses",
+        },
       },
       customer_payment_sources: {
         links: {
-          self: 'https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/relationships/customer_payment_sources',
+          self: "https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/relationships/customer_payment_sources",
           related:
-            'https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/customer_payment_sources'
-        }
+            "https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/customer_payment_sources",
+        },
       },
       customer_subscriptions: {
         links: {
-          self: 'https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/relationships/customer_subscriptions',
+          self: "https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/relationships/customer_subscriptions",
           related:
-            'https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/customer_subscriptions'
-        }
+            "https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/customer_subscriptions",
+        },
       },
       orders: {
         links: {
-          self: 'https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/relationships/orders',
-          related:
-            'https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/orders'
+          self: "https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/relationships/orders",
+          related: "https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/orders",
         },
         data: [
-          { type: 'orders', id: 'qJZYhBMeDr' },
-          { type: 'orders', id: 'wkykhjYmBy' },
-          { type: 'orders', id: 'weWdhoaYeY' },
-          { type: 'orders', id: 'wLmohdKBzz' },
-          { type: 'orders', id: 'qjobhrmMda' },
-          { type: 'orders', id: 'NvoJhMOZQv' },
-          { type: 'orders', id: 'qdyBhGZLeE' },
-          { type: 'orders', id: 'qOBnhVabXe' },
-          { type: 'orders', id: 'NVlXhyBLja' },
-          { type: 'orders', id: 'NMWYhbYaBy' },
-          { type: 'orders', id: 'PbQLhypYdr' },
-          { type: 'orders', id: 'qAezhrQjpY' },
-          { type: 'orders', id: 'PrnYhAerQJ' },
-          { type: 'orders', id: 'PoKkhYJdBz' }
-        ]
+          { type: "orders", id: "qJZYhBMeDr" },
+          { type: "orders", id: "wkykhjYmBy" },
+          { type: "orders", id: "weWdhoaYeY" },
+          { type: "orders", id: "wLmohdKBzz" },
+          { type: "orders", id: "qjobhrmMda" },
+          { type: "orders", id: "NvoJhMOZQv" },
+          { type: "orders", id: "qdyBhGZLeE" },
+          { type: "orders", id: "qOBnhVabXe" },
+          { type: "orders", id: "NVlXhyBLja" },
+          { type: "orders", id: "NMWYhbYaBy" },
+          { type: "orders", id: "PbQLhypYdr" },
+          { type: "orders", id: "qAezhrQjpY" },
+          { type: "orders", id: "PrnYhAerQJ" },
+          { type: "orders", id: "PoKkhYJdBz" },
+        ],
       },
       order_subscriptions: {
         links: {
-          self: 'https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/relationships/order_subscriptions',
+          self: "https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/relationships/order_subscriptions",
           related:
-            'https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/order_subscriptions'
-        }
+            "https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/order_subscriptions",
+        },
       },
       returns: {
         links: {
-          self: 'https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/relationships/returns',
-          related:
-            'https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/returns'
-        }
+          self: "https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/relationships/returns",
+          related: "https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/returns",
+        },
       },
       sku_lists: {
         links: {
-          self: 'https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/relationships/sku_lists',
-          related:
-            'https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/sku_lists'
-        }
+          self: "https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/relationships/sku_lists",
+          related: "https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/sku_lists",
+        },
       },
       attachments: {
         links: {
-          self: 'https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/relationships/attachments',
-          related:
-            'https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/attachments'
-        }
+          self: "https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/relationships/attachments",
+          related: "https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/attachments",
+        },
       },
       events: {
         links: {
-          self: 'https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/relationships/events',
-          related:
-            'https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/events'
-        }
-      }
+          self: "https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/relationships/events",
+          related: "https://the-blue-brand-3.commercelayer.co/api/customers/kwyehmWLpO/events",
+        },
+      },
     },
-    meta: { mode: 'test', organization_id: 'enWoxFMOnp' }
+    meta: { mode: "test", organization_id: "enWoxFMOnp" },
   },
   included: [
     {
-      id: 'qJZYhBMeDr',
-      type: 'orders',
+      id: "qJZYhBMeDr",
+      type: "orders",
       links: {
-        self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr'
+        self: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr",
       },
       attributes: {
         number: 2454744,
         autorefresh: true,
-        status: 'placed',
-        payment_status: 'authorized',
-        fulfillment_status: 'unfulfilled',
+        status: "placed",
+        payment_status: "authorized",
+        fulfillment_status: "unfulfilled",
         guest: false,
         editable: false,
-        customer_email: 'tony@iron.man',
-        language_code: 'en',
-        currency_code: 'EUR',
+        customer_email: "tony@iron.man",
+        language_code: "en",
+        currency_code: "EUR",
         tax_included: true,
-        tax_rate: '0.22',
+        tax_rate: "0.22",
         freight_taxable: false,
         requires_billing_info: true,
-        country_code: 'IT',
+        country_code: "IT",
         shipping_country_code_lock: null,
         coupon_code: null,
         gift_card_code: null,
         gift_card_or_coupon_code: null,
         subtotal_amount_cents: 3500,
         subtotal_amount_float: 35,
-        formatted_subtotal_amount: '€35,00',
+        formatted_subtotal_amount: "€35,00",
         shipping_amount_cents: 0,
         shipping_amount_float: 0,
-        formatted_shipping_amount: '€0,00',
+        formatted_shipping_amount: "€0,00",
         payment_method_amount_cents: 0,
         payment_method_amount_float: 0,
-        formatted_payment_method_amount: '€0,00',
+        formatted_payment_method_amount: "€0,00",
         discount_amount_cents: 0,
         discount_amount_float: 0,
-        formatted_discount_amount: '€0,00',
+        formatted_discount_amount: "€0,00",
         adjustment_amount_cents: 0,
         adjustment_amount_float: 0,
-        formatted_adjustment_amount: '€0,00',
+        formatted_adjustment_amount: "€0,00",
         gift_card_amount_cents: 0,
         gift_card_amount_float: 0,
-        formatted_gift_card_amount: '€0,00',
+        formatted_gift_card_amount: "€0,00",
         total_tax_amount_cents: 631,
         total_tax_amount_float: 6.31,
-        formatted_total_tax_amount: '€6,31',
+        formatted_total_tax_amount: "€6,31",
         subtotal_tax_amount_cents: 631,
         subtotal_tax_amount_float: 6.31,
-        formatted_subtotal_tax_amount: '€6,31',
+        formatted_subtotal_tax_amount: "€6,31",
         shipping_tax_amount_cents: 0,
         shipping_tax_amount_float: 0,
-        formatted_shipping_tax_amount: '€0,00',
+        formatted_shipping_tax_amount: "€0,00",
         payment_method_tax_amount_cents: 0,
         payment_method_tax_amount_float: 0,
-        formatted_payment_method_tax_amount: '€0,00',
+        formatted_payment_method_tax_amount: "€0,00",
         adjustment_tax_amount_cents: 0,
         adjustment_tax_amount_float: 0,
-        formatted_adjustment_tax_amount: '€0,00',
+        formatted_adjustment_tax_amount: "€0,00",
         total_amount_cents: 3500,
         total_amount_float: 35,
-        formatted_total_amount: '€35,00',
+        formatted_total_amount: "€35,00",
         total_taxable_amount_cents: 2869,
         total_taxable_amount_float: 28.69,
-        formatted_total_taxable_amount: '€28,69',
+        formatted_total_taxable_amount: "€28,69",
         subtotal_taxable_amount_cents: 2869,
         subtotal_taxable_amount_float: 28.69,
-        formatted_subtotal_taxable_amount: '€28,69',
+        formatted_subtotal_taxable_amount: "€28,69",
         shipping_taxable_amount_cents: 0,
         shipping_taxable_amount_float: 0,
-        formatted_shipping_taxable_amount: '€0,00',
+        formatted_shipping_taxable_amount: "€0,00",
         payment_method_taxable_amount_cents: 0,
         payment_method_taxable_amount_float: 0,
-        formatted_payment_method_taxable_amount: '€0,00',
+        formatted_payment_method_taxable_amount: "€0,00",
         adjustment_taxable_amount_cents: 0,
         adjustment_taxable_amount_float: 0,
-        formatted_adjustment_taxable_amount: '€0,00',
+        formatted_adjustment_taxable_amount: "€0,00",
         total_amount_with_taxes_cents: 3500,
         total_amount_with_taxes_float: 35,
-        formatted_total_amount_with_taxes: '€35,00',
+        formatted_total_amount_with_taxes: "€35,00",
         fees_amount_cents: 0,
         fees_amount_float: 0,
-        formatted_fees_amount: '€0,00',
+        formatted_fees_amount: "€0,00",
         duty_amount_cents: null,
         duty_amount_float: null,
         formatted_duty_amount: null,
@@ -199,261 +194,250 @@ export const customerOrders = {
         line_item_options_count: 0,
         shipments_count: 1,
         tax_calculations_count: 4,
-        payment_source_details: { type: 'wire_transfer' },
-        token: '5106b316997ac0ea1db87e212aaf3842',
+        payment_source_details: { type: "wire_transfer" },
+        token: "5106b316997ac0ea1db87e212aaf3842",
         cart_url: null,
         return_url: null,
         terms_url: null,
         privacy_url: null,
         checkout_url: null,
-        placed_at: '2022-12-02T09:42:44.007Z',
+        placed_at: "2022-12-02T09:42:44.007Z",
         approved_at: null,
         cancelled_at: null,
-        payment_updated_at: '2022-12-02T09:42:43.933Z',
+        payment_updated_at: "2022-12-02T09:42:43.933Z",
         fulfillment_updated_at: null,
-        refreshed_at: '2022-12-02T09:42:33.625Z',
+        refreshed_at: "2022-12-02T09:42:33.625Z",
         archived_at: null,
         expires_at: null,
-        created_at: '2022-12-02T09:42:22.223Z',
-        updated_at: '2022-12-02T09:42:44.019Z',
+        created_at: "2022-12-02T09:42:22.223Z",
+        updated_at: "2022-12-02T09:42:44.019Z",
         reference: null,
         reference_origin: null,
-        metadata: {}
+        metadata: {},
       },
       relationships: {
         market: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/market',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/market'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/market",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/market",
+          },
         },
         customer: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/customer',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/customer'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/customer",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/customer",
+          },
         },
         shipping_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/shipping_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/shipping_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/shipping_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/shipping_address",
+          },
         },
         billing_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/billing_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/billing_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/billing_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/billing_address",
+          },
         },
         available_payment_methods: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/available_payment_methods',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/available_payment_methods",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/available_payment_methods'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/available_payment_methods",
+          },
         },
         available_customer_payment_sources: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/available_customer_payment_sources',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/available_customer_payment_sources",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/available_customer_payment_sources'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/available_customer_payment_sources",
+          },
         },
         available_free_skus: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/available_free_skus',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/available_free_skus",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/available_free_skus'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/available_free_skus",
+          },
         },
         available_free_bundles: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/available_free_bundles',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/available_free_bundles",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/available_free_bundles'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/available_free_bundles",
+          },
         },
         payment_method: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/payment_method',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/payment_method",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/payment_method'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/payment_method",
+          },
         },
         payment_source: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/payment_source',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/payment_source",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/payment_source'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/payment_source",
+          },
         },
         line_items: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/line_items',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/line_items'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/line_items",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/line_items",
+          },
         },
         shipments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/shipments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/shipments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/shipments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/shipments",
+          },
         },
         transactions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/transactions',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/transactions'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/transactions",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/transactions",
+          },
         },
         authorizations: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/authorizations',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/authorizations",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/authorizations'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/authorizations",
+          },
         },
         captures: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/captures',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/captures'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/captures",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/captures",
+          },
         },
         voids: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/voids',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/voids'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/voids",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/voids",
+          },
         },
         refunds: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/refunds',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/refunds'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/refunds",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/refunds",
+          },
         },
         order_subscriptions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/order_subscriptions',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/order_subscriptions",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/order_subscriptions'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/order_subscriptions",
+          },
         },
         order_copies: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/order_copies',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/order_copies'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/order_copies",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/order_copies",
+          },
         },
         attachments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/attachments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/attachments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/attachments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/attachments",
+          },
         },
         events: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/events',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/events'
-          }
-        }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/relationships/events",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qJZYhBMeDr/events",
+          },
+        },
       },
-      meta: { mode: 'test', organization_id: 'enWoxFMOnp' }
+      meta: { mode: "test", organization_id: "enWoxFMOnp" },
     },
     {
-      id: 'wkykhjYmBy',
-      type: 'orders',
+      id: "wkykhjYmBy",
+      type: "orders",
       links: {
-        self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy'
+        self: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy",
       },
       attributes: {
         number: 2454745,
         autorefresh: true,
-        status: 'placed',
-        payment_status: 'authorized',
-        fulfillment_status: 'unfulfilled',
+        status: "placed",
+        payment_status: "authorized",
+        fulfillment_status: "unfulfilled",
         guest: false,
         editable: false,
-        customer_email: 'tony@iron.man',
-        language_code: 'en',
-        currency_code: 'EUR',
+        customer_email: "tony@iron.man",
+        language_code: "en",
+        currency_code: "EUR",
         tax_included: true,
-        tax_rate: '0.22',
+        tax_rate: "0.22",
         freight_taxable: false,
         requires_billing_info: true,
-        country_code: 'IT',
+        country_code: "IT",
         shipping_country_code_lock: null,
         coupon_code: null,
         gift_card_code: null,
         gift_card_or_coupon_code: null,
         subtotal_amount_cents: 3500,
         subtotal_amount_float: 35,
-        formatted_subtotal_amount: '€35,00',
+        formatted_subtotal_amount: "€35,00",
         shipping_amount_cents: 0,
         shipping_amount_float: 0,
-        formatted_shipping_amount: '€0,00',
+        formatted_shipping_amount: "€0,00",
         payment_method_amount_cents: 0,
         payment_method_amount_float: 0,
-        formatted_payment_method_amount: '€0,00',
+        formatted_payment_method_amount: "€0,00",
         discount_amount_cents: 0,
         discount_amount_float: 0,
-        formatted_discount_amount: '€0,00',
+        formatted_discount_amount: "€0,00",
         adjustment_amount_cents: 0,
         adjustment_amount_float: 0,
-        formatted_adjustment_amount: '€0,00',
+        formatted_adjustment_amount: "€0,00",
         gift_card_amount_cents: 0,
         gift_card_amount_float: 0,
-        formatted_gift_card_amount: '€0,00',
+        formatted_gift_card_amount: "€0,00",
         total_tax_amount_cents: 631,
         total_tax_amount_float: 6.31,
-        formatted_total_tax_amount: '€6,31',
+        formatted_total_tax_amount: "€6,31",
         subtotal_tax_amount_cents: 631,
         subtotal_tax_amount_float: 6.31,
-        formatted_subtotal_tax_amount: '€6,31',
+        formatted_subtotal_tax_amount: "€6,31",
         shipping_tax_amount_cents: 0,
         shipping_tax_amount_float: 0,
-        formatted_shipping_tax_amount: '€0,00',
+        formatted_shipping_tax_amount: "€0,00",
         payment_method_tax_amount_cents: 0,
         payment_method_tax_amount_float: 0,
-        formatted_payment_method_tax_amount: '€0,00',
+        formatted_payment_method_tax_amount: "€0,00",
         adjustment_tax_amount_cents: 0,
         adjustment_tax_amount_float: 0,
-        formatted_adjustment_tax_amount: '€0,00',
+        formatted_adjustment_tax_amount: "€0,00",
         total_amount_cents: 3500,
         total_amount_float: 35,
-        formatted_total_amount: '€35,00',
+        formatted_total_amount: "€35,00",
         total_taxable_amount_cents: 2869,
         total_taxable_amount_float: 28.69,
-        formatted_total_taxable_amount: '€28,69',
+        formatted_total_taxable_amount: "€28,69",
         subtotal_taxable_amount_cents: 2869,
         subtotal_taxable_amount_float: 28.69,
-        formatted_subtotal_taxable_amount: '€28,69',
+        formatted_subtotal_taxable_amount: "€28,69",
         shipping_taxable_amount_cents: 0,
         shipping_taxable_amount_float: 0,
-        formatted_shipping_taxable_amount: '€0,00',
+        formatted_shipping_taxable_amount: "€0,00",
         payment_method_taxable_amount_cents: 0,
         payment_method_taxable_amount_float: 0,
-        formatted_payment_method_taxable_amount: '€0,00',
+        formatted_payment_method_taxable_amount: "€0,00",
         adjustment_taxable_amount_cents: 0,
         adjustment_taxable_amount_float: 0,
-        formatted_adjustment_taxable_amount: '€0,00',
+        formatted_adjustment_taxable_amount: "€0,00",
         total_amount_with_taxes_cents: 3500,
         total_amount_with_taxes_float: 35,
-        formatted_total_amount_with_taxes: '€35,00',
+        formatted_total_amount_with_taxes: "€35,00",
         fees_amount_cents: 0,
         fees_amount_float: 0,
-        formatted_fees_amount: '€0,00',
+        formatted_fees_amount: "€0,00",
         duty_amount_cents: null,
         duty_amount_float: null,
         formatted_duty_amount: null,
@@ -461,261 +445,250 @@ export const customerOrders = {
         line_item_options_count: 0,
         shipments_count: 1,
         tax_calculations_count: 4,
-        payment_source_details: { type: 'wire_transfer' },
-        token: 'bab9a940193c21db7732f8d6ce59b7b2',
+        payment_source_details: { type: "wire_transfer" },
+        token: "bab9a940193c21db7732f8d6ce59b7b2",
         cart_url: null,
         return_url: null,
         terms_url: null,
         privacy_url: null,
         checkout_url: null,
-        placed_at: '2022-12-02T09:43:26.741Z',
+        placed_at: "2022-12-02T09:43:26.741Z",
         approved_at: null,
         cancelled_at: null,
-        payment_updated_at: '2022-12-02T09:43:26.699Z',
+        payment_updated_at: "2022-12-02T09:43:26.699Z",
         fulfillment_updated_at: null,
-        refreshed_at: '2022-12-02T09:43:14.603Z',
+        refreshed_at: "2022-12-02T09:43:14.603Z",
         archived_at: null,
         expires_at: null,
-        created_at: '2022-12-02T09:42:57.170Z',
-        updated_at: '2022-12-02T09:43:26.747Z',
+        created_at: "2022-12-02T09:42:57.170Z",
+        updated_at: "2022-12-02T09:43:26.747Z",
         reference: null,
         reference_origin: null,
-        metadata: {}
+        metadata: {},
       },
       relationships: {
         market: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/market',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/market'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/market",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/market",
+          },
         },
         customer: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/customer',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/customer'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/customer",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/customer",
+          },
         },
         shipping_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/shipping_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/shipping_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/shipping_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/shipping_address",
+          },
         },
         billing_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/billing_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/billing_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/billing_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/billing_address",
+          },
         },
         available_payment_methods: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/available_payment_methods',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/available_payment_methods",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/available_payment_methods'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/available_payment_methods",
+          },
         },
         available_customer_payment_sources: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/available_customer_payment_sources',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/available_customer_payment_sources",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/available_customer_payment_sources'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/available_customer_payment_sources",
+          },
         },
         available_free_skus: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/available_free_skus',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/available_free_skus",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/available_free_skus'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/available_free_skus",
+          },
         },
         available_free_bundles: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/available_free_bundles',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/available_free_bundles",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/available_free_bundles'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/available_free_bundles",
+          },
         },
         payment_method: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/payment_method',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/payment_method",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/payment_method'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/payment_method",
+          },
         },
         payment_source: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/payment_source',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/payment_source",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/payment_source'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/payment_source",
+          },
         },
         line_items: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/line_items',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/line_items'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/line_items",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/line_items",
+          },
         },
         shipments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/shipments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/shipments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/shipments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/shipments",
+          },
         },
         transactions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/transactions',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/transactions'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/transactions",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/transactions",
+          },
         },
         authorizations: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/authorizations',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/authorizations",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/authorizations'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/authorizations",
+          },
         },
         captures: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/captures',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/captures'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/captures",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/captures",
+          },
         },
         voids: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/voids',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/voids'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/voids",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/voids",
+          },
         },
         refunds: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/refunds',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/refunds'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/refunds",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/refunds",
+          },
         },
         order_subscriptions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/order_subscriptions',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/order_subscriptions",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/order_subscriptions'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/order_subscriptions",
+          },
         },
         order_copies: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/order_copies',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/order_copies'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/order_copies",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/order_copies",
+          },
         },
         attachments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/attachments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/attachments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/attachments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/attachments",
+          },
         },
         events: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/events',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/events'
-          }
-        }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/relationships/events",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/wkykhjYmBy/events",
+          },
+        },
       },
-      meta: { mode: 'test', organization_id: 'enWoxFMOnp' }
+      meta: { mode: "test", organization_id: "enWoxFMOnp" },
     },
     {
-      id: 'weWdhoaYeY',
-      type: 'orders',
+      id: "weWdhoaYeY",
+      type: "orders",
       links: {
-        self: 'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY'
+        self: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY",
       },
       attributes: {
         number: 2454747,
         autorefresh: true,
-        status: 'placed',
-        payment_status: 'authorized',
-        fulfillment_status: 'unfulfilled',
+        status: "placed",
+        payment_status: "authorized",
+        fulfillment_status: "unfulfilled",
         guest: false,
         editable: false,
-        customer_email: 'tony@iron.man',
-        language_code: 'en',
-        currency_code: 'EUR',
+        customer_email: "tony@iron.man",
+        language_code: "en",
+        currency_code: "EUR",
         tax_included: true,
-        tax_rate: '0.22',
+        tax_rate: "0.22",
         freight_taxable: false,
         requires_billing_info: true,
-        country_code: 'IT',
+        country_code: "IT",
         shipping_country_code_lock: null,
         coupon_code: null,
         gift_card_code: null,
         gift_card_or_coupon_code: null,
         subtotal_amount_cents: 3500,
         subtotal_amount_float: 35,
-        formatted_subtotal_amount: '€35,00',
+        formatted_subtotal_amount: "€35,00",
         shipping_amount_cents: 0,
         shipping_amount_float: 0,
-        formatted_shipping_amount: '€0,00',
+        formatted_shipping_amount: "€0,00",
         payment_method_amount_cents: 0,
         payment_method_amount_float: 0,
-        formatted_payment_method_amount: '€0,00',
+        formatted_payment_method_amount: "€0,00",
         discount_amount_cents: 0,
         discount_amount_float: 0,
-        formatted_discount_amount: '€0,00',
+        formatted_discount_amount: "€0,00",
         adjustment_amount_cents: 0,
         adjustment_amount_float: 0,
-        formatted_adjustment_amount: '€0,00',
+        formatted_adjustment_amount: "€0,00",
         gift_card_amount_cents: 0,
         gift_card_amount_float: 0,
-        formatted_gift_card_amount: '€0,00',
+        formatted_gift_card_amount: "€0,00",
         total_tax_amount_cents: 631,
         total_tax_amount_float: 6.31,
-        formatted_total_tax_amount: '€6,31',
+        formatted_total_tax_amount: "€6,31",
         subtotal_tax_amount_cents: 631,
         subtotal_tax_amount_float: 6.31,
-        formatted_subtotal_tax_amount: '€6,31',
+        formatted_subtotal_tax_amount: "€6,31",
         shipping_tax_amount_cents: 0,
         shipping_tax_amount_float: 0,
-        formatted_shipping_tax_amount: '€0,00',
+        formatted_shipping_tax_amount: "€0,00",
         payment_method_tax_amount_cents: 0,
         payment_method_tax_amount_float: 0,
-        formatted_payment_method_tax_amount: '€0,00',
+        formatted_payment_method_tax_amount: "€0,00",
         adjustment_tax_amount_cents: 0,
         adjustment_tax_amount_float: 0,
-        formatted_adjustment_tax_amount: '€0,00',
+        formatted_adjustment_tax_amount: "€0,00",
         total_amount_cents: 3500,
         total_amount_float: 35,
-        formatted_total_amount: '€35,00',
+        formatted_total_amount: "€35,00",
         total_taxable_amount_cents: 2869,
         total_taxable_amount_float: 28.69,
-        formatted_total_taxable_amount: '€28,69',
+        formatted_total_taxable_amount: "€28,69",
         subtotal_taxable_amount_cents: 2869,
         subtotal_taxable_amount_float: 28.69,
-        formatted_subtotal_taxable_amount: '€28,69',
+        formatted_subtotal_taxable_amount: "€28,69",
         shipping_taxable_amount_cents: 0,
         shipping_taxable_amount_float: 0,
-        formatted_shipping_taxable_amount: '€0,00',
+        formatted_shipping_taxable_amount: "€0,00",
         payment_method_taxable_amount_cents: 0,
         payment_method_taxable_amount_float: 0,
-        formatted_payment_method_taxable_amount: '€0,00',
+        formatted_payment_method_taxable_amount: "€0,00",
         adjustment_taxable_amount_cents: 0,
         adjustment_taxable_amount_float: 0,
-        formatted_adjustment_taxable_amount: '€0,00',
+        formatted_adjustment_taxable_amount: "€0,00",
         total_amount_with_taxes_cents: 3500,
         total_amount_with_taxes_float: 35,
-        formatted_total_amount_with_taxes: '€35,00',
+        formatted_total_amount_with_taxes: "€35,00",
         fees_amount_cents: 0,
         fees_amount_float: 0,
-        formatted_fees_amount: '€0,00',
+        formatted_fees_amount: "€0,00",
         duty_amount_cents: null,
         duty_amount_float: null,
         formatted_duty_amount: null,
@@ -723,261 +696,250 @@ export const customerOrders = {
         line_item_options_count: 0,
         shipments_count: 1,
         tax_calculations_count: 4,
-        payment_source_details: { type: 'wire_transfer' },
-        token: '17aadf0c864c635bb2341acd88df1863',
+        payment_source_details: { type: "wire_transfer" },
+        token: "17aadf0c864c635bb2341acd88df1863",
         cart_url: null,
         return_url: null,
         terms_url: null,
         privacy_url: null,
         checkout_url: null,
-        placed_at: '2022-12-02T09:44:29.025Z',
+        placed_at: "2022-12-02T09:44:29.025Z",
         approved_at: null,
         cancelled_at: null,
-        payment_updated_at: '2022-12-02T09:44:28.969Z',
+        payment_updated_at: "2022-12-02T09:44:28.969Z",
         fulfillment_updated_at: null,
-        refreshed_at: '2022-12-02T09:44:18.906Z',
+        refreshed_at: "2022-12-02T09:44:18.906Z",
         archived_at: null,
         expires_at: null,
-        created_at: '2022-12-02T09:44:09.090Z',
-        updated_at: '2022-12-02T09:44:29.033Z',
+        created_at: "2022-12-02T09:44:09.090Z",
+        updated_at: "2022-12-02T09:44:29.033Z",
         reference: null,
         reference_origin: null,
-        metadata: {}
+        metadata: {},
       },
       relationships: {
         market: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/market',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/market'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/market",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/market",
+          },
         },
         customer: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/customer',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/customer'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/customer",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/customer",
+          },
         },
         shipping_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/shipping_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/shipping_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/shipping_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/shipping_address",
+          },
         },
         billing_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/billing_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/billing_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/billing_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/billing_address",
+          },
         },
         available_payment_methods: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/available_payment_methods',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/available_payment_methods",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/available_payment_methods'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/available_payment_methods",
+          },
         },
         available_customer_payment_sources: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/available_customer_payment_sources',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/available_customer_payment_sources",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/available_customer_payment_sources'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/available_customer_payment_sources",
+          },
         },
         available_free_skus: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/available_free_skus',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/available_free_skus",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/available_free_skus'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/available_free_skus",
+          },
         },
         available_free_bundles: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/available_free_bundles',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/available_free_bundles",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/available_free_bundles'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/available_free_bundles",
+          },
         },
         payment_method: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/payment_method',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/payment_method",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/payment_method'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/payment_method",
+          },
         },
         payment_source: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/payment_source',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/payment_source",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/payment_source'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/payment_source",
+          },
         },
         line_items: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/line_items',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/line_items'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/line_items",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/line_items",
+          },
         },
         shipments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/shipments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/shipments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/shipments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/shipments",
+          },
         },
         transactions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/transactions',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/transactions'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/transactions",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/transactions",
+          },
         },
         authorizations: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/authorizations',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/authorizations",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/authorizations'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/authorizations",
+          },
         },
         captures: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/captures',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/captures'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/captures",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/captures",
+          },
         },
         voids: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/voids',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/voids'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/voids",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/voids",
+          },
         },
         refunds: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/refunds',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/refunds'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/refunds",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/refunds",
+          },
         },
         order_subscriptions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/order_subscriptions',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/order_subscriptions",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/order_subscriptions'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/order_subscriptions",
+          },
         },
         order_copies: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/order_copies',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/order_copies'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/order_copies",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/order_copies",
+          },
         },
         attachments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/attachments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/attachments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/attachments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/attachments",
+          },
         },
         events: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/events',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/events'
-          }
-        }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/relationships/events",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/weWdhoaYeY/events",
+          },
+        },
       },
-      meta: { mode: 'test', organization_id: 'enWoxFMOnp' }
+      meta: { mode: "test", organization_id: "enWoxFMOnp" },
     },
     {
-      id: 'wLmohdKBzz',
-      type: 'orders',
+      id: "wLmohdKBzz",
+      type: "orders",
       links: {
-        self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz'
+        self: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz",
       },
       attributes: {
         number: 2454748,
         autorefresh: true,
-        status: 'placed',
-        payment_status: 'authorized',
-        fulfillment_status: 'unfulfilled',
+        status: "placed",
+        payment_status: "authorized",
+        fulfillment_status: "unfulfilled",
         guest: false,
         editable: false,
-        customer_email: 'tony@iron.man',
-        language_code: 'en',
-        currency_code: 'EUR',
+        customer_email: "tony@iron.man",
+        language_code: "en",
+        currency_code: "EUR",
         tax_included: true,
-        tax_rate: '0.22',
+        tax_rate: "0.22",
         freight_taxable: false,
         requires_billing_info: true,
-        country_code: 'IT',
+        country_code: "IT",
         shipping_country_code_lock: null,
         coupon_code: null,
         gift_card_code: null,
         gift_card_or_coupon_code: null,
         subtotal_amount_cents: 3500,
         subtotal_amount_float: 35,
-        formatted_subtotal_amount: '€35,00',
+        formatted_subtotal_amount: "€35,00",
         shipping_amount_cents: 0,
         shipping_amount_float: 0,
-        formatted_shipping_amount: '€0,00',
+        formatted_shipping_amount: "€0,00",
         payment_method_amount_cents: 0,
         payment_method_amount_float: 0,
-        formatted_payment_method_amount: '€0,00',
+        formatted_payment_method_amount: "€0,00",
         discount_amount_cents: 0,
         discount_amount_float: 0,
-        formatted_discount_amount: '€0,00',
+        formatted_discount_amount: "€0,00",
         adjustment_amount_cents: 0,
         adjustment_amount_float: 0,
-        formatted_adjustment_amount: '€0,00',
+        formatted_adjustment_amount: "€0,00",
         gift_card_amount_cents: 0,
         gift_card_amount_float: 0,
-        formatted_gift_card_amount: '€0,00',
+        formatted_gift_card_amount: "€0,00",
         total_tax_amount_cents: 631,
         total_tax_amount_float: 6.31,
-        formatted_total_tax_amount: '€6,31',
+        formatted_total_tax_amount: "€6,31",
         subtotal_tax_amount_cents: 631,
         subtotal_tax_amount_float: 6.31,
-        formatted_subtotal_tax_amount: '€6,31',
+        formatted_subtotal_tax_amount: "€6,31",
         shipping_tax_amount_cents: 0,
         shipping_tax_amount_float: 0,
-        formatted_shipping_tax_amount: '€0,00',
+        formatted_shipping_tax_amount: "€0,00",
         payment_method_tax_amount_cents: 0,
         payment_method_tax_amount_float: 0,
-        formatted_payment_method_tax_amount: '€0,00',
+        formatted_payment_method_tax_amount: "€0,00",
         adjustment_tax_amount_cents: 0,
         adjustment_tax_amount_float: 0,
-        formatted_adjustment_tax_amount: '€0,00',
+        formatted_adjustment_tax_amount: "€0,00",
         total_amount_cents: 3500,
         total_amount_float: 35,
-        formatted_total_amount: '€35,00',
+        formatted_total_amount: "€35,00",
         total_taxable_amount_cents: 2869,
         total_taxable_amount_float: 28.69,
-        formatted_total_taxable_amount: '€28,69',
+        formatted_total_taxable_amount: "€28,69",
         subtotal_taxable_amount_cents: 2869,
         subtotal_taxable_amount_float: 28.69,
-        formatted_subtotal_taxable_amount: '€28,69',
+        formatted_subtotal_taxable_amount: "€28,69",
         shipping_taxable_amount_cents: 0,
         shipping_taxable_amount_float: 0,
-        formatted_shipping_taxable_amount: '€0,00',
+        formatted_shipping_taxable_amount: "€0,00",
         payment_method_taxable_amount_cents: 0,
         payment_method_taxable_amount_float: 0,
-        formatted_payment_method_taxable_amount: '€0,00',
+        formatted_payment_method_taxable_amount: "€0,00",
         adjustment_taxable_amount_cents: 0,
         adjustment_taxable_amount_float: 0,
-        formatted_adjustment_taxable_amount: '€0,00',
+        formatted_adjustment_taxable_amount: "€0,00",
         total_amount_with_taxes_cents: 3500,
         total_amount_with_taxes_float: 35,
-        formatted_total_amount_with_taxes: '€35,00',
+        formatted_total_amount_with_taxes: "€35,00",
         fees_amount_cents: 0,
         fees_amount_float: 0,
-        formatted_fees_amount: '€0,00',
+        formatted_fees_amount: "€0,00",
         duty_amount_cents: null,
         duty_amount_float: null,
         formatted_duty_amount: null,
@@ -985,261 +947,250 @@ export const customerOrders = {
         line_item_options_count: 0,
         shipments_count: 1,
         tax_calculations_count: 4,
-        payment_source_details: { type: 'wire_transfer' },
-        token: '92602b939382429cbebac46d3a15caa5',
+        payment_source_details: { type: "wire_transfer" },
+        token: "92602b939382429cbebac46d3a15caa5",
         cart_url: null,
         return_url: null,
         terms_url: null,
         privacy_url: null,
         checkout_url: null,
-        placed_at: '2022-12-02T10:14:42.933Z',
+        placed_at: "2022-12-02T10:14:42.933Z",
         approved_at: null,
         cancelled_at: null,
-        payment_updated_at: '2022-12-02T10:14:42.890Z',
+        payment_updated_at: "2022-12-02T10:14:42.890Z",
         fulfillment_updated_at: null,
-        refreshed_at: '2022-12-02T10:14:33.197Z',
+        refreshed_at: "2022-12-02T10:14:33.197Z",
         archived_at: null,
         expires_at: null,
-        created_at: '2022-12-02T10:14:15.956Z',
-        updated_at: '2022-12-02T10:14:42.941Z',
+        created_at: "2022-12-02T10:14:15.956Z",
+        updated_at: "2022-12-02T10:14:42.941Z",
         reference: null,
         reference_origin: null,
-        metadata: {}
+        metadata: {},
       },
       relationships: {
         market: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/market',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/market'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/market",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/market",
+          },
         },
         customer: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/customer',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/customer'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/customer",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/customer",
+          },
         },
         shipping_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/shipping_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/shipping_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/shipping_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/shipping_address",
+          },
         },
         billing_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/billing_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/billing_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/billing_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/billing_address",
+          },
         },
         available_payment_methods: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/available_payment_methods',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/available_payment_methods",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/available_payment_methods'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/available_payment_methods",
+          },
         },
         available_customer_payment_sources: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/available_customer_payment_sources',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/available_customer_payment_sources",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/available_customer_payment_sources'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/available_customer_payment_sources",
+          },
         },
         available_free_skus: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/available_free_skus',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/available_free_skus",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/available_free_skus'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/available_free_skus",
+          },
         },
         available_free_bundles: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/available_free_bundles',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/available_free_bundles",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/available_free_bundles'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/available_free_bundles",
+          },
         },
         payment_method: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/payment_method',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/payment_method",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/payment_method'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/payment_method",
+          },
         },
         payment_source: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/payment_source',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/payment_source",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/payment_source'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/payment_source",
+          },
         },
         line_items: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/line_items',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/line_items'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/line_items",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/line_items",
+          },
         },
         shipments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/shipments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/shipments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/shipments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/shipments",
+          },
         },
         transactions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/transactions',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/transactions'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/transactions",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/transactions",
+          },
         },
         authorizations: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/authorizations',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/authorizations",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/authorizations'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/authorizations",
+          },
         },
         captures: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/captures',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/captures'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/captures",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/captures",
+          },
         },
         voids: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/voids',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/voids'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/voids",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/voids",
+          },
         },
         refunds: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/refunds',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/refunds'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/refunds",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/refunds",
+          },
         },
         order_subscriptions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/order_subscriptions',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/order_subscriptions",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/order_subscriptions'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/order_subscriptions",
+          },
         },
         order_copies: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/order_copies',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/order_copies'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/order_copies",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/order_copies",
+          },
         },
         attachments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/attachments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/attachments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/attachments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/attachments",
+          },
         },
         events: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/events',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/events'
-          }
-        }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/relationships/events",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/wLmohdKBzz/events",
+          },
+        },
       },
-      meta: { mode: 'test', organization_id: 'enWoxFMOnp' }
+      meta: { mode: "test", organization_id: "enWoxFMOnp" },
     },
     {
-      id: 'qjobhrmMda',
-      type: 'orders',
+      id: "qjobhrmMda",
+      type: "orders",
       links: {
-        self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda'
+        self: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda",
       },
       attributes: {
         number: 2454752,
         autorefresh: true,
-        status: 'placed',
-        payment_status: 'authorized',
-        fulfillment_status: 'unfulfilled',
+        status: "placed",
+        payment_status: "authorized",
+        fulfillment_status: "unfulfilled",
         guest: false,
         editable: false,
-        customer_email: 'tony@iron.man',
-        language_code: 'en',
-        currency_code: 'EUR',
+        customer_email: "tony@iron.man",
+        language_code: "en",
+        currency_code: "EUR",
         tax_included: true,
-        tax_rate: '0.22',
+        tax_rate: "0.22",
         freight_taxable: false,
         requires_billing_info: true,
-        country_code: 'IT',
+        country_code: "IT",
         shipping_country_code_lock: null,
         coupon_code: null,
         gift_card_code: null,
         gift_card_or_coupon_code: null,
         subtotal_amount_cents: 3500,
         subtotal_amount_float: 35,
-        formatted_subtotal_amount: '€35,00',
+        formatted_subtotal_amount: "€35,00",
         shipping_amount_cents: 0,
         shipping_amount_float: 0,
-        formatted_shipping_amount: '€0,00',
+        formatted_shipping_amount: "€0,00",
         payment_method_amount_cents: 0,
         payment_method_amount_float: 0,
-        formatted_payment_method_amount: '€0,00',
+        formatted_payment_method_amount: "€0,00",
         discount_amount_cents: 0,
         discount_amount_float: 0,
-        formatted_discount_amount: '€0,00',
+        formatted_discount_amount: "€0,00",
         adjustment_amount_cents: 0,
         adjustment_amount_float: 0,
-        formatted_adjustment_amount: '€0,00',
+        formatted_adjustment_amount: "€0,00",
         gift_card_amount_cents: 0,
         gift_card_amount_float: 0,
-        formatted_gift_card_amount: '€0,00',
+        formatted_gift_card_amount: "€0,00",
         total_tax_amount_cents: 631,
         total_tax_amount_float: 6.31,
-        formatted_total_tax_amount: '€6,31',
+        formatted_total_tax_amount: "€6,31",
         subtotal_tax_amount_cents: 631,
         subtotal_tax_amount_float: 6.31,
-        formatted_subtotal_tax_amount: '€6,31',
+        formatted_subtotal_tax_amount: "€6,31",
         shipping_tax_amount_cents: 0,
         shipping_tax_amount_float: 0,
-        formatted_shipping_tax_amount: '€0,00',
+        formatted_shipping_tax_amount: "€0,00",
         payment_method_tax_amount_cents: 0,
         payment_method_tax_amount_float: 0,
-        formatted_payment_method_tax_amount: '€0,00',
+        formatted_payment_method_tax_amount: "€0,00",
         adjustment_tax_amount_cents: 0,
         adjustment_tax_amount_float: 0,
-        formatted_adjustment_tax_amount: '€0,00',
+        formatted_adjustment_tax_amount: "€0,00",
         total_amount_cents: 3500,
         total_amount_float: 35,
-        formatted_total_amount: '€35,00',
+        formatted_total_amount: "€35,00",
         total_taxable_amount_cents: 2869,
         total_taxable_amount_float: 28.69,
-        formatted_total_taxable_amount: '€28,69',
+        formatted_total_taxable_amount: "€28,69",
         subtotal_taxable_amount_cents: 2869,
         subtotal_taxable_amount_float: 28.69,
-        formatted_subtotal_taxable_amount: '€28,69',
+        formatted_subtotal_taxable_amount: "€28,69",
         shipping_taxable_amount_cents: 0,
         shipping_taxable_amount_float: 0,
-        formatted_shipping_taxable_amount: '€0,00',
+        formatted_shipping_taxable_amount: "€0,00",
         payment_method_taxable_amount_cents: 0,
         payment_method_taxable_amount_float: 0,
-        formatted_payment_method_taxable_amount: '€0,00',
+        formatted_payment_method_taxable_amount: "€0,00",
         adjustment_taxable_amount_cents: 0,
         adjustment_taxable_amount_float: 0,
-        formatted_adjustment_taxable_amount: '€0,00',
+        formatted_adjustment_taxable_amount: "€0,00",
         total_amount_with_taxes_cents: 3500,
         total_amount_with_taxes_float: 35,
-        formatted_total_amount_with_taxes: '€35,00',
+        formatted_total_amount_with_taxes: "€35,00",
         fees_amount_cents: 0,
         fees_amount_float: 0,
-        formatted_fees_amount: '€0,00',
+        formatted_fees_amount: "€0,00",
         duty_amount_cents: null,
         duty_amount_float: null,
         formatted_duty_amount: null,
@@ -1247,261 +1198,250 @@ export const customerOrders = {
         line_item_options_count: 0,
         shipments_count: 1,
         tax_calculations_count: 4,
-        payment_source_details: { type: 'wire_transfer' },
-        token: '714b4c274462db2293dd28ee82dfac46',
+        payment_source_details: { type: "wire_transfer" },
+        token: "714b4c274462db2293dd28ee82dfac46",
         cart_url: null,
         return_url: null,
         terms_url: null,
         privacy_url: null,
         checkout_url: null,
-        placed_at: '2022-12-02T10:19:03.215Z',
+        placed_at: "2022-12-02T10:19:03.215Z",
         approved_at: null,
         cancelled_at: null,
-        payment_updated_at: '2022-12-02T10:19:03.172Z',
+        payment_updated_at: "2022-12-02T10:19:03.172Z",
         fulfillment_updated_at: null,
-        refreshed_at: '2022-12-02T10:18:53.080Z',
+        refreshed_at: "2022-12-02T10:18:53.080Z",
         archived_at: null,
         expires_at: null,
-        created_at: '2022-12-02T10:18:37.220Z',
-        updated_at: '2022-12-02T10:19:03.222Z',
+        created_at: "2022-12-02T10:18:37.220Z",
+        updated_at: "2022-12-02T10:19:03.222Z",
         reference: null,
         reference_origin: null,
-        metadata: {}
+        metadata: {},
       },
       relationships: {
         market: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/market',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/market'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/market",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/market",
+          },
         },
         customer: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/customer',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/customer'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/customer",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/customer",
+          },
         },
         shipping_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/shipping_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/shipping_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/shipping_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/shipping_address",
+          },
         },
         billing_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/billing_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/billing_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/billing_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/billing_address",
+          },
         },
         available_payment_methods: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/available_payment_methods',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/available_payment_methods",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/available_payment_methods'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/available_payment_methods",
+          },
         },
         available_customer_payment_sources: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/available_customer_payment_sources',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/available_customer_payment_sources",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/available_customer_payment_sources'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/available_customer_payment_sources",
+          },
         },
         available_free_skus: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/available_free_skus',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/available_free_skus",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/available_free_skus'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/available_free_skus",
+          },
         },
         available_free_bundles: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/available_free_bundles',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/available_free_bundles",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/available_free_bundles'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/available_free_bundles",
+          },
         },
         payment_method: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/payment_method',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/payment_method",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/payment_method'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/payment_method",
+          },
         },
         payment_source: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/payment_source',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/payment_source",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/payment_source'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/payment_source",
+          },
         },
         line_items: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/line_items',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/line_items'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/line_items",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/line_items",
+          },
         },
         shipments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/shipments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/shipments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/shipments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/shipments",
+          },
         },
         transactions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/transactions',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/transactions'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/transactions",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/transactions",
+          },
         },
         authorizations: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/authorizations',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/authorizations",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/authorizations'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/authorizations",
+          },
         },
         captures: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/captures',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/captures'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/captures",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/captures",
+          },
         },
         voids: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/voids',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/voids'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/voids",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/voids",
+          },
         },
         refunds: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/refunds',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/refunds'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/refunds",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/refunds",
+          },
         },
         order_subscriptions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/order_subscriptions',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/order_subscriptions",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/order_subscriptions'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/order_subscriptions",
+          },
         },
         order_copies: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/order_copies',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/order_copies'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/order_copies",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/order_copies",
+          },
         },
         attachments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/attachments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/attachments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/attachments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/attachments",
+          },
         },
         events: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/events',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/events'
-          }
-        }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/relationships/events",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qjobhrmMda/events",
+          },
+        },
       },
-      meta: { mode: 'test', organization_id: 'enWoxFMOnp' }
+      meta: { mode: "test", organization_id: "enWoxFMOnp" },
     },
     {
-      id: 'NvoJhMOZQv',
-      type: 'orders',
+      id: "NvoJhMOZQv",
+      type: "orders",
       links: {
-        self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv'
+        self: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv",
       },
       attributes: {
         number: 2454749,
         autorefresh: true,
-        status: 'placed',
-        payment_status: 'authorized',
-        fulfillment_status: 'unfulfilled',
+        status: "placed",
+        payment_status: "authorized",
+        fulfillment_status: "unfulfilled",
         guest: false,
         editable: false,
-        customer_email: 'tony@iron.man',
-        language_code: 'en',
-        currency_code: 'EUR',
+        customer_email: "tony@iron.man",
+        language_code: "en",
+        currency_code: "EUR",
         tax_included: true,
-        tax_rate: '0.22',
+        tax_rate: "0.22",
         freight_taxable: false,
         requires_billing_info: true,
-        country_code: 'IT',
+        country_code: "IT",
         shipping_country_code_lock: null,
         coupon_code: null,
         gift_card_code: null,
         gift_card_or_coupon_code: null,
         subtotal_amount_cents: 3500,
         subtotal_amount_float: 35,
-        formatted_subtotal_amount: '€35,00',
+        formatted_subtotal_amount: "€35,00",
         shipping_amount_cents: 0,
         shipping_amount_float: 0,
-        formatted_shipping_amount: '€0,00',
+        formatted_shipping_amount: "€0,00",
         payment_method_amount_cents: 0,
         payment_method_amount_float: 0,
-        formatted_payment_method_amount: '€0,00',
+        formatted_payment_method_amount: "€0,00",
         discount_amount_cents: 0,
         discount_amount_float: 0,
-        formatted_discount_amount: '€0,00',
+        formatted_discount_amount: "€0,00",
         adjustment_amount_cents: 0,
         adjustment_amount_float: 0,
-        formatted_adjustment_amount: '€0,00',
+        formatted_adjustment_amount: "€0,00",
         gift_card_amount_cents: 0,
         gift_card_amount_float: 0,
-        formatted_gift_card_amount: '€0,00',
+        formatted_gift_card_amount: "€0,00",
         total_tax_amount_cents: 631,
         total_tax_amount_float: 6.31,
-        formatted_total_tax_amount: '€6,31',
+        formatted_total_tax_amount: "€6,31",
         subtotal_tax_amount_cents: 631,
         subtotal_tax_amount_float: 6.31,
-        formatted_subtotal_tax_amount: '€6,31',
+        formatted_subtotal_tax_amount: "€6,31",
         shipping_tax_amount_cents: 0,
         shipping_tax_amount_float: 0,
-        formatted_shipping_tax_amount: '€0,00',
+        formatted_shipping_tax_amount: "€0,00",
         payment_method_tax_amount_cents: 0,
         payment_method_tax_amount_float: 0,
-        formatted_payment_method_tax_amount: '€0,00',
+        formatted_payment_method_tax_amount: "€0,00",
         adjustment_tax_amount_cents: 0,
         adjustment_tax_amount_float: 0,
-        formatted_adjustment_tax_amount: '€0,00',
+        formatted_adjustment_tax_amount: "€0,00",
         total_amount_cents: 3500,
         total_amount_float: 35,
-        formatted_total_amount: '€35,00',
+        formatted_total_amount: "€35,00",
         total_taxable_amount_cents: 2869,
         total_taxable_amount_float: 28.69,
-        formatted_total_taxable_amount: '€28,69',
+        formatted_total_taxable_amount: "€28,69",
         subtotal_taxable_amount_cents: 2869,
         subtotal_taxable_amount_float: 28.69,
-        formatted_subtotal_taxable_amount: '€28,69',
+        formatted_subtotal_taxable_amount: "€28,69",
         shipping_taxable_amount_cents: 0,
         shipping_taxable_amount_float: 0,
-        formatted_shipping_taxable_amount: '€0,00',
+        formatted_shipping_taxable_amount: "€0,00",
         payment_method_taxable_amount_cents: 0,
         payment_method_taxable_amount_float: 0,
-        formatted_payment_method_taxable_amount: '€0,00',
+        formatted_payment_method_taxable_amount: "€0,00",
         adjustment_taxable_amount_cents: 0,
         adjustment_taxable_amount_float: 0,
-        formatted_adjustment_taxable_amount: '€0,00',
+        formatted_adjustment_taxable_amount: "€0,00",
         total_amount_with_taxes_cents: 3500,
         total_amount_with_taxes_float: 35,
-        formatted_total_amount_with_taxes: '€35,00',
+        formatted_total_amount_with_taxes: "€35,00",
         fees_amount_cents: 0,
         fees_amount_float: 0,
-        formatted_fees_amount: '€0,00',
+        formatted_fees_amount: "€0,00",
         duty_amount_cents: null,
         duty_amount_float: null,
         formatted_duty_amount: null,
@@ -1509,261 +1449,250 @@ export const customerOrders = {
         line_item_options_count: 0,
         shipments_count: 1,
         tax_calculations_count: 4,
-        payment_source_details: { type: 'wire_transfer' },
-        token: 'b0e5b15d257a783e8d8d08d13a230015',
+        payment_source_details: { type: "wire_transfer" },
+        token: "b0e5b15d257a783e8d8d08d13a230015",
         cart_url: null,
         return_url: null,
         terms_url: null,
         privacy_url: null,
         checkout_url: null,
-        placed_at: '2022-12-02T10:15:07.749Z',
+        placed_at: "2022-12-02T10:15:07.749Z",
         approved_at: null,
         cancelled_at: null,
-        payment_updated_at: '2022-12-02T10:15:07.704Z',
+        payment_updated_at: "2022-12-02T10:15:07.704Z",
         fulfillment_updated_at: null,
-        refreshed_at: '2022-12-02T10:14:58.474Z',
+        refreshed_at: "2022-12-02T10:14:58.474Z",
         archived_at: null,
         expires_at: null,
-        created_at: '2022-12-02T10:14:47.957Z',
-        updated_at: '2022-12-02T10:15:07.755Z',
+        created_at: "2022-12-02T10:14:47.957Z",
+        updated_at: "2022-12-02T10:15:07.755Z",
         reference: null,
         reference_origin: null,
-        metadata: {}
+        metadata: {},
       },
       relationships: {
         market: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/market',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/market'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/market",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/market",
+          },
         },
         customer: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/customer',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/customer'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/customer",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/customer",
+          },
         },
         shipping_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/shipping_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/shipping_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/shipping_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/shipping_address",
+          },
         },
         billing_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/billing_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/billing_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/billing_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/billing_address",
+          },
         },
         available_payment_methods: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/available_payment_methods',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/available_payment_methods",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/available_payment_methods'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/available_payment_methods",
+          },
         },
         available_customer_payment_sources: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/available_customer_payment_sources',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/available_customer_payment_sources",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/available_customer_payment_sources'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/available_customer_payment_sources",
+          },
         },
         available_free_skus: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/available_free_skus',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/available_free_skus",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/available_free_skus'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/available_free_skus",
+          },
         },
         available_free_bundles: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/available_free_bundles',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/available_free_bundles",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/available_free_bundles'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/available_free_bundles",
+          },
         },
         payment_method: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/payment_method',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/payment_method",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/payment_method'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/payment_method",
+          },
         },
         payment_source: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/payment_source',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/payment_source",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/payment_source'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/payment_source",
+          },
         },
         line_items: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/line_items',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/line_items'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/line_items",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/line_items",
+          },
         },
         shipments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/shipments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/shipments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/shipments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/shipments",
+          },
         },
         transactions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/transactions',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/transactions'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/transactions",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/transactions",
+          },
         },
         authorizations: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/authorizations',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/authorizations",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/authorizations'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/authorizations",
+          },
         },
         captures: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/captures',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/captures'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/captures",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/captures",
+          },
         },
         voids: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/voids',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/voids'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/voids",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/voids",
+          },
         },
         refunds: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/refunds',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/refunds'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/refunds",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/refunds",
+          },
         },
         order_subscriptions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/order_subscriptions',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/order_subscriptions",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/order_subscriptions'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/order_subscriptions",
+          },
         },
         order_copies: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/order_copies',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/order_copies'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/order_copies",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/order_copies",
+          },
         },
         attachments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/attachments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/attachments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/attachments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/attachments",
+          },
         },
         events: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/events',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/events'
-          }
-        }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/relationships/events",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NvoJhMOZQv/events",
+          },
+        },
       },
-      meta: { mode: 'test', organization_id: 'enWoxFMOnp' }
+      meta: { mode: "test", organization_id: "enWoxFMOnp" },
     },
     {
-      id: 'qdyBhGZLeE',
-      type: 'orders',
+      id: "qdyBhGZLeE",
+      type: "orders",
       links: {
-        self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE'
+        self: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE",
       },
       attributes: {
         number: 2454750,
         autorefresh: true,
-        status: 'placed',
-        payment_status: 'authorized',
-        fulfillment_status: 'unfulfilled',
+        status: "placed",
+        payment_status: "authorized",
+        fulfillment_status: "unfulfilled",
         guest: false,
         editable: false,
-        customer_email: 'tony@iron.man',
-        language_code: 'en',
-        currency_code: 'EUR',
+        customer_email: "tony@iron.man",
+        language_code: "en",
+        currency_code: "EUR",
         tax_included: true,
-        tax_rate: '0.22',
+        tax_rate: "0.22",
         freight_taxable: false,
         requires_billing_info: true,
-        country_code: 'IT',
+        country_code: "IT",
         shipping_country_code_lock: null,
         coupon_code: null,
         gift_card_code: null,
         gift_card_or_coupon_code: null,
         subtotal_amount_cents: 3500,
         subtotal_amount_float: 35,
-        formatted_subtotal_amount: '€35,00',
+        formatted_subtotal_amount: "€35,00",
         shipping_amount_cents: 0,
         shipping_amount_float: 0,
-        formatted_shipping_amount: '€0,00',
+        formatted_shipping_amount: "€0,00",
         payment_method_amount_cents: 0,
         payment_method_amount_float: 0,
-        formatted_payment_method_amount: '€0,00',
+        formatted_payment_method_amount: "€0,00",
         discount_amount_cents: 0,
         discount_amount_float: 0,
-        formatted_discount_amount: '€0,00',
+        formatted_discount_amount: "€0,00",
         adjustment_amount_cents: 0,
         adjustment_amount_float: 0,
-        formatted_adjustment_amount: '€0,00',
+        formatted_adjustment_amount: "€0,00",
         gift_card_amount_cents: 0,
         gift_card_amount_float: 0,
-        formatted_gift_card_amount: '€0,00',
+        formatted_gift_card_amount: "€0,00",
         total_tax_amount_cents: 631,
         total_tax_amount_float: 6.31,
-        formatted_total_tax_amount: '€6,31',
+        formatted_total_tax_amount: "€6,31",
         subtotal_tax_amount_cents: 631,
         subtotal_tax_amount_float: 6.31,
-        formatted_subtotal_tax_amount: '€6,31',
+        formatted_subtotal_tax_amount: "€6,31",
         shipping_tax_amount_cents: 0,
         shipping_tax_amount_float: 0,
-        formatted_shipping_tax_amount: '€0,00',
+        formatted_shipping_tax_amount: "€0,00",
         payment_method_tax_amount_cents: 0,
         payment_method_tax_amount_float: 0,
-        formatted_payment_method_tax_amount: '€0,00',
+        formatted_payment_method_tax_amount: "€0,00",
         adjustment_tax_amount_cents: 0,
         adjustment_tax_amount_float: 0,
-        formatted_adjustment_tax_amount: '€0,00',
+        formatted_adjustment_tax_amount: "€0,00",
         total_amount_cents: 3500,
         total_amount_float: 35,
-        formatted_total_amount: '€35,00',
+        formatted_total_amount: "€35,00",
         total_taxable_amount_cents: 2869,
         total_taxable_amount_float: 28.69,
-        formatted_total_taxable_amount: '€28,69',
+        formatted_total_taxable_amount: "€28,69",
         subtotal_taxable_amount_cents: 2869,
         subtotal_taxable_amount_float: 28.69,
-        formatted_subtotal_taxable_amount: '€28,69',
+        formatted_subtotal_taxable_amount: "€28,69",
         shipping_taxable_amount_cents: 0,
         shipping_taxable_amount_float: 0,
-        formatted_shipping_taxable_amount: '€0,00',
+        formatted_shipping_taxable_amount: "€0,00",
         payment_method_taxable_amount_cents: 0,
         payment_method_taxable_amount_float: 0,
-        formatted_payment_method_taxable_amount: '€0,00',
+        formatted_payment_method_taxable_amount: "€0,00",
         adjustment_taxable_amount_cents: 0,
         adjustment_taxable_amount_float: 0,
-        formatted_adjustment_taxable_amount: '€0,00',
+        formatted_adjustment_taxable_amount: "€0,00",
         total_amount_with_taxes_cents: 3500,
         total_amount_with_taxes_float: 35,
-        formatted_total_amount_with_taxes: '€35,00',
+        formatted_total_amount_with_taxes: "€35,00",
         fees_amount_cents: 0,
         fees_amount_float: 0,
-        formatted_fees_amount: '€0,00',
+        formatted_fees_amount: "€0,00",
         duty_amount_cents: null,
         duty_amount_float: null,
         formatted_duty_amount: null,
@@ -1771,261 +1700,250 @@ export const customerOrders = {
         line_item_options_count: 0,
         shipments_count: 1,
         tax_calculations_count: 4,
-        payment_source_details: { type: 'wire_transfer' },
-        token: 'd1ddf5a4ebd81453bb445c44727c2eb2',
+        payment_source_details: { type: "wire_transfer" },
+        token: "d1ddf5a4ebd81453bb445c44727c2eb2",
         cart_url: null,
         return_url: null,
         terms_url: null,
         privacy_url: null,
         checkout_url: null,
-        placed_at: '2022-12-02T10:16:32.250Z',
+        placed_at: "2022-12-02T10:16:32.250Z",
         approved_at: null,
         cancelled_at: null,
-        payment_updated_at: '2022-12-02T10:16:32.200Z',
+        payment_updated_at: "2022-12-02T10:16:32.200Z",
         fulfillment_updated_at: null,
-        refreshed_at: '2022-12-02T10:16:21.270Z',
+        refreshed_at: "2022-12-02T10:16:21.270Z",
         archived_at: null,
         expires_at: null,
-        created_at: '2022-12-02T10:15:55.592Z',
-        updated_at: '2022-12-02T10:16:32.257Z',
+        created_at: "2022-12-02T10:15:55.592Z",
+        updated_at: "2022-12-02T10:16:32.257Z",
         reference: null,
         reference_origin: null,
-        metadata: {}
+        metadata: {},
       },
       relationships: {
         market: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/market',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/market'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/market",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/market",
+          },
         },
         customer: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/customer',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/customer'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/customer",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/customer",
+          },
         },
         shipping_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/shipping_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/shipping_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/shipping_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/shipping_address",
+          },
         },
         billing_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/billing_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/billing_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/billing_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/billing_address",
+          },
         },
         available_payment_methods: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/available_payment_methods',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/available_payment_methods",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/available_payment_methods'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/available_payment_methods",
+          },
         },
         available_customer_payment_sources: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/available_customer_payment_sources',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/available_customer_payment_sources",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/available_customer_payment_sources'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/available_customer_payment_sources",
+          },
         },
         available_free_skus: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/available_free_skus',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/available_free_skus",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/available_free_skus'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/available_free_skus",
+          },
         },
         available_free_bundles: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/available_free_bundles',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/available_free_bundles",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/available_free_bundles'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/available_free_bundles",
+          },
         },
         payment_method: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/payment_method',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/payment_method",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/payment_method'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/payment_method",
+          },
         },
         payment_source: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/payment_source',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/payment_source",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/payment_source'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/payment_source",
+          },
         },
         line_items: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/line_items',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/line_items'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/line_items",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/line_items",
+          },
         },
         shipments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/shipments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/shipments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/shipments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/shipments",
+          },
         },
         transactions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/transactions',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/transactions'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/transactions",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/transactions",
+          },
         },
         authorizations: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/authorizations',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/authorizations",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/authorizations'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/authorizations",
+          },
         },
         captures: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/captures',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/captures'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/captures",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/captures",
+          },
         },
         voids: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/voids',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/voids'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/voids",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/voids",
+          },
         },
         refunds: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/refunds',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/refunds'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/refunds",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/refunds",
+          },
         },
         order_subscriptions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/order_subscriptions',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/order_subscriptions",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/order_subscriptions'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/order_subscriptions",
+          },
         },
         order_copies: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/order_copies',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/order_copies'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/order_copies",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/order_copies",
+          },
         },
         attachments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/attachments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/attachments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/attachments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/attachments",
+          },
         },
         events: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/events',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/events'
-          }
-        }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/relationships/events",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qdyBhGZLeE/events",
+          },
+        },
       },
-      meta: { mode: 'test', organization_id: 'enWoxFMOnp' }
+      meta: { mode: "test", organization_id: "enWoxFMOnp" },
     },
     {
-      id: 'qOBnhVabXe',
-      type: 'orders',
+      id: "qOBnhVabXe",
+      type: "orders",
       links: {
-        self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe'
+        self: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe",
       },
       attributes: {
         number: 2454751,
         autorefresh: true,
-        status: 'placed',
-        payment_status: 'authorized',
-        fulfillment_status: 'unfulfilled',
+        status: "placed",
+        payment_status: "authorized",
+        fulfillment_status: "unfulfilled",
         guest: false,
         editable: false,
-        customer_email: 'tony@iron.man',
-        language_code: 'en',
-        currency_code: 'EUR',
+        customer_email: "tony@iron.man",
+        language_code: "en",
+        currency_code: "EUR",
         tax_included: true,
-        tax_rate: '0.22',
+        tax_rate: "0.22",
         freight_taxable: false,
         requires_billing_info: true,
-        country_code: 'IT',
+        country_code: "IT",
         shipping_country_code_lock: null,
         coupon_code: null,
         gift_card_code: null,
         gift_card_or_coupon_code: null,
         subtotal_amount_cents: 3500,
         subtotal_amount_float: 35,
-        formatted_subtotal_amount: '€35,00',
+        formatted_subtotal_amount: "€35,00",
         shipping_amount_cents: 0,
         shipping_amount_float: 0,
-        formatted_shipping_amount: '€0,00',
+        formatted_shipping_amount: "€0,00",
         payment_method_amount_cents: 0,
         payment_method_amount_float: 0,
-        formatted_payment_method_amount: '€0,00',
+        formatted_payment_method_amount: "€0,00",
         discount_amount_cents: 0,
         discount_amount_float: 0,
-        formatted_discount_amount: '€0,00',
+        formatted_discount_amount: "€0,00",
         adjustment_amount_cents: 0,
         adjustment_amount_float: 0,
-        formatted_adjustment_amount: '€0,00',
+        formatted_adjustment_amount: "€0,00",
         gift_card_amount_cents: 0,
         gift_card_amount_float: 0,
-        formatted_gift_card_amount: '€0,00',
+        formatted_gift_card_amount: "€0,00",
         total_tax_amount_cents: 631,
         total_tax_amount_float: 6.31,
-        formatted_total_tax_amount: '€6,31',
+        formatted_total_tax_amount: "€6,31",
         subtotal_tax_amount_cents: 631,
         subtotal_tax_amount_float: 6.31,
-        formatted_subtotal_tax_amount: '€6,31',
+        formatted_subtotal_tax_amount: "€6,31",
         shipping_tax_amount_cents: 0,
         shipping_tax_amount_float: 0,
-        formatted_shipping_tax_amount: '€0,00',
+        formatted_shipping_tax_amount: "€0,00",
         payment_method_tax_amount_cents: 0,
         payment_method_tax_amount_float: 0,
-        formatted_payment_method_tax_amount: '€0,00',
+        formatted_payment_method_tax_amount: "€0,00",
         adjustment_tax_amount_cents: 0,
         adjustment_tax_amount_float: 0,
-        formatted_adjustment_tax_amount: '€0,00',
+        formatted_adjustment_tax_amount: "€0,00",
         total_amount_cents: 3500,
         total_amount_float: 35,
-        formatted_total_amount: '€35,00',
+        formatted_total_amount: "€35,00",
         total_taxable_amount_cents: 2869,
         total_taxable_amount_float: 28.69,
-        formatted_total_taxable_amount: '€28,69',
+        formatted_total_taxable_amount: "€28,69",
         subtotal_taxable_amount_cents: 2869,
         subtotal_taxable_amount_float: 28.69,
-        formatted_subtotal_taxable_amount: '€28,69',
+        formatted_subtotal_taxable_amount: "€28,69",
         shipping_taxable_amount_cents: 0,
         shipping_taxable_amount_float: 0,
-        formatted_shipping_taxable_amount: '€0,00',
+        formatted_shipping_taxable_amount: "€0,00",
         payment_method_taxable_amount_cents: 0,
         payment_method_taxable_amount_float: 0,
-        formatted_payment_method_taxable_amount: '€0,00',
+        formatted_payment_method_taxable_amount: "€0,00",
         adjustment_taxable_amount_cents: 0,
         adjustment_taxable_amount_float: 0,
-        formatted_adjustment_taxable_amount: '€0,00',
+        formatted_adjustment_taxable_amount: "€0,00",
         total_amount_with_taxes_cents: 3500,
         total_amount_with_taxes_float: 35,
-        formatted_total_amount_with_taxes: '€35,00',
+        formatted_total_amount_with_taxes: "€35,00",
         fees_amount_cents: 0,
         fees_amount_float: 0,
-        formatted_fees_amount: '€0,00',
+        formatted_fees_amount: "€0,00",
         duty_amount_cents: null,
         duty_amount_float: null,
         formatted_duty_amount: null,
@@ -2033,261 +1951,250 @@ export const customerOrders = {
         line_item_options_count: 0,
         shipments_count: 1,
         tax_calculations_count: 4,
-        payment_source_details: { type: 'wire_transfer' },
-        token: '322ec4f42342d295a9b6776ad7ca1454',
+        payment_source_details: { type: "wire_transfer" },
+        token: "322ec4f42342d295a9b6776ad7ca1454",
         cart_url: null,
         return_url: null,
         terms_url: null,
         privacy_url: null,
         checkout_url: null,
-        placed_at: '2022-12-02T10:18:11.950Z',
+        placed_at: "2022-12-02T10:18:11.950Z",
         approved_at: null,
         cancelled_at: null,
-        payment_updated_at: '2022-12-02T10:18:11.907Z',
+        payment_updated_at: "2022-12-02T10:18:11.907Z",
         fulfillment_updated_at: null,
-        refreshed_at: '2022-12-02T10:18:00.818Z',
+        refreshed_at: "2022-12-02T10:18:00.818Z",
         archived_at: null,
         expires_at: null,
-        created_at: '2022-12-02T10:17:51.103Z',
-        updated_at: '2022-12-02T10:18:11.956Z',
+        created_at: "2022-12-02T10:17:51.103Z",
+        updated_at: "2022-12-02T10:18:11.956Z",
         reference: null,
         reference_origin: null,
-        metadata: {}
+        metadata: {},
       },
       relationships: {
         market: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/market',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/market'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/market",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/market",
+          },
         },
         customer: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/customer',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/customer'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/customer",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/customer",
+          },
         },
         shipping_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/shipping_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/shipping_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/shipping_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/shipping_address",
+          },
         },
         billing_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/billing_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/billing_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/billing_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/billing_address",
+          },
         },
         available_payment_methods: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/available_payment_methods',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/available_payment_methods",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/available_payment_methods'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/available_payment_methods",
+          },
         },
         available_customer_payment_sources: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/available_customer_payment_sources',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/available_customer_payment_sources",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/available_customer_payment_sources'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/available_customer_payment_sources",
+          },
         },
         available_free_skus: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/available_free_skus',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/available_free_skus",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/available_free_skus'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/available_free_skus",
+          },
         },
         available_free_bundles: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/available_free_bundles',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/available_free_bundles",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/available_free_bundles'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/available_free_bundles",
+          },
         },
         payment_method: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/payment_method',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/payment_method",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/payment_method'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/payment_method",
+          },
         },
         payment_source: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/payment_source',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/payment_source",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/payment_source'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/payment_source",
+          },
         },
         line_items: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/line_items',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/line_items'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/line_items",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/line_items",
+          },
         },
         shipments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/shipments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/shipments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/shipments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/shipments",
+          },
         },
         transactions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/transactions',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/transactions'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/transactions",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/transactions",
+          },
         },
         authorizations: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/authorizations',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/authorizations",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/authorizations'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/authorizations",
+          },
         },
         captures: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/captures',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/captures'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/captures",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/captures",
+          },
         },
         voids: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/voids',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/voids'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/voids",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/voids",
+          },
         },
         refunds: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/refunds',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/refunds'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/refunds",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/refunds",
+          },
         },
         order_subscriptions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/order_subscriptions',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/order_subscriptions",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/order_subscriptions'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/order_subscriptions",
+          },
         },
         order_copies: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/order_copies',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/order_copies'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/order_copies",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/order_copies",
+          },
         },
         attachments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/attachments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/attachments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/attachments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/attachments",
+          },
         },
         events: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/events',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/events'
-          }
-        }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/relationships/events",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qOBnhVabXe/events",
+          },
+        },
       },
-      meta: { mode: 'test', organization_id: 'enWoxFMOnp' }
+      meta: { mode: "test", organization_id: "enWoxFMOnp" },
     },
     {
-      id: 'NVlXhyBLja',
-      type: 'orders',
+      id: "NVlXhyBLja",
+      type: "orders",
       links: {
-        self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja'
+        self: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja",
       },
       attributes: {
         number: 2454753,
         autorefresh: true,
-        status: 'placed',
-        payment_status: 'authorized',
-        fulfillment_status: 'unfulfilled',
+        status: "placed",
+        payment_status: "authorized",
+        fulfillment_status: "unfulfilled",
         guest: false,
         editable: false,
-        customer_email: 'tony@iron.man',
-        language_code: 'en',
-        currency_code: 'EUR',
+        customer_email: "tony@iron.man",
+        language_code: "en",
+        currency_code: "EUR",
         tax_included: true,
-        tax_rate: '0.22',
+        tax_rate: "0.22",
         freight_taxable: false,
         requires_billing_info: true,
-        country_code: 'IT',
+        country_code: "IT",
         shipping_country_code_lock: null,
         coupon_code: null,
         gift_card_code: null,
         gift_card_or_coupon_code: null,
         subtotal_amount_cents: 3500,
         subtotal_amount_float: 35,
-        formatted_subtotal_amount: '€35,00',
+        formatted_subtotal_amount: "€35,00",
         shipping_amount_cents: 0,
         shipping_amount_float: 0,
-        formatted_shipping_amount: '€0,00',
+        formatted_shipping_amount: "€0,00",
         payment_method_amount_cents: 0,
         payment_method_amount_float: 0,
-        formatted_payment_method_amount: '€0,00',
+        formatted_payment_method_amount: "€0,00",
         discount_amount_cents: 0,
         discount_amount_float: 0,
-        formatted_discount_amount: '€0,00',
+        formatted_discount_amount: "€0,00",
         adjustment_amount_cents: 0,
         adjustment_amount_float: 0,
-        formatted_adjustment_amount: '€0,00',
+        formatted_adjustment_amount: "€0,00",
         gift_card_amount_cents: 0,
         gift_card_amount_float: 0,
-        formatted_gift_card_amount: '€0,00',
+        formatted_gift_card_amount: "€0,00",
         total_tax_amount_cents: 631,
         total_tax_amount_float: 6.31,
-        formatted_total_tax_amount: '€6,31',
+        formatted_total_tax_amount: "€6,31",
         subtotal_tax_amount_cents: 631,
         subtotal_tax_amount_float: 6.31,
-        formatted_subtotal_tax_amount: '€6,31',
+        formatted_subtotal_tax_amount: "€6,31",
         shipping_tax_amount_cents: 0,
         shipping_tax_amount_float: 0,
-        formatted_shipping_tax_amount: '€0,00',
+        formatted_shipping_tax_amount: "€0,00",
         payment_method_tax_amount_cents: 0,
         payment_method_tax_amount_float: 0,
-        formatted_payment_method_tax_amount: '€0,00',
+        formatted_payment_method_tax_amount: "€0,00",
         adjustment_tax_amount_cents: 0,
         adjustment_tax_amount_float: 0,
-        formatted_adjustment_tax_amount: '€0,00',
+        formatted_adjustment_tax_amount: "€0,00",
         total_amount_cents: 3500,
         total_amount_float: 35,
-        formatted_total_amount: '€35,00',
+        formatted_total_amount: "€35,00",
         total_taxable_amount_cents: 2869,
         total_taxable_amount_float: 28.69,
-        formatted_total_taxable_amount: '€28,69',
+        formatted_total_taxable_amount: "€28,69",
         subtotal_taxable_amount_cents: 2869,
         subtotal_taxable_amount_float: 28.69,
-        formatted_subtotal_taxable_amount: '€28,69',
+        formatted_subtotal_taxable_amount: "€28,69",
         shipping_taxable_amount_cents: 0,
         shipping_taxable_amount_float: 0,
-        formatted_shipping_taxable_amount: '€0,00',
+        formatted_shipping_taxable_amount: "€0,00",
         payment_method_taxable_amount_cents: 0,
         payment_method_taxable_amount_float: 0,
-        formatted_payment_method_taxable_amount: '€0,00',
+        formatted_payment_method_taxable_amount: "€0,00",
         adjustment_taxable_amount_cents: 0,
         adjustment_taxable_amount_float: 0,
-        formatted_adjustment_taxable_amount: '€0,00',
+        formatted_adjustment_taxable_amount: "€0,00",
         total_amount_with_taxes_cents: 3500,
         total_amount_with_taxes_float: 35,
-        formatted_total_amount_with_taxes: '€35,00',
+        formatted_total_amount_with_taxes: "€35,00",
         fees_amount_cents: 0,
         fees_amount_float: 0,
-        formatted_fees_amount: '€0,00',
+        formatted_fees_amount: "€0,00",
         duty_amount_cents: null,
         duty_amount_float: null,
         formatted_duty_amount: null,
@@ -2295,261 +2202,250 @@ export const customerOrders = {
         line_item_options_count: 0,
         shipments_count: 1,
         tax_calculations_count: 4,
-        payment_source_details: { type: 'wire_transfer' },
-        token: '077a778c2cb32031da34a2fb3e401256',
+        payment_source_details: { type: "wire_transfer" },
+        token: "077a778c2cb32031da34a2fb3e401256",
         cart_url: null,
         return_url: null,
         terms_url: null,
         privacy_url: null,
         checkout_url: null,
-        placed_at: '2022-12-02T10:22:38.535Z',
+        placed_at: "2022-12-02T10:22:38.535Z",
         approved_at: null,
         cancelled_at: null,
-        payment_updated_at: '2022-12-02T10:22:38.487Z',
+        payment_updated_at: "2022-12-02T10:22:38.487Z",
         fulfillment_updated_at: null,
-        refreshed_at: '2022-12-02T10:22:21.723Z',
+        refreshed_at: "2022-12-02T10:22:21.723Z",
         archived_at: null,
         expires_at: null,
-        created_at: '2022-12-02T10:22:04.198Z',
-        updated_at: '2022-12-02T10:22:38.549Z',
+        created_at: "2022-12-02T10:22:04.198Z",
+        updated_at: "2022-12-02T10:22:38.549Z",
         reference: null,
         reference_origin: null,
-        metadata: {}
+        metadata: {},
       },
       relationships: {
         market: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/market',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/market'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/market",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/market",
+          },
         },
         customer: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/customer',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/customer'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/customer",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/customer",
+          },
         },
         shipping_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/shipping_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/shipping_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/shipping_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/shipping_address",
+          },
         },
         billing_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/billing_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/billing_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/billing_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/billing_address",
+          },
         },
         available_payment_methods: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/available_payment_methods',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/available_payment_methods",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/available_payment_methods'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/available_payment_methods",
+          },
         },
         available_customer_payment_sources: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/available_customer_payment_sources',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/available_customer_payment_sources",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/available_customer_payment_sources'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/available_customer_payment_sources",
+          },
         },
         available_free_skus: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/available_free_skus',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/available_free_skus",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/available_free_skus'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/available_free_skus",
+          },
         },
         available_free_bundles: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/available_free_bundles',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/available_free_bundles",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/available_free_bundles'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/available_free_bundles",
+          },
         },
         payment_method: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/payment_method',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/payment_method",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/payment_method'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/payment_method",
+          },
         },
         payment_source: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/payment_source',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/payment_source",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/payment_source'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/payment_source",
+          },
         },
         line_items: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/line_items',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/line_items'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/line_items",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/line_items",
+          },
         },
         shipments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/shipments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/shipments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/shipments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/shipments",
+          },
         },
         transactions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/transactions',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/transactions'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/transactions",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/transactions",
+          },
         },
         authorizations: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/authorizations',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/authorizations",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/authorizations'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/authorizations",
+          },
         },
         captures: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/captures',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/captures'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/captures",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/captures",
+          },
         },
         voids: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/voids',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/voids'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/voids",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/voids",
+          },
         },
         refunds: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/refunds',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/refunds'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/refunds",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/refunds",
+          },
         },
         order_subscriptions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/order_subscriptions',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/order_subscriptions",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/order_subscriptions'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/order_subscriptions",
+          },
         },
         order_copies: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/order_copies',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/order_copies'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/order_copies",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/order_copies",
+          },
         },
         attachments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/attachments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/attachments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/attachments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/attachments",
+          },
         },
         events: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/events',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/events'
-          }
-        }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/relationships/events",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NVlXhyBLja/events",
+          },
+        },
       },
-      meta: { mode: 'test', organization_id: 'enWoxFMOnp' }
+      meta: { mode: "test", organization_id: "enWoxFMOnp" },
     },
     {
-      id: 'NMWYhbYaBy',
-      type: 'orders',
+      id: "NMWYhbYaBy",
+      type: "orders",
       links: {
-        self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy'
+        self: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy",
       },
       attributes: {
         number: 2454754,
         autorefresh: true,
-        status: 'placed',
-        payment_status: 'authorized',
-        fulfillment_status: 'unfulfilled',
+        status: "placed",
+        payment_status: "authorized",
+        fulfillment_status: "unfulfilled",
         guest: false,
         editable: false,
-        customer_email: 'tony@iron.man',
-        language_code: 'en',
-        currency_code: 'EUR',
+        customer_email: "tony@iron.man",
+        language_code: "en",
+        currency_code: "EUR",
         tax_included: true,
-        tax_rate: '0.22',
+        tax_rate: "0.22",
         freight_taxable: false,
         requires_billing_info: true,
-        country_code: 'IT',
+        country_code: "IT",
         shipping_country_code_lock: null,
         coupon_code: null,
         gift_card_code: null,
         gift_card_or_coupon_code: null,
         subtotal_amount_cents: 3500,
         subtotal_amount_float: 35,
-        formatted_subtotal_amount: '€35,00',
+        formatted_subtotal_amount: "€35,00",
         shipping_amount_cents: 0,
         shipping_amount_float: 0,
-        formatted_shipping_amount: '€0,00',
+        formatted_shipping_amount: "€0,00",
         payment_method_amount_cents: 0,
         payment_method_amount_float: 0,
-        formatted_payment_method_amount: '€0,00',
+        formatted_payment_method_amount: "€0,00",
         discount_amount_cents: 0,
         discount_amount_float: 0,
-        formatted_discount_amount: '€0,00',
+        formatted_discount_amount: "€0,00",
         adjustment_amount_cents: 0,
         adjustment_amount_float: 0,
-        formatted_adjustment_amount: '€0,00',
+        formatted_adjustment_amount: "€0,00",
         gift_card_amount_cents: 0,
         gift_card_amount_float: 0,
-        formatted_gift_card_amount: '€0,00',
+        formatted_gift_card_amount: "€0,00",
         total_tax_amount_cents: 631,
         total_tax_amount_float: 6.31,
-        formatted_total_tax_amount: '€6,31',
+        formatted_total_tax_amount: "€6,31",
         subtotal_tax_amount_cents: 631,
         subtotal_tax_amount_float: 6.31,
-        formatted_subtotal_tax_amount: '€6,31',
+        formatted_subtotal_tax_amount: "€6,31",
         shipping_tax_amount_cents: 0,
         shipping_tax_amount_float: 0,
-        formatted_shipping_tax_amount: '€0,00',
+        formatted_shipping_tax_amount: "€0,00",
         payment_method_tax_amount_cents: 0,
         payment_method_tax_amount_float: 0,
-        formatted_payment_method_tax_amount: '€0,00',
+        formatted_payment_method_tax_amount: "€0,00",
         adjustment_tax_amount_cents: 0,
         adjustment_tax_amount_float: 0,
-        formatted_adjustment_tax_amount: '€0,00',
+        formatted_adjustment_tax_amount: "€0,00",
         total_amount_cents: 3500,
         total_amount_float: 35,
-        formatted_total_amount: '€35,00',
+        formatted_total_amount: "€35,00",
         total_taxable_amount_cents: 2869,
         total_taxable_amount_float: 28.69,
-        formatted_total_taxable_amount: '€28,69',
+        formatted_total_taxable_amount: "€28,69",
         subtotal_taxable_amount_cents: 2869,
         subtotal_taxable_amount_float: 28.69,
-        formatted_subtotal_taxable_amount: '€28,69',
+        formatted_subtotal_taxable_amount: "€28,69",
         shipping_taxable_amount_cents: 0,
         shipping_taxable_amount_float: 0,
-        formatted_shipping_taxable_amount: '€0,00',
+        formatted_shipping_taxable_amount: "€0,00",
         payment_method_taxable_amount_cents: 0,
         payment_method_taxable_amount_float: 0,
-        formatted_payment_method_taxable_amount: '€0,00',
+        formatted_payment_method_taxable_amount: "€0,00",
         adjustment_taxable_amount_cents: 0,
         adjustment_taxable_amount_float: 0,
-        formatted_adjustment_taxable_amount: '€0,00',
+        formatted_adjustment_taxable_amount: "€0,00",
         total_amount_with_taxes_cents: 3500,
         total_amount_with_taxes_float: 35,
-        formatted_total_amount_with_taxes: '€35,00',
+        formatted_total_amount_with_taxes: "€35,00",
         fees_amount_cents: 0,
         fees_amount_float: 0,
-        formatted_fees_amount: '€0,00',
+        formatted_fees_amount: "€0,00",
         duty_amount_cents: null,
         duty_amount_float: null,
         formatted_duty_amount: null,
@@ -2557,261 +2453,250 @@ export const customerOrders = {
         line_item_options_count: 0,
         shipments_count: 1,
         tax_calculations_count: 6,
-        payment_source_details: { type: 'wire_transfer' },
-        token: '9d772e917c6cece5eb57750e2bc966bc',
+        payment_source_details: { type: "wire_transfer" },
+        token: "9d772e917c6cece5eb57750e2bc966bc",
         cart_url: null,
         return_url: null,
         terms_url: null,
         privacy_url: null,
         checkout_url: null,
-        placed_at: '2022-12-02T10:23:25.812Z',
+        placed_at: "2022-12-02T10:23:25.812Z",
         approved_at: null,
         cancelled_at: null,
-        payment_updated_at: '2022-12-02T10:23:25.770Z',
+        payment_updated_at: "2022-12-02T10:23:25.770Z",
         fulfillment_updated_at: null,
-        refreshed_at: '2022-12-02T10:23:04.326Z',
+        refreshed_at: "2022-12-02T10:23:04.326Z",
         archived_at: null,
         expires_at: null,
-        created_at: '2022-12-02T10:22:48.891Z',
-        updated_at: '2022-12-02T10:23:25.820Z',
+        created_at: "2022-12-02T10:22:48.891Z",
+        updated_at: "2022-12-02T10:23:25.820Z",
         reference: null,
         reference_origin: null,
-        metadata: {}
+        metadata: {},
       },
       relationships: {
         market: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/market',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/market'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/market",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/market",
+          },
         },
         customer: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/customer',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/customer'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/customer",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/customer",
+          },
         },
         shipping_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/shipping_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/shipping_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/shipping_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/shipping_address",
+          },
         },
         billing_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/billing_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/billing_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/billing_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/billing_address",
+          },
         },
         available_payment_methods: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/available_payment_methods',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/available_payment_methods",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/available_payment_methods'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/available_payment_methods",
+          },
         },
         available_customer_payment_sources: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/available_customer_payment_sources',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/available_customer_payment_sources",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/available_customer_payment_sources'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/available_customer_payment_sources",
+          },
         },
         available_free_skus: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/available_free_skus',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/available_free_skus",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/available_free_skus'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/available_free_skus",
+          },
         },
         available_free_bundles: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/available_free_bundles',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/available_free_bundles",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/available_free_bundles'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/available_free_bundles",
+          },
         },
         payment_method: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/payment_method',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/payment_method",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/payment_method'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/payment_method",
+          },
         },
         payment_source: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/payment_source',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/payment_source",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/payment_source'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/payment_source",
+          },
         },
         line_items: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/line_items',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/line_items'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/line_items",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/line_items",
+          },
         },
         shipments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/shipments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/shipments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/shipments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/shipments",
+          },
         },
         transactions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/transactions',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/transactions'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/transactions",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/transactions",
+          },
         },
         authorizations: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/authorizations',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/authorizations",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/authorizations'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/authorizations",
+          },
         },
         captures: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/captures',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/captures'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/captures",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/captures",
+          },
         },
         voids: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/voids',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/voids'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/voids",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/voids",
+          },
         },
         refunds: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/refunds',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/refunds'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/refunds",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/refunds",
+          },
         },
         order_subscriptions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/order_subscriptions',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/order_subscriptions",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/order_subscriptions'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/order_subscriptions",
+          },
         },
         order_copies: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/order_copies',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/order_copies'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/order_copies",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/order_copies",
+          },
         },
         attachments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/attachments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/attachments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/attachments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/attachments",
+          },
         },
         events: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/events',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/events'
-          }
-        }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/relationships/events",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/NMWYhbYaBy/events",
+          },
+        },
       },
-      meta: { mode: 'test', organization_id: 'enWoxFMOnp' }
+      meta: { mode: "test", organization_id: "enWoxFMOnp" },
     },
     {
-      id: 'PbQLhypYdr',
-      type: 'orders',
+      id: "PbQLhypYdr",
+      type: "orders",
       links: {
-        self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr'
+        self: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr",
       },
       attributes: {
         number: 2454755,
         autorefresh: true,
-        status: 'placed',
-        payment_status: 'authorized',
-        fulfillment_status: 'unfulfilled',
+        status: "placed",
+        payment_status: "authorized",
+        fulfillment_status: "unfulfilled",
         guest: false,
         editable: false,
-        customer_email: 'tony@iron.man',
-        language_code: 'en',
-        currency_code: 'EUR',
+        customer_email: "tony@iron.man",
+        language_code: "en",
+        currency_code: "EUR",
         tax_included: true,
-        tax_rate: '0.22',
+        tax_rate: "0.22",
         freight_taxable: false,
         requires_billing_info: true,
-        country_code: 'IT',
+        country_code: "IT",
         shipping_country_code_lock: null,
         coupon_code: null,
         gift_card_code: null,
         gift_card_or_coupon_code: null,
         subtotal_amount_cents: 3500,
         subtotal_amount_float: 35,
-        formatted_subtotal_amount: '€35,00',
+        formatted_subtotal_amount: "€35,00",
         shipping_amount_cents: 0,
         shipping_amount_float: 0,
-        formatted_shipping_amount: '€0,00',
+        formatted_shipping_amount: "€0,00",
         payment_method_amount_cents: 0,
         payment_method_amount_float: 0,
-        formatted_payment_method_amount: '€0,00',
+        formatted_payment_method_amount: "€0,00",
         discount_amount_cents: 0,
         discount_amount_float: 0,
-        formatted_discount_amount: '€0,00',
+        formatted_discount_amount: "€0,00",
         adjustment_amount_cents: 0,
         adjustment_amount_float: 0,
-        formatted_adjustment_amount: '€0,00',
+        formatted_adjustment_amount: "€0,00",
         gift_card_amount_cents: 0,
         gift_card_amount_float: 0,
-        formatted_gift_card_amount: '€0,00',
+        formatted_gift_card_amount: "€0,00",
         total_tax_amount_cents: 631,
         total_tax_amount_float: 6.31,
-        formatted_total_tax_amount: '€6,31',
+        formatted_total_tax_amount: "€6,31",
         subtotal_tax_amount_cents: 631,
         subtotal_tax_amount_float: 6.31,
-        formatted_subtotal_tax_amount: '€6,31',
+        formatted_subtotal_tax_amount: "€6,31",
         shipping_tax_amount_cents: 0,
         shipping_tax_amount_float: 0,
-        formatted_shipping_tax_amount: '€0,00',
+        formatted_shipping_tax_amount: "€0,00",
         payment_method_tax_amount_cents: 0,
         payment_method_tax_amount_float: 0,
-        formatted_payment_method_tax_amount: '€0,00',
+        formatted_payment_method_tax_amount: "€0,00",
         adjustment_tax_amount_cents: 0,
         adjustment_tax_amount_float: 0,
-        formatted_adjustment_tax_amount: '€0,00',
+        formatted_adjustment_tax_amount: "€0,00",
         total_amount_cents: 3500,
         total_amount_float: 35,
-        formatted_total_amount: '€35,00',
+        formatted_total_amount: "€35,00",
         total_taxable_amount_cents: 2869,
         total_taxable_amount_float: 28.69,
-        formatted_total_taxable_amount: '€28,69',
+        formatted_total_taxable_amount: "€28,69",
         subtotal_taxable_amount_cents: 2869,
         subtotal_taxable_amount_float: 28.69,
-        formatted_subtotal_taxable_amount: '€28,69',
+        formatted_subtotal_taxable_amount: "€28,69",
         shipping_taxable_amount_cents: 0,
         shipping_taxable_amount_float: 0,
-        formatted_shipping_taxable_amount: '€0,00',
+        formatted_shipping_taxable_amount: "€0,00",
         payment_method_taxable_amount_cents: 0,
         payment_method_taxable_amount_float: 0,
-        formatted_payment_method_taxable_amount: '€0,00',
+        formatted_payment_method_taxable_amount: "€0,00",
         adjustment_taxable_amount_cents: 0,
         adjustment_taxable_amount_float: 0,
-        formatted_adjustment_taxable_amount: '€0,00',
+        formatted_adjustment_taxable_amount: "€0,00",
         total_amount_with_taxes_cents: 3500,
         total_amount_with_taxes_float: 35,
-        formatted_total_amount_with_taxes: '€35,00',
+        formatted_total_amount_with_taxes: "€35,00",
         fees_amount_cents: 0,
         fees_amount_float: 0,
-        formatted_fees_amount: '€0,00',
+        formatted_fees_amount: "€0,00",
         duty_amount_cents: null,
         duty_amount_float: null,
         formatted_duty_amount: null,
@@ -2819,195 +2704,184 @@ export const customerOrders = {
         line_item_options_count: 0,
         shipments_count: 1,
         tax_calculations_count: 5,
-        payment_source_details: { type: 'wire_transfer' },
-        token: 'e863b6888a844b4f87c120e934f7c1b7',
+        payment_source_details: { type: "wire_transfer" },
+        token: "e863b6888a844b4f87c120e934f7c1b7",
         cart_url: null,
         return_url: null,
         terms_url: null,
         privacy_url: null,
         checkout_url: null,
-        placed_at: '2022-12-02T10:24:06.271Z',
+        placed_at: "2022-12-02T10:24:06.271Z",
         approved_at: null,
         cancelled_at: null,
-        payment_updated_at: '2022-12-02T10:24:06.228Z',
+        payment_updated_at: "2022-12-02T10:24:06.228Z",
         fulfillment_updated_at: null,
-        refreshed_at: '2022-12-02T10:23:48.380Z',
+        refreshed_at: "2022-12-02T10:23:48.380Z",
         archived_at: null,
         expires_at: null,
-        created_at: '2022-12-02T10:23:31.900Z',
-        updated_at: '2022-12-02T10:24:06.277Z',
+        created_at: "2022-12-02T10:23:31.900Z",
+        updated_at: "2022-12-02T10:24:06.277Z",
         reference: null,
         reference_origin: null,
-        metadata: {}
+        metadata: {},
       },
       relationships: {
         market: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/market',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/market'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/market",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/market",
+          },
         },
         customer: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/customer',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/customer'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/customer",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/customer",
+          },
         },
         shipping_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/shipping_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/shipping_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/shipping_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/shipping_address",
+          },
         },
         billing_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/billing_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/billing_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/billing_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/billing_address",
+          },
         },
         available_payment_methods: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/available_payment_methods',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/available_payment_methods",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/available_payment_methods'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/available_payment_methods",
+          },
         },
         available_customer_payment_sources: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/available_customer_payment_sources',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/available_customer_payment_sources",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/available_customer_payment_sources'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/available_customer_payment_sources",
+          },
         },
         available_free_skus: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/available_free_skus',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/available_free_skus",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/available_free_skus'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/available_free_skus",
+          },
         },
         available_free_bundles: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/available_free_bundles',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/available_free_bundles",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/available_free_bundles'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/available_free_bundles",
+          },
         },
         payment_method: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/payment_method',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/payment_method",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/payment_method'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/payment_method",
+          },
         },
         payment_source: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/payment_source',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/payment_source",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/payment_source'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/payment_source",
+          },
         },
         line_items: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/line_items',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/line_items'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/line_items",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/line_items",
+          },
         },
         shipments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/shipments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/shipments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/shipments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/shipments",
+          },
         },
         transactions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/transactions',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/transactions'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/transactions",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/transactions",
+          },
         },
         authorizations: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/authorizations',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/authorizations",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/authorizations'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/authorizations",
+          },
         },
         captures: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/captures',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/captures'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/captures",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/captures",
+          },
         },
         voids: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/voids',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/voids'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/voids",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/voids",
+          },
         },
         refunds: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/refunds',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/refunds'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/refunds",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/refunds",
+          },
         },
         order_subscriptions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/order_subscriptions',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/order_subscriptions",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/order_subscriptions'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/order_subscriptions",
+          },
         },
         order_copies: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/order_copies',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/order_copies'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/order_copies",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/order_copies",
+          },
         },
         attachments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/attachments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/attachments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/attachments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/attachments",
+          },
         },
         events: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/events',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/events'
-          }
-        }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/relationships/events",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PbQLhypYdr/events",
+          },
+        },
       },
-      meta: { mode: 'test', organization_id: 'enWoxFMOnp' }
+      meta: { mode: "test", organization_id: "enWoxFMOnp" },
     },
     {
-      id: 'qAezhrQjpY',
-      type: 'orders',
+      id: "qAezhrQjpY",
+      type: "orders",
       links: {
-        self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY'
+        self: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY",
       },
       attributes: {
         number: 2454757,
         autorefresh: true,
-        status: 'pending',
-        payment_status: 'unpaid',
-        fulfillment_status: 'unfulfilled',
+        status: "pending",
+        payment_status: "unpaid",
+        fulfillment_status: "unfulfilled",
         guest: false,
         editable: true,
-        customer_email: 'tony@iron.man',
-        language_code: 'en',
-        currency_code: 'EUR',
+        customer_email: "tony@iron.man",
+        language_code: "en",
+        currency_code: "EUR",
         tax_included: true,
         tax_rate: null,
         freight_taxable: null,
@@ -3019,61 +2893,61 @@ export const customerOrders = {
         gift_card_or_coupon_code: null,
         subtotal_amount_cents: 3500,
         subtotal_amount_float: 35,
-        formatted_subtotal_amount: '€35,00',
+        formatted_subtotal_amount: "€35,00",
         shipping_amount_cents: 0,
         shipping_amount_float: 0,
-        formatted_shipping_amount: '€0,00',
+        formatted_shipping_amount: "€0,00",
         payment_method_amount_cents: 0,
         payment_method_amount_float: 0,
-        formatted_payment_method_amount: '€0,00',
+        formatted_payment_method_amount: "€0,00",
         discount_amount_cents: 0,
         discount_amount_float: 0,
-        formatted_discount_amount: '€0,00',
+        formatted_discount_amount: "€0,00",
         adjustment_amount_cents: 0,
         adjustment_amount_float: 0,
-        formatted_adjustment_amount: '€0,00',
+        formatted_adjustment_amount: "€0,00",
         gift_card_amount_cents: 0,
         gift_card_amount_float: 0,
-        formatted_gift_card_amount: '€0,00',
+        formatted_gift_card_amount: "€0,00",
         total_tax_amount_cents: 0,
         total_tax_amount_float: 0,
-        formatted_total_tax_amount: '€0,00',
+        formatted_total_tax_amount: "€0,00",
         subtotal_tax_amount_cents: 0,
         subtotal_tax_amount_float: 0,
-        formatted_subtotal_tax_amount: '€0,00',
+        formatted_subtotal_tax_amount: "€0,00",
         shipping_tax_amount_cents: 0,
         shipping_tax_amount_float: 0,
-        formatted_shipping_tax_amount: '€0,00',
+        formatted_shipping_tax_amount: "€0,00",
         payment_method_tax_amount_cents: 0,
         payment_method_tax_amount_float: 0,
-        formatted_payment_method_tax_amount: '€0,00',
+        formatted_payment_method_tax_amount: "€0,00",
         adjustment_tax_amount_cents: 0,
         adjustment_tax_amount_float: 0,
-        formatted_adjustment_tax_amount: '€0,00',
+        formatted_adjustment_tax_amount: "€0,00",
         total_amount_cents: 3500,
         total_amount_float: 35,
-        formatted_total_amount: '€35,00',
+        formatted_total_amount: "€35,00",
         total_taxable_amount_cents: 3500,
         total_taxable_amount_float: 35,
-        formatted_total_taxable_amount: '€35,00',
+        formatted_total_taxable_amount: "€35,00",
         subtotal_taxable_amount_cents: 3500,
         subtotal_taxable_amount_float: 35,
-        formatted_subtotal_taxable_amount: '€35,00',
+        formatted_subtotal_taxable_amount: "€35,00",
         shipping_taxable_amount_cents: 0,
         shipping_taxable_amount_float: 0,
-        formatted_shipping_taxable_amount: '€0,00',
+        formatted_shipping_taxable_amount: "€0,00",
         payment_method_taxable_amount_cents: 0,
         payment_method_taxable_amount_float: 0,
-        formatted_payment_method_taxable_amount: '€0,00',
+        formatted_payment_method_taxable_amount: "€0,00",
         adjustment_taxable_amount_cents: 0,
         adjustment_taxable_amount_float: 0,
-        formatted_adjustment_taxable_amount: '€0,00',
+        formatted_adjustment_taxable_amount: "€0,00",
         total_amount_with_taxes_cents: 3500,
         total_amount_with_taxes_float: 35,
-        formatted_total_amount_with_taxes: '€35,00',
+        formatted_total_amount_with_taxes: "€35,00",
         fees_amount_cents: 0,
         fees_amount_float: 0,
-        formatted_fees_amount: '€0,00',
+        formatted_fees_amount: "€0,00",
         duty_amount_cents: null,
         duty_amount_float: null,
         formatted_duty_amount: null,
@@ -3082,7 +2956,7 @@ export const customerOrders = {
         shipments_count: 0,
         tax_calculations_count: 0,
         payment_source_details: null,
-        token: '451c37542c6b185ba2ee9fa6227418b6',
+        token: "451c37542c6b185ba2ee9fa6227418b6",
         cart_url: null,
         return_url: null,
         terms_url: null,
@@ -3096,246 +2970,235 @@ export const customerOrders = {
         refreshed_at: null,
         archived_at: null,
         expires_at: null,
-        created_at: '2022-12-02T15:39:43.852Z',
-        updated_at: '2022-12-02T15:39:44.093Z',
+        created_at: "2022-12-02T15:39:43.852Z",
+        updated_at: "2022-12-02T15:39:44.093Z",
         reference: null,
         reference_origin: null,
-        metadata: {}
+        metadata: {},
       },
       relationships: {
         market: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/market',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/market'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/market",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/market",
+          },
         },
         customer: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/customer',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/customer'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/customer",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/customer",
+          },
         },
         shipping_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/shipping_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/shipping_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/shipping_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/shipping_address",
+          },
         },
         billing_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/billing_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/billing_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/billing_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/billing_address",
+          },
         },
         available_payment_methods: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/available_payment_methods',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/available_payment_methods",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/available_payment_methods'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/available_payment_methods",
+          },
         },
         available_customer_payment_sources: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/available_customer_payment_sources',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/available_customer_payment_sources",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/available_customer_payment_sources'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/available_customer_payment_sources",
+          },
         },
         available_free_skus: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/available_free_skus',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/available_free_skus",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/available_free_skus'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/available_free_skus",
+          },
         },
         available_free_bundles: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/available_free_bundles',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/available_free_bundles",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/available_free_bundles'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/available_free_bundles",
+          },
         },
         payment_method: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/payment_method',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/payment_method",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/payment_method'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/payment_method",
+          },
         },
         payment_source: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/payment_source',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/payment_source",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/payment_source'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/payment_source",
+          },
         },
         line_items: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/line_items',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/line_items'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/line_items",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/line_items",
+          },
         },
         shipments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/shipments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/shipments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/shipments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/shipments",
+          },
         },
         transactions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/transactions',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/transactions'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/transactions",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/transactions",
+          },
         },
         authorizations: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/authorizations',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/authorizations",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/authorizations'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/authorizations",
+          },
         },
         captures: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/captures',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/captures'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/captures",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/captures",
+          },
         },
         voids: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/voids',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/voids'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/voids",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/voids",
+          },
         },
         refunds: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/refunds',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/refunds'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/refunds",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/refunds",
+          },
         },
         order_subscriptions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/order_subscriptions',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/order_subscriptions",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/order_subscriptions'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/order_subscriptions",
+          },
         },
         order_copies: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/order_copies',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/order_copies'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/order_copies",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/order_copies",
+          },
         },
         attachments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/attachments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/attachments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/attachments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/attachments",
+          },
         },
         events: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/events',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/events'
-          }
-        }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/relationships/events",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/qAezhrQjpY/events",
+          },
+        },
       },
-      meta: { mode: 'test', organization_id: 'enWoxFMOnp' }
+      meta: { mode: "test", organization_id: "enWoxFMOnp" },
     },
     {
-      id: 'PrnYhAerQJ',
-      type: 'orders',
+      id: "PrnYhAerQJ",
+      type: "orders",
       links: {
-        self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ'
+        self: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ",
       },
       attributes: {
         number: 2454743,
         autorefresh: true,
-        status: 'placed',
-        payment_status: 'authorized',
-        fulfillment_status: 'unfulfilled',
+        status: "placed",
+        payment_status: "authorized",
+        fulfillment_status: "unfulfilled",
         guest: false,
         editable: false,
-        customer_email: 'tony@iron.man',
-        language_code: 'en',
-        currency_code: 'EUR',
+        customer_email: "tony@iron.man",
+        language_code: "en",
+        currency_code: "EUR",
         tax_included: true,
-        tax_rate: '0.22',
+        tax_rate: "0.22",
         freight_taxable: false,
         requires_billing_info: true,
-        country_code: 'IT',
+        country_code: "IT",
         shipping_country_code_lock: null,
         coupon_code: null,
         gift_card_code: null,
         gift_card_or_coupon_code: null,
         subtotal_amount_cents: 3500,
         subtotal_amount_float: 35,
-        formatted_subtotal_amount: '€35,00',
+        formatted_subtotal_amount: "€35,00",
         shipping_amount_cents: 0,
         shipping_amount_float: 0,
-        formatted_shipping_amount: '€0,00',
+        formatted_shipping_amount: "€0,00",
         payment_method_amount_cents: 0,
         payment_method_amount_float: 0,
-        formatted_payment_method_amount: '€0,00',
+        formatted_payment_method_amount: "€0,00",
         discount_amount_cents: 0,
         discount_amount_float: 0,
-        formatted_discount_amount: '€0,00',
+        formatted_discount_amount: "€0,00",
         adjustment_amount_cents: 0,
         adjustment_amount_float: 0,
-        formatted_adjustment_amount: '€0,00',
+        formatted_adjustment_amount: "€0,00",
         gift_card_amount_cents: 0,
         gift_card_amount_float: 0,
-        formatted_gift_card_amount: '€0,00',
+        formatted_gift_card_amount: "€0,00",
         total_tax_amount_cents: 631,
         total_tax_amount_float: 6.31,
-        formatted_total_tax_amount: '€6,31',
+        formatted_total_tax_amount: "€6,31",
         subtotal_tax_amount_cents: 631,
         subtotal_tax_amount_float: 6.31,
-        formatted_subtotal_tax_amount: '€6,31',
+        formatted_subtotal_tax_amount: "€6,31",
         shipping_tax_amount_cents: 0,
         shipping_tax_amount_float: 0,
-        formatted_shipping_tax_amount: '€0,00',
+        formatted_shipping_tax_amount: "€0,00",
         payment_method_tax_amount_cents: 0,
         payment_method_tax_amount_float: 0,
-        formatted_payment_method_tax_amount: '€0,00',
+        formatted_payment_method_tax_amount: "€0,00",
         adjustment_tax_amount_cents: 0,
         adjustment_tax_amount_float: 0,
-        formatted_adjustment_tax_amount: '€0,00',
+        formatted_adjustment_tax_amount: "€0,00",
         total_amount_cents: 3500,
         total_amount_float: 35,
-        formatted_total_amount: '€35,00',
+        formatted_total_amount: "€35,00",
         total_taxable_amount_cents: 2869,
         total_taxable_amount_float: 28.69,
-        formatted_total_taxable_amount: '€28,69',
+        formatted_total_taxable_amount: "€28,69",
         subtotal_taxable_amount_cents: 2869,
         subtotal_taxable_amount_float: 28.69,
-        formatted_subtotal_taxable_amount: '€28,69',
+        formatted_subtotal_taxable_amount: "€28,69",
         shipping_taxable_amount_cents: 0,
         shipping_taxable_amount_float: 0,
-        formatted_shipping_taxable_amount: '€0,00',
+        formatted_shipping_taxable_amount: "€0,00",
         payment_method_taxable_amount_cents: 0,
         payment_method_taxable_amount_float: 0,
-        formatted_payment_method_taxable_amount: '€0,00',
+        formatted_payment_method_taxable_amount: "€0,00",
         adjustment_taxable_amount_cents: 0,
         adjustment_taxable_amount_float: 0,
-        formatted_adjustment_taxable_amount: '€0,00',
+        formatted_adjustment_taxable_amount: "€0,00",
         total_amount_with_taxes_cents: 3500,
         total_amount_with_taxes_float: 35,
-        formatted_total_amount_with_taxes: '€35,00',
+        formatted_total_amount_with_taxes: "€35,00",
         fees_amount_cents: 0,
         fees_amount_float: 0,
-        formatted_fees_amount: '€0,00',
+        formatted_fees_amount: "€0,00",
         duty_amount_cents: null,
         duty_amount_float: null,
         formatted_duty_amount: null,
@@ -3343,261 +3206,250 @@ export const customerOrders = {
         line_item_options_count: 0,
         shipments_count: 1,
         tax_calculations_count: 5,
-        payment_source_details: { type: 'wire_transfer' },
-        token: 'c58819deeb5066aa6f8df76ee116a8c7',
+        payment_source_details: { type: "wire_transfer" },
+        token: "c58819deeb5066aa6f8df76ee116a8c7",
         cart_url: null,
         return_url: null,
         terms_url: null,
         privacy_url: null,
         checkout_url: null,
-        placed_at: '2022-12-02T09:42:13.739Z',
+        placed_at: "2022-12-02T09:42:13.739Z",
         approved_at: null,
         cancelled_at: null,
-        payment_updated_at: '2022-12-02T09:42:13.674Z',
+        payment_updated_at: "2022-12-02T09:42:13.674Z",
         fulfillment_updated_at: null,
-        refreshed_at: '2022-12-02T09:40:50.311Z',
+        refreshed_at: "2022-12-02T09:40:50.311Z",
         archived_at: null,
         expires_at: null,
-        created_at: '2022-12-02T09:40:37.940Z',
-        updated_at: '2022-12-02T09:42:13.747Z',
+        created_at: "2022-12-02T09:40:37.940Z",
+        updated_at: "2022-12-02T09:42:13.747Z",
         reference: null,
         reference_origin: null,
-        metadata: {}
+        metadata: {},
       },
       relationships: {
         market: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/market',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/market'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/market",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/market",
+          },
         },
         customer: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/customer',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/customer'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/customer",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/customer",
+          },
         },
         shipping_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/shipping_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/shipping_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/shipping_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/shipping_address",
+          },
         },
         billing_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/billing_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/billing_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/billing_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/billing_address",
+          },
         },
         available_payment_methods: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/available_payment_methods',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/available_payment_methods",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/available_payment_methods'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/available_payment_methods",
+          },
         },
         available_customer_payment_sources: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/available_customer_payment_sources',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/available_customer_payment_sources",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/available_customer_payment_sources'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/available_customer_payment_sources",
+          },
         },
         available_free_skus: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/available_free_skus',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/available_free_skus",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/available_free_skus'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/available_free_skus",
+          },
         },
         available_free_bundles: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/available_free_bundles',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/available_free_bundles",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/available_free_bundles'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/available_free_bundles",
+          },
         },
         payment_method: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/payment_method',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/payment_method",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/payment_method'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/payment_method",
+          },
         },
         payment_source: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/payment_source',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/payment_source",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/payment_source'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/payment_source",
+          },
         },
         line_items: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/line_items',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/line_items'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/line_items",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/line_items",
+          },
         },
         shipments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/shipments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/shipments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/shipments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/shipments",
+          },
         },
         transactions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/transactions',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/transactions'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/transactions",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/transactions",
+          },
         },
         authorizations: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/authorizations',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/authorizations",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/authorizations'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/authorizations",
+          },
         },
         captures: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/captures',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/captures'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/captures",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/captures",
+          },
         },
         voids: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/voids',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/voids'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/voids",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/voids",
+          },
         },
         refunds: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/refunds',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/refunds'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/refunds",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/refunds",
+          },
         },
         order_subscriptions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/order_subscriptions',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/order_subscriptions",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/order_subscriptions'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/order_subscriptions",
+          },
         },
         order_copies: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/order_copies',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/order_copies'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/order_copies",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/order_copies",
+          },
         },
         attachments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/attachments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/attachments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/attachments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/attachments",
+          },
         },
         events: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/events',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/events'
-          }
-        }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/relationships/events",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PrnYhAerQJ/events",
+          },
+        },
       },
-      meta: { mode: 'test', organization_id: 'enWoxFMOnp' }
+      meta: { mode: "test", organization_id: "enWoxFMOnp" },
     },
     {
-      id: 'PoKkhYJdBz',
-      type: 'orders',
+      id: "PoKkhYJdBz",
+      type: "orders",
       links: {
-        self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz'
+        self: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz",
       },
       attributes: {
         number: 2454746,
         autorefresh: true,
-        status: 'placed',
-        payment_status: 'authorized',
-        fulfillment_status: 'unfulfilled',
+        status: "placed",
+        payment_status: "authorized",
+        fulfillment_status: "unfulfilled",
         guest: false,
         editable: false,
-        customer_email: 'tony@iron.man',
-        language_code: 'en',
-        currency_code: 'EUR',
+        customer_email: "tony@iron.man",
+        language_code: "en",
+        currency_code: "EUR",
         tax_included: true,
-        tax_rate: '0.22',
+        tax_rate: "0.22",
         freight_taxable: false,
         requires_billing_info: true,
-        country_code: 'IT',
+        country_code: "IT",
         shipping_country_code_lock: null,
         coupon_code: null,
         gift_card_code: null,
         gift_card_or_coupon_code: null,
         subtotal_amount_cents: 3500,
         subtotal_amount_float: 35,
-        formatted_subtotal_amount: '€35,00',
+        formatted_subtotal_amount: "€35,00",
         shipping_amount_cents: 0,
         shipping_amount_float: 0,
-        formatted_shipping_amount: '€0,00',
+        formatted_shipping_amount: "€0,00",
         payment_method_amount_cents: 0,
         payment_method_amount_float: 0,
-        formatted_payment_method_amount: '€0,00',
+        formatted_payment_method_amount: "€0,00",
         discount_amount_cents: 0,
         discount_amount_float: 0,
-        formatted_discount_amount: '€0,00',
+        formatted_discount_amount: "€0,00",
         adjustment_amount_cents: 0,
         adjustment_amount_float: 0,
-        formatted_adjustment_amount: '€0,00',
+        formatted_adjustment_amount: "€0,00",
         gift_card_amount_cents: 0,
         gift_card_amount_float: 0,
-        formatted_gift_card_amount: '€0,00',
+        formatted_gift_card_amount: "€0,00",
         total_tax_amount_cents: 631,
         total_tax_amount_float: 6.31,
-        formatted_total_tax_amount: '€6,31',
+        formatted_total_tax_amount: "€6,31",
         subtotal_tax_amount_cents: 631,
         subtotal_tax_amount_float: 6.31,
-        formatted_subtotal_tax_amount: '€6,31',
+        formatted_subtotal_tax_amount: "€6,31",
         shipping_tax_amount_cents: 0,
         shipping_tax_amount_float: 0,
-        formatted_shipping_tax_amount: '€0,00',
+        formatted_shipping_tax_amount: "€0,00",
         payment_method_tax_amount_cents: 0,
         payment_method_tax_amount_float: 0,
-        formatted_payment_method_tax_amount: '€0,00',
+        formatted_payment_method_tax_amount: "€0,00",
         adjustment_tax_amount_cents: 0,
         adjustment_tax_amount_float: 0,
-        formatted_adjustment_tax_amount: '€0,00',
+        formatted_adjustment_tax_amount: "€0,00",
         total_amount_cents: 3500,
         total_amount_float: 35,
-        formatted_total_amount: '€35,00',
+        formatted_total_amount: "€35,00",
         total_taxable_amount_cents: 2869,
         total_taxable_amount_float: 28.69,
-        formatted_total_taxable_amount: '€28,69',
+        formatted_total_taxable_amount: "€28,69",
         subtotal_taxable_amount_cents: 2869,
         subtotal_taxable_amount_float: 28.69,
-        formatted_subtotal_taxable_amount: '€28,69',
+        formatted_subtotal_taxable_amount: "€28,69",
         shipping_taxable_amount_cents: 0,
         shipping_taxable_amount_float: 0,
-        formatted_shipping_taxable_amount: '€0,00',
+        formatted_shipping_taxable_amount: "€0,00",
         payment_method_taxable_amount_cents: 0,
         payment_method_taxable_amount_float: 0,
-        formatted_payment_method_taxable_amount: '€0,00',
+        formatted_payment_method_taxable_amount: "€0,00",
         adjustment_taxable_amount_cents: 0,
         adjustment_taxable_amount_float: 0,
-        formatted_adjustment_taxable_amount: '€0,00',
+        formatted_adjustment_taxable_amount: "€0,00",
         total_amount_with_taxes_cents: 3500,
         total_amount_with_taxes_float: 35,
-        formatted_total_amount_with_taxes: '€35,00',
+        formatted_total_amount_with_taxes: "€35,00",
         fees_amount_cents: 0,
         fees_amount_float: 0,
-        formatted_fees_amount: '€0,00',
+        formatted_fees_amount: "€0,00",
         duty_amount_cents: null,
         duty_amount_float: null,
         formatted_duty_amount: null,
@@ -3605,177 +3457,166 @@ export const customerOrders = {
         line_item_options_count: 0,
         shipments_count: 1,
         tax_calculations_count: 4,
-        payment_source_details: { type: 'wire_transfer' },
-        token: '6f41ae37855f29966d5cd398bfe692c2',
+        payment_source_details: { type: "wire_transfer" },
+        token: "6f41ae37855f29966d5cd398bfe692c2",
         cart_url: null,
         return_url: null,
         terms_url: null,
         privacy_url: null,
         checkout_url: null,
-        placed_at: '2022-12-02T09:43:59.824Z',
+        placed_at: "2022-12-02T09:43:59.824Z",
         approved_at: null,
         cancelled_at: null,
-        payment_updated_at: '2022-12-02T09:43:59.777Z',
+        payment_updated_at: "2022-12-02T09:43:59.777Z",
         fulfillment_updated_at: null,
-        refreshed_at: '2022-12-02T09:43:49.102Z',
+        refreshed_at: "2022-12-02T09:43:49.102Z",
         archived_at: null,
         expires_at: null,
-        created_at: '2022-12-02T09:43:37.755Z',
-        updated_at: '2022-12-02T09:43:59.832Z',
+        created_at: "2022-12-02T09:43:37.755Z",
+        updated_at: "2022-12-02T09:43:59.832Z",
         reference: null,
         reference_origin: null,
-        metadata: {}
+        metadata: {},
       },
       relationships: {
         market: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/market',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/market'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/market",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/market",
+          },
         },
         customer: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/customer',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/customer'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/customer",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/customer",
+          },
         },
         shipping_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/shipping_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/shipping_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/shipping_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/shipping_address",
+          },
         },
         billing_address: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/billing_address',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/billing_address",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/billing_address'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/billing_address",
+          },
         },
         available_payment_methods: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/available_payment_methods',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/available_payment_methods",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/available_payment_methods'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/available_payment_methods",
+          },
         },
         available_customer_payment_sources: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/available_customer_payment_sources',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/available_customer_payment_sources",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/available_customer_payment_sources'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/available_customer_payment_sources",
+          },
         },
         available_free_skus: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/available_free_skus',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/available_free_skus",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/available_free_skus'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/available_free_skus",
+          },
         },
         available_free_bundles: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/available_free_bundles',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/available_free_bundles",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/available_free_bundles'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/available_free_bundles",
+          },
         },
         payment_method: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/payment_method',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/payment_method",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/payment_method'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/payment_method",
+          },
         },
         payment_source: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/payment_source',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/payment_source",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/payment_source'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/payment_source",
+          },
         },
         line_items: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/line_items',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/line_items'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/line_items",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/line_items",
+          },
         },
         shipments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/shipments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/shipments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/shipments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/shipments",
+          },
         },
         transactions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/transactions',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/transactions'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/transactions",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/transactions",
+          },
         },
         authorizations: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/authorizations',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/authorizations",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/authorizations'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/authorizations",
+          },
         },
         captures: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/captures',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/captures'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/captures",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/captures",
+          },
         },
         voids: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/voids',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/voids'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/voids",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/voids",
+          },
         },
         refunds: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/refunds',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/refunds'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/refunds",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/refunds",
+          },
         },
         order_subscriptions: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/order_subscriptions',
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/order_subscriptions",
             related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/order_subscriptions'
-          }
+              "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/order_subscriptions",
+          },
         },
         order_copies: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/order_copies',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/order_copies'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/order_copies",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/order_copies",
+          },
         },
         attachments: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/attachments',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/attachments'
-          }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/attachments",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/attachments",
+          },
         },
         events: {
           links: {
-            self: 'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/events',
-            related:
-              'https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/events'
-          }
-        }
+            self: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/relationships/events",
+            related: "https://the-blue-brand-3.commercelayer.co/api/orders/PoKkhYJdBz/events",
+          },
+        },
       },
-      meta: { mode: 'test', organization_id: 'enWoxFMOnp' }
-    }
-  ]
+      meta: { mode: "test", organization_id: "enWoxFMOnp" },
+    },
+  ],
 }
diff --git a/packages/react-components/mocks/server.ts b/packages/react-components/mocks/server.ts
index 95cb2373..5a8053cd 100644
--- a/packages/react-components/mocks/server.ts
+++ b/packages/react-components/mocks/server.ts
@@ -1,5 +1,5 @@
-import { setupServer } from 'msw/node'
-import { handlers } from './handlers'
+import { setupServer } from "msw/node"
+import { handlers } from "./handlers"
 // This configures a Service Worker with the given request handlers.
 // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
 export const server = setupServer(...handlers)
diff --git a/packages/react-components/mocks/setup.ts b/packages/react-components/mocks/setup.ts
index ffab67ea..d5beca94 100644
--- a/packages/react-components/mocks/setup.ts
+++ b/packages/react-components/mocks/setup.ts
@@ -1,4 +1,4 @@
-import { server } from './server'
+import { server } from "./server"
 
 beforeAll(async () => {
   server.listen()
diff --git a/packages/react-components/specs/auth/commerce-layer.spec.tsx b/packages/react-components/specs/auth/commerce-layer.spec.tsx
index 038e25f1..19a7a475 100644
--- a/packages/react-components/specs/auth/commerce-layer.spec.tsx
+++ b/packages/react-components/specs/auth/commerce-layer.spec.tsx
@@ -1,15 +1,9 @@
 import { render, screen } from "@testing-library/react"
 import { useContext } from "react"
 import CommerceLayer from "#components/auth/CommerceLayer"
-import CommerceLayerContext, {
-  type CommerceLayerConfig,
-} from "#context/CommerceLayerContext"
+import CommerceLayerContext, { type CommerceLayerConfig } from "#context/CommerceLayerContext"
 
-function ContextInspector({
-  onContext,
-}: {
-  onContext: (ctx: CommerceLayerConfig) => void
-}) {
+function ContextInspector({ onContext }: { onContext: (ctx: CommerceLayerConfig) => void }) {
   const ctx = useContext(CommerceLayerContext)
   onContext(ctx)
   return null
@@ -30,7 +24,7 @@ describe("CommerceLayer component", () => {
     render(
       <CommerceLayer accessToken={token}>
         <span data-testid="child">hello</span>
-      </CommerceLayer>,
+      </CommerceLayer>
     )
     expect(screen.getByTestId("child").textContent).toBe("hello")
   })
@@ -45,7 +39,7 @@ describe("CommerceLayer component", () => {
             captured = ctx
           }}
         />
-      </CommerceLayer>,
+      </CommerceLayer>
     )
     expect(captured.accessToken).toBe(token)
   })
@@ -60,7 +54,7 @@ describe("CommerceLayer component", () => {
             captured = ctx
           }}
         />
-      </CommerceLayer>,
+      </CommerceLayer>
     )
     expect("endpoint" in captured).toBe(false)
   })
@@ -68,9 +62,7 @@ describe("CommerceLayer component", () => {
   it("re-renders with same props (cache-hit path)", () => {
     const token = makeFakeToken("my-org")
     const child = <span data-testid="stable-child">stable</span>
-    const { rerender } = render(
-      <CommerceLayer accessToken={token}>{child}</CommerceLayer>,
-    )
+    const { rerender } = render(<CommerceLayer accessToken={token}>{child}</CommerceLayer>)
     rerender(<CommerceLayer accessToken={token}>{child}</CommerceLayer>)
     expect(screen.getByTestId("stable-child").textContent).toBe("stable")
   })
diff --git a/packages/react-components/specs/orders/add-to-cart-button.spec.tsx b/packages/react-components/specs/orders/add-to-cart-button.spec.tsx
index 99ed2a34..8b747b28 100644
--- a/packages/react-components/specs/orders/add-to-cart-button.spec.tsx
+++ b/packages/react-components/specs/orders/add-to-cart-button.spec.tsx
@@ -7,11 +7,7 @@ import OrderContext, { defaultOrderContext } from "#context/OrderContext"
 const FAKE_TOKEN =
   "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJvcmdhbml6YXRpb24iOnsiaWQiOiJvcmctaWQiLCJzbHVnIjoidGVzdC1vcmcifSwibWFya2V0Ijp7ImlkIjpbIjEiXSwicHJpY2VfbGlzdF9pZCI6InBsMSIsInN0b2NrX2xvY2F0aW9uX2lkcyI6W10sImdlb2NvZGVyX2lkIjpudWxsLCJhbGxvd3NfZXh0ZXJuYWxfcHJpY2VzIjpmYWxzZX0sImFwcGxpY2F0aW9uIjp7ImlkIjoiYXBwLWlkIiwia2luZCI6InNhbGVzX2NoYW5uZWwiLCJwdWJsaWMiOnRydWV9LCJleHAiOjk5OTk5OTk5OTksIm93bmVyIjp7ImlkIjoiY3VzLWlkIiwidHlwZSI6IkN1c3RvbWVyIn0sInJhbmQiOjEsInRlc3QiOnRydWV9.fake-sig"
 
-function makeOrderCtx(
-  addToCart = vi
-    .fn()
-    .mockResolvedValue({ success: true, orderId: "ord-1" }),
-) {
+function makeOrderCtx(addToCart = vi.fn().mockResolvedValue({ success: true, orderId: "ord-1" })) {
   return {
     ...defaultOrderContext,
     addToCart,
@@ -30,9 +26,7 @@ function Wrapper({
 }) {
   return (
     <CommerceLayerContext.Provider value={{ accessToken: FAKE_TOKEN }}>
-      <OrderContext.Provider value={orderCtx}>
-        {children}
-      </OrderContext.Provider>
+      <OrderContext.Provider value={orderCtx}>{children}</OrderContext.Provider>
     </CommerceLayerContext.Provider>
   )
 }
@@ -42,7 +36,7 @@ describe("AddToCartButton", () => {
     render(
       <Wrapper>
         <AddToCartButton skuCode="SKU1" />
-      </Wrapper>,
+      </Wrapper>
     )
     expect(screen.getByRole("button", { name: /add to cart/i })).toBeDefined()
   })
@@ -51,59 +45,51 @@ describe("AddToCartButton", () => {
     render(
       <Wrapper>
         <AddToCartButton skuCode="SKU1" label="Buy now" />
-      </Wrapper>,
+      </Wrapper>
     )
     expect(screen.getByRole("button", { name: /buy now/i })).toBeDefined()
   })
 
   it("calls addToCart with skuCode and default quantity when clicked", async () => {
-    const addToCart = vi
-      .fn()
-      .mockResolvedValue({ success: true, orderId: "ord-1" })
+    const addToCart = vi.fn().mockResolvedValue({ success: true, orderId: "ord-1" })
     render(
       <Wrapper orderCtx={makeOrderCtx(addToCart)}>
         <AddToCartButton skuCode="SKU1" />
-      </Wrapper>,
+      </Wrapper>
     )
     fireEvent.click(screen.getByRole("button"))
     await waitFor(() => {
       expect(addToCart).toHaveBeenCalledWith(
-        expect.objectContaining({ skuCode: "SKU1", quantity: 1 }),
+        expect.objectContaining({ skuCode: "SKU1", quantity: 1 })
       )
     })
   })
 
   it("calls addToCart with custom quantity", async () => {
-    const addToCart = vi
-      .fn()
-      .mockResolvedValue({ success: true, orderId: "ord-1" })
+    const addToCart = vi.fn().mockResolvedValue({ success: true, orderId: "ord-1" })
     render(
       <Wrapper orderCtx={makeOrderCtx(addToCart)}>
         <AddToCartButton skuCode="SKU1" quantity="3" />
-      </Wrapper>,
+      </Wrapper>
     )
     fireEvent.click(screen.getByRole("button"))
     await waitFor(() => {
       expect(addToCart).toHaveBeenCalledWith(
-        expect.objectContaining({ skuCode: "SKU1", quantity: 3 }),
+        expect.objectContaining({ skuCode: "SKU1", quantity: 3 })
       )
     })
   })
 
   it("calls addToCart with bundleCode when provided", async () => {
-    const addToCart = vi
-      .fn()
-      .mockResolvedValue({ success: true, orderId: "ord-1" })
+    const addToCart = vi.fn().mockResolvedValue({ success: true, orderId: "ord-1" })
     render(
       <Wrapper orderCtx={makeOrderCtx(addToCart)}>
         <AddToCartButton bundleCode="BUNDLE1" />
-      </Wrapper>,
+      </Wrapper>
     )
     fireEvent.click(screen.getByRole("button"))
     await waitFor(() => {
-      expect(addToCart).toHaveBeenCalledWith(
-        expect.objectContaining({ bundleCode: "BUNDLE1" }),
-      )
+      expect(addToCart).toHaveBeenCalledWith(expect.objectContaining({ bundleCode: "BUNDLE1" }))
     })
   })
 
@@ -112,12 +98,12 @@ describe("AddToCartButton", () => {
     const addToCart = vi.fn().mockReturnValue(
       new Promise<{ success: boolean; orderId: string }>((res) => {
         resolve = res
-      }),
+      })
     )
     render(
       <Wrapper orderCtx={makeOrderCtx(addToCart)}>
         <AddToCartButton skuCode="SKU1" />
-      </Wrapper>,
+      </Wrapper>
     )
     const button = screen.getByRole("button") as HTMLButtonElement
     fireEvent.click(button)
@@ -130,7 +116,7 @@ describe("AddToCartButton", () => {
     render(
       <Wrapper>
         <AddToCartButton skuCode="SKU1" className="my-btn" data-testid="atc" />
-      </Wrapper>,
+      </Wrapper>
     )
     const button = screen.getByTestId("atc")
     expect((button as HTMLButtonElement).className).toContain("my-btn")
@@ -140,17 +126,13 @@ describe("AddToCartButton", () => {
     render(
       <Wrapper>
         <AddToCartButton skuCode="SKU1" disabled />
-      </Wrapper>,
-    )
-    expect((screen.getByRole("button") as HTMLButtonElement).disabled).toBe(
-      true,
+      </Wrapper>
     )
+    expect((screen.getByRole("button") as HTMLButtonElement).disabled).toBe(true)
   })
 
   it("renders custom children and passes handleClick to them", async () => {
-    const addToCart = vi
-      .fn()
-      .mockResolvedValue({ success: true, orderId: "ord-1" })
+    const addToCart = vi.fn().mockResolvedValue({ success: true, orderId: "ord-1" })
     render(
       <Wrapper orderCtx={makeOrderCtx(addToCart)}>
         <AddToCartButton skuCode="SKU1">
@@ -165,36 +147,32 @@ describe("AddToCartButton", () => {
             </button>
           )}
         </AddToCartButton>
-      </Wrapper>,
+      </Wrapper>
     )
     fireEvent.click(screen.getByTestId("custom"))
     await waitFor(() => expect(addToCart).toHaveBeenCalled())
   })
 
   it("throws when rendered outside <CommerceLayer>", () => {
-    const consoleSpy = vi
-      .spyOn(console, "error")
-      .mockImplementation(() => undefined)
+    const consoleSpy = vi.spyOn(console, "error").mockImplementation(() => undefined)
     expect(() =>
       render(
         <OrderContext.Provider value={makeOrderCtx()}>
           <AddToCartButton skuCode="SKU1" />
-        </OrderContext.Provider>,
-      ),
+        </OrderContext.Provider>
+      )
     ).toThrow("Cannot use <AddToCartButton/> outside of <CommerceLayer/>")
     consoleSpy.mockRestore()
   })
 
   it("throws when rendered outside <OrderContainer>", () => {
-    const consoleSpy = vi
-      .spyOn(console, "error")
-      .mockImplementation(() => undefined)
+    const consoleSpy = vi.spyOn(console, "error").mockImplementation(() => undefined)
     expect(() =>
       render(
         <CommerceLayerContext.Provider value={{ accessToken: FAKE_TOKEN }}>
           <AddToCartButton skuCode="SKU1" />
-        </CommerceLayerContext.Provider>,
-      ),
+        </CommerceLayerContext.Provider>
+      )
     ).toThrow("Cannot use <AddToCartButton/> outside of <Order/>")
     consoleSpy.mockRestore()
   })
diff --git a/packages/react-components/specs/orders/checkout-link.spec.tsx b/packages/react-components/specs/orders/checkout-link.spec.tsx
index 11b2dca5..846ae377 100644
--- a/packages/react-components/specs/orders/checkout-link.spec.tsx
+++ b/packages/react-components/specs/orders/checkout-link.spec.tsx
@@ -30,9 +30,7 @@ function Wrapper({
 }) {
   return (
     <CommerceLayerContext.Provider value={{ accessToken: FAKE_TOKEN }}>
-      <OrderContext.Provider value={orderCtx}>
-        {children}
-      </OrderContext.Provider>
+      <OrderContext.Provider value={orderCtx}>{children}</OrderContext.Provider>
     </CommerceLayerContext.Provider>
   )
 }
@@ -49,17 +47,13 @@ describe("CheckoutLink", () => {
 
   describe("rendering", () => {
     it("renders an anchor with the given label", () => {
-      vi.spyOn(applicationLinkUtils, "getApplicationLink").mockReturnValue(
-        HOSTED_CHECKOUT_URL,
-      )
+      vi.spyOn(applicationLinkUtils, "getApplicationLink").mockReturnValue(HOSTED_CHECKOUT_URL)
       render(
         <Wrapper>
           <CheckoutLink label="Go to checkout" />
-        </Wrapper>,
+        </Wrapper>
       )
-      expect(
-        screen.getByRole("link", { name: /go to checkout/i }),
-      ).toBeDefined()
+      expect(screen.getByRole("link", { name: /go to checkout/i })).toBeDefined()
     })
 
     it("builds href via getApplicationLink when hostedCheckout=true (default)", () => {
@@ -70,71 +64,61 @@ describe("CheckoutLink", () => {
       render(
         <Wrapper>
           <CheckoutLink label="Checkout" />
-        </Wrapper>,
+        </Wrapper>
       )
 
       expect(spy).toHaveBeenCalledWith(
         expect.objectContaining({
           orderId: "order-id-1",
           applicationType: "checkout",
-        }),
+        })
       )
-      expect(
-        screen.getByRole("link").getAttribute("href"),
-      ).toBe(HOSTED_CHECKOUT_URL)
+      expect(screen.getByRole("link").getAttribute("href")).toBe(HOSTED_CHECKOUT_URL)
     })
 
     it("uses order.checkout_url when hostedCheckout=false", () => {
       render(
         <Wrapper>
           <CheckoutLink label="Checkout" hostedCheckout={false} />
-        </Wrapper>,
-      )
-      expect(screen.getByRole("link").getAttribute("href")).toBe(
-        mockOrder.checkout_url,
+        </Wrapper>
       )
+      expect(screen.getByRole("link").getAttribute("href")).toBe(mockOrder.checkout_url)
     })
 
     it("falls back to empty string when hostedCheckout=false and checkout_url is absent", () => {
       render(
         <Wrapper orderCtx={makeOrderCtx({ id: "order-id-1", checkout_url: undefined } as any)}>
           <CheckoutLink label="Checkout" hostedCheckout={false} />
-        </Wrapper>,
+        </Wrapper>
       )
       expect(screen.getByText("Checkout").getAttribute("href")).toBe("")
     })
 
     it("forwards className to the anchor element", () => {
-      vi.spyOn(applicationLinkUtils, "getApplicationLink").mockReturnValue(
-        HOSTED_CHECKOUT_URL,
-      )
+      vi.spyOn(applicationLinkUtils, "getApplicationLink").mockReturnValue(HOSTED_CHECKOUT_URL)
       render(
         <Wrapper>
           <CheckoutLink label="Checkout" className="my-class" />
-        </Wrapper>,
+        </Wrapper>
       )
       expect(screen.getByRole("link").getAttribute("class")).toBe("my-class")
     })
 
     it("forwards target to the anchor element", () => {
-      vi.spyOn(applicationLinkUtils, "getApplicationLink").mockReturnValue(
-        HOSTED_CHECKOUT_URL,
-      )
+      vi.spyOn(applicationLinkUtils, "getApplicationLink").mockReturnValue(HOSTED_CHECKOUT_URL)
       render(
         <Wrapper>
           <CheckoutLink label="Checkout" target="_blank" />
-        </Wrapper>,
+        </Wrapper>
       )
       expect(screen.getByRole("link").getAttribute("target")).toBe("_blank")
     })
 
     it("throws when rendered outside <CommerceLayer>", () => {
-      const consoleSpy = vi
-        .spyOn(console, "error")
-        .mockImplementation(() => undefined)
-      expect(() =>
-        render(<CheckoutLink label="Checkout" />),
-      ).toThrow("Cannot use `CheckoutLink` outside of `CommerceLayer`")
+      const consoleSpy = vi.spyOn(console, "error").mockImplementation(() => undefined)
+      expect(() => render(<CheckoutLink label="Checkout" />)).toThrow(
+        "Cannot use `CheckoutLink` outside of `CommerceLayer`"
+      )
       consoleSpy.mockRestore()
     })
   })
@@ -145,9 +129,7 @@ describe("CheckoutLink", () => {
 
   describe("handleClick", () => {
     it("navigates to config.links.checkout when org config provides it", async () => {
-      vi.spyOn(applicationLinkUtils, "getApplicationLink").mockReturnValue(
-        HOSTED_CHECKOUT_URL,
-      )
+      vi.spyOn(applicationLinkUtils, "getApplicationLink").mockReturnValue(HOSTED_CHECKOUT_URL)
       vi.spyOn(organizationUtils, "getOrganizationConfig").mockResolvedValue({
         links: { checkout: "https://org-checkout.example.com/order-id-1" },
       } as any)
@@ -156,31 +138,27 @@ describe("CheckoutLink", () => {
       render(
         <Wrapper>
           <CheckoutLink label="Checkout" />
-        </Wrapper>,
+        </Wrapper>
       )
       fireEvent.click(screen.getByRole("link"))
 
       await waitFor(() => {
         expect(windowOpenSpy).toHaveBeenCalledWith(
           "https://org-checkout.example.com/order-id-1",
-          "_self",
+          "_self"
         )
       })
     })
 
     it("falls back to the resolved href when config.links.checkout is absent", async () => {
-      vi.spyOn(applicationLinkUtils, "getApplicationLink").mockReturnValue(
-        HOSTED_CHECKOUT_URL,
-      )
-      vi.spyOn(organizationUtils, "getOrganizationConfig").mockResolvedValue(
-        null,
-      )
+      vi.spyOn(applicationLinkUtils, "getApplicationLink").mockReturnValue(HOSTED_CHECKOUT_URL)
+      vi.spyOn(organizationUtils, "getOrganizationConfig").mockResolvedValue(null)
       const windowOpenSpy = vi.spyOn(window, "open").mockImplementation(vi.fn())
 
       render(
         <Wrapper>
           <CheckoutLink label="Checkout" />
-        </Wrapper>,
+        </Wrapper>
       )
       fireEvent.click(screen.getByRole("link"))
 
@@ -190,16 +168,13 @@ describe("CheckoutLink", () => {
     })
 
     it("skips getOrganizationConfig and opens href directly when order.id is absent", async () => {
-      const getOrgConfigSpy = vi.spyOn(
-        organizationUtils,
-        "getOrganizationConfig",
-      )
+      const getOrgConfigSpy = vi.spyOn(organizationUtils, "getOrganizationConfig")
       const windowOpenSpy = vi.spyOn(window, "open").mockImplementation(vi.fn())
 
       render(
         <Wrapper orderCtx={makeOrderCtx(null)}>
           <CheckoutLink label="Checkout" hostedCheckout={false} />
-        </Wrapper>,
+        </Wrapper>
       )
       fireEvent.click(screen.getByText("Checkout"))
 
@@ -210,18 +185,14 @@ describe("CheckoutLink", () => {
     })
 
     it("opens in a new tab when target=_blank", async () => {
-      vi.spyOn(applicationLinkUtils, "getApplicationLink").mockReturnValue(
-        HOSTED_CHECKOUT_URL,
-      )
-      vi.spyOn(organizationUtils, "getOrganizationConfig").mockResolvedValue(
-        null,
-      )
+      vi.spyOn(applicationLinkUtils, "getApplicationLink").mockReturnValue(HOSTED_CHECKOUT_URL)
+      vi.spyOn(organizationUtils, "getOrganizationConfig").mockResolvedValue(null)
       const windowOpenSpy = vi.spyOn(window, "open").mockImplementation(vi.fn())
 
       render(
         <Wrapper>
           <CheckoutLink label="Checkout" target="_blank" />
-        </Wrapper>,
+        </Wrapper>
       )
       fireEvent.click(screen.getByRole("link"))
 
@@ -231,18 +202,14 @@ describe("CheckoutLink", () => {
     })
 
     it("opens in _top when target=_top", async () => {
-      vi.spyOn(applicationLinkUtils, "getApplicationLink").mockReturnValue(
-        HOSTED_CHECKOUT_URL,
-      )
-      vi.spyOn(organizationUtils, "getOrganizationConfig").mockResolvedValue(
-        null,
-      )
+      vi.spyOn(applicationLinkUtils, "getApplicationLink").mockReturnValue(HOSTED_CHECKOUT_URL)
+      vi.spyOn(organizationUtils, "getOrganizationConfig").mockResolvedValue(null)
       const windowOpenSpy = vi.spyOn(window, "open").mockImplementation(vi.fn())
 
       render(
         <Wrapper>
           <CheckoutLink label="Checkout" target="_top" />
-        </Wrapper>,
+        </Wrapper>
       )
       fireEvent.click(screen.getByRole("link"))
 
@@ -252,18 +219,14 @@ describe("CheckoutLink", () => {
     })
 
     it("defaults to _self when no target is provided", async () => {
-      vi.spyOn(applicationLinkUtils, "getApplicationLink").mockReturnValue(
-        HOSTED_CHECKOUT_URL,
-      )
-      vi.spyOn(organizationUtils, "getOrganizationConfig").mockResolvedValue(
-        null,
-      )
+      vi.spyOn(applicationLinkUtils, "getApplicationLink").mockReturnValue(HOSTED_CHECKOUT_URL)
+      vi.spyOn(organizationUtils, "getOrganizationConfig").mockResolvedValue(null)
       const windowOpenSpy = vi.spyOn(window, "open").mockImplementation(vi.fn())
 
       render(
         <Wrapper>
           <CheckoutLink label="Checkout" />
-        </Wrapper>,
+        </Wrapper>
       )
       fireEvent.click(screen.getByRole("link"))
 
@@ -279,9 +242,7 @@ describe("CheckoutLink", () => {
 
   describe("children render prop", () => {
     it("passes href and handleClick to the children function", () => {
-      vi.spyOn(applicationLinkUtils, "getApplicationLink").mockReturnValue(
-        HOSTED_CHECKOUT_URL,
-      )
+      vi.spyOn(applicationLinkUtils, "getApplicationLink").mockReturnValue(HOSTED_CHECKOUT_URL)
       let capturedHref: string | undefined
       let capturedHandleClick: unknown
 
@@ -298,7 +259,7 @@ describe("CheckoutLink", () => {
               )
             }}
           </CheckoutLink>
-        </Wrapper>,
+        </Wrapper>
       )
 
       expect(capturedHref).toBe(HOSTED_CHECKOUT_URL)
@@ -307,9 +268,7 @@ describe("CheckoutLink", () => {
     })
 
     it("exposes orderId and accessToken in the children props", () => {
-      vi.spyOn(applicationLinkUtils, "getApplicationLink").mockReturnValue(
-        HOSTED_CHECKOUT_URL,
-      )
+      vi.spyOn(applicationLinkUtils, "getApplicationLink").mockReturnValue(HOSTED_CHECKOUT_URL)
       let capturedOrderId: string | undefined
       let capturedAccessToken: string | undefined
 
@@ -322,7 +281,7 @@ describe("CheckoutLink", () => {
               return null
             }}
           </CheckoutLink>
-        </Wrapper>,
+        </Wrapper>
       )
 
       expect(capturedOrderId).toBe("order-id-1")
@@ -330,9 +289,7 @@ describe("CheckoutLink", () => {
     })
 
     it("exposes checkoutUrl from the order in the children props", () => {
-      vi.spyOn(applicationLinkUtils, "getApplicationLink").mockReturnValue(
-        HOSTED_CHECKOUT_URL,
-      )
+      vi.spyOn(applicationLinkUtils, "getApplicationLink").mockReturnValue(HOSTED_CHECKOUT_URL)
       let capturedCheckoutUrl: string | undefined
 
       render(
@@ -343,7 +300,7 @@ describe("CheckoutLink", () => {
               return null
             }}
           </CheckoutLink>
-        </Wrapper>,
+        </Wrapper>
       )
 
       expect(capturedCheckoutUrl).toBe(mockOrder.checkout_url)
diff --git a/packages/react-components/specs/orders/hosted-cart.spec.tsx b/packages/react-components/specs/orders/hosted-cart.spec.tsx
index 5a44d134..a850e742 100644
--- a/packages/react-components/specs/orders/hosted-cart.spec.tsx
+++ b/packages/react-components/specs/orders/hosted-cart.spec.tsx
@@ -25,9 +25,7 @@ describe("HostedCart component", () => {
 
     const getApplicationLinkSpy = vi
       .spyOn(applicationLinkUtils, "getApplicationLink")
-      .mockImplementation(
-        ({ orderId }) => `https://test-cart.local/cart/${orderId}`,
-      )
+      .mockImplementation(({ orderId }) => `https://test-cart.local/cart/${orderId}`)
 
     const orderContextValue = {
       ...defaultOrderContext,
@@ -44,7 +42,8 @@ describe("HostedCart component", () => {
     const { rerender } = render(
       <CommerceLayerContext.Provider
         value={{
-          accessToken: "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJvcmdhbml6YXRpb24iOnsiaWQiOiJvcmctaWQiLCJzbHVnIjoidGVzdC1vcmcifSwibWFya2V0Ijp7ImlkIjpbIjEiXSwicHJpY2VfbGlzdF9pZCI6InBsMSIsInN0b2NrX2xvY2F0aW9uX2lkcyI6W10sImdlb2NvZGVyX2lkIjpudWxsLCJhbGxvd3NfZXh0ZXJuYWxfcHJpY2VzIjpmYWxzZX0sImFwcGxpY2F0aW9uIjp7ImlkIjoiYXBwLWlkIiwia2luZCI6InNhbGVzX2NoYW5uZWwiLCJwdWJsaWMiOnRydWV9LCJleHAiOjk5OTk5OTk5OTksIm93bmVyIjp7ImlkIjoiY3VzLWlkIiwidHlwZSI6IkN1c3RvbWVyIn0sInJhbmQiOjEsInRlc3QiOnRydWV9.fake-sig",
+          accessToken:
+            "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJvcmdhbml6YXRpb24iOnsiaWQiOiJvcmctaWQiLCJzbHVnIjoidGVzdC1vcmcifSwibWFya2V0Ijp7ImlkIjpbIjEiXSwicHJpY2VfbGlzdF9pZCI6InBsMSIsInN0b2NrX2xvY2F0aW9uX2lkcyI6W10sImdlb2NvZGVyX2lkIjpudWxsLCJhbGxvd3NfZXh0ZXJuYWxfcHJpY2VzIjpmYWxzZX0sImFwcGxpY2F0aW9uIjp7ImlkIjoiYXBwLWlkIiwia2luZCI6InNhbGVzX2NoYW5uZWwiLCJwdWJsaWMiOnRydWV9LCJleHAiOjk5OTk5OTk5OTksIm93bmVyIjp7ImlkIjoiY3VzLWlkIiwidHlwZSI6IkN1c3RvbWVyIn0sInJhbmQiOjEsInRlc3QiOnRydWV9.fake-sig",
         }}
       >
         <OrderContext.Provider value={orderContextValue}>
@@ -57,19 +56,20 @@ describe("HostedCart component", () => {
             <HostedCart />
           </OrderStorageContext.Provider>
         </OrderContext.Provider>
-      </CommerceLayerContext.Provider>,
+      </CommerceLayerContext.Provider>
     )
 
     await waitFor(() => {
       expect(getApplicationLinkSpy).toHaveBeenCalledWith(
-        expect.objectContaining({ orderId: "order-id-1" }),
+        expect.objectContaining({ orderId: "order-id-1" })
       )
     })
 
     rerender(
       <CommerceLayerContext.Provider
         value={{
-          accessToken: "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJvcmdhbml6YXRpb24iOnsiaWQiOiJvcmctaWQiLCJzbHVnIjoidGVzdC1vcmcifSwibWFya2V0Ijp7ImlkIjpbIjEiXSwicHJpY2VfbGlzdF9pZCI6InBsMSIsInN0b2NrX2xvY2F0aW9uX2lkcyI6W10sImdlb2NvZGVyX2lkIjpudWxsLCJhbGxvd3NfZXh0ZXJuYWxfcHJpY2VzIjpmYWxzZX0sImFwcGxpY2F0aW9uIjp7ImlkIjoiYXBwLWlkIiwia2luZCI6InNhbGVzX2NoYW5uZWwiLCJwdWJsaWMiOnRydWV9LCJleHAiOjk5OTk5OTk5OTksIm93bmVyIjp7ImlkIjoiY3VzLWlkIiwidHlwZSI6IkN1c3RvbWVyIn0sInJhbmQiOjEsInRlc3QiOnRydWV9.fake-sig",
+          accessToken:
+            "eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9.eyJvcmdhbml6YXRpb24iOnsiaWQiOiJvcmctaWQiLCJzbHVnIjoidGVzdC1vcmcifSwibWFya2V0Ijp7ImlkIjpbIjEiXSwicHJpY2VfbGlzdF9pZCI6InBsMSIsInN0b2NrX2xvY2F0aW9uX2lkcyI6W10sImdlb2NvZGVyX2lkIjpudWxsLCJhbGxvd3NfZXh0ZXJuYWxfcHJpY2VzIjpmYWxzZX0sImFwcGxpY2F0aW9uIjp7ImlkIjoiYXBwLWlkIiwia2luZCI6InNhbGVzX2NoYW5uZWwiLCJwdWJsaWMiOnRydWV9LCJleHAiOjk5OTk5OTk5OTksIm93bmVyIjp7ImlkIjoiY3VzLWlkIiwidHlwZSI6IkN1c3RvbWVyIn0sInJhbmQiOjEsInRlc3QiOnRydWV9.fake-sig",
         }}
       >
         <OrderContext.Provider value={orderContextValue}>
@@ -82,12 +82,12 @@ describe("HostedCart component", () => {
             <HostedCart />
           </OrderStorageContext.Provider>
         </OrderContext.Provider>
-      </CommerceLayerContext.Provider>,
+      </CommerceLayerContext.Provider>
     )
 
     await waitFor(() => {
       expect(getApplicationLinkSpy).toHaveBeenCalledWith(
-        expect.objectContaining({ orderId: "order-id-2" }),
+        expect.objectContaining({ orderId: "order-id-2" })
       )
     })
   })
diff --git a/packages/react-components/specs/orders/order.spec.tsx b/packages/react-components/specs/orders/order.spec.tsx
index e4e0ffe0..32db1700 100644
--- a/packages/react-components/specs/orders/order.spec.tsx
+++ b/packages/react-components/specs/orders/order.spec.tsx
@@ -53,7 +53,7 @@ describe("Order component", () => {
         <Order orderId="test-order-id">
           <span data-testid="child">hello</span>
         </Order>
-      </Wrapper>,
+      </Wrapper>
     )
     expect(screen.getByTestId("child")).toBeDefined()
   })
@@ -71,23 +71,21 @@ describe("Order component", () => {
         <Order orderId="test-order-id">
           <Consumer />
         </Order>
-      </Wrapper>,
+      </Wrapper>
     )
 
     expect(capturedCtx).not.toBeNull()
   })
 
   it("throws when rendered outside <CommerceLayer>", () => {
-    const consoleSpy = vi
-      .spyOn(console, "error")
-      .mockImplementation(() => undefined)
+    const consoleSpy = vi.spyOn(console, "error").mockImplementation(() => undefined)
 
     expect(() =>
       render(
         <Order orderId="test-order-id">
           <span />
-        </Order>,
-      ),
+        </Order>
+      )
     ).toThrow("Cannot use <Order/> outside of <CommerceLayer/>")
 
     consoleSpy.mockRestore()
@@ -100,7 +98,7 @@ describe("Order component", () => {
           <span data-testid="child-1">one</span>
           <span data-testid="child-2">two</span>
         </Order>
-      </Wrapper>,
+      </Wrapper>
     )
     expect(screen.getByTestId("child-1")).toBeDefined()
     expect(screen.getByTestId("child-2")).toBeDefined()
@@ -118,7 +116,7 @@ describe("OrderContainer component (deprecated)", () => {
         <OrderContainer orderId="test-order-id">
           <span data-testid="oc-child">content</span>
         </OrderContainer>
-      </Wrapper>,
+      </Wrapper>
     )
     expect(screen.getByTestId("oc-child")).toBeDefined()
   })
@@ -131,12 +129,10 @@ describe("OrderContainer component (deprecated)", () => {
         <OrderContainer orderId="test-order-id">
           <span />
         </OrderContainer>
-      </Wrapper>,
+      </Wrapper>
     )
 
-    expect(warnSpy).toHaveBeenCalledWith(
-      expect.stringContaining("<OrderContainer> is deprecated"),
-    )
+    expect(warnSpy).toHaveBeenCalledWith(expect.stringContaining("<OrderContainer> is deprecated"))
     warnSpy.mockRestore()
   })
 
@@ -149,7 +145,7 @@ describe("OrderContainer component (deprecated)", () => {
         <OrderContainer orderId="test-order-id">
           <span />
         </OrderContainer>
-      </Wrapper>,
+      </Wrapper>
     )
 
     expect(warnSpy).not.toHaveBeenCalled()
@@ -170,7 +166,7 @@ describe("OrderContainer component (deprecated)", () => {
         <OrderContainer orderId="test-order-id">
           <Consumer />
         </OrderContainer>
-      </Wrapper>,
+      </Wrapper>
     )
 
     expect(capturedCtx).not.toBeNull()
@@ -183,9 +179,7 @@ describe("OrderContainer component (deprecated)", () => {
 
 describe("useOrderContainer hook", () => {
   it("throws when used outside <Order>", () => {
-    const consoleSpy = vi
-      .spyOn(console, "error")
-      .mockImplementation(() => undefined)
+    const consoleSpy = vi.spyOn(console, "error").mockImplementation(() => undefined)
 
     function BadConsumer() {
       useOrderContainer()
@@ -193,7 +187,7 @@ describe("useOrderContainer hook", () => {
     }
 
     expect(() => render(<BadConsumer />)).toThrow(
-      "Cannot use `useOrderContainer` outside of <Order/>",
+      "Cannot use `useOrderContainer` outside of <Order/>"
     )
 
     consoleSpy.mockRestore()
@@ -223,7 +217,7 @@ describe("useOrderContainer hook", () => {
     render(
       <OrderContext.Provider value={mockCtx}>
         <Consumer />
-      </OrderContext.Provider>,
+      </OrderContext.Provider>
     )
 
     expect(result).not.toBeNull()
diff --git a/packages/react-components/specs/prices/price.spec.tsx b/packages/react-components/specs/prices/price.spec.tsx
index 780dca56..52b10062 100644
--- a/packages/react-components/specs/prices/price.spec.tsx
+++ b/packages/react-components/specs/prices/price.spec.tsx
@@ -51,18 +51,14 @@ describe("Price component", () => {
     const { container } = render(
       <CommerceLayer accessToken={FAKE_TOKEN}>
         <PricesContainer>
-          <SkuChildrenContext.Provider
-            value={{ sku: { code: SKU_CODE } as Partial<Sku> as Sku }}
-          >
+          <SkuChildrenContext.Provider value={{ sku: { code: SKU_CODE } as Partial<Sku> as Sku }}>
             <Price data-testid="sku-ctx-price" />
           </SkuChildrenContext.Provider>
         </PricesContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
+      { wrapper: swrWrapper }
     )
-    expect(
-      container.querySelector('[data-testid="sku-ctx-price"]'),
-    ).not.toBeNull()
+    expect(container.querySelector('[data-testid="sku-ctx-price"]')).not.toBeNull()
   })
 
   it("renders when no skuCode available (final empty-string fallback)", () => {
@@ -73,11 +69,9 @@ describe("Price component", () => {
           <Price data-testid="no-code-price" />
         </PricesContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
+      { wrapper: swrWrapper }
     )
-    expect(
-      container.querySelector('[data-testid="no-code-price"]'),
-    ).not.toBeNull()
+    expect(container.querySelector('[data-testid="no-code-price"]')).not.toBeNull()
   })
 
   it("renders standalone — filters batch prices by sku_code", () => {
@@ -97,7 +91,7 @@ describe("Price component", () => {
       <CommerceLayer accessToken={FAKE_TOKEN}>
         <Price skuCode={SKU_CODE} data-testid="standalone-price" />
       </CommerceLayer>,
-      { wrapper: swrWrapper },
+      { wrapper: swrWrapper }
     )
     expect(container).not.toBeNull()
   })
@@ -108,7 +102,7 @@ describe("Price component", () => {
       <CommerceLayerContext.Provider value={{}}>
         <Price skuCode={SKU_CODE} data-testid="no-token-standalone" />
       </CommerceLayerContext.Provider>,
-      { wrapper: swrWrapper },
+      { wrapper: swrWrapper }
     )
     // usePrices called with "" since accessToken is undefined
     expect(vi.mocked(usePrices)).toHaveBeenLastCalledWith("", undefined)
@@ -122,7 +116,7 @@ describe("Price component", () => {
           <span data-testid="child">test</span>
         </PricesContainer>
       </CommerceLayerContext.Provider>,
-      { wrapper: swrWrapper },
+      { wrapper: swrWrapper }
     )
     expect(container.querySelector('[data-testid="child"]')).not.toBeNull()
   })
diff --git a/packages/react-components/specs/prices/prices-container.spec.tsx b/packages/react-components/specs/prices/prices-container.spec.tsx
index 219ff14c..562f74be 100644
--- a/packages/react-components/specs/prices/prices-container.spec.tsx
+++ b/packages/react-components/specs/prices/prices-container.spec.tsx
@@ -12,11 +12,7 @@ import type { PricesContext as PricesCtx } from "../utils/context"
 const swrWrapper = ({ children }: { children: ReactNode }) =>
   createElement(SWRConfig, { value: { provider: () => new Map() } }, children)
 
-function PricesInspector({
-  onCapture,
-}: {
-  onCapture: (prices: Record<string, unknown>) => void
-}) {
+function PricesInspector({ onCapture }: { onCapture: (prices: Record<string, unknown>) => void }) {
   const { prices } = useContext(PricesContext)
   onCapture(prices)
   return null
@@ -39,7 +35,7 @@ describe("PricesContainer component", () => {
           <span data-testid="child">price</span>
         </PricesContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
+      { wrapper: swrWrapper }
     )
     expect(container.querySelector('[data-testid="child"]')).not.toBeNull()
   })
@@ -56,12 +52,9 @@ describe("PricesContainer component", () => {
           />
         </PricesContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
-    )
-    await waitFor(
-      () => expect(Object.keys(captured).length).toBeGreaterThan(0),
-      { timeout: 10000 },
+      { wrapper: swrWrapper }
     )
+    await waitFor(() => expect(Object.keys(captured).length).toBeGreaterThan(0), { timeout: 10000 })
     expect(Object.keys(captured)).toContain(ctx.skuCode)
   })
 
@@ -72,7 +65,7 @@ describe("PricesContainer component", () => {
           <Price skuCode={ctx.skuCode} data-testid={`price-${ctx.skuCode}`} />
         </PricesContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
+      { wrapper: swrWrapper }
     )
     await waitFor(
       () => {
@@ -80,7 +73,7 @@ describe("PricesContainer component", () => {
         expect(els.length).toBeGreaterThan(0)
         expect(els[0].textContent).not.toBe("")
       },
-      { timeout: 10000 },
+      { timeout: 10000 }
     )
   })
 
@@ -91,7 +84,7 @@ describe("PricesContainer component", () => {
           <span data-testid="child">price</span>
         </PricesContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
+      { wrapper: swrWrapper }
     )
     expect(container.querySelector('[data-testid="child"]')).not.toBeNull()
   })
@@ -111,12 +104,9 @@ describe("PricesContainer component", () => {
           </PricesContainer>
         </CommerceLayer>
       </SkuContext.Provider>,
-      { wrapper: swrWrapper },
-    )
-    await waitFor(
-      () => expect(Object.keys(captured).length).toBeGreaterThan(0),
-      { timeout: 10000 },
+      { wrapper: swrWrapper }
     )
+    await waitFor(() => expect(Object.keys(captured).length).toBeGreaterThan(0), { timeout: 10000 })
     expect(Object.keys(captured)).toContain(ctx.skuCode)
   })
 
@@ -128,14 +118,14 @@ describe("PricesContainer component", () => {
           <Price skuCode={ctx.skuCode} data-testid={`dyn-${ctx.skuCode}`} />
         </PricesContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
+      { wrapper: swrWrapper }
     )
     await waitFor(
       () => {
         const els = screen.getAllByTestId(`dyn-${ctx.skuCode}`)
         expect(els[0].textContent).not.toBe("")
       },
-      { timeout: 10000 },
+      { timeout: 10000 }
     )
   })
 
@@ -147,7 +137,7 @@ describe("PricesContainer component", () => {
           <span>test</span>
         </PricesContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
+      { wrapper: swrWrapper }
     )
     unmount()
   })
@@ -160,7 +150,7 @@ describe("PricesContainer component", () => {
           <span data-testid="empty">no codes</span>
         </PricesContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
+      { wrapper: swrWrapper }
     )
     expect(container.querySelector('[data-testid="empty"]')).not.toBeNull()
   })
@@ -185,7 +175,7 @@ describe("PricesContainer component", () => {
           <Price skuCode={sku3} />
         </PricesContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
+      { wrapper: swrWrapper }
     )
     // All three codes must end up in the context (even if the API returns no
     // prices for those SKUs the fetch must have been attempted with all three)
@@ -194,7 +184,7 @@ describe("PricesContainer component", () => {
         const keys = Object.keys(captured)
         expect(keys.length).toBeGreaterThanOrEqual(1)
       },
-      { timeout: 10000 },
+      { timeout: 10000 }
     )
   })
 
@@ -204,21 +194,19 @@ describe("PricesContainer component", () => {
         <PricesContainer skuCode={ctx.skuCode}>
           <Price skuCode={ctx.skuCode}>
             {({ prices, loading }) => (
-              <span data-testid="price-child">
-                {loading ? "loading" : `${prices.length}`}
-              </span>
+              <span data-testid="price-child">{loading ? "loading" : `${prices.length}`}</span>
             )}
           </Price>
         </PricesContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
+      { wrapper: swrWrapper }
     )
     await waitFor(
       () => {
         const el = screen.getByTestId("price-child")
         expect(el.textContent).not.toBe("loading")
       },
-      { timeout: 10000 },
+      { timeout: 10000 }
     )
   })
 })
diff --git a/packages/react-components/specs/skus/availability-container.spec.tsx b/packages/react-components/specs/skus/availability-container.spec.tsx
index f24e8836..829e8967 100644
--- a/packages/react-components/specs/skus/availability-container.spec.tsx
+++ b/packages/react-components/specs/skus/availability-container.spec.tsx
@@ -38,7 +38,7 @@ describe("AvailabilityContainer component", () => {
           <span data-testid="child">availability</span>
         </AvailabilityContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
+      { wrapper: swrWrapper }
     )
     expect(container.querySelector('[data-testid="child"]')).not.toBeNull()
   })
@@ -55,7 +55,7 @@ describe("AvailabilityContainer component", () => {
           />
         </AvailabilityContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
+      { wrapper: swrWrapper }
     )
     await waitFor(() => expect(capturedQty).toBeDefined(), { timeout: 10000 })
     expect(typeof capturedQty).toBe("number")
@@ -65,19 +65,17 @@ describe("AvailabilityContainer component", () => {
     render(
       <CommerceLayer accessToken={ctx.accessToken}>
         <AvailabilityContainer skuCode={ctx.skuCode}>
-          <AvailabilityTemplate
-            labels={{ available: "Available", outOfStock: "Out of stock" }}
-          />
+          <AvailabilityTemplate labels={{ available: "Available", outOfStock: "Out of stock" }} />
         </AvailabilityContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
+      { wrapper: swrWrapper }
     )
     await waitFor(
       () => {
         const span = screen.getByTestId(`availability-${ctx.skuCode}`)
         expect(span.textContent).toMatch(/Available|Out of stock/)
       },
-      { timeout: 10000 },
+      { timeout: 10000 }
     )
   })
 
@@ -89,12 +87,11 @@ describe("AvailabilityContainer component", () => {
           <span />
         </AvailabilityContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
-    )
-    await waitFor(
-      () => expect(onQuantity).toHaveBeenCalledWith(expect.any(Number)),
-      { timeout: 10000 },
+      { wrapper: swrWrapper }
     )
+    await waitFor(() => expect(onQuantity).toHaveBeenCalledWith(expect.any(Number)), {
+      timeout: 10000,
+    })
   })
 
   it<AvailabilityCtx>("renders nothing meaningful when skuCode is empty", (ctx) => {
@@ -104,7 +101,7 @@ describe("AvailabilityContainer component", () => {
           <AvailabilityTemplate />
         </AvailabilityContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
+      { wrapper: swrWrapper }
     )
     const spans = container.querySelectorAll("span")
     spans.forEach((span) => {
diff --git a/packages/react-components/specs/skus/sku-lists-container-unit.spec.tsx b/packages/react-components/specs/skus/sku-lists-container-unit.spec.tsx
index 263040db..2a068331 100644
--- a/packages/react-components/specs/skus/sku-lists-container-unit.spec.tsx
+++ b/packages/react-components/specs/skus/sku-lists-container-unit.spec.tsx
@@ -1,55 +1,54 @@
-import { SkuListsContainer } from '#components/skus/SkuListsContainer'
-import { SkuList } from '#components/skus/SkuList'
-import CommerceLayerContext from '#context/CommerceLayerContext'
-import SkuListsContext from '#context/SkuListsContext'
-import { render, waitFor } from '@testing-library/react'
-import { createElement, useContext, type ReactNode } from 'react'
-import { SWRConfig } from 'swr'
-import { vi } from 'vitest'
+import { SkuListsContainer } from "#components/skus/SkuListsContainer"
+import { SkuList } from "#components/skus/SkuList"
+import CommerceLayerContext from "#context/CommerceLayerContext"
+import SkuListsContext from "#context/SkuListsContext"
+import { render, waitFor } from "@testing-library/react"
+import { createElement, useContext, type ReactNode } from "react"
+import { SWRConfig } from "swr"
+import { vi } from "vitest"
 
-vi.mock('@commercelayer/hooks', async (importOriginal) => {
-  const actual = await importOriginal<typeof import('@commercelayer/hooks')>()
+vi.mock("@commercelayer/hooks", async (importOriginal) => {
+  const actual = await importOriginal<typeof import("@commercelayer/hooks")>()
   return {
     ...actual,
     useSkuLists: vi.fn(() => ({
       retrieveSkuList: vi.fn().mockResolvedValue({
-        skus: [{ code: 'SKU001', id: '1', type: 'skus' }]
-      })
-    }))
+        skus: [{ code: "SKU001", id: "1", type: "skus" }],
+      }),
+    })),
   }
 })
 
 const swrWrapper = ({ children }: { children: ReactNode }) =>
   createElement(SWRConfig, { value: { provider: () => new Map() } }, children)
 
-function SkuListsInspector({
-  onCapture
-}: {
-  onCapture: (v: Record<string, unknown>) => void
-}) {
+function SkuListsInspector({ onCapture }: { onCapture: (v: Record<string, unknown>) => void }) {
   const { skuLists } = useContext(SkuListsContext)
   onCapture(skuLists)
   return null
 }
 
-describe('SkuListsContainer – unit (mocked useSkuLists)', () => {
-  it('fetches sku lists and populates skuLists context when accessToken and ids are present', async () => {
+describe("SkuListsContainer – unit (mocked useSkuLists)", () => {
+  it("fetches sku lists and populates skuLists context when accessToken and ids are present", async () => {
     let captured: Record<string, unknown> = {}
     render(
-      <CommerceLayerContext.Provider value={{ accessToken: 'fake-token', endpoint: 'https://test.commercelayer.io' }}>
+      <CommerceLayerContext.Provider
+        value={{ accessToken: "fake-token", endpoint: "https://test.commercelayer.io" }}
+      >
         <SkuListsContainer>
-          <SkuList id='list-001'>
+          <SkuList id="list-001">
             <span />
           </SkuList>
-          <SkuListsInspector onCapture={(v) => { captured = v }} />
+          <SkuListsInspector
+            onCapture={(v) => {
+              captured = v
+            }}
+          />
         </SkuListsContainer>
       </CommerceLayerContext.Provider>,
       { wrapper: swrWrapper }
     )
-    await waitFor(
-      () => expect(Object.keys(captured)).toContain('list-001'),
-      { timeout: 5000 }
-    )
-    expect(Array.isArray(captured['list-001'])).toBe(true)
+    await waitFor(() => expect(Object.keys(captured)).toContain("list-001"), { timeout: 5000 })
+    expect(Array.isArray(captured["list-001"])).toBe(true)
   })
 })
diff --git a/packages/react-components/specs/skus/sku-lists-container.spec.tsx b/packages/react-components/specs/skus/sku-lists-container.spec.tsx
index 41d238d9..5ff3e264 100644
--- a/packages/react-components/specs/skus/sku-lists-container.spec.tsx
+++ b/packages/react-components/specs/skus/sku-lists-container.spec.tsx
@@ -12,11 +12,7 @@ import type { SkuListsContext as SkuListsCtx } from "../utils/context"
 const swrWrapper = ({ children }: { children: ReactNode }) =>
   createElement(SWRConfig, { value: { provider: () => new Map() } }, children)
 
-function SkuListsInspector({
-  onCapture,
-}: {
-  onCapture: (v: Record<string, unknown>) => void
-}) {
+function SkuListsInspector({ onCapture }: { onCapture: (v: Record<string, unknown>) => void }) {
   const { skuLists } = useContext(SkuListsContext)
   onCapture(skuLists)
   return null
@@ -40,7 +36,7 @@ describe("SkuListsContainer component", () => {
           <div data-testid="child">content</div>
         </SkuListsContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
+      { wrapper: swrWrapper }
     )
     expect(container.querySelector('[data-testid="child"]')).not.toBeNull()
   })
@@ -55,12 +51,11 @@ describe("SkuListsContainer component", () => {
           </SkuList>
         </SkuListsContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
-    )
-    await waitFor(
-      () => expect(screen.getByTestId(`list-${ctx.skuListId}`)).toBeTruthy(),
-      { timeout: 5000 },
+      { wrapper: swrWrapper }
     )
+    await waitFor(() => expect(screen.getByTestId(`list-${ctx.skuListId}`)).toBeTruthy(), {
+      timeout: 5000,
+    })
     expect(screen.getByTestId(`list-${ctx.skuListId}`).textContent).toBe("item")
   })
 
@@ -80,12 +75,9 @@ describe("SkuListsContainer component", () => {
           />
         </SkuListsContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
-    )
-    await waitFor(
-      () => expect(Object.keys(captured)).toContain(ctx.skuListId),
-      { timeout: 10000 },
+      { wrapper: swrWrapper }
     )
+    await waitFor(() => expect(Object.keys(captured)).toContain(ctx.skuListId), { timeout: 10000 })
     expect(Array.isArray(captured[ctx.skuListId])).toBe(true)
   })
 })
diff --git a/packages/react-components/specs/skus/skus-container.spec.tsx b/packages/react-components/specs/skus/skus-container.spec.tsx
index dbd34e6f..dadcd4c0 100644
--- a/packages/react-components/specs/skus/skus-container.spec.tsx
+++ b/packages/react-components/specs/skus/skus-container.spec.tsx
@@ -31,7 +31,7 @@ describe("SkusContainer component", () => {
           </Skus>
         </SkusContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
+      { wrapper: swrWrapper }
     )
     for await (const sku of ctx.skus) {
       await waitFor(() => screen.getByTestId(sku), { timeout: 10000 })
@@ -48,13 +48,11 @@ describe("SkusContainer component", () => {
           </Skus>
         </SkusContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
-    )
-    await waitFor(
-      () =>
-        expect(screen.getAllByTestId(/^BABY/)).toHaveLength(ctx.skus.length),
-      { timeout: 10000 },
+      { wrapper: swrWrapper }
     )
+    await waitFor(() => expect(screen.getAllByTestId(/^BABY/)).toHaveLength(ctx.skus.length), {
+      timeout: 10000,
+    })
   })
 
   it<SkusContext>("renders SKU name field", async (ctx) => {
@@ -62,15 +60,11 @@ describe("SkusContainer component", () => {
       <CommerceLayer accessToken={ctx.accessToken}>
         <SkusContainer skus={[ctx.sku]}>
           <Skus>
-            <SkuField
-              attribute="name"
-              tagElement="span"
-              data-testid="sku-name"
-            />
+            <SkuField attribute="name" tagElement="span" data-testid="sku-name" />
           </Skus>
         </SkusContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
+      { wrapper: swrWrapper }
     )
     await waitFor(() => screen.getByTestId("sku-name"), { timeout: 10000 })
     expect(screen.getByTestId("sku-name").textContent).not.toBe("")
@@ -85,7 +79,7 @@ describe("SkusContainer component", () => {
           </Skus>
         </SkusContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
+      { wrapper: swrWrapper }
     )
     await waitFor(
       () => {
@@ -93,7 +87,7 @@ describe("SkusContainer component", () => {
         expect(img).not.toBeNull()
         expect(img?.getAttribute("src")).toBeTruthy()
       },
-      { timeout: 10000 },
+      { timeout: 10000 }
     )
   })
 
@@ -106,7 +100,7 @@ describe("SkusContainer component", () => {
           </Skus>
         </SkusContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
+      { wrapper: swrWrapper }
     )
     expect(container.querySelectorAll("p")).toHaveLength(0)
   })
@@ -120,12 +114,10 @@ describe("SkusContainer component", () => {
           </Skus>
         </SkusContainer>
       </CommerceLayer>,
-      { wrapper: swrWrapper },
-    )
-    await waitFor(
-      () =>
-        expect(screen.getAllByTestId(/^BABY/).length).toBeGreaterThanOrEqual(1),
-      { timeout: 10000 },
+      { wrapper: swrWrapper }
     )
+    await waitFor(() => expect(screen.getAllByTestId(/^BABY/).length).toBeGreaterThanOrEqual(1), {
+      timeout: 10000,
+    })
   })
 })
diff --git a/packages/react-components/specs/skus/skus-unit.spec.tsx b/packages/react-components/specs/skus/skus-unit.spec.tsx
index 05df2614..5d2eb5a2 100644
--- a/packages/react-components/specs/skus/skus-unit.spec.tsx
+++ b/packages/react-components/specs/skus/skus-unit.spec.tsx
@@ -1,17 +1,17 @@
-import { AvailabilityTemplate } from '#components/skus/AvailabilityTemplate'
-import { DeliveryLeadTime } from '#components/skus/DeliveryLeadTime'
-import { SkuField } from '#components/skus/SkuField'
-import { SkuList } from '#components/skus/SkuList'
-import { SkuListsContainer } from '#components/skus/SkuListsContainer'
-import Parent from '#components/utils/Parent'
-import AvailabilityContext from '#context/AvailabilityContext'
-import CommerceLayerContext from '#context/CommerceLayerContext'
-import ShippingMethodChildrenContext from '#context/ShippingMethodChildrenContext'
-import SkuChildrenContext from '#context/SkuChildrenContext'
-import SkuListsContext from '#context/SkuListsContext'
-import { render, screen, waitFor } from '@testing-library/react'
-import { createElement, type ReactNode } from 'react'
-import { SWRConfig } from 'swr'
+import { AvailabilityTemplate } from "#components/skus/AvailabilityTemplate"
+import { DeliveryLeadTime } from "#components/skus/DeliveryLeadTime"
+import { SkuField } from "#components/skus/SkuField"
+import { SkuList } from "#components/skus/SkuList"
+import { SkuListsContainer } from "#components/skus/SkuListsContainer"
+import Parent from "#components/utils/Parent"
+import AvailabilityContext from "#context/AvailabilityContext"
+import CommerceLayerContext from "#context/CommerceLayerContext"
+import ShippingMethodChildrenContext from "#context/ShippingMethodChildrenContext"
+import SkuChildrenContext from "#context/SkuChildrenContext"
+import SkuListsContext from "#context/SkuListsContext"
+import { render, screen, waitFor } from "@testing-library/react"
+import { createElement, type ReactNode } from "react"
+import { SWRConfig } from "swr"
 
 const swrWrapper = ({ children }: { children: ReactNode }) =>
   createElement(SWRConfig, { value: { provider: () => new Map() } }, children)
@@ -20,57 +20,57 @@ const swrWrapper = ({ children }: { children: ReactNode }) =>
 // DeliveryLeadTime
 // ---------------------------------------------------------------------------
 
-describe('DeliveryLeadTime component', () => {
-  it('renders the min_days value from context', () => {
+describe("DeliveryLeadTime component", () => {
+  it("renders the min_days value from context", () => {
     const mockContext = {
       deliveryLeadTimeForShipment: {
         min_days: 2,
         max_days: 5,
         min_hours: 48,
-        max_hours: 120
-      } as any
+        max_hours: 120,
+      } as any,
     }
     render(
       <ShippingMethodChildrenContext.Provider value={mockContext}>
-        <DeliveryLeadTime type='min_days' data-testid='lead-time' />
+        <DeliveryLeadTime type="min_days" data-testid="lead-time" />
       </ShippingMethodChildrenContext.Provider>
     )
-    expect(screen.getByTestId('lead-time').textContent).toBe('2')
+    expect(screen.getByTestId("lead-time").textContent).toBe("2")
   })
 
-  it('renders nothing when context has no deliveryLeadTime', () => {
+  it("renders nothing when context has no deliveryLeadTime", () => {
     render(
       <ShippingMethodChildrenContext.Provider value={{}}>
-        <DeliveryLeadTime type='min_days' data-testid='lead-time' />
+        <DeliveryLeadTime type="min_days" data-testid="lead-time" />
       </ShippingMethodChildrenContext.Provider>
     )
-    expect(screen.getByTestId('lead-time').textContent).toBe('')
+    expect(screen.getByTestId("lead-time").textContent).toBe("")
   })
 
-  it('clears text on unmount via useEffect cleanup', () => {
+  it("clears text on unmount via useEffect cleanup", () => {
     const { unmount } = render(
       <ShippingMethodChildrenContext.Provider
         value={{ deliveryLeadTimeForShipment: { min_days: 5 } as any }}
       >
-        <DeliveryLeadTime type='min_days' data-testid='lead-time-cleanup' />
+        <DeliveryLeadTime type="min_days" data-testid="lead-time-cleanup" />
       </ShippingMethodChildrenContext.Provider>
     )
     unmount()
     // verifies the cleanup function (setText('')) runs without errors
   })
 
-  it('renders via children render prop', () => {
+  it("renders via children render prop", () => {
     const mockContext = {
-      deliveryLeadTimeForShipment: { min_days: 3 } as any
+      deliveryLeadTimeForShipment: { min_days: 3 } as any,
     }
     render(
       <ShippingMethodChildrenContext.Provider value={mockContext}>
-        <DeliveryLeadTime type='min_days'>
-          {({ text }) => <span data-testid='custom'>{text}</span>}
+        <DeliveryLeadTime type="min_days">
+          {({ text }) => <span data-testid="custom">{text}</span>}
         </DeliveryLeadTime>
       </ShippingMethodChildrenContext.Provider>
     )
-    expect(screen.getByTestId('custom')).toBeDefined()
+    expect(screen.getByTestId("custom")).toBeDefined()
   })
 })
 
@@ -78,121 +78,126 @@ describe('DeliveryLeadTime component', () => {
 // AvailabilityTemplate
 // ---------------------------------------------------------------------------
 
-describe('AvailabilityTemplate component', () => {
+describe("AvailabilityTemplate component", () => {
   const wrapWithContext = (qty: number | undefined, min?: number, max?: number) =>
     createElement(
       AvailabilityContext.Provider,
       {
         value: {
           quantity: qty,
-          skuCode: 'TESTSKU',
+          skuCode: "TESTSKU",
           parent: true,
           min: min != null ? { hours: min * 24, days: min } : undefined,
-          max: max != null ? { hours: max * 24, days: max } : undefined
-        }
+          max: max != null ? { hours: max * 24, days: max } : undefined,
+        },
       },
       createElement(AvailabilityTemplate, {
-        labels: { available: 'Available', outOfStock: 'Out of stock', negativeStock: 'Negative' }
+        labels: { available: "Available", outOfStock: "Out of stock", negativeStock: "Negative" },
       })
     )
 
-  it('shows available text when quantity > 0', () => {
+  it("shows available text when quantity > 0", () => {
     render(wrapWithContext(5))
-    expect(screen.getByTestId('availability-TESTSKU').textContent).toContain('Available')
+    expect(screen.getByTestId("availability-TESTSKU").textContent).toContain("Available")
   })
 
-  it('shows out of stock when quantity === 0', () => {
+  it("shows out of stock when quantity === 0", () => {
     render(wrapWithContext(0))
-    expect(screen.getByTestId('availability-TESTSKU').textContent).toContain('Out of stock')
+    expect(screen.getByTestId("availability-TESTSKU").textContent).toContain("Out of stock")
   })
 
-  it('shows negative stock text when quantity < 0', () => {
+  it("shows negative stock text when quantity < 0", () => {
     render(wrapWithContext(-1))
-    expect(screen.getByTestId('availability-TESTSKU').textContent).toContain('Negative')
+    expect(screen.getByTestId("availability-TESTSKU").textContent).toContain("Negative")
   })
 
-  it('renders empty span when quantity is undefined', () => {
+  it("renders empty span when quantity is undefined", () => {
     render(
       createElement(
         AvailabilityContext.Provider,
-        { value: { skuCode: 'TESTSKU-UNDEF', parent: true } },
+        { value: { skuCode: "TESTSKU-UNDEF", parent: true } },
         createElement(AvailabilityTemplate)
       )
     )
-    expect(screen.getByTestId('availability-TESTSKU-UNDEF').textContent).toBe('')
+    expect(screen.getByTestId("availability-TESTSKU-UNDEF").textContent).toBe("")
   })
 
-  it('shows delivery lead time with timeFormat when min/max are set', () => {
+  it("shows delivery lead time with timeFormat when min/max are set", () => {
     render(
       createElement(
         AvailabilityContext.Provider,
         {
           value: {
             quantity: 10,
-            skuCode: 'TESTSKU2',
+            skuCode: "TESTSKU2",
             parent: true,
             min: { hours: 24, days: 1 },
-            max: { hours: 72, days: 3 }
-          }
+            max: { hours: 72, days: 3 },
+          },
         },
-        createElement(AvailabilityTemplate, { timeFormat: 'days' })
+        createElement(AvailabilityTemplate, { timeFormat: "days" })
       )
     )
-    expect(screen.getByTestId('availability-TESTSKU2').textContent).toContain('1')
+    expect(screen.getByTestId("availability-TESTSKU2").textContent).toContain("1")
   })
 
-  it('shows shipping method name when showShippingMethodName is true', () => {
+  it("shows shipping method name when showShippingMethodName is true", () => {
     render(
       createElement(
         AvailabilityContext.Provider,
         {
           value: {
             quantity: 10,
-            skuCode: 'TESTSKU-SM',
+            skuCode: "TESTSKU-SM",
             parent: true,
             min: { hours: 24, days: 1 },
             max: { hours: 72, days: 3 },
-            shipping_method: { name: 'Express', id: '1', type: 'shipping_methods' } as any
-          }
+            shipping_method: { name: "Express", id: "1", type: "shipping_methods" } as any,
+          },
         },
-        createElement(AvailabilityTemplate, { timeFormat: 'days', showShippingMethodName: true })
+        createElement(AvailabilityTemplate, { timeFormat: "days", showShippingMethodName: true })
       )
     )
-    expect(screen.getByTestId('availability-TESTSKU-SM').textContent).toContain('with Express')
+    expect(screen.getByTestId("availability-TESTSKU-SM").textContent).toContain("with Express")
   })
 
-  it('shows shipping method price when showShippingMethodPrice is true', () => {
+  it("shows shipping method price when showShippingMethodPrice is true", () => {
     render(
       createElement(
         AvailabilityContext.Provider,
         {
           value: {
             quantity: 10,
-            skuCode: 'TESTSKU-PRICE',
+            skuCode: "TESTSKU-PRICE",
             parent: true,
             min: { hours: 24, days: 1 },
             max: { hours: 72, days: 3 },
-            shipping_method: { name: 'Standard', formatted_price_amount: '$5.00', id: '1', type: 'shipping_methods' } as any
-          }
+            shipping_method: {
+              name: "Standard",
+              formatted_price_amount: "$5.00",
+              id: "1",
+              type: "shipping_methods",
+            } as any,
+          },
         },
-        createElement(AvailabilityTemplate, { timeFormat: 'days', showShippingMethodPrice: true })
+        createElement(AvailabilityTemplate, { timeFormat: "days", showShippingMethodPrice: true })
       )
     )
-    expect(screen.getByTestId('availability-TESTSKU-PRICE').textContent).toContain('($5.00)')
+    expect(screen.getByTestId("availability-TESTSKU-PRICE").textContent).toContain("($5.00)")
   })
 
-  it('renders via children render prop', () => {
+  it("renders via children render prop", () => {
     render(
       createElement(
         AvailabilityContext.Provider,
-        { value: { quantity: 5, skuCode: 'TESTSKU3', parent: true } },
+        { value: { quantity: 5, skuCode: "TESTSKU3", parent: true } },
         createElement(AvailabilityTemplate, {
           children: ({ quantity }) =>
-            createElement('span', { 'data-testid': 'custom-avail' }, String(quantity))
+            createElement("span", { "data-testid": "custom-avail" }, String(quantity)),
         })
       )
     )
-    expect(screen.getByTestId('custom-avail').textContent).toBe('5')
+    expect(screen.getByTestId("custom-avail").textContent).toBe("5")
   })
 })
 
@@ -200,62 +205,60 @@ describe('AvailabilityTemplate component', () => {
 // SkuField children render prop
 // ---------------------------------------------------------------------------
 
-describe('SkuField component', () => {
-  it('renders via children render prop', () => {
+describe("SkuField component", () => {
+  it("renders via children render prop", () => {
     render(
-      <SkuChildrenContext.Provider value={{ sku: { code: 'SKU001' } as any }}>
-        <SkuField attribute='code'>
-          {({ attributeValue }) => (
-            <span data-testid='custom-field'>{String(attributeValue)}</span>
-          )}
+      <SkuChildrenContext.Provider value={{ sku: { code: "SKU001" } as any }}>
+        <SkuField attribute="code">
+          {({ attributeValue }) => <span data-testid="custom-field">{String(attributeValue)}</span>}
         </SkuField>
       </SkuChildrenContext.Provider>
     )
-    expect(screen.getByTestId('custom-field').textContent).toBe('SKU001')
+    expect(screen.getByTestId("custom-field").textContent).toBe("SKU001")
   })
 
-  it('renders default span tag when no children provided', () => {
+  it("renders default span tag when no children provided", () => {
     render(
-      <SkuChildrenContext.Provider value={{ sku: { code: 'SKU002' } as any }}>
-        <SkuField attribute='code' />
+      <SkuChildrenContext.Provider value={{ sku: { code: "SKU002" } as any }}>
+        <SkuField attribute="code" />
       </SkuChildrenContext.Provider>
     )
-    expect(screen.getByTestId('SKU002').textContent).toBe('SKU002')
+    expect(screen.getByTestId("SKU002").textContent).toBe("SKU002")
   })
 
-  it('renders custom tagElement when provided', () => {
+  it("renders custom tagElement when provided", () => {
     render(
-      <SkuChildrenContext.Provider value={{ sku: { code: 'SKU003' } as any }}>
-        <SkuField attribute='code' tagElement='p' />
+      <SkuChildrenContext.Provider value={{ sku: { code: "SKU003" } as any }}>
+        <SkuField attribute="code" tagElement="p" />
       </SkuChildrenContext.Provider>
     )
-    const el = screen.getByTestId('SKU003')
-    expect(el.tagName.toLowerCase()).toBe('p')
-    expect(el.textContent).toBe('SKU003')
+    const el = screen.getByTestId("SKU003")
+    expect(el.tagName.toLowerCase()).toBe("p")
+    expect(el.textContent).toBe("SKU003")
   })
 
-  it('renders img tag when tagElement is img', () => {
+  it("renders img tag when tagElement is img", () => {
     const { container } = render(
       <SkuChildrenContext.Provider
-        value={{ sku: { image_url: 'https://example.com/img.jpg' } as any }}
+        value={{ sku: { image_url: "https://example.com/img.jpg" } as any }}
       >
-        <SkuField attribute='image_url' tagElement='img' />
+        <SkuField attribute="image_url" tagElement="img" />
       </SkuChildrenContext.Provider>
     )
-    const img = container.querySelector('img')
+    const img = container.querySelector("img")
     expect(img).not.toBeNull()
-    expect(img?.getAttribute('src')).toBe('https://example.com/img.jpg')
+    expect(img?.getAttribute("src")).toBe("https://example.com/img.jpg")
   })
 
-  it('renders img with defaultImgUrl when attribute value is empty', () => {
+  it("renders img with defaultImgUrl when attribute value is empty", () => {
     const { container } = render(
-      <SkuChildrenContext.Provider value={{ sku: { image_url: '' } as any }}>
-        <SkuField attribute='image_url' tagElement='img' />
+      <SkuChildrenContext.Provider value={{ sku: { image_url: "" } as any }}>
+        <SkuField attribute="image_url" tagElement="img" />
       </SkuChildrenContext.Provider>
     )
-    const img = container.querySelector('img')
+    const img = container.querySelector("img")
     expect(img).not.toBeNull()
-    expect(img?.getAttribute('src')).toBeTruthy()
+    expect(img?.getAttribute("src")).toBeTruthy()
   })
 })
 
@@ -263,18 +266,16 @@ describe('SkuField component', () => {
 // Parent utility component
 // ---------------------------------------------------------------------------
 
-describe('Parent component', () => {
-  it('returns null when children is undefined', () => {
+describe("Parent component", () => {
+  it("returns null when children is undefined", () => {
     const { container } = render(<Parent />)
     expect(container.firstChild).toBeNull()
   })
 
-  it('renders children when provided', () => {
-    const Child = ({ label }: { label: string }) => (
-      <span data-testid='parent-child'>{label}</span>
-    )
+  it("renders children when provided", () => {
+    const Child = ({ label }: { label: string }) => <span data-testid="parent-child">{label}</span>
     render(<Parent>{Child}</Parent>)
-    expect(screen.getByTestId('parent-child')).toBeDefined()
+    expect(screen.getByTestId("parent-child")).toBeDefined()
   })
 })
 
@@ -282,27 +283,27 @@ describe('Parent component', () => {
 // SkuList inside SkuListsContainer
 // ---------------------------------------------------------------------------
 
-describe('SkuList component', () => {
-  it('renders its children', () => {
+describe("SkuList component", () => {
+  it("renders its children", () => {
     render(
-      <CommerceLayerContext.Provider value={{ accessToken: undefined as any, endpoint: '' }}>
+      <CommerceLayerContext.Provider value={{ accessToken: undefined as any, endpoint: "" }}>
         <SkuListsContainer>
-          <SkuList id='test-list-id'>
-            <span data-testid='list-child'>content</span>
+          <SkuList id="test-list-id">
+            <span data-testid="list-child">content</span>
           </SkuList>
         </SkuListsContainer>
       </CommerceLayerContext.Provider>,
       { wrapper: swrWrapper }
     )
-    expect(screen.getByTestId('list-child').textContent).toBe('content')
+    expect(screen.getByTestId("list-child").textContent).toBe("content")
   })
 
-  it('registers the id in SkuListsContext', async () => {
+  it("registers the id in SkuListsContext", async () => {
     let capturedIds: string[] = []
     render(
-      <CommerceLayerContext.Provider value={{ accessToken: undefined as any, endpoint: '' }}>
+      <CommerceLayerContext.Provider value={{ accessToken: undefined as any, endpoint: "" }}>
         <SkuListsContainer>
-          <SkuList id='my-list'>
+          <SkuList id="my-list">
             <span />
           </SkuList>
           <SkuListsContext.Consumer>
@@ -315,6 +316,6 @@ describe('SkuList component', () => {
       </CommerceLayerContext.Provider>,
       { wrapper: swrWrapper }
     )
-    await waitFor(() => expect(capturedIds).toContain('my-list'), { timeout: 2000 })
+    await waitFor(() => expect(capturedIds).toContain("my-list"), { timeout: 2000 })
   })
 })
diff --git a/packages/react-components/specs/utils/getToken.ts b/packages/react-components/specs/utils/getToken.ts
index 35423b64..2931d3f4 100644
--- a/packages/react-components/specs/utils/getToken.ts
+++ b/packages/react-components/specs/utils/getToken.ts
@@ -1,50 +1,46 @@
-import { authenticate } from '@commercelayer/js-auth'
+import { authenticate } from "@commercelayer/js-auth"
 
-export type TokenType =
-  | 'sales_channel'
-  | 'customer'
-  | 'customer_empty'
-  | 'customer_with_low_data'
+export type TokenType = "sales_channel" | "customer" | "customer_empty" | "customer_with_low_data"
 
 export default async function getToken(
-  type: TokenType = 'sales_channel'
+  type: TokenType = "sales_channel"
 ): Promise<{ accessToken: string | undefined; endpoint: string }> {
-  const clientId = process.env['VITE_TEST_CLIENT_ID'] ?? ''
-  const slug = process.env['VITE_TEST_SLUG'] ?? ''
-  const scope = process.env['VITE_TEST_MARKET_ID'] ?? ''
-  const domain = process.env['VITE_TEST_DOMAIN'] ?? ''
+  const clientId = process.env["VITE_TEST_CLIENT_ID"] ?? ""
+  const slug = process.env["VITE_TEST_SLUG"] ?? ""
+  const scope = process.env["VITE_TEST_MARKET_ID"] ?? ""
+  const domain = process.env["VITE_TEST_DOMAIN"] ?? ""
   const user =
-    type === 'customer'
+    type === "customer"
       ? {
-          username: process.env['VITE_TEST_USERNAME'] ?? '',
-          password: process.env['VITE_TEST_PASSWORD'] ?? ''
+          username: process.env["VITE_TEST_USERNAME"] ?? "",
+          password: process.env["VITE_TEST_PASSWORD"] ?? "",
         }
-      : type === 'customer_empty'
+      : type === "customer_empty"
         ? {
-            username: process.env['VITE_TEST_USERNAME_EMPTY'] ?? '',
-            password: process.env['VITE_TEST_PASSWORD_EMPTY'] ?? ''
+            username: process.env["VITE_TEST_USERNAME_EMPTY"] ?? "",
+            password: process.env["VITE_TEST_PASSWORD_EMPTY"] ?? "",
           }
-        : type === 'customer_with_low_data'
+        : type === "customer_with_low_data"
           ? {
-              username: process.env['VITE_TEST_USERNAME_WITH_LOW_DATA'] ?? '',
-              password: process.env['VITE_TEST_PASSWORD_WITH_LOW_DATA'] ?? ''
+              username: process.env["VITE_TEST_USERNAME_WITH_LOW_DATA"] ?? "",
+              password: process.env["VITE_TEST_PASSWORD_WITH_LOW_DATA"] ?? "",
             }
           : undefined
   const { accessToken } =
     user == null
-      ? await authenticate('client_credentials', {
+      ? await authenticate("client_credentials", {
           clientId,
           domain,
-          scope
+          scope,
         })
-      : await authenticate('password', {
+      : await authenticate("password", {
           clientId,
           domain,
           scope,
-          ...user
+          ...user,
         })
   return {
     accessToken,
-    endpoint: `https://${slug}.${domain}`
+    endpoint: `https://${slug}.${domain}`,
   }
 }
diff --git a/packages/react-components/specs/utils/toJSON.ts b/packages/react-components/specs/utils/toJSON.ts
index 0b46aec7..c9c2ace4 100644
--- a/packages/react-components/specs/utils/toJSON.ts
+++ b/packages/react-components/specs/utils/toJSON.ts
@@ -1,4 +1,4 @@
-import renderer from 'react-test-renderer'
+import renderer from "react-test-renderer"
 
 export default function toJson(
   component: renderer.ReactTestRenderer
diff --git a/packages/react-components/specs/utils/use-custom-context.spec.tsx b/packages/react-components/specs/utils/use-custom-context.spec.tsx
index 108ccaed..48476dc5 100644
--- a/packages/react-components/specs/utils/use-custom-context.spec.tsx
+++ b/packages/react-components/specs/utils/use-custom-context.spec.tsx
@@ -18,7 +18,7 @@ describe("useCustomContext hook", () => {
     render(
       <AvailabilityContext.Provider value={{ parent: true, quantity: 5 }}>
         <ContextChecker keyProp="parent" />
-      </AvailabilityContext.Provider>,
+      </AvailabilityContext.Provider>
     )
   })
 
@@ -26,14 +26,14 @@ describe("useCustomContext hook", () => {
     render(
       <AvailabilityContext.Provider value={{ quantity: 5 }}>
         <ContextChecker keyProp={null} />
-      </AvailabilityContext.Provider>,
+      </AvailabilityContext.Provider>
     )
   })
 
   it("throws when key is not found in context (used outside provider)", () => {
     const consoleError = vi.spyOn(console, "error").mockImplementation(() => {})
     expect(() => render(<ContextChecker keyProp="parent" />)).toThrow(
-      "Cannot use <TestComponent/> outside of <AvailabilityContainer/>",
+      "Cannot use <TestComponent/> outside of <AvailabilityContainer/>"
     )
     consoleError.mockRestore()
   })
@@ -43,7 +43,7 @@ describe("useCustomContext hook", () => {
     const consoleError = vi.spyOn(console, "error").mockImplementation(() => {})
     render(<ContextChecker keyProp="parent" />)
     expect(consoleError).toHaveBeenCalledWith(
-      expect.stringContaining("Cannot use <TestComponent/>"),
+      expect.stringContaining("Cannot use <TestComponent/>")
     )
     consoleError.mockRestore()
     vi.unstubAllEnvs()
diff --git a/packages/react-components/src/components/ExternalFunction.tsx b/packages/react-components/src/components/ExternalFunction.tsx
index 4b60100a..c7998bff 100644
--- a/packages/react-components/src/components/ExternalFunction.tsx
+++ b/packages/react-components/src/components/ExternalFunction.tsx
@@ -1,7 +1,5 @@
-import ExternalFunctionContext, {
-  callExternalFunction
-} from '#context/ExternalFunctionContext'
-import type { ReactNode, JSX } from 'react';
+import ExternalFunctionContext, { callExternalFunction } from "#context/ExternalFunctionContext"
+import type { ReactNode, JSX } from "react"
 
 interface Props {
   children: ReactNode
diff --git a/packages/react-components/src/components/MetadataInput.tsx b/packages/react-components/src/components/MetadataInput.tsx
index e5d3a078..d6b087d0 100644
--- a/packages/react-components/src/components/MetadataInput.tsx
+++ b/packages/react-components/src/components/MetadataInput.tsx
@@ -1,11 +1,11 @@
-import BaseInput from '#components/utils/BaseInput'
-import type { BaseInputComponentProps } from '#typings'
+import BaseInput from "#components/utils/BaseInput"
+import type { BaseInputComponentProps } from "#typings"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
 type Props = BaseInputComponentProps &
-  JSX.IntrinsicElements['input'] &
-  JSX.IntrinsicElements['textarea']
+  JSX.IntrinsicElements["input"] &
+  JSX.IntrinsicElements["textarea"]
 
 export function MetadataInput(props: Props): JSX.Element {
   return <BaseInput data-metadata={true} {...props} />
diff --git a/packages/react-components/src/components/SubmitButton.tsx b/packages/react-components/src/components/SubmitButton.tsx
index 35072a90..bb0c17b2 100644
--- a/packages/react-components/src/components/SubmitButton.tsx
+++ b/packages/react-components/src/components/SubmitButton.tsx
@@ -1,25 +1,25 @@
-import type { ReactNode, JSX } from 'react';
-import Parent from '#components/utils/Parent'
-import type { ChildrenFunction } from '#typings/index'
+import type { ReactNode, JSX } from "react"
+import Parent from "#components/utils/Parent"
+import type { ChildrenFunction } from "#typings/index"
 
-interface ChildrenProps extends Omit<Props, 'children'> {}
+interface ChildrenProps extends Omit<Props, "children"> {}
 
-interface Props extends Omit<JSX.IntrinsicElements['button'], 'children' | 'ref'> {
+interface Props extends Omit<JSX.IntrinsicElements["button"], "children" | "ref"> {
   children?: ChildrenFunction<ChildrenProps>
   label?: string | ReactNode | (() => ReactNode)
 }
 
 export function SubmitButton(props: Props): JSX.Element {
-  const { children, label = 'Submit', ...p } = props
+  const { children, label = "Submit", ...p } = props
   const parentProps = {
     ...p,
-    label
+    label,
   }
   return children ? (
     <Parent {...parentProps}>{children}</Parent>
   ) : (
-    <button type='submit' {...p}>
-      {typeof label === 'function' ? label() : label}
+    <button type="submit" {...p}>
+      {typeof label === "function" ? label() : label}
     </button>
   )
 }
diff --git a/packages/react-components/src/components/addresses/Address.tsx b/packages/react-components/src/components/addresses/Address.tsx
index 4f2d5351..ac7c00ef 100644
--- a/packages/react-components/src/components/addresses/Address.tsx
+++ b/packages/react-components/src/components/addresses/Address.tsx
@@ -14,8 +14,7 @@ import OrderContext from "#context/OrderContext"
 import ShippingAddressContext from "#context/ShippingAddressContext"
 import type { DefaultChildrenType } from "#typings/globals"
 
-interface Props
-  extends Omit<JSX.IntrinsicElements["div"], "children" | "onSelect"> {
+interface Props extends Omit<JSX.IntrinsicElements["div"], "children" | "onSelect"> {
   children: DefaultChildrenType | AddressCardsTemplateChildren
   selectedClassName?: string
   disabledClassName?: string
@@ -53,19 +52,12 @@ export function Address(props: Props): JSX.Element {
     ...p
   } = props
   const { addresses: addressesContext } = useContext(CustomerContext)
-  const { setBillingAddress, billingCustomerAddressId } = useContext(
-    BillingAddressContext,
-  )
-  const { setShippingAddress, shippingCustomerAddressId } = useContext(
-    ShippingAddressContext,
-  )
-  const { shipToDifferentAddress, billingAddressId, shippingAddressId } =
-    useContext(AddressContext)
+  const { setBillingAddress, billingCustomerAddressId } = useContext(BillingAddressContext)
+  const { setShippingAddress, shippingCustomerAddressId } = useContext(ShippingAddressContext)
+  const { shipToDifferentAddress, billingAddressId, shippingAddressId } = useContext(AddressContext)
   const { order } = useContext(OrderContext)
   const [selected, setSelected] = useState<null | number | undefined>(null)
-  const items = !isEmpty(addresses)
-    ? addresses
-    : (addressesContext && addressesContext) || []
+  const items = !isEmpty(addresses) ? addresses : (addressesContext && addressesContext) || []
   // biome-ignore lint/correctness/useExhaustiveDependencies: intentional effect with stable context refs
   useEffect(() => {
     if (items && !deselect) {
@@ -76,12 +68,7 @@ export function Address(props: Props): JSX.Element {
             setSelected(k)
           }
         }
-        if (
-          !billingAddressId &&
-          k === selected &&
-          setBillingAddress &&
-          address.reference != null
-        ) {
+        if (!billingAddressId && k === selected && setBillingAddress && address.reference != null) {
           setBillingAddress(address.id, {
             customerAddressId: address.reference,
           })
@@ -116,19 +103,10 @@ export function Address(props: Props): JSX.Element {
     addressesContext,
     shipToDifferentAddress,
   ])
-  const handleSelect: HandleSelect = async (
-    k,
-    addressId,
-    customerAddressId,
-    disabled,
-    address,
-  ) => {
+  const handleSelect: HandleSelect = async (k, addressId, customerAddressId, disabled, address) => {
     !disabled && setSelected(k)
-    setBillingAddress &&
-      (await setBillingAddress(addressId, { customerAddressId }))
-    !disabled &&
-      setShippingAddress &&
-      (await setShippingAddress(addressId, { customerAddressId }))
+    setBillingAddress && (await setBillingAddress(addressId, { customerAddressId }))
+    !disabled && setShippingAddress && (await setShippingAddress(addressId, { customerAddressId }))
     if (onSelect) onSelect(address)
   }
   const countryLock = order?.shipping_country_code_lock
@@ -137,11 +115,7 @@ export function Address(props: Props): JSX.Element {
       ? []
       : items
           .filter((address) => {
-            if (
-              setShippingAddress &&
-              countryLock &&
-              countryLock !== address.country_code
-            ) {
+            if (setShippingAddress && countryLock && countryLock !== address.country_code) {
               return false
             }
             return true
@@ -151,10 +125,7 @@ export function Address(props: Props): JSX.Element {
               address,
             }
             const disabled =
-              (setShippingAddress &&
-                countryLock &&
-                countryLock !== address.country_code) ||
-              false
+              (setShippingAddress && countryLock && countryLock !== address.country_code) || false
             const selectedClass = deselect ? "" : selectedClassName
             const addressSelectedClass =
               selected === k ? `${className || ""} ${selectedClass}` : className
@@ -170,13 +141,7 @@ export function Address(props: Props): JSX.Element {
                 <div
                   className={finalClassName}
                   onClick={() => {
-                    handleSelect(
-                      k,
-                      address.id,
-                      customerAddressId,
-                      disabled,
-                      address,
-                    )
+                    handleSelect(k, address.id, customerAddressId, disabled, address)
                   }}
                   data-disabled={disabled}
                   {...p}
diff --git a/packages/react-components/src/components/addresses/AddressCountrySelector.tsx b/packages/react-components/src/components/addresses/AddressCountrySelector.tsx
index 8e635a75..e716e5f3 100644
--- a/packages/react-components/src/components/addresses/AddressCountrySelector.tsx
+++ b/packages/react-components/src/components/addresses/AddressCountrySelector.tsx
@@ -1,21 +1,21 @@
-import { useContext, useEffect, useMemo, type JSX } from 'react';
-import BaseSelect from '../utils/BaseSelect'
-import type { BaseSelectComponentProps } from '#typings'
+import { useContext, useEffect, useMemo, type JSX } from "react"
+import BaseSelect from "../utils/BaseSelect"
+import type { BaseSelectComponentProps } from "#typings"
 import BillingAddressFormContext, {
-  type AddressValuesKeys
-} from '#context/BillingAddressFormContext'
-import ShippingAddressFormContext from '#context/ShippingAddressFormContext'
-import { getCountries, type Country } from '#utils/countryStateCity'
-import CustomerAddressFormContext from '#context/CustomerAddressFormContext'
+  type AddressValuesKeys,
+} from "#context/BillingAddressFormContext"
+import ShippingAddressFormContext from "#context/ShippingAddressFormContext"
+import { getCountries, type Country } from "#utils/countryStateCity"
+import CustomerAddressFormContext from "#context/CustomerAddressFormContext"
 
 type TCountryFieldName =
-  | 'billing_address_country_code'
-  | 'shipping_address_country_code'
-  | 'customer_address_country_code'
+  | "billing_address_country_code"
+  | "shipping_address_country_code"
+  | "customer_address_country_code"
 
 interface Props
-  extends Omit<BaseSelectComponentProps, 'options' | 'name'>,
-    Pick<JSX.IntrinsicElements['select'], 'className' | 'id' | 'style'> {
+  extends Omit<BaseSelectComponentProps, "options" | "name">,
+    Pick<JSX.IntrinsicElements["select"], "className" | "id" | "style"> {
   name: Extract<AddressValuesKeys, TCountryFieldName>
   required?: boolean
   disabled?: boolean
@@ -71,18 +71,12 @@ export function AddressCountrySelector(props: Props): JSX.Element {
       return true
     }
     return false
-  }, [
-    billingAddress?.errors, 
-    shippingAddress?.errors, 
-    customerAddress?.errors, name
-  ])
+  }, [billingAddress?.errors, shippingAddress?.errors, customerAddress?.errors, name])
   const errorClassName =
     billingAddress?.errorClassName ||
     shippingAddress?.errorClassName ||
     customerAddress?.errorClassName
-  const classNameComputed = `${className ?? ''} ${
-    hasError && errorClassName ? errorClassName : ''
-  }`
+  const classNameComputed = `${className ?? ""} ${hasError && errorClassName ? errorClassName : ""}`
   return (
     <BaseSelect
       className={classNameComputed}
diff --git a/packages/react-components/src/components/addresses/AddressInput.tsx b/packages/react-components/src/components/addresses/AddressInput.tsx
index f8653bd8..57b595c6 100644
--- a/packages/react-components/src/components/addresses/AddressInput.tsx
+++ b/packages/react-components/src/components/addresses/AddressInput.tsx
@@ -68,22 +68,14 @@ export function AddressInput(props: Props): JSX.Element | null {
       return true
     }
     return false
-  }, [
-    value,
-    billingAddress?.errors,
-    shippingAddress?.errors,
-    customerAddress?.errors,
-  ])
+  }, [value, billingAddress?.errors, shippingAddress?.errors, customerAddress?.errors])
 
   const mandatoryField = billingAddress?.isBusiness
     ? businessMandatoryField(p.name, billingAddress.isBusiness)
     : businessMandatoryField(p.name, shippingAddress.isBusiness)
   const reqField = required !== undefined ? required : mandatoryField
-  const errorClassName =
-    billingAddress?.errorClassName || shippingAddress?.errorClassName
-  const classNameComputed = `${className || ""} ${
-    hasError && errorClassName ? errorClassName : ""
-  }`
+  const errorClassName = billingAddress?.errorClassName || shippingAddress?.errorClassName
+  const classNameComputed = `${className || ""} ${hasError && errorClassName ? errorClassName : ""}`
   if (
     p.name === "billing_address_billing_info" &&
     billingAddress.requiresBillingInfo === false &&
diff --git a/packages/react-components/src/components/addresses/AddressInputSelect.tsx b/packages/react-components/src/components/addresses/AddressInputSelect.tsx
index d578fb59..e8682050 100644
--- a/packages/react-components/src/components/addresses/AddressInputSelect.tsx
+++ b/packages/react-components/src/components/addresses/AddressInputSelect.tsx
@@ -1,18 +1,18 @@
-import { useContext, useEffect, useMemo, type JSX } from 'react';
-import BaseSelect from '../utils/BaseSelect'
-import type { BaseSelectComponentProps } from '#typings'
+import { useContext, useEffect, useMemo, type JSX } from "react"
+import BaseSelect from "../utils/BaseSelect"
+import type { BaseSelectComponentProps } from "#typings"
 import BillingAddressFormContext, {
-  type AddressValuesKeys
-} from '#context/BillingAddressFormContext'
-import ShippingAddressFormContext from '#context/ShippingAddressFormContext'
+  type AddressValuesKeys,
+} from "#context/BillingAddressFormContext"
+import ShippingAddressFormContext from "#context/ShippingAddressFormContext"
 
 type SelectFieldName =
   | `billing_address_${`metadata_${string}`}`
   | `shipping_address_${`metadata_${string}`}`
 
 interface Props
-  extends Omit<BaseSelectComponentProps, 'name'>,
-    Pick<JSX.IntrinsicElements['select'], 'className' | 'id' | 'style'> {
+  extends Omit<BaseSelectComponentProps, "name">,
+    Pick<JSX.IntrinsicElements["select"], "className" | "id" | "style"> {
   name: Extract<AddressValuesKeys, SelectFieldName>
   required?: boolean
   disabled?: boolean
@@ -58,11 +58,8 @@ export function AddressInputSelect(props: Props): JSX.Element {
     }
     return false
   }, [billingAddress?.errors, shippingAddress?.errors, name])
-  const errorClassName =
-    billingAddress?.errorClassName || shippingAddress?.errorClassName
-  const classNameComputed = `${className ?? ''} ${
-    hasError && errorClassName ? errorClassName : ''
-  }`
+  const errorClassName = billingAddress?.errorClassName || shippingAddress?.errorClassName
+  const classNameComputed = `${className ?? ""} ${hasError && errorClassName ? errorClassName : ""}`
   return (
     <BaseSelect
       className={classNameComputed}
diff --git a/packages/react-components/src/components/addresses/AddressStateSelector.tsx b/packages/react-components/src/components/addresses/AddressStateSelector.tsx
index 71e44ccd..bd17615d 100644
--- a/packages/react-components/src/components/addresses/AddressStateSelector.tsx
+++ b/packages/react-components/src/components/addresses/AddressStateSelector.tsx
@@ -1,26 +1,15 @@
 import { useContext, useEffect, useMemo, useState, type JSX } from "react"
 import BaseSelect from "#components/utils/BaseSelect"
-import type {
-  AddressStateSelectName,
-  BaseSelectComponentProps,
-  Option,
-} from "#typings"
+import type { AddressStateSelectName, BaseSelectComponentProps, Option } from "#typings"
 import BillingAddressFormContext from "#context/BillingAddressFormContext"
 import ShippingAddressFormContext from "#context/ShippingAddressFormContext"
 import { isEmpty } from "#utils/isEmpty"
-import {
-  getStateOfCountry,
-  isValidState,
-  type States,
-} from "#utils/countryStateCity"
+import { getStateOfCountry, isValidState, type States } from "#utils/countryStateCity"
 import AddressesContext from "#context/AddressContext"
 import BaseInput from "#components/utils/BaseInput"
 import CustomerAddressFormContext from "#context/CustomerAddressFormContext"
 
-type Props = Omit<
-  BaseSelectComponentProps,
-  "options" | "name" | "placeholder"
-> & {
+type Props = Omit<BaseSelectComponentProps, "options" | "name" | "placeholder"> & {
   name: AddressStateSelectName
   required?: boolean
   disabled?: boolean
@@ -97,18 +86,14 @@ export function AddressStateSelector(props: Props): JSX.Element {
     })
   }, [states, countryCode])
 
-  const isEmptyStates = useMemo(
-    () => () => isEmpty(stateOptions),
-    [stateOptions],
-  )
+  const 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
-    if (billingCountryCode && billingCountryCode !== countryCode)
-      setCountryCode(billingCountryCode)
+    if (billingCountryCode && billingCountryCode !== countryCode) setCountryCode(billingCountryCode)
     const shippingCountryCode =
       typeof shippingAddress?.values?.shipping_address_country_code === "string"
         ? shippingAddress?.values?.shipping_address_country_code
@@ -120,12 +105,7 @@ export function AddressStateSelector(props: Props): JSX.Element {
       billingCountryCode,
       countryCode !== billingCountryCode,
     ].every(Boolean)
-    if (
-      !changeBillingCountry &&
-      value != null &&
-      value !== "" &&
-      value !== val
-    ) {
+    if (!changeBillingCountry && value != null && value !== "" && value !== val) {
       if (billingAddress.setValue != null) {
         billingAddress?.setValue(name, value)
       }
@@ -149,12 +129,7 @@ export function AddressStateSelector(props: Props): JSX.Element {
       shippingCountryCode,
       countryCode !== shippingCountryCode,
     ].every(Boolean)
-    if (
-      !changeShippingCountry &&
-      value != null &&
-      value !== "" &&
-      value !== val
-    ) {
+    if (!changeShippingCountry && value != null && value !== "" && value !== val) {
       if (shippingAddress.setValue != null) {
         shippingAddress?.setValue(name, value)
       }
diff --git a/packages/react-components/src/components/addresses/AddressesContainer.tsx b/packages/react-components/src/components/addresses/AddressesContainer.tsx
index 300c9443..5e35eea3 100644
--- a/packages/react-components/src/components/addresses/AddressesContainer.tsx
+++ b/packages/react-components/src/components/addresses/AddressesContainer.tsx
@@ -1,13 +1,5 @@
-import {
-  type JSX,
-  type ReactNode,
-  useContext,
-  useEffect,
-  useReducer,
-} from "react"
-import AddressesContext, {
-  defaultAddressContext,
-} from "#context/AddressContext"
+import { type JSX, type ReactNode, useContext, useEffect, useReducer } from "react"
+import AddressesContext, { defaultAddressContext } from "#context/AddressContext"
 import CommerceLayerContext from "#context/CommerceLayerContext"
 import OrderContext from "#context/OrderContext"
 import addressReducer, {
@@ -62,26 +54,15 @@ interface Props {
  * </span>
  */
 export function AddressesContainer(props: Props): JSX.Element {
-  const {
-    children,
-    shipToDifferentAddress = false,
-    isBusiness,
-    invertAddresses = false,
-  } = props
+  const { children, shipToDifferentAddress = false, isBusiness, invertAddresses = false } = props
   const [state, dispatch] = useReducer(addressReducer, addressInitialState)
   const { order, orderId, updateOrder } = useContext(OrderContext)
   const config = useContext(CommerceLayerContext)
   useEffect(() => {
     if (order?.status === "draft") {
       // Set the customer order parameters to false when the order is in draft status
-      setCustomerOrderParam(
-        "_save_billing_address_to_customer_address_book",
-        "false",
-      )
-      setCustomerOrderParam(
-        "_save_shipping_address_to_customer_address_book",
-        "false",
-      )
+      setCustomerOrderParam("_save_billing_address_to_customer_address_book", "false")
+      setCustomerOrderParam("_save_shipping_address_to_customer_address_book", "false")
     }
   }, [order?.status])
   useEffect(() => {
@@ -132,11 +113,7 @@ export function AddressesContainer(props: Props): JSX.Element {
       setCloneAddress(id, resource, dispatch)
     },
   }
-  return (
-    <AddressesContext.Provider value={contextValue}>
-      {children}
-    </AddressesContext.Provider>
-  )
+  return <AddressesContext.Provider value={contextValue}>{children}</AddressesContext.Provider>
 }
 
 export default AddressesContainer
diff --git a/packages/react-components/src/components/addresses/AddressesEmpty.tsx b/packages/react-components/src/components/addresses/AddressesEmpty.tsx
index fad3b46c..05029c20 100644
--- a/packages/react-components/src/components/addresses/AddressesEmpty.tsx
+++ b/packages/react-components/src/components/addresses/AddressesEmpty.tsx
@@ -1,13 +1,13 @@
-import Parent from '#components/utils/Parent'
-import CustomerContext from '#context/CustomerContext'
-import type { ChildrenFunction } from '#typings/index'
-import { useContext, type JSX } from 'react';
+import Parent from "#components/utils/Parent"
+import CustomerContext from "#context/CustomerContext"
+import type { ChildrenFunction } from "#typings/index"
+import { useContext, type JSX } from "react"
 
-interface Props extends Omit<JSX.IntrinsicElements['span'], 'children'> {
+interface Props extends Omit<JSX.IntrinsicElements["span"], "children"> {
   /**
    * Function allow you to customize the component
    */
-  children?: ChildrenFunction<Omit<Props, 'children'>>
+  children?: ChildrenFunction<Omit<Props, "children">>
   /**
    * Label to show. Default: 'No addresses available.'
    */
@@ -27,7 +27,7 @@ interface Props extends Omit<JSX.IntrinsicElements['span'], 'children'> {
  *
  */
 export function AddressesEmpty(props: Props): JSX.Element | null {
-  const { children, emptyText = 'No addresses available.', ...p } = props
+  const { children, emptyText = "No addresses available.", ...p } = props
   const { addresses } = useContext(CustomerContext)
   const parentProps = { emptyText, ...p }
   if (addresses == null || addresses.length > 0) {
@@ -36,7 +36,7 @@ export function AddressesEmpty(props: Props): JSX.Element | null {
   return children !== undefined ? (
     <Parent {...parentProps}>{children}</Parent>
   ) : (
-    <span data-testid='addresses-empty' {...p}>
+    <span data-testid="addresses-empty" {...p}>
       {emptyText}
     </span>
   )
diff --git a/packages/react-components/src/components/addresses/BillingAddressContainer.tsx b/packages/react-components/src/components/addresses/BillingAddressContainer.tsx
index 62d6228f..31cd91e4 100644
--- a/packages/react-components/src/components/addresses/BillingAddressContainer.tsx
+++ b/packages/react-components/src/components/addresses/BillingAddressContainer.tsx
@@ -1,68 +1,60 @@
-import BillingAddressContext from '#context/BillingAddressContext'
-import { type ReactNode, useContext, useEffect, useReducer, type JSX } from 'react';
+import BillingAddressContext from "#context/BillingAddressContext"
+import { type ReactNode, useContext, useEffect, useReducer, type JSX } from "react"
 import billingAddressReducer, {
   billingAddressInitialState,
   setBillingAddress,
-  setBillingCustomerAddressId
-} from '#reducers/BillingAddressReducer'
-import CommerceLayerContext from '#context/CommerceLayerContext'
-import OrderContext from '#context/OrderContext'
-import AddressContext from '#context/AddressContext'
+  setBillingCustomerAddressId,
+} from "#reducers/BillingAddressReducer"
+import CommerceLayerContext from "#context/CommerceLayerContext"
+import OrderContext from "#context/OrderContext"
+import AddressContext from "#context/AddressContext"
 
 interface Props {
   children: ReactNode
 }
 export function BillingAddressContainer(props: Props): JSX.Element {
   const { children } = props
-  const [state, dispatch] = useReducer(
-    billingAddressReducer,
-    billingAddressInitialState
-  )
+  const [state, dispatch] = useReducer(billingAddressReducer, billingAddressInitialState)
   const config = useContext(CommerceLayerContext)
   const { order, include, addResourceToInclude } = useContext(OrderContext)
   const { shipToDifferentAddress, setCloneAddress } = useContext(AddressContext)
   // biome-ignore lint/correctness/useExhaustiveDependencies: intentional effect with stable context refs
   useEffect(() => {
-    if (!include?.includes('billing_address')) {
+    if (!include?.includes("billing_address")) {
       addResourceToInclude({
-        newResource: 'billing_address',
-        resourcesIncluded: include
+        newResource: "billing_address",
+        resourcesIncluded: include,
       })
     }
     if (order && config) {
       setBillingCustomerAddressId({
         dispatch,
         order,
-        setCloneAddress
+        setCloneAddress,
       })
     }
     return () => {
       dispatch({
-        type: 'cleanup',
-        payload: {}
+        type: "cleanup",
+        payload: {},
       })
     }
   }, [order, include])
   const contextValue = {
     ...state,
-    setBillingAddress: async (
-      id: string,
-      options?: { customerAddressId: string }
-    ) => {
+    setBillingAddress: async (id: string, options?: { customerAddressId: string }) => {
       await setBillingAddress(id, {
         config,
         dispatch,
         order,
         shipToDifferentAddress,
-        customerAddressId: options?.customerAddressId
+        customerAddressId: options?.customerAddressId,
       })
-      setCloneAddress(id, 'billing_address')
-    }
+      setCloneAddress(id, "billing_address")
+    },
   }
   return (
-    <BillingAddressContext.Provider value={contextValue}>
-      {children}
-    </BillingAddressContext.Provider>
+    <BillingAddressContext.Provider value={contextValue}>{children}</BillingAddressContext.Provider>
   )
 }
 
diff --git a/packages/react-components/src/components/addresses/BillingAddressForm.tsx b/packages/react-components/src/components/addresses/BillingAddressForm.tsx
index 8c7ddfd8..35ddca24 100644
--- a/packages/react-components/src/components/addresses/BillingAddressForm.tsx
+++ b/packages/react-components/src/components/addresses/BillingAddressForm.tsx
@@ -59,15 +59,9 @@ export function BillingAddressForm(props: Props): JSX.Element {
     setValue: setValueForm,
     setError: setErrorForm,
   } = (useRapidForm as any)({ fieldEvent })
-  const { setAddressErrors, setAddress, isBusiness } =
-    useContext(AddressesContext)
-  const {
-    saveAddressToCustomerAddressBook,
-    order,
-    include,
-    addResourceToInclude,
-    includeLoaded,
-  } = useContext(OrderContext)
+  const { setAddressErrors, setAddress, isBusiness } = useContext(AddressesContext)
+  const { saveAddressToCustomerAddressBook, order, include, addResourceToInclude, includeLoaded } =
+    useContext(OrderContext)
   const ref = useRef<HTMLFormElement | null>(null)
   useEffect(() => {
     if (!include?.includes("billing_address")) {
@@ -86,11 +80,7 @@ export function BillingAddressForm(props: Props): JSX.Element {
           const fieldName = field.name
           const value = field.value
           const inError = errors[fieldName] != null
-          if (
-            customFieldMessageError != null &&
-            fieldName != null &&
-            value != null
-          ) {
+          if (customFieldMessageError != null && fieldName != null && value != null) {
             values[fieldName.replace("shipping_address_", "")] = value
             const customMessage = customFieldMessageError({
               field: fieldName,
@@ -160,10 +150,7 @@ export function BillingAddressForm(props: Props): JSX.Element {
       setAddressErrors([], "billing_address")
       for (const name in values) {
         const field = values[name]
-        if (
-          field?.value ||
-          (field?.required === false && field?.type !== "checkbox")
-        ) {
+        if (field?.value || (field?.required === false && field?.type !== "checkbox")) {
           values[name.replace("billing_address_", "")] = field.value
 
           delete values[name]
@@ -186,7 +173,7 @@ export function BillingAddressForm(props: Props): JSX.Element {
     }
     const checkboxChecked =
       ref.current?.querySelector(
-        '[name="billing_address_save_to_customer_book"]',
+        '[name="billing_address_save_to_customer_book"]'
         // @ts-expect-error no type no types
       )?.checked || getSaveBillingAddressToAddressBook()
     if (checkboxChecked) {
@@ -218,10 +205,7 @@ export function BillingAddressForm(props: Props): JSX.Element {
       }
     }
   }, [errors, values, reset, include, includeLoaded, isBusiness])
-  const setValue = (
-    name: AddressValuesKeys,
-    value: string | number | readonly string[],
-  ): void => {
+  const setValue = (name: AddressValuesKeys, value: string | number | readonly string[]): void => {
     setValueForm(name, value as string)
     const field: any = {
       [name.replace("billing_address_", "")]: value,
diff --git a/packages/react-components/src/components/addresses/SaveAddressesButton.tsx b/packages/react-components/src/components/addresses/SaveAddressesButton.tsx
index 6e5da80c..0bf9ec00 100644
--- a/packages/react-components/src/components/addresses/SaveAddressesButton.tsx
+++ b/packages/react-components/src/components/addresses/SaveAddressesButton.tsx
@@ -6,10 +6,7 @@ import CustomerContext from "#context/CustomerContext"
 import OrderContext from "#context/OrderContext"
 import type { TCustomerAddress } from "#reducers/CustomerReducer"
 import type { ChildrenFunction } from "#typings/index"
-import {
-  addressesController,
-  countryLockController,
-} from "#utils/addressesManager"
+import { addressesController, countryLockController } from "#utils/addressesManager"
 import { formCleaner } from "#utils/formCleaner"
 import { validateValue } from "#utils/validateFormFields"
 
@@ -20,8 +17,7 @@ interface TOnClick {
 
 interface ChildrenProps extends Omit<Props, "children"> {}
 
-interface Props
-  extends Omit<JSX.IntrinsicElements["button"], "children" | "onClick"> {
+interface Props extends Omit<JSX.IntrinsicElements["button"], "children" | "onClick"> {
   children?: ChildrenFunction<ChildrenProps>
   label?: string | ReactNode | (() => ReactNode)
   onClick?: (params: TOnClick) => void
@@ -59,26 +55,17 @@ export function SaveAddressesButton(props: Props): JSX.Element {
   } = useContext(CustomerContext)
   const [forceDisable, setForceDisable] = useState(disabled)
   let customerEmail = !!(
-    !!(isGuest === true || typeof isGuest === "undefined") &&
-    !order?.customer_email
+    !!(isGuest === true || typeof isGuest === "undefined") && !order?.customer_email
   )
   if (email != null && email !== "") {
-    const isValidEmail = validateValue(
-      email,
-      "customer_email",
-      "email",
-      "orders",
-    )
+    const isValidEmail = validateValue(email, "customer_email", "email", "orders")
     customerEmail = Object.keys(isValidEmail).length > 0
   }
-  const shippingAddressCleaned: any = Object.keys(shippingAddress ?? {}).reduce(
-    (acc, key) => {
-      // @ts-expect-error type mismatch
-      acc[key.replace("shipping_address_", "")] = shippingAddress[key].value
-      return acc
-    },
-    {},
-  )
+  const shippingAddressCleaned: any = Object.keys(shippingAddress ?? {}).reduce((acc, key) => {
+    // @ts-expect-error type mismatch
+    acc[key.replace("shipping_address_", "")] = shippingAddress[key].value
+    return acc
+  }, {})
   const { billingDisable, shippingDisable } = addressesController({
     invertAddresses,
     requiresBillingInfo: order?.requires_billing_info,
@@ -101,14 +88,9 @@ export function SaveAddressesButton(props: Props): JSX.Element {
     lineItems: order?.line_items,
   })
   // NOTE: This is a temporary fix to avoid the button to be disabled when the user is editing an address
-  const invertAddressesDisable =
-    invertAddresses && shippingAddressId ? false : shippingDisable
+  const invertAddressesDisable = invertAddresses && shippingAddressId ? false : shippingDisable
   const disable =
-    disabled ||
-    customerEmail ||
-    billingDisable ||
-    invertAddressesDisable ||
-    countryLockDisable
+    disabled || customerEmail || billingDisable || invertAddressesDisable || countryLockDisable
 
   const handleClick = async (): Promise<void> => {
     if (errors && Object.keys(errors).length === 0 && !disable) {
@@ -129,9 +111,7 @@ export function SaveAddressesButton(props: Props): JSX.Element {
           response = await saveAddresses({
             customerEmail: email,
             customerAddress: {
-              resource: invertAddresses
-                ? "shipping_address"
-                : "billing_address",
+              resource: invertAddresses ? "shipping_address" : "billing_address",
               id: addressId,
             },
           })
@@ -178,7 +158,7 @@ export function SaveAddressesButton(props: Props): JSX.Element {
       }}
       {...p}
     >
-      {typeof label === 'function' ? label() : label}
+      {typeof label === "function" ? label() : label}
     </button>
   )
 }
diff --git a/packages/react-components/src/components/addresses/ShippingAddressContainer.tsx b/packages/react-components/src/components/addresses/ShippingAddressContainer.tsx
index e57a5c84..975d4194 100644
--- a/packages/react-components/src/components/addresses/ShippingAddressContainer.tsx
+++ b/packages/react-components/src/components/addresses/ShippingAddressContainer.tsx
@@ -1,14 +1,14 @@
-import ShippingAddressContext from '#context/ShippingAddressContext'
-import { useContext, useEffect, useReducer, type JSX } from 'react';
+import ShippingAddressContext from "#context/ShippingAddressContext"
+import { useContext, useEffect, useReducer, type JSX } from "react"
 import shippingAddressReducer, {
   setShippingAddress,
   shippingAddressInitialState,
-  setShippingCustomerAddressId
-} from '#reducers/ShippingAddressReducer'
-import CommerceLayerContext from '#context/CommerceLayerContext'
-import OrderContext from '#context/OrderContext'
-import AddressContext from '#context/AddressContext'
-import type { DefaultChildrenType } from '#typings/globals'
+  setShippingCustomerAddressId,
+} from "#reducers/ShippingAddressReducer"
+import CommerceLayerContext from "#context/CommerceLayerContext"
+import OrderContext from "#context/OrderContext"
+import AddressContext from "#context/AddressContext"
+import type { DefaultChildrenType } from "#typings/globals"
 
 interface Props {
   children: DefaultChildrenType
@@ -16,10 +16,7 @@ interface Props {
 
 export function ShippingAddressContainer(props: Props): JSX.Element {
   const { children } = props
-  const [state, dispatch] = useReducer(
-    shippingAddressReducer,
-    shippingAddressInitialState
-  )
+  const [state, dispatch] = useReducer(shippingAddressReducer, shippingAddressInitialState)
   const config = useContext(CommerceLayerContext)
   const { order } = useContext(OrderContext)
   const { setCloneAddress } = useContext(AddressContext)
@@ -29,30 +26,27 @@ export function ShippingAddressContainer(props: Props): JSX.Element {
       setShippingCustomerAddressId({
         dispatch,
         order,
-        setCloneAddress
+        setCloneAddress,
       })
     }
     return () => {
       dispatch({
-        type: 'cleanup',
-        payload: {}
+        type: "cleanup",
+        payload: {},
       })
     }
   }, [config, order])
   const contextValue = {
     ...state,
-    setShippingAddress: async (
-      id: string,
-      options?: { customerAddressId: string }
-    ) => {
+    setShippingAddress: async (id: string, options?: { customerAddressId: string }) => {
       await setShippingAddress(id, {
         config,
         dispatch,
         order,
-        customerAddressId: options?.customerAddressId
+        customerAddressId: options?.customerAddressId,
       })
-      setCloneAddress(id, 'shipping_address')
-    }
+      setCloneAddress(id, "shipping_address")
+    },
   }
   return (
     <ShippingAddressContext.Provider value={contextValue}>
diff --git a/packages/react-components/src/components/addresses/ShippingAddressForm.tsx b/packages/react-components/src/components/addresses/ShippingAddressForm.tsx
index 724e830f..78e52375 100644
--- a/packages/react-components/src/components/addresses/ShippingAddressForm.tsx
+++ b/packages/react-components/src/components/addresses/ShippingAddressForm.tsx
@@ -54,19 +54,10 @@ export function ShippingAddressForm(props: Props): JSX.Element {
     setValue: setValueForm,
     setError: setErrorForm,
   } = (useRapidForm as any)({ fieldEvent })
-  const {
-    setAddressErrors,
-    setAddress,
-    shipToDifferentAddress,
-    isBusiness,
-    invertAddresses,
-  } = useContext(AddressesContext)
-  const {
-    saveAddressToCustomerAddressBook,
-    include,
-    addResourceToInclude,
-    includeLoaded,
-  } = useContext(OrderContext)
+  const { setAddressErrors, setAddress, shipToDifferentAddress, isBusiness, invertAddresses } =
+    useContext(AddressesContext)
+  const { saveAddressToCustomerAddressBook, include, addResourceToInclude, includeLoaded } =
+    useContext(OrderContext)
   const ref = useRef<HTMLFormElement>(null)
   useEffect(() => {
     if (!include?.includes("shipping_address")) {
@@ -85,11 +76,7 @@ export function ShippingAddressForm(props: Props): JSX.Element {
           const fieldName = field.name
           const value = field.value
           const inError = errors[fieldName] != null
-          if (
-            customFieldMessageError != null &&
-            fieldName != null &&
-            value != null
-          ) {
+          if (customFieldMessageError != null && fieldName != null && value != null) {
             values[fieldName.replace("shipping_address_", "")] = value
             const customMessage = customFieldMessageError({
               field: fieldName,
@@ -165,10 +152,7 @@ export function ShippingAddressForm(props: Props): JSX.Element {
       setAddressErrors([], "shipping_address")
       for (const name in values) {
         const field = values[name]
-        if (
-          field?.value ||
-          (field?.required === false && field?.type !== "checkbox")
-        ) {
+        if (field?.value || (field?.required === false && field?.type !== "checkbox")) {
           values[name.replace("shipping_address_", "")] = field.value
           delete values[name]
         }
@@ -190,7 +174,7 @@ export function ShippingAddressForm(props: Props): JSX.Element {
     }
     const checkboxChecked =
       ref.current?.querySelector(
-        '[name="shipping_address_save_to_customer_book"]',
+        '[name="shipping_address_save_to_customer_book"]'
         // @ts-expect-error no type
       )?.checked || getSaveShippingAddressToAddressBook()
     if (checkboxChecked) {
@@ -217,19 +201,8 @@ export function ShippingAddressForm(props: Props): JSX.Element {
         setAddress({ values: {} as any, resource: "shipping_address" })
       }
     }
-  }, [
-    values,
-    errors,
-    shipToDifferentAddress,
-    reset,
-    include,
-    includeLoaded,
-    isBusiness,
-  ])
-  const setValue = (
-    name: AddressValuesKeys,
-    value: string | number | readonly string[],
-  ): void => {
+  }, [values, errors, shipToDifferentAddress, reset, include, includeLoaded, isBusiness])
+  const setValue = (name: AddressValuesKeys, value: string | number | readonly string[]): void => {
     setValueForm(name, value as string)
     const field: any = {
       [name.replace("shipping_address_", "")]: value,
diff --git a/packages/react-components/src/components/auth/CommerceLayer.tsx b/packages/react-components/src/components/auth/CommerceLayer.tsx
index 29a2c523..e86e8f16 100644
--- a/packages/react-components/src/components/auth/CommerceLayer.tsx
+++ b/packages/react-components/src/components/auth/CommerceLayer.tsx
@@ -22,11 +22,7 @@ interface Props {
 /**
  * CommerceLayer component
  */
-export function CommerceLayer({
-  children,
-  accessToken,
-  interceptors,
-}: Props): JSX.Element {
+export function CommerceLayer({ children, accessToken, interceptors }: Props): JSX.Element {
   return (
     <ErrorBoundary>
       <CommerceLayerContext.Provider value={{ accessToken, interceptors }}>
diff --git a/packages/react-components/src/components/customers/CustomerAddressForm.tsx b/packages/react-components/src/components/customers/CustomerAddressForm.tsx
index 0d31ae9b..a294527f 100644
--- a/packages/react-components/src/components/customers/CustomerAddressForm.tsx
+++ b/packages/react-components/src/components/customers/CustomerAddressForm.tsx
@@ -1,14 +1,14 @@
-import AddressesContext from '#context/AddressContext'
-import { useRapidForm } from 'rapid-form'
-import { type ReactNode, useContext, useEffect, useRef, type JSX } from 'react';
-import CustomerAddressFormContext from '#context/CustomerAddressFormContext'
-import type { BaseError, CodeErrorType } from '#typings/errors'
-import type { AddressField } from '#reducers/AddressReducer'
-import type { AddressCountrySelectName, AddressInputName } from '#typings'
-import OrderContext from '#context/OrderContext'
-import { isEmptyStates } from '#utils/countryStateCity'
+import AddressesContext from "#context/AddressContext"
+import { useRapidForm } from "rapid-form"
+import { type ReactNode, useContext, useEffect, useRef, type JSX } from "react"
+import CustomerAddressFormContext from "#context/CustomerAddressFormContext"
+import type { BaseError, CodeErrorType } from "#typings/errors"
+import type { AddressField } from "#reducers/AddressReducer"
+import type { AddressCountrySelectName, AddressInputName } from "#typings"
+import OrderContext from "#context/OrderContext"
+import { isEmptyStates } from "#utils/countryStateCity"
 
-interface Props extends Omit<JSX.IntrinsicElements['form'], 'onSubmit'> {
+interface Props extends Omit<JSX.IntrinsicElements["form"], "onSubmit"> {
   children: ReactNode
   reset?: boolean
   errorClassName?: string
@@ -23,7 +23,7 @@ export function CustomerAddressForm(props: Props): JSX.Element {
   const {
     children,
     errorClassName,
-    autoComplete = 'on',
+    autoComplete = "on",
     reset = false,
     countriesWithPredefinedStateOptions,
     ...p
@@ -37,67 +37,62 @@ export function CustomerAddressForm(props: Props): JSX.Element {
       const formErrors: BaseError[] = []
       for (const fieldName in errors) {
         const code = errors[fieldName]?.code
-        const message = errors[fieldName]?.message || ''
-        if (fieldName === 'billing_address_state_code') {
-          if (values['state_code']) {
-            
+        const message = errors[fieldName]?.message || ""
+        if (fieldName === "billing_address_state_code") {
+          if (values["state_code"]) {
             delete errors[fieldName]
           } else {
             formErrors.push({
               code: code as CodeErrorType,
               message,
-              resource: 'billing_address',
-              field: fieldName
+              resource: "billing_address",
+              field: fieldName,
             })
           }
         } else {
           formErrors.push({
             code: code as CodeErrorType,
             message,
-            resource: 'billing_address',
-            field: fieldName
+            resource: "billing_address",
+            field: fieldName,
           })
         }
       }
-      setAddressErrors(formErrors, 'billing_address')
+      setAddressErrors(formErrors, "billing_address")
     } else if (Object.keys(values).length > 0) {
-      setAddressErrors([], 'billing_address')
+      setAddressErrors([], "billing_address")
       for (const name in values) {
         const field = values[name]
         if (field?.value) {
-          values[name.replace('billing_address_', '')] = field.value
-          
+          values[name.replace("billing_address_", "")] = field.value
+
           delete values[name]
         }
-        if (['billing_address_state_code'].includes(name)) {
-          const countryCode = (values['billing_address_country_code']?.value ||
-            values['country_code']) as string
+        if (["billing_address_state_code"].includes(name)) {
+          const countryCode = (values["billing_address_country_code"]?.value ||
+            values["country_code"]) as string
           if (
             !isEmptyStates({
               countryCode,
-              countriesWithPredefinedStateOptions
+              countriesWithPredefinedStateOptions,
             }) &&
             !field.value
           ) {
-            
-            delete values['billing_address_state_code']
+            delete values["billing_address_state_code"]
           }
         }
       }
       setAddress({
         values: values as any,
-        resource: 'billing_address'
+        resource: "billing_address",
       })
     }
-    if (
-      reset &&
-      (Object.keys(values).length > 0 || Object.keys(errors).length > 0)
-    ) {
+    if (reset && (Object.keys(values).length > 0 || Object.keys(errors).length > 0)) {
       if (ref) {
         ref.current?.reset()
         resetForm({ target: ref.current })
-        setAddressErrors([], 'billing_address')
-        setAddress({ values: {} as any, resource: 'billing_address' })
+        setAddressErrors([], "billing_address")
+        setAddress({ values: {} as any, resource: "billing_address" })
       }
     }
   }, [errors, values, reset])
@@ -106,11 +101,11 @@ export function CustomerAddressForm(props: Props): JSX.Element {
     value: any
   ): void => {
     const field = {
-      [name.replace('billing_address_', '')]: value
+      [name.replace("billing_address_", "")]: value,
     }
     setAddress({
       values: { ...(values as any), ...field },
-      resource: 'billing_address'
+      resource: "billing_address",
     })
   }
   const providerValues = {
@@ -122,7 +117,7 @@ export function CustomerAddressForm(props: Props): JSX.Element {
     errors: errors as any,
     resetField: (name: string) => {
       resetForm({ currentTarget: ref.current }, name)
-    }
+    },
   }
   return (
     <CustomerAddressFormContext.Provider value={providerValues}>
diff --git a/packages/react-components/src/components/customers/CustomerContainer.tsx b/packages/react-components/src/components/customers/CustomerContainer.tsx
index 648f999e..398d073e 100644
--- a/packages/react-components/src/components/customers/CustomerContainer.tsx
+++ b/packages/react-components/src/components/customers/CustomerContainer.tsx
@@ -1,4 +1,4 @@
-import { useContext, useEffect, useReducer, useMemo, type JSX } from 'react';
+import { useContext, useEffect, useReducer, useMemo, type JSX } from "react"
 import customerReducer, {
   customerInitialState,
   getCustomerAddresses,
@@ -15,15 +15,15 @@ import customerReducer, {
   getCustomerSubscriptions,
   getCustomerInfo,
   type SetResourceTriggerParams,
-  setResourceTrigger
-} from '#reducers/CustomerReducer'
-import OrderContext from '#context/OrderContext'
-import CommerceLayerContext from '#context/CommerceLayerContext'
-import CustomerContext from '#context/CustomerContext'
-import type { BaseError } from '#typings/errors'
-import type { DefaultChildrenType } from '#typings/globals'
-import { isGuestToken } from '#utils/isGuestToken'
-import type { Order, QueryPageSize, QuerySort } from '@commercelayer/sdk'
+  setResourceTrigger,
+} from "#reducers/CustomerReducer"
+import OrderContext from "#context/OrderContext"
+import CommerceLayerContext from "#context/CommerceLayerContext"
+import CustomerContext from "#context/CustomerContext"
+import type { BaseError } from "#typings/errors"
+import type { DefaultChildrenType } from "#typings/globals"
+import { isGuestToken } from "#utils/isGuestToken"
+import type { Order, QueryPageSize, QuerySort } from "@commercelayer/sdk"
 
 interface Props {
   children: DefaultChildrenType
@@ -62,52 +62,36 @@ interface Props {
 export function CustomerContainer(props: Props): JSX.Element {
   const { children, isGuest, addressesPageSize: pageSize } = props
   const [state, dispatch] = useReducer(customerReducer, customerInitialState)
-  const {
-    order,
-    addResourceToInclude,
-    include,
-    updateOrder,
-    includeLoaded,
-    withoutIncludes
-  } = useContext(OrderContext)
+  const { order, addResourceToInclude, include, updateOrder, includeLoaded, withoutIncludes } =
+    useContext(OrderContext)
   const config = useContext(CommerceLayerContext)
   useEffect(() => {
     if (config.accessToken) {
-      const guestToken =
-        isGuest == null ? isGuestToken(config.accessToken) : isGuest
+      const guestToken = isGuest == null ? isGuestToken(config.accessToken) : isGuest
       if (guestToken) {
         return
       }
-      if (
-        !include?.includes('available_customer_payment_sources.payment_source')
-      ) {
+      if (!include?.includes("available_customer_payment_sources.payment_source")) {
         addResourceToInclude({
           newResource: [
-            'available_customer_payment_sources.payment_source',
-            'available_customer_payment_sources.payment_method'
-          ]
+            "available_customer_payment_sources.payment_source",
+            "available_customer_payment_sources.payment_method",
+          ],
         })
-      } else if (
-        !includeLoaded?.['available_customer_payment_sources.payment_source']
-      ) {
+      } else if (!includeLoaded?.["available_customer_payment_sources.payment_source"]) {
         addResourceToInclude({
           newResourceLoaded: {
-            'available_customer_payment_sources.payment_source': true,
-            'available_customer_payment_sources.payment_method': true
-          }
+            "available_customer_payment_sources.payment_source": true,
+            "available_customer_payment_sources.payment_method": true,
+          },
         })
       }
     }
-  }, [
-    config.accessToken,
-    include?.length,
-    Object.keys(includeLoaded ?? {}).length
-  ])
+  }, [config.accessToken, include?.length, Object.keys(includeLoaded ?? {}).length])
 
   useEffect(() => {
     if (config.accessToken) {
-      const guestToken =
-        isGuest == null ? isGuestToken(config.accessToken) : isGuest
+      const guestToken = isGuest == null ? isGuestToken(config.accessToken) : isGuest
       if (guestToken) {
         return
       }
@@ -119,7 +103,7 @@ export function CustomerContainer(props: Props): JSX.Element {
           config,
           dispatch,
           isOrderAvailable: withoutIncludes != null,
-          pageSize
+          pageSize,
         })
       }
       if (order?.available_customer_payment_sources) {
@@ -145,7 +129,7 @@ export function CustomerContainer(props: Props): JSX.Element {
           customerEmail,
           dispatch,
           updateOrder,
-          order
+          order,
         })
       },
       setCustomerErrors: (errors: BaseError[]) => {
@@ -158,36 +142,32 @@ export function CustomerContainer(props: Props): JSX.Element {
         getCustomerPaymentSources({ dispatch, order })
       },
       deleteCustomerPayment: async ({
-        customerPaymentSourceId
+        customerPaymentSourceId,
       }: {
         customerPaymentSourceId: string
       }) => {
         await deleteCustomerPayment({
           customerPaymentSourceId,
           dispatch,
-          config
+          config,
         })
       },
-      deleteCustomerAddress: async ({
-        customerAddressId
-      }: {
-        customerAddressId: string
-      }) => {
+      deleteCustomerAddress: async ({ customerAddressId }: { customerAddressId: string }) => {
         await deleteCustomerAddress({
           customerAddressId,
           dispatch,
           config,
-          addresses: state.addresses
+          addresses: state.addresses,
         })
       },
       setResourceTrigger: async (
-        props: Omit<SetResourceTriggerParams, 'dispatch' | 'config'>
+        props: Omit<SetResourceTriggerParams, "dispatch" | "config">
       ): Promise<boolean> => {
         // @ts-expect-error strange type error
         return await setResourceTrigger({
           ...props,
           dispatch,
-          config
+          config,
         })
       },
       createCustomerAddress: async (address: TCustomerAddress) => {
@@ -196,7 +176,7 @@ export function CustomerContainer(props: Props): JSX.Element {
       getCustomerOrders: async ({
         pageNumber,
         pageSize,
-        sortBy
+        sortBy,
       }: {
         pageNumber?: number
         pageSize?: QueryPageSize
@@ -207,14 +187,14 @@ export function CustomerContainer(props: Props): JSX.Element {
           dispatch,
           pageNumber,
           pageSize,
-          sortBy
+          sortBy,
         })
       },
       getCustomerSubscriptions: async ({
         pageNumber,
         pageSize,
         sortBy,
-        id
+        id,
       }: {
         pageNumber?: number
         pageSize?: QueryPageSize
@@ -227,7 +207,7 @@ export function CustomerContainer(props: Props): JSX.Element {
           pageNumber,
           pageSize,
           sortBy,
-          id
+          id,
         })
       },
       reloadCustomerAddresses: async () => {
@@ -235,16 +215,12 @@ export function CustomerContainer(props: Props): JSX.Element {
           config,
           dispatch,
           isOrderAvailable: withoutIncludes != null,
-          pageSize
+          pageSize,
         })
-      }
+      },
     }
   }, [state, isGuest])
-  return (
-    <CustomerContext.Provider value={contextValue}>
-      {children}
-    </CustomerContext.Provider>
-  )
+  return <CustomerContext.Provider value={contextValue}>{children}</CustomerContext.Provider>
 }
 
 export default CustomerContainer
diff --git a/packages/react-components/src/components/customers/CustomerField.tsx b/packages/react-components/src/components/customers/CustomerField.tsx
index 3ba64d6b..b63031cb 100644
--- a/packages/react-components/src/components/customers/CustomerField.tsx
+++ b/packages/react-components/src/components/customers/CustomerField.tsx
@@ -1,20 +1,16 @@
-import type { ConditionalElement } from '#typings'
+import type { ConditionalElement } from "#typings"
 import GenericFieldComponent, {
   type TGenericChildrenProps,
   type TResourceKey,
-  type TResources
-} from '#components/utils/GenericFieldComponent'
-import CustomerContext from '#context/CustomerContext'
+  type TResources,
+} from "#components/utils/GenericFieldComponent"
+import CustomerContext from "#context/CustomerContext"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
-type StockTransferFieldChildrenProps = TGenericChildrenProps<
-  TResources['Customer']
->
+type StockTransferFieldChildrenProps = TGenericChildrenProps<TResources["Customer"]>
 
-type TCondition = ConditionalElement<
-  Exclude<TResources['Customer'], 'resource'>
->
+type TCondition = ConditionalElement<Exclude<TResources["Customer"], "resource">>
 
 type Props = {
   children?: (props: StockTransferFieldChildrenProps) => JSX.Element
@@ -36,10 +32,10 @@ type Props = {
  * </span>
  */
 export function CustomerField<P extends Props>(props: P): JSX.Element {
-  const { attribute, tagElement = 'span', children, ...p } = props
+  const { attribute, tagElement = "span", children, ...p } = props
   return (
-    <GenericFieldComponent<TResourceKey['Customer']>
-      resource='customers'
+    <GenericFieldComponent<TResourceKey["Customer"]>
+      resource="customers"
       attribute={attribute}
       tagElement={tagElement}
       context={CustomerContext}
diff --git a/packages/react-components/src/components/customers/CustomerInput.tsx b/packages/react-components/src/components/customers/CustomerInput.tsx
index b7d76fb7..9176a36e 100644
--- a/packages/react-components/src/components/customers/CustomerInput.tsx
+++ b/packages/react-components/src/components/customers/CustomerInput.tsx
@@ -1,30 +1,30 @@
 /* eslint-disable @typescript-eslint/no-unsafe-argument */
-import { useContext, useEffect, useState, type JSX } from 'react';
-import BaseInput from '#components-utils/BaseInput'
-import type { BaseInputComponentProps } from '#typings'
-import { useRapidForm } from 'rapid-form'
-import CustomerContext from '#context/CustomerContext'
-import type { BaseError, CodeErrorType } from '#typings/errors'
-import { validateValue } from '#utils/validateFormFields'
-import OrderContext from '#context/OrderContext'
+import { useContext, useEffect, useState, type JSX } from "react"
+import BaseInput from "#components-utils/BaseInput"
+import type { BaseInputComponentProps } from "#typings"
+import { useRapidForm } from "rapid-form"
+import CustomerContext from "#context/CustomerContext"
+import type { BaseError, CodeErrorType } from "#typings/errors"
+import { validateValue } from "#utils/validateFormFields"
+import OrderContext from "#context/OrderContext"
 
 type Props = {
-  name?: 'customer_email' | string
-  type?: 'email' | string
+  name?: "customer_email" | string
+  type?: "email" | string
   saveOnBlur?: boolean
   onBlur?: (email: string) => void
   errorClassName?: string
-} & Omit<BaseInputComponentProps, 'name' | 'type' | 'onBlur'> &
-  Omit<JSX.IntrinsicElements['input'], 'children'> &
-  Omit<JSX.IntrinsicElements['textarea'], 'children'>
+} & Omit<BaseInputComponentProps, "name" | "type" | "onBlur"> &
+  Omit<JSX.IntrinsicElements["input"], "children"> &
+  Omit<JSX.IntrinsicElements["textarea"], "children">
 
 export function CustomerInput(props: Props): JSX.Element {
   const {
-    name = 'customer_email',
-    placeholder = '',
+    name = "customer_email",
+    placeholder = "",
     required = true,
     saveOnBlur = false,
-    type = 'email',
+    type = "email",
     value,
     onBlur,
     className,
@@ -32,19 +32,16 @@ export function CustomerInput(props: Props): JSX.Element {
     ...p
   } = props
   const { validation, values, errors, setError } = (useRapidForm as any)({
-    fieldEvent: 'blur'
+    fieldEvent: "blur",
   })
-  const { saveCustomerUser, setCustomerErrors, setCustomerEmail } =
-    useContext(CustomerContext)
+  const { saveCustomerUser, setCustomerErrors, setCustomerEmail } = useContext(CustomerContext)
   const { setOrderErrors } = useContext(OrderContext)
   const [hasError, setHasError] = useState(false)
   const handleOnBlur = async (
-    e:
-      | React.FocusEvent<HTMLInputElement, Element>
-      | React.FocusEvent<HTMLTextAreaElement, Element>
+    e: React.FocusEvent<HTMLInputElement, Element> | React.FocusEvent<HTMLTextAreaElement, Element>
   ): Promise<void> => {
     const v = e?.target?.value
-    const checkValue = validateValue(v, name, type, 'orders')
+    const checkValue = validateValue(v, name, type, "orders")
     const isValid = Object.keys(checkValue).length === 0
     if (saveOnBlur && Object.keys(values).length > 0) {
       if (saveCustomerUser != null) {
@@ -55,7 +52,7 @@ export function CustomerInput(props: Props): JSX.Element {
     if (!isValid) {
       const currentError = {
         ...checkValue,
-        name: checkValue?.field
+        name: checkValue?.field,
       }
       setError(currentError)
     }
@@ -68,9 +65,9 @@ export function CustomerInput(props: Props): JSX.Element {
         const message = errors[fieldName]?.message
         formErrors.push({
           code: code as CodeErrorType,
-          message: message || '',
-          resource: 'orders',
-          field: fieldName
+          message: message || "",
+          resource: "orders",
+          field: fieldName,
         })
       }
       if (formErrors.length > 0) {
@@ -89,9 +86,7 @@ export function CustomerInput(props: Props): JSX.Element {
       setHasError(false)
     }
   }, [errors])
-  const classNameComputed = `${className ?? ''} ${
-    hasError && errorClassName ? errorClassName : ''
-  }`
+  const classNameComputed = `${className ?? ""} ${hasError && errorClassName ? errorClassName : ""}`
   return (
     <BaseInput
       name={name}
diff --git a/packages/react-components/src/components/customers/CustomerPaymentSource.tsx b/packages/react-components/src/components/customers/CustomerPaymentSource.tsx
index 0627cf10..6fe052c4 100644
--- a/packages/react-components/src/components/customers/CustomerPaymentSource.tsx
+++ b/packages/react-components/src/components/customers/CustomerPaymentSource.tsx
@@ -14,10 +14,7 @@ interface Props {
   loader?: string | JSX.Element
 }
 
-export function CustomerPaymentSource({
-  children,
-  loader = "Loading...",
-}: Props): JSX.Element {
+export function CustomerPaymentSource({ children, loader = "Loading..." }: Props): JSX.Element {
   const [loading, setLoading] = useState(true)
   const { payments, deleteCustomerPayment } = useCustomContext({
     context: CustomerContext,
@@ -45,7 +42,7 @@ export function CustomerPaymentSource({
           e?.stopPropagation()
           if (deleteCustomerPayment != null) {
             deleteCustomerPayment({
-              customerPaymentSourceId: p.id
+              customerPaymentSourceId: p.id,
             })
           }
         },
diff --git a/packages/react-components/src/components/customers/CustomerPaymentSourceEmpty.tsx b/packages/react-components/src/components/customers/CustomerPaymentSourceEmpty.tsx
index 02cd5b1b..f2eda8ae 100644
--- a/packages/react-components/src/components/customers/CustomerPaymentSourceEmpty.tsx
+++ b/packages/react-components/src/components/customers/CustomerPaymentSourceEmpty.tsx
@@ -1,15 +1,15 @@
-import Parent from '#components/utils/Parent'
-import CustomerContext from '#context/CustomerContext'
-import type { ChildrenFunction } from '#typings/index'
-import useCustomContext from '#utils/hooks/useCustomContext'
+import Parent from "#components/utils/Parent"
+import CustomerContext from "#context/CustomerContext"
+import type { ChildrenFunction } from "#typings/index"
+import useCustomContext from "#utils/hooks/useCustomContext"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
-interface Props extends Omit<JSX.IntrinsicElements['span'], 'children'> {
+interface Props extends Omit<JSX.IntrinsicElements["span"], "children"> {
   /**
    * Function allow you to customize the component
    */
-  children?: ChildrenFunction<Omit<Props, 'children'>>
+  children?: ChildrenFunction<Omit<Props, "children">>
   /**
    * Label to show. Default: 'No payments available.'
    */
@@ -18,14 +18,14 @@ interface Props extends Omit<JSX.IntrinsicElements['span'], 'children'> {
 
 export function CustomerPaymentSourceEmpty({
   children,
-  emptyText = 'No payments available',
+  emptyText = "No payments available",
   ...p
 }: Props): JSX.Element | null {
   const { payments } = useCustomContext({
     context: CustomerContext,
-    contextComponentName: 'CustomerContainer',
-    currentComponentName: 'CustomerPaymentSourceEmpty',
-    key: 'payments'
+    contextComponentName: "CustomerContainer",
+    currentComponentName: "CustomerPaymentSourceEmpty",
+    key: "payments",
   })
   const parentProps = { emptyText, ...p }
   if (payments != null && payments.length > 0) {
diff --git a/packages/react-components/src/components/customers/MyAccountLink.tsx b/packages/react-components/src/components/customers/MyAccountLink.tsx
index 3d33f109..d42c3bf5 100644
--- a/packages/react-components/src/components/customers/MyAccountLink.tsx
+++ b/packages/react-components/src/components/customers/MyAccountLink.tsx
@@ -1,12 +1,12 @@
-import { useContext, useEffect, useState, type JSX } from 'react';
-import Parent from '../utils/Parent'
-import type { ChildrenFunction } from '#typings/index'
-import CommerceLayerContext from '#context/CommerceLayerContext'
-import { getApplicationLink } from '#utils/getApplicationLink'
-import { jwt } from '#utils/jwt'
-import { getOrganizationConfig } from '#utils/organization'
+import { useContext, useEffect, useState, type JSX } from "react"
+import Parent from "../utils/Parent"
+import type { ChildrenFunction } from "#typings/index"
+import CommerceLayerContext from "#context/CommerceLayerContext"
+import { getApplicationLink } from "#utils/getApplicationLink"
+import { jwt } from "#utils/jwt"
+import { getOrganizationConfig } from "#utils/organization"
 
-interface ChildrenProps extends Omit<Props, 'children'> {
+interface ChildrenProps extends Omit<Props, "children"> {
   /**
    * The link href
    */
@@ -17,7 +17,7 @@ interface ChildrenProps extends Omit<Props, 'children'> {
   disabled: boolean
 }
 
-interface Props extends Omit<JSX.IntrinsicElements['a'], 'children'> {
+interface Props extends Omit<JSX.IntrinsicElements["a"], "children"> {
   /**
    * A render function to render your own custom component
    */
@@ -48,36 +48,37 @@ interface Props extends Omit<JSX.IntrinsicElements['a'], 'children'> {
  * @link https://github.com/commercelayer/mfe-my-account
  */
 export function MyAccountLink(props: Props): JSX.Element {
-  const { label = 'Go to my account', children, customDomain, returnUrl, ...p } = props
+  const { label = "Go to my account", children, customDomain, returnUrl, ...p } = props
   const { accessToken } = useContext(CommerceLayerContext)
   const [href, setHref] = useState<string | undefined>(undefined)
-  if (accessToken == null)
-    throw new Error('Cannot use `MyAccountLink` outside of `CommerceLayer`')
-  const disabled = !('owner' in jwt(accessToken))
+  if (accessToken == null) throw new Error("Cannot use `MyAccountLink` outside of `CommerceLayer`")
+  const disabled = !("owner" in jwt(accessToken))
   useEffect(() => {
     if (accessToken) {
       const { organization } = jwt(accessToken)
       const slug = organization.slug
-      const domain = 'commercelayer.io'
+      const domain = "commercelayer.io"
       getOrganizationConfig({
         accessToken,
         params: {
           accessToken,
           slug,
-          returnUrl
-        }
+          returnUrl,
+        },
       }).then((config) => {
         if (config?.links?.my_account) {
           setHref(config.links.my_account)
         } else {
-          setHref(getApplicationLink({
-            slug,
-            accessToken,
-            applicationType: 'my-account',
-            domain,
-            customDomain,
-            returnUrl
-          }))
+          setHref(
+            getApplicationLink({
+              slug,
+              accessToken,
+              applicationType: "my-account",
+              domain,
+              customDomain,
+              returnUrl,
+            })
+          )
         }
       })
     }
@@ -89,7 +90,7 @@ export function MyAccountLink(props: Props): JSX.Element {
     disabled,
     label,
     href,
-    ...p
+    ...p,
   }
   return children ? (
     <Parent {...parentProps}>{children}</Parent>
diff --git a/packages/react-components/src/components/customers/MyIdentityLink.tsx b/packages/react-components/src/components/customers/MyIdentityLink.tsx
index f59c5605..208aab53 100644
--- a/packages/react-components/src/components/customers/MyIdentityLink.tsx
+++ b/packages/react-components/src/components/customers/MyIdentityLink.tsx
@@ -77,22 +77,23 @@ export function MyIdentityLink(props: Props): JSX.Element {
   } = props
   const { accessToken } = useContext(CommerceLayerContext)
   const [href, setHref] = useState<string | undefined>(undefined)
-  if (accessToken == null)
-    throw new Error("Cannot use `MyIdentityLink` outside of `CommerceLayer`")
+  if (accessToken == null) throw new Error("Cannot use `MyIdentityLink` outside of `CommerceLayer`")
   useEffect(() => {
     if (accessToken) {
       const { organization } = jwt(accessToken)
       const slug = organization.slug
-      const domain = 'commercelayer.io'
+      const domain = "commercelayer.io"
       getOrganizationConfig({
         accessToken,
         params: {
           accessToken,
-          slug,          identityType: type,
+          slug,
+          identityType: type,
           clientId,
           scope,
           returnUrl: returnUrl ?? window.location.href,
-          resetPasswordUrl,        },
+          resetPasswordUrl,
+        },
       }).then((config) => {
         if (config?.links?.identity) {
           setHref(config.links.identity)
diff --git a/packages/react-components/src/components/customers/SaveCustomerButton.tsx b/packages/react-components/src/components/customers/SaveCustomerButton.tsx
index d4a1ecce..3c74c775 100644
--- a/packages/react-components/src/components/customers/SaveCustomerButton.tsx
+++ b/packages/react-components/src/components/customers/SaveCustomerButton.tsx
@@ -1,23 +1,22 @@
-import { type ReactNode, useContext, type JSX } from 'react';
-import Parent from '#components/utils/Parent'
-import type { ChildrenFunction } from '#typings/index'
-import { isEmpty } from '#utils/isEmpty'
-import CustomerContext from '#context/CustomerContext'
+import { type ReactNode, useContext, type JSX } from "react"
+import Parent from "#components/utils/Parent"
+import type { ChildrenFunction } from "#typings/index"
+import { isEmpty } from "#utils/isEmpty"
+import CustomerContext from "#context/CustomerContext"
 
-interface ChildrenProps extends Omit<Props, 'children'> {
+interface ChildrenProps extends Omit<Props, "children"> {
   handleClick: () => void
 }
 
-interface Props extends Omit<JSX.IntrinsicElements['button'], 'children'> {
+interface Props extends Omit<JSX.IntrinsicElements["button"], "children"> {
   children?: ChildrenFunction<ChildrenProps>
   label?: string | ReactNode
   onClick?: () => void
 }
 
 export function SaveCustomerButton(props: Props): JSX.Element {
-  const { children, label = 'Save', resource, disabled, onClick, ...p } = props
-  const { errors, saveCustomerUser, customerEmail } =
-    useContext(CustomerContext)
+  const { children, label = "Save", resource, disabled, onClick, ...p } = props
+  const { errors, saveCustomerUser, customerEmail } = useContext(CustomerContext)
   const disable = disabled || !isEmpty(errors) || isEmpty(customerEmail)
   const handleClick = async (): Promise<void> => {
     if (isEmpty(errors) && !disable && customerEmail != null) {
@@ -30,13 +29,13 @@ export function SaveCustomerButton(props: Props): JSX.Element {
     label,
     resource,
     handleClick,
-    disabled: disable
+    disabled: disable,
   }
   return children ? (
     <Parent {...parentProps}>{children}</Parent>
   ) : (
     <button
-      type='button'
+      type="button"
       disabled={disable}
       onClick={() => {
         handleClick()
diff --git a/packages/react-components/src/components/errors/Errors.tsx b/packages/react-components/src/components/errors/Errors.tsx
index 44cd5097..eff20d2a 100644
--- a/packages/react-components/src/components/errors/Errors.tsx
+++ b/packages/react-components/src/components/errors/Errors.tsx
@@ -33,8 +33,7 @@ type ErrorChildrenComponentProps = ChildrenFunction<
   Omit<TErrorComponent, "children"> & { errors: string[] }
 >
 
-export interface TErrorComponent
-  extends Omit<JSX.IntrinsicElements["span"], "children"> {
+export interface TErrorComponent extends Omit<JSX.IntrinsicElements["span"], "children"> {
   /**
    * Resource which get the error
    */
@@ -67,9 +66,7 @@ export function Errors(props: Props): JSX.Element {
   const { errors: addressErrors } = useContext(AddressContext)
   const { errors: customerErrors } = useContext(CustomerContext)
   const { errors: shipmentErrors } = useContext(ShipmentContext)
-  const { errors: inStockSubscriptionErrors } = useContext(
-    InStockSubscriptionContext,
-  )
+  const { errors: inStockSubscriptionErrors } = useContext(InStockSubscriptionContext)
   const {
     errors: paymentMethodErrors,
     currentPaymentMethodType,
@@ -85,9 +82,7 @@ export function Errors(props: Props): JSX.Element {
       ...(shipmentErrors || []),
       ...(inStockSubscriptionErrors || []),
       ...(paymentMethodErrors?.filter(
-        (v) =>
-          v.field === currentPaymentMethodType &&
-          payment?.id === currentPaymentMethodId,
+        (v) => v.field === currentPaymentMethodType && payment?.id === currentPaymentMethodId
       ) || []),
     ],
     [
@@ -98,12 +93,9 @@ export function Errors(props: Props): JSX.Element {
       shipmentErrors,
       inStockSubscriptionErrors,
       paymentMethodErrors,
-    ],
+    ]
   ).filter((v, k, a) => v?.code !== a[k - 1]?.code)
-  const addressesErrors = useMemo(
-    () => [...(addressErrors || [])],
-    [addressErrors],
-  )
+  const addressesErrors = useMemo(() => [...(addressErrors || [])], [addressErrors])
   const msgErrors = getAllErrors({
     allErrors: [...allErrors, ...addressesErrors],
     field,
@@ -114,11 +106,7 @@ export function Errors(props: Props): JSX.Element {
     returnHtml: !children,
   })
   const parentProps = { messages, resource, field, errors: msgErrors, ...p }
-  return children ? (
-    <Parent {...parentProps}>{children}</Parent>
-  ) : (
-    <>{msgErrors}</>
-  )
+  return children ? <Parent {...parentProps}>{children}</Parent> : <>{msgErrors}</>
 }
 
 export default Errors
diff --git a/packages/react-components/src/components/gift_cards/GiftCard.tsx b/packages/react-components/src/components/gift_cards/GiftCard.tsx
index ef71faff..248cbfe1 100644
--- a/packages/react-components/src/components/gift_cards/GiftCard.tsx
+++ b/packages/react-components/src/components/gift_cards/GiftCard.tsx
@@ -1,14 +1,14 @@
-import { useRef, useContext, type RefObject, type JSX } from 'react';
-import validateFormFields from '#utils/validateFormFields'
-import { isEmpty } from '#utils/isEmpty'
-import GiftCardContext from '#context/GiftCardContext'
-import type { GiftCardI } from '#reducers/GiftCardReducer'
-import type { BaseState } from '#typings/index'
-import type { DefaultChildrenType } from '#typings/globals'
+import { useRef, useContext, type RefObject, type JSX } from "react"
+import validateFormFields from "#utils/validateFormFields"
+import { isEmpty } from "#utils/isEmpty"
+import GiftCardContext from "#context/GiftCardContext"
+import type { GiftCardI } from "#reducers/GiftCardReducer"
+import type { BaseState } from "#typings/index"
+import type { DefaultChildrenType } from "#typings/globals"
 
-type RequiredFields = 'currencyCode' | 'balanceCents'
+type RequiredFields = "currencyCode" | "balanceCents"
 
-interface Props extends Omit<JSX.IntrinsicElements['form'], 'children' | 'ref'> {
+interface Props extends Omit<JSX.IntrinsicElements["form"], "children" | "ref"> {
   children: DefaultChildrenType
   onSubmit?: (values: BaseState) => void
   ref?: RefObject<HTMLFormElement | null>
@@ -16,7 +16,7 @@ interface Props extends Omit<JSX.IntrinsicElements['form'], 'children' | 'ref'>
 
 export function GiftCard(props: Props): JSX.Element {
   const { children, onSubmit } = props
-  const name = 'giftCardForm'
+  const name = "giftCardForm"
   const ref: RefObject<HTMLFormElement | null> = useRef<HTMLFormElement>(null)
   const { addGiftCard, addGiftCardError } = useContext(GiftCardContext)
   const handleSubmit = (e: React.FormEvent<HTMLFormElement>): void => {
@@ -26,8 +26,8 @@ export function GiftCard(props: Props): JSX.Element {
     const { errors, values } = validateFormFields<RequiredFields[]>(
       // @ts-expect-error type undefined
       elements,
-      ['currencyCode', 'balanceCents'],
-      'gift_cards'
+      ["currencyCode", "balanceCents"],
+      "gift_cards"
     )
     if (isEmpty(errors)) {
       addGiftCard(values as GiftCardI)
diff --git a/packages/react-components/src/components/gift_cards/GiftCardContainer.tsx b/packages/react-components/src/components/gift_cards/GiftCardContainer.tsx
index 0b6f439d..174c39e1 100644
--- a/packages/react-components/src/components/gift_cards/GiftCardContainer.tsx
+++ b/packages/react-components/src/components/gift_cards/GiftCardContainer.tsx
@@ -1,14 +1,14 @@
-import { useReducer, useContext, type ReactNode, type JSX } from 'react';
-import GiftCardContext from '#context/GiftCardContext'
-import CommerceLayerContext from '#context/CommerceLayerContext'
+import { useReducer, useContext, type ReactNode, type JSX } from "react"
+import GiftCardContext from "#context/GiftCardContext"
+import CommerceLayerContext from "#context/CommerceLayerContext"
 import giftCardReducer, {
   giftCardInitialState,
   addGiftCardRecipient,
   addGiftCard,
   addGiftCardError,
-  addGiftCardLoading
-} from '#reducers/GiftCardReducer'
-import OrderContext from '#context/OrderContext'
+  addGiftCardLoading,
+} from "#reducers/GiftCardReducer"
+import OrderContext from "#context/OrderContext"
 
 export interface Props {
   children: ReactNode
@@ -25,23 +25,16 @@ export function GiftCardContainer(props: Props): JSX.Element {
       await addGiftCardRecipient(values, config, dispatch)
     },
     addGiftCard: async (values: any) => {
-      await addGiftCard(
-        { ...values },
-        { config, dispatch, getOrder, createOrder, order }
-      )
+      await addGiftCard({ ...values }, { config, dispatch, getOrder, createOrder, order })
     },
     addGiftCardError: (errors: any): void => {
       addGiftCardError(errors, dispatch)
     },
     addGiftCardLoading: (loading: boolean): void => {
       addGiftCardLoading(loading, dispatch)
-    }
+    },
   }
-  return (
-    <GiftCardContext.Provider value={giftCardValue}>
-      {children}
-    </GiftCardContext.Provider>
-  )
+  return <GiftCardContext.Provider value={giftCardValue}>{children}</GiftCardContext.Provider>
 }
 
 export default GiftCardContainer
diff --git a/packages/react-components/src/components/gift_cards/GiftCardCurrencySelector.tsx b/packages/react-components/src/components/gift_cards/GiftCardCurrencySelector.tsx
index 52567f39..1400e98b 100644
--- a/packages/react-components/src/components/gift_cards/GiftCardCurrencySelector.tsx
+++ b/packages/react-components/src/components/gift_cards/GiftCardCurrencySelector.tsx
@@ -1,15 +1,15 @@
-import BaseSelect from '#components/utils/BaseSelect'
-import currencyOptions from '#config/currency'
-import type { BaseSelectComponentProps } from '#typings'
+import BaseSelect from "#components/utils/BaseSelect"
+import currencyOptions from "#config/currency"
+import type { BaseSelectComponentProps } from "#typings"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
-type Props = Omit<BaseSelectComponentProps, 'options' | 'name'> & {
+type Props = Omit<BaseSelectComponentProps, "options" | "name"> & {
   required?: boolean
-} & Pick<JSX.IntrinsicElements['select'], 'className' | 'id' | 'style'>
+} & Pick<JSX.IntrinsicElements["select"], "className" | "id" | "style">
 
 export function GiftCardCurrencySelector(props: Props): JSX.Element {
-  return <BaseSelect options={currencyOptions} name='currencyCode' {...props} />
+  return <BaseSelect options={currencyOptions} name="currencyCode" {...props} />
 }
 
 export default GiftCardCurrencySelector
diff --git a/packages/react-components/src/components/gift_cards/GiftCardInput.tsx b/packages/react-components/src/components/gift_cards/GiftCardInput.tsx
index 38c77e5d..83edc4be 100644
--- a/packages/react-components/src/components/gift_cards/GiftCardInput.tsx
+++ b/packages/react-components/src/components/gift_cards/GiftCardInput.tsx
@@ -1,16 +1,16 @@
-import BaseInput from '#components/utils/BaseInput'
-import type { BaseInputComponentProps, GiftCardInputName } from '#typings'
+import BaseInput from "#components/utils/BaseInput"
+import type { BaseInputComponentProps, GiftCardInputName } from "#typings"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
 type Props = {
   name: GiftCardInputName
-} & Omit<BaseInputComponentProps, 'name'> &
-  Omit<JSX.IntrinsicElements['input'], 'children'> &
-  Omit<JSX.IntrinsicElements['textarea'], 'children'>
+} & Omit<BaseInputComponentProps, "name"> &
+  Omit<JSX.IntrinsicElements["input"], "children"> &
+  Omit<JSX.IntrinsicElements["textarea"], "children">
 
 export function GiftCardInput(props: Props): JSX.Element {
-  const { placeholder = '', ...p } = props
+  const { placeholder = "", ...p } = props
   return <BaseInput placeholder={placeholder} {...p} />
 }
 
diff --git a/packages/react-components/src/components/gift_cards/GiftCardOrCouponCode.tsx b/packages/react-components/src/components/gift_cards/GiftCardOrCouponCode.tsx
index 3c8d6def..9c166d3b 100644
--- a/packages/react-components/src/components/gift_cards/GiftCardOrCouponCode.tsx
+++ b/packages/react-components/src/components/gift_cards/GiftCardOrCouponCode.tsx
@@ -18,15 +18,10 @@ interface Props extends Omit<JSX.IntrinsicElements["span"], "children"> {
   children?: ChildrenFunction<ChildrenProps>
 }
 
-export function GiftCardOrCouponCode({
-  children,
-  type,
-  ...props
-}: Props): JSX.Element | null {
+export function GiftCardOrCouponCode({ children, type, ...props }: Props): JSX.Element | null {
   const { order, managePaymentProviderGiftCards } = useContext(OrderContext)
   let codeType = type ? (`${type}_code` as const) : undefined
-  if (!type && order && "coupon_code" in order && order.coupon_code !== "")
-    codeType = "coupon_code"
+  if (!type && order && "coupon_code" in order && order.coupon_code !== "") codeType = "coupon_code"
   else if (!type) codeType = "gift_card_code"
   const code = order && codeType ? order[codeType] : ""
   let hide = !(order && code)
diff --git a/packages/react-components/src/components/gift_cards/GiftCardOrCouponForm.tsx b/packages/react-components/src/components/gift_cards/GiftCardOrCouponForm.tsx
index 3bfb5ca5..89534ace 100644
--- a/packages/react-components/src/components/gift_cards/GiftCardOrCouponForm.tsx
+++ b/packages/react-components/src/components/gift_cards/GiftCardOrCouponForm.tsx
@@ -1,42 +1,32 @@
-import { useRapidForm } from 'rapid-form'
-import { useContext, useEffect, useRef, useState, type JSX } from 'react';
-import CouponAndGiftCardFormContext from '#context/CouponAndGiftCardFormContext'
-import OrderContext from '#context/OrderContext'
-import type { OrderCodeType } from '#reducers/OrderReducer'
-import type { Order } from '@commercelayer/sdk'
-import type { DefaultChildrenType } from '#typings/globals'
+import { useRapidForm } from "rapid-form"
+import { useContext, useEffect, useRef, useState, type JSX } from "react"
+import CouponAndGiftCardFormContext from "#context/CouponAndGiftCardFormContext"
+import OrderContext from "#context/OrderContext"
+import type { OrderCodeType } from "#reducers/OrderReducer"
+import type { Order } from "@commercelayer/sdk"
+import type { DefaultChildrenType } from "#typings/globals"
 
-interface Props extends Omit<JSX.IntrinsicElements['form'], 'onSubmit'> {
+interface Props extends Omit<JSX.IntrinsicElements["form"], "onSubmit"> {
   codeType?: OrderCodeType
   children: DefaultChildrenType
-  onSubmit?: (response: {
-    success: boolean
-    value: string
-    order?: Order
-  }) => void
+  onSubmit?: (response: { success: boolean; value: string; order?: Order }) => void
 }
 
 export function GiftCardOrCouponForm(props: Props): JSX.Element | null {
-  const { children, codeType, autoComplete = 'on', onSubmit, ...p } = props
+  const { children, codeType, autoComplete = "on", onSubmit, ...p } = props
   const { validation, values, reset } = (useRapidForm as any)()
-  const { setGiftCardOrCouponCode, order, errors, setOrderErrors } =
-    useContext(OrderContext)
+  const { setGiftCardOrCouponCode, order, errors, setOrderErrors } = useContext(OrderContext)
   const ref = useRef<HTMLFormElement>(null)
   const [type, setType] = useState(codeType)
   useEffect(() => {
-    if (
-      type != null &&
-      values[type]?.value === '' &&
-      errors != null &&
-      errors.length > 0
-    ) {
+    if (type != null && values[type]?.value === "" && errors != null && errors.length > 0) {
       const err = errors.filter((e) => e.field === type)
       setOrderErrors(err)
       if (onSubmit) {
         onSubmit({ value: values[type]?.value, success: false })
       }
     }
-    if (type != null && values[type]?.value === '') {
+    if (type != null && values[type]?.value === "") {
       setOrderErrors([])
       if (onSubmit) {
         onSubmit({ value: values[type]?.value, success: false })
@@ -47,55 +37,45 @@ export function GiftCardOrCouponForm(props: Props): JSX.Element | null {
   useEffect(() => {
     if (codeType == null) {
       if (order?.gift_card_code && !order?.coupon_code) {
-        setType('coupon_code')
+        setType("coupon_code")
       }
       if (!order?.gift_card_code && order?.coupon_code) {
-        setType('gift_card_code')
+        setType("gift_card_code")
       }
       if (!order?.gift_card_code && !order?.coupon_code) {
         // TODO: Remove the `as` assertion
-        setType('gift_card_or_coupon_code' as OrderCodeType)
+        setType("gift_card_or_coupon_code" as OrderCodeType)
       }
     } else {
       setType(codeType)
     }
   }, [order])
 
-  const handleSubmit = async (
-    e: React.FormEvent<HTMLFormElement>
-  ): Promise<void> => {
+  const handleSubmit = async (e: React.FormEvent<HTMLFormElement>): Promise<void> => {
     e.preventDefault()
-    const code =
-      type != null && values[type] != null ? values[type].value : undefined
+    const code = type != null && values[type] != null ? values[type].value : undefined
     if (code != null && setGiftCardOrCouponCode != null && type != null) {
       const { success, order } = await setGiftCardOrCouponCode({
         code,
         // TODO: Remove the `as` assertion
-        codeType: type as OrderCodeType
+        codeType: type as OrderCodeType,
       })
       const value = values[type]?.value
       if (onSubmit) {
         onSubmit({
           success,
           value,
-          order
+          order,
         })
       }
       if (success) reset(e)
     }
   }
-  if (
-    codeType != null &&
-    order?.[codeType] != null &&
-    order?.[codeType] !== ''
-  ) {
+  if (codeType != null && order?.[codeType] != null && order?.[codeType] !== "") {
     return null
   }
-  return (order?.gift_card_code && order?.coupon_code) ||
-    order == null ? null : (
-    <CouponAndGiftCardFormContext.Provider
-      value={{ validation, codeType: type }}
-    >
+  return (order?.gift_card_code && order?.coupon_code) || order == null ? null : (
+    <CouponAndGiftCardFormContext.Provider value={{ validation, codeType: type }}>
       <form
         ref={ref}
         autoComplete={autoComplete}
diff --git a/packages/react-components/src/components/gift_cards/GiftCardOrCouponInput.tsx b/packages/react-components/src/components/gift_cards/GiftCardOrCouponInput.tsx
index d303ef18..68264a50 100644
--- a/packages/react-components/src/components/gift_cards/GiftCardOrCouponInput.tsx
+++ b/packages/react-components/src/components/gift_cards/GiftCardOrCouponInput.tsx
@@ -1,28 +1,21 @@
-import { useContext, type JSX } from 'react';
-import BaseInput from '#components/utils/BaseInput'
-import CouponAndGiftCardFormContext from '#context/CouponAndGiftCardFormContext'
-import type { BaseInputComponentProps } from '#typings'
-import type { OrderCodeType } from '#reducers/OrderReducer'
+import { useContext, type JSX } from "react"
+import BaseInput from "#components/utils/BaseInput"
+import CouponAndGiftCardFormContext from "#context/CouponAndGiftCardFormContext"
+import type { BaseInputComponentProps } from "#typings"
+import type { OrderCodeType } from "#reducers/OrderReducer"
 
-type FieldName = 'gift_card_code' | 'coupon_code'
+type FieldName = "gift_card_code" | "coupon_code"
 
 type Props = {
   name?: FieldName
-  type?: 'text'
+  type?: "text"
   placeholderTranslation?: (codeType: OrderCodeType) => string
-} & Omit<BaseInputComponentProps, 'name' | 'type'> &
-  Omit<JSX.IntrinsicElements['input'], 'children'> &
-  Omit<JSX.IntrinsicElements['textarea'], 'children'>
+} & Omit<BaseInputComponentProps, "name" | "type"> &
+  Omit<JSX.IntrinsicElements["input"], "children"> &
+  Omit<JSX.IntrinsicElements["textarea"], "children">
 
 export function GiftCardOrCouponInput(props: Props): JSX.Element | null {
-  const {
-    placeholder = '',
-    required,
-    value,
-    placeholderTranslation,
-    name,
-    ...p
-  } = props
+  const { placeholder = "", required, value, placeholderTranslation, name, ...p } = props
   const { validation, codeType } = useContext(CouponAndGiftCardFormContext)
   let placeholderLabel = placeholder
   if (placeholderTranslation && codeType) {
@@ -30,8 +23,8 @@ export function GiftCardOrCouponInput(props: Props): JSX.Element | null {
   }
   return codeType == null ? null : (
     <BaseInput
-      type='text'
-      name={codeType ?? 'gift_card_or_coupon_code'}
+      type="text"
+      name={codeType ?? "gift_card_or_coupon_code"}
       ref={validation as any}
       required={required !== undefined ? required : true}
       placeholder={placeholderLabel}
diff --git a/packages/react-components/src/components/gift_cards/GiftCardOrCouponRemoveButton.tsx b/packages/react-components/src/components/gift_cards/GiftCardOrCouponRemoveButton.tsx
index db4729d6..bd0aa6a2 100644
--- a/packages/react-components/src/components/gift_cards/GiftCardOrCouponRemoveButton.tsx
+++ b/packages/react-components/src/components/gift_cards/GiftCardOrCouponRemoveButton.tsx
@@ -28,17 +28,12 @@ export function GiftCardOrCouponRemoveButton(props: Props): JSX.Element | null {
     paymentSourceRequest,
   } = useContext(OrderContext)
   let codeType = type ? (`${type}_code` as const) : undefined
-  if (!type && order && "coupon_code" in order && order.coupon_code !== "")
-    codeType = "coupon_code"
+  if (!type && order && "coupon_code" in order && order.coupon_code !== "") codeType = "coupon_code"
   else if (!type) codeType = "gift_card_code"
   const code = order && codeType ? order[codeType] : ""
   let hide = !(order && code)
   const handleClick = async (): Promise<void> => {
-    if (
-      managePaymentProviderGiftCards &&
-      codeType === "gift_card_code" &&
-      order != null
-    ) {
+    if (managePaymentProviderGiftCards && codeType === "gift_card_code" && order != null) {
       const id = order?.payment_source?.id
       if (id != null) {
         const res = await paymentSourceRequest({
diff --git a/packages/react-components/src/components/in_stock_subscriptions/InStockSubscriptionButton.tsx b/packages/react-components/src/components/in_stock_subscriptions/InStockSubscriptionButton.tsx
index 69317c91..14102a0f 100644
--- a/packages/react-components/src/components/in_stock_subscriptions/InStockSubscriptionButton.tsx
+++ b/packages/react-components/src/components/in_stock_subscriptions/InStockSubscriptionButton.tsx
@@ -1,13 +1,12 @@
-import Parent from '#components/utils/Parent'
-import CommerceLayerContext from '#context/CommerceLayerContext'
-import InStockSubscriptionContext from '#context/InStockSubscriptionContext'
-import type { ChildrenFunction } from '#typings/index'
-import useCustomContext from '#utils/hooks/useCustomContext'
-import { jwt } from '#utils/jwt'
-import { useContext, useState, type JSX } from 'react';
+import Parent from "#components/utils/Parent"
+import CommerceLayerContext from "#context/CommerceLayerContext"
+import InStockSubscriptionContext from "#context/InStockSubscriptionContext"
+import type { ChildrenFunction } from "#typings/index"
+import useCustomContext from "#utils/hooks/useCustomContext"
+import { jwt } from "#utils/jwt"
+import { useContext, useState, type JSX } from "react"
 
-interface Props
-  extends Omit<JSX.IntrinsicElements['button'], 'children' | 'onClick'> {
+interface Props extends Omit<JSX.IntrinsicElements["button"], "children" | "onClick"> {
   /**
    * The code of the sku.
    */
@@ -27,7 +26,7 @@ interface Props
   /**
    * The children of the component.
    */
-  children?: ChildrenFunction<Omit<Props, 'children'>>
+  children?: ChildrenFunction<Omit<Props, "children">>
   /**
    * Show the button.
    */
@@ -44,15 +43,15 @@ export function InStockSubscriptionButton({
   children,
   onClick,
   show = false,
-  label = 'Subscribe',
-  loadingLabel = 'Loading...',
+  label = "Subscribe",
+  loadingLabel = "Loading...",
   ...props
 }: Props): JSX.Element | null {
   const { setInStockSubscription } = useCustomContext({
     context: InStockSubscriptionContext,
-    contextComponentName: 'InStockSubscriptionsContainer',
-    currentComponentName: 'InStockSubscriptionButton',
-    key: 'setInStockSubscription'
+    contextComponentName: "InStockSubscriptionsContainer",
+    currentComponentName: "InStockSubscriptionButton",
+    key: "setInStockSubscription",
   })
   const { accessToken } = useContext(CommerceLayerContext)
   const [loading, setLoading] = useState(false)
@@ -60,18 +59,18 @@ export function InStockSubscriptionButton({
     if (accessToken != null && customerEmail == null) {
       const get = jwt(accessToken)
       if (get?.owner == null) {
-        console.error('Missing customerEmail')
+        console.error("Missing customerEmail")
         return
       }
     }
     if (setInStockSubscription == null) {
-      console.error('Missing <InStockSubscriptionsContainer>')
+      console.error("Missing <InStockSubscriptionsContainer>")
       return
     }
     setLoading(true)
     const res = await setInStockSubscription({
       customerEmail,
-      skuCode
+      skuCode,
     })
     if (onClick != null) {
       onClick(res)
@@ -79,14 +78,14 @@ export function InStockSubscriptionButton({
     setLoading(false)
   }
   if (children != null) {
-    const parentProps: Omit<Props, 'children'> = {
+    const parentProps: Omit<Props, "children"> = {
       skuCode,
       customerEmail,
       onClick,
       show,
       label,
       loadingLabel,
-      ...props
+      ...props,
     }
     return <Parent {...parentProps}>{children}</Parent>
   }
diff --git a/packages/react-components/src/components/in_stock_subscriptions/InStockSubscriptionsContainer.tsx b/packages/react-components/src/components/in_stock_subscriptions/InStockSubscriptionsContainer.tsx
index 4218d696..59f2c075 100644
--- a/packages/react-components/src/components/in_stock_subscriptions/InStockSubscriptionsContainer.tsx
+++ b/packages/react-components/src/components/in_stock_subscriptions/InStockSubscriptionsContainer.tsx
@@ -1,14 +1,14 @@
-import CommerceLayerContext from '#context/CommerceLayerContext'
+import CommerceLayerContext from "#context/CommerceLayerContext"
 import InStockSubscriptionContext, {
-  type InitialInStockSubscriptionContext
-} from '#context/InStockSubscriptionContext'
+  type InitialInStockSubscriptionContext,
+} from "#context/InStockSubscriptionContext"
 import inStockSubscriptionReducer, {
   inStockSubscriptionInitialState,
-  setInStockSubscription
-} from '#reducers/InStockSubscriptionReducer'
-import type { DefaultChildrenType } from '#typings/globals'
-import useCustomContext from '#utils/hooks/useCustomContext'
-import { useReducer, type JSX } from 'react';
+  setInStockSubscription,
+} from "#reducers/InStockSubscriptionReducer"
+import type { DefaultChildrenType } from "#typings/globals"
+import useCustomContext from "#utils/hooks/useCustomContext"
+import { useReducer, type JSX } from "react"
 
 interface Props {
   /**
@@ -17,19 +17,14 @@ interface Props {
   children: DefaultChildrenType
 }
 
-export function InStockSubscriptionsContainer({
-  children
-}: Props): JSX.Element | null {
+export function InStockSubscriptionsContainer({ children }: Props): JSX.Element | null {
   const config = useCustomContext({
     context: CommerceLayerContext,
-    contextComponentName: 'CommerceLayer',
-    currentComponentName: 'InStockSubscriptionsContainer',
-    key: 'accessToken'
+    contextComponentName: "CommerceLayer",
+    currentComponentName: "InStockSubscriptionsContainer",
+    key: "accessToken",
   })
-  const [state, dispatch] = useReducer(
-    inStockSubscriptionReducer,
-    inStockSubscriptionInitialState
-  )
+  const [state, dispatch] = useReducer(inStockSubscriptionReducer, inStockSubscriptionInitialState)
   const value: InitialInStockSubscriptionContext = {
     ...state,
     setInStockSubscription: async ({ customerEmail, skuCode }) =>
@@ -37,8 +32,8 @@ export function InStockSubscriptionsContainer({
         customerEmail,
         skuCode,
         config,
-        dispatch
-      })
+        dispatch,
+      }),
   }
   return (
     <InStockSubscriptionContext.Provider value={value}>
diff --git a/packages/react-components/src/components/line_items/LineItem.tsx b/packages/react-components/src/components/line_items/LineItem.tsx
index ad0ca56c..52508a85 100644
--- a/packages/react-components/src/components/line_items/LineItem.tsx
+++ b/packages/react-components/src/components/line_items/LineItem.tsx
@@ -1,18 +1,18 @@
-import { useContext, type JSX } from 'react';
-import LineItemContext from '#context/LineItemContext'
+import { useContext, type JSX } from "react"
+import LineItemContext from "#context/LineItemContext"
 import LineItemChildrenContext, {
-  type InitialLineItemChildrenContext
-} from '#context/LineItemChildrenContext'
-import ShipmentChildrenContext from '#context/ShipmentChildrenContext'
+  type InitialLineItemChildrenContext,
+} from "#context/LineItemChildrenContext"
+import ShipmentChildrenContext from "#context/ShipmentChildrenContext"
 
 export type TLineItem =
-  | 'gift_cards'
-  | 'payment_methods'
-  | 'promotions'
-  | 'shipments'
-  | 'skus'
-  | 'bundles'
-  | 'adjustments'
+  | "gift_cards"
+  | "payment_methods"
+  | "promotions"
+  | "shipments"
+  | "skus"
+  | "bundles"
+  | "adjustments"
 
 interface Props {
   children: JSX.Element | JSX.Element[]
@@ -20,30 +20,27 @@ interface Props {
 }
 
 export function LineItem(props: Props): JSX.Element {
-  const { type = 'skus', children } = props
+  const { type = "skus", children } = props
   const { lineItems } = useContext(LineItemContext)
   const { lineItems: shipmentLineItems } = useContext(ShipmentChildrenContext)
-  const items =
-    shipmentLineItems && shipmentLineItems?.length > 0
-      ? shipmentLineItems
-      : lineItems
+  const items = shipmentLineItems && shipmentLineItems?.length > 0 ? shipmentLineItems : lineItems
   const components = items
     ?.filter((l) => l?.item_type === type)
     .map((lineItem, k, check) => {
       if (
-        lineItem?.item_type === 'bundles' &&
+        lineItem?.item_type === "bundles" &&
         k > 0 &&
         check[k - 1]?.bundle_code === lineItem.bundle_code
       )
         return null
       if (
-        lineItem?.item_type === 'gift_cards' &&
+        lineItem?.item_type === "gift_cards" &&
         lineItem?.total_amount_cents &&
         lineItem?.total_amount_cents <= 0
       )
         return null
       const lineProps: InitialLineItemChildrenContext = {
-        lineItem
+        lineItem,
       }
       return (
         <LineItemChildrenContext.Provider key={lineItem?.id} value={lineProps}>
diff --git a/packages/react-components/src/components/line_items/LineItemAmount.tsx b/packages/react-components/src/components/line_items/LineItemAmount.tsx
index afe0254d..fb8df03f 100644
--- a/packages/react-components/src/components/line_items/LineItemAmount.tsx
+++ b/packages/react-components/src/components/line_items/LineItemAmount.tsx
@@ -1,34 +1,34 @@
-import { useState, useEffect, useContext, type JSX } from 'react';
-import getAmount from '#utils/getAmount'
-import LineItemChildrenContext from '#context/LineItemChildrenContext'
-import Parent from '#components/utils/Parent'
-import type { BaseAmountComponent, BasePriceType } from '#typings/index'
+import { useState, useEffect, useContext, type JSX } from "react"
+import getAmount from "#utils/getAmount"
+import LineItemChildrenContext from "#context/LineItemChildrenContext"
+import Parent from "#components/utils/Parent"
+import type { BaseAmountComponent, BasePriceType } from "#typings/index"
 
 type Props = BaseAmountComponent & {
   type?: BasePriceType
 }
 
 export function LineItemAmount(props: Props): JSX.Element {
-  const { format = 'formatted', type = 'total', ...p } = props
+  const { format = "formatted", type = "total", ...p } = props
   const { lineItem } = useContext(LineItemChildrenContext)
-  const [price, setPrice] = useState('')
+  const [price, setPrice] = useState("")
   useEffect(() => {
     if (lineItem) {
       const p = getAmount({
-        base: 'amount',
+        base: "amount",
         type,
         format,
-        obj: lineItem
+        obj: lineItem,
       })
       setPrice(p)
     }
     return (): void => {
-      setPrice('')
+      setPrice("")
     }
   }, [lineItem])
   const parentProps = {
     price,
-    ...p
+    ...p,
   }
   return props.children ? (
     <Parent {...parentProps}>{props.children}</Parent>
diff --git a/packages/react-components/src/components/line_items/LineItemCode.tsx b/packages/react-components/src/components/line_items/LineItemCode.tsx
index fb3a5d48..851e0eb8 100644
--- a/packages/react-components/src/components/line_items/LineItemCode.tsx
+++ b/packages/react-components/src/components/line_items/LineItemCode.tsx
@@ -1,36 +1,28 @@
-import { useContext, type JSX } from 'react';
-import LineItemChildrenContext from '#context/LineItemChildrenContext'
-import Parent from '#components/utils/Parent'
-import type { LineItem } from '@commercelayer/sdk'
-import type { ChildrenFunction } from '#typings/index'
+import { useContext, type JSX } from "react"
+import LineItemChildrenContext from "#context/LineItemChildrenContext"
+import Parent from "#components/utils/Parent"
+import type { LineItem } from "@commercelayer/sdk"
+import type { ChildrenFunction } from "#typings/index"
 
-export interface TLineItemCode extends Omit<Props, 'children'> {
+export interface TLineItemCode extends Omit<Props, "children"> {
   lineItem: LineItem
   skuCode: string
 }
 
-interface Props extends Omit<JSX.IntrinsicElements['p'], 'children'> {
+interface Props extends Omit<JSX.IntrinsicElements["p"], "children"> {
   children?: ChildrenFunction<TLineItemCode>
-  type?: 'sku_code' | 'bundle_code'
+  type?: "sku_code" | "bundle_code"
 }
 
-export function LineItemCode({
-  type = 'sku_code',
-  children,
-  ...p
-}: Props): JSX.Element {
+export function LineItemCode({ type = "sku_code", children, ...p }: Props): JSX.Element {
   const { lineItem } = useContext(LineItemChildrenContext)
   const labelName = lineItem?.[type]
   const parentProps = {
     lineItem,
     skuCode: labelName,
-    ...p
+    ...p,
   }
-  return children ? (
-    <Parent {...parentProps}>{children}</Parent>
-  ) : (
-    <p {...p}>{labelName}</p>
-  )
+  return children ? <Parent {...parentProps}>{children}</Parent> : <p {...p}>{labelName}</p>
 }
 
 export default LineItemCode
diff --git a/packages/react-components/src/components/line_items/LineItemField.tsx b/packages/react-components/src/components/line_items/LineItemField.tsx
index b7ddaa7f..14fd3ab7 100644
--- a/packages/react-components/src/components/line_items/LineItemField.tsx
+++ b/packages/react-components/src/components/line_items/LineItemField.tsx
@@ -1,18 +1,16 @@
-import LineItemChildrenContext from '#context/LineItemChildrenContext'
-import type { ConditionalElement } from '#typings'
+import LineItemChildrenContext from "#context/LineItemChildrenContext"
+import type { ConditionalElement } from "#typings"
 import GenericFieldComponent, {
   type TGenericChildrenProps,
   type TResourceKey,
-  type TResources
-} from '#components/utils/GenericFieldComponent'
+  type TResources,
+} from "#components/utils/GenericFieldComponent"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
-type LineItemFieldChildrenProps = TGenericChildrenProps<TResources['LineItem']>
+type LineItemFieldChildrenProps = TGenericChildrenProps<TResources["LineItem"]>
 
-type TCondition = ConditionalElement<
-  Exclude<TResources['LineItem'], 'resource'>
->
+type TCondition = ConditionalElement<Exclude<TResources["LineItem"], "resource">>
 
 type Props = {
   children?: (props: LineItemFieldChildrenProps) => JSX.Element
@@ -22,10 +20,10 @@ type Props = {
  * @returns
  */
 export function LineItemField<P extends Props>(props: P): JSX.Element {
-  const { attribute, tagElement = 'span', children, ...p } = props
+  const { attribute, tagElement = "span", children, ...p } = props
   return (
-    <GenericFieldComponent<TResourceKey['LineItem']>
-      resource='lineItem'
+    <GenericFieldComponent<TResourceKey["LineItem"]>
+      resource="lineItem"
       attribute={attribute}
       tagElement={tagElement}
       context={LineItemChildrenContext}
diff --git a/packages/react-components/src/components/line_items/LineItemImage.tsx b/packages/react-components/src/components/line_items/LineItemImage.tsx
index ec95714a..cbe7a3c6 100644
--- a/packages/react-components/src/components/line_items/LineItemImage.tsx
+++ b/packages/react-components/src/components/line_items/LineItemImage.tsx
@@ -1,12 +1,12 @@
-import { useContext, type JSX } from 'react';
-import LineItemChildrenContext from '#context/LineItemChildrenContext'
-import type { LineItem } from '@commercelayer/sdk'
-import type { ChildrenFunction } from '#typings'
-import { defaultGiftCardImgUrl, defaultImgUrl } from '#utils/placeholderImages'
-import Parent from '#components/utils/Parent'
-import type { TLineItem } from './LineItem'
+import { useContext, type JSX } from "react"
+import LineItemChildrenContext from "#context/LineItemChildrenContext"
+import type { LineItem } from "@commercelayer/sdk"
+import type { ChildrenFunction } from "#typings"
+import { defaultGiftCardImgUrl, defaultImgUrl } from "#utils/placeholderImages"
+import Parent from "#components/utils/Parent"
+import type { TLineItem } from "./LineItem"
 
-export interface TLineItemImage extends Omit<Props, 'children'> {
+export interface TLineItemImage extends Omit<Props, "children"> {
   src: string
   lineItem: LineItem
 }
@@ -17,7 +17,7 @@ type Props = {
   placeholder?: {
     [K in TLineItem]?: string
   }
-} & Omit<JSX.IntrinsicElements['img'], 'src' | 'srcSet' | 'placeholder'>
+} & Omit<JSX.IntrinsicElements["img"], "src" | "srcSet" | "placeholder">
 
 export function LineItemImage(props: Props): JSX.Element | null {
   const { placeholder, children, ...p } = props
@@ -28,21 +28,21 @@ export function LineItemImage(props: Props): JSX.Element | null {
     if (placeholder?.[itemType]) {
       src = placeholder?.[itemType]
     } else {
-      src = itemType === 'gift_cards' ? defaultGiftCardImgUrl : defaultImgUrl
+      src = itemType === "gift_cards" ? defaultGiftCardImgUrl : defaultImgUrl
     }
   }
   const parenProps = {
     lineItem,
     src,
     placeholder,
-    ...p
+    ...p,
   }
   return children ? (
     <Parent {...parenProps}>{children}</Parent>
   ) : !src ? null : (
     <img
-      data-testid={`line-item-image-${lineItem?.sku_code ?? ''}`}
-      alt={lineItem?.name ?? ''}
+      data-testid={`line-item-image-${lineItem?.sku_code ?? ""}`}
+      alt={lineItem?.name ?? ""}
       src={src}
       {...p}
     />
diff --git a/packages/react-components/src/components/line_items/LineItemName.tsx b/packages/react-components/src/components/line_items/LineItemName.tsx
index 74530857..f45b06a0 100644
--- a/packages/react-components/src/components/line_items/LineItemName.tsx
+++ b/packages/react-components/src/components/line_items/LineItemName.tsx
@@ -1,15 +1,15 @@
-import { useContext, type JSX } from 'react';
-import LineItemChildrenContext from '#context/LineItemChildrenContext'
-import Parent from '#components/utils/Parent'
-import type { LineItem } from '@commercelayer/sdk'
-import type { ChildrenFunction } from '#typings/index'
+import { useContext, type JSX } from "react"
+import LineItemChildrenContext from "#context/LineItemChildrenContext"
+import Parent from "#components/utils/Parent"
+import type { LineItem } from "@commercelayer/sdk"
+import type { ChildrenFunction } from "#typings/index"
 
-export interface TLineItemName extends Omit<Props, 'children'> {
+export interface TLineItemName extends Omit<Props, "children"> {
   label: string
   lineItem: LineItem
 }
 
-interface Props extends Omit<JSX.IntrinsicElements['p'], 'children'> {
+interface Props extends Omit<JSX.IntrinsicElements["p"], "children"> {
   children?: ChildrenFunction<TLineItemName>
 }
 
@@ -19,12 +19,12 @@ export function LineItemName(props: Props): JSX.Element {
   const parentProps = {
     label,
     lineItem,
-    ...props
+    ...props,
   }
   return props.children ? (
     <Parent {...parentProps}>{props.children}</Parent>
   ) : (
-    <p data-testid={`line-item-name-${lineItem?.sku_code ?? ''}`} {...props}>
+    <p data-testid={`line-item-name-${lineItem?.sku_code ?? ""}`} {...props}>
       {label}
     </p>
   )
diff --git a/packages/react-components/src/components/line_items/LineItemOption.tsx b/packages/react-components/src/components/line_items/LineItemOption.tsx
index dae84f95..e70accbe 100644
--- a/packages/react-components/src/components/line_items/LineItemOption.tsx
+++ b/packages/react-components/src/components/line_items/LineItemOption.tsx
@@ -1,11 +1,11 @@
-import { useContext, type CSSProperties, type JSX } from 'react';
-import LineItemOptionChildrenContext from '#context/LineItemOptionChildrenContext'
-import Parent from '#components/utils/Parent'
-import type { LineItemOption as LineItemOptionType } from '@commercelayer/sdk'
-import type { ChildrenFunction } from '#typings/index'
-import isJSON from '#utils/isJSON'
+import { useContext, type CSSProperties, type JSX } from "react"
+import LineItemOptionChildrenContext from "#context/LineItemOptionChildrenContext"
+import Parent from "#components/utils/Parent"
+import type { LineItemOption as LineItemOptionType } from "@commercelayer/sdk"
+import type { ChildrenFunction } from "#typings/index"
+import isJSON from "#utils/isJSON"
 
-export interface TLineItemOption extends Omit<Props, 'children'> {
+export interface TLineItemOption extends Omit<Props, "children"> {
   lineItemOption: LineItemOptionType
 }
 
@@ -27,18 +27,18 @@ export function LineItemOption(props: Props): JSX.Element {
     children,
     valueClassName,
     key,
-    tagElement = 'li',
-    tagContainer = 'ul',
+    tagElement = "li",
+    tagContainer = "ul",
     ...p
   } = props
   const { lineItemOption, showAll } = useContext(LineItemOptionChildrenContext)
   const parentProps = {
     ...props,
-    lineItemOption
+    lineItemOption,
   }
   const TagElement = tagElement as any
   const TagContainer = tagContainer
-  const label = name != null ? lineItemOption?.options?.[name] : ''
+  const label = name != null ? lineItemOption?.options?.[name] : ""
   const components =
     showAll && isJSON(JSON.stringify(lineItemOption?.options)) ? (
       Object.entries(lineItemOption?.options ?? {}).map(([key, value]) => {
@@ -49,13 +49,11 @@ export function LineItemOption(props: Props): JSX.Element {
           </TagElement>
         )
       })
-    ) : name != null &&
-      lineItemOption?.options != null &&
-      name in lineItemOption.options ? (
+    ) : name != null && lineItemOption?.options != null && name in lineItemOption.options ? (
       <TagElement key={key} {...p}>
         {`${name}:`}
         <span className={valueClassName} {...p}>
-          {label ?? ''}
+          {label ?? ""}
         </span>
       </TagElement>
     ) : null
diff --git a/packages/react-components/src/components/line_items/LineItemOptions.tsx b/packages/react-components/src/components/line_items/LineItemOptions.tsx
index 65cb6c3f..9b2a464d 100644
--- a/packages/react-components/src/components/line_items/LineItemOptions.tsx
+++ b/packages/react-components/src/components/line_items/LineItemOptions.tsx
@@ -1,8 +1,8 @@
-import { useContext, type ReactNode, type JSX } from 'react';
-import LineItemChildrenContext from '#context/LineItemChildrenContext'
+import { useContext, type ReactNode, type JSX } from "react"
+import LineItemChildrenContext from "#context/LineItemChildrenContext"
 import LineItemOptionChildrenContext, {
-  type TLineItemOptions
-} from '#context/LineItemOptionChildrenContext'
+  type TLineItemOptions,
+} from "#context/LineItemOptionChildrenContext"
 
 type Props = {
   children: ReactNode
@@ -10,7 +10,7 @@ type Props = {
   showName?: boolean
   titleTagElement?: keyof JSX.IntrinsicElements
   titleClassName?: string
-} & Omit<JSX.IntrinsicElements['div'], 'children'> &
+} & Omit<JSX.IntrinsicElements["div"], "children"> &
   (
     | {
         skuOptionId: string
@@ -30,13 +30,12 @@ export function LineItemOptions(props: Props): JSX.Element {
     showName = true,
     showAll,
     className,
-    titleTagElement = 'h6',
+    titleTagElement = "h6",
     titleClassName,
     ...p
   } = props
   const { lineItem } = useContext(LineItemChildrenContext)
-  const lineItemOptions =
-    lineItem != null ? lineItem?.line_item_options || [] : []
+  const lineItemOptions = lineItem != null ? lineItem?.line_item_options || [] : []
   const TitleTagElement = titleTagElement as any
   const options = lineItemOptions
     .filter((o) => {
@@ -46,13 +45,11 @@ export function LineItemOptions(props: Props): JSX.Element {
     })
     .map((o, k) => {
       const showTitle = showName ? (
-        <TitleTagElement className={titleClassName}>
-          {title || o.name}
-        </TitleTagElement>
+        <TitleTagElement className={titleClassName}>{title || o.name}</TitleTagElement>
       ) : null
       const valueProps = {
         lineItemOption: o as TLineItemOptions,
-        showAll
+        showAll,
       }
       return (
         <div className={className} key={k} {...p}>
diff --git a/packages/react-components/src/components/line_items/LineItemQuantity.tsx b/packages/react-components/src/components/line_items/LineItemQuantity.tsx
index 8f315190..d7ba7143 100644
--- a/packages/react-components/src/components/line_items/LineItemQuantity.tsx
+++ b/packages/react-components/src/components/line_items/LineItemQuantity.tsx
@@ -1,11 +1,11 @@
-import { useContext, type ReactNode, type JSX } from 'react';
-import LineItemChildrenContext from '#context/LineItemChildrenContext'
-import LineItemContext from '#context/LineItemContext'
-import Parent from '#components/utils/Parent'
-import type { ChildrenFunction } from '#typings'
-import type { LineItem } from '@commercelayer/sdk'
+import { useContext, type ReactNode, type JSX } from "react"
+import LineItemChildrenContext from "#context/LineItemChildrenContext"
+import LineItemContext from "#context/LineItemContext"
+import Parent from "#components/utils/Parent"
+import type { ChildrenFunction } from "#typings"
+import type { LineItem } from "@commercelayer/sdk"
 
-interface ChildrenProps extends Omit<Props, 'children'> {
+interface ChildrenProps extends Omit<Props, "children"> {
   quantity: number
   handleChange: (event: React.MouseEvent<HTMLSelectElement>) => void
   lineItem?: LineItem
@@ -21,8 +21,8 @@ type Props = {
    * @link https://docs.commercelayer.io/core/external-resources/external-prices
    */
   hasExternalPrice?: boolean
-} & (Omit<JSX.IntrinsicElements['select'], 'children'> &
-  Omit<JSX.IntrinsicElements['span'], 'children'>)
+} & (Omit<JSX.IntrinsicElements["select"], "children"> &
+  Omit<JSX.IntrinsicElements["span"], "children">)
 
 export function LineItemQuantity(props: Props): JSX.Element {
   const { max = 50, readonly = false, hasExternalPrice, ...p } = props
@@ -47,7 +47,7 @@ export function LineItemQuantity(props: Props): JSX.Element {
     handleChange,
     quantity,
     lineItem,
-    ...props
+    ...props,
   }
   return props.children ? (
     <Parent {...parentProps}>{props.children}</Parent>
@@ -56,7 +56,7 @@ export function LineItemQuantity(props: Props): JSX.Element {
   ) : (
     <select
       data-testid={lineItem?.sku_code}
-      title={lineItem?.name ?? ''}
+      title={lineItem?.name ?? ""}
       value={quantity}
       onChange={handleChange}
       {...p}
diff --git a/packages/react-components/src/components/line_items/LineItemRemoveLink.tsx b/packages/react-components/src/components/line_items/LineItemRemoveLink.tsx
index 09ce481c..9096bddc 100644
--- a/packages/react-components/src/components/line_items/LineItemRemoveLink.tsx
+++ b/packages/react-components/src/components/line_items/LineItemRemoveLink.tsx
@@ -1,50 +1,48 @@
-import { useContext, type PropsWithoutRef, type JSX } from 'react';
-import LineItemChildrenContext from '#context/LineItemChildrenContext'
-import LineItemContext from '#context/LineItemContext'
-import Parent from '#components/utils/Parent'
-import type { ChildrenFunction } from '#typings/index'
-import useCustomContext from '#utils/hooks/useCustomContext'
-import type { LineItem } from '@commercelayer/sdk'
+import { useContext, type PropsWithoutRef, type JSX } from "react"
+import LineItemChildrenContext from "#context/LineItemChildrenContext"
+import LineItemContext from "#context/LineItemContext"
+import Parent from "#components/utils/Parent"
+import type { ChildrenFunction } from "#typings/index"
+import useCustomContext from "#utils/hooks/useCustomContext"
+import type { LineItem } from "@commercelayer/sdk"
 
-interface ChildrenProps extends Omit<Props, 'children'> {
+interface ChildrenProps extends Omit<Props, "children"> {
   handleRemove: (event: React.MouseEvent<HTMLAnchorElement>) => void
   label?: string
   lineItem?: LineItem
 }
 
-interface Props
-  extends PropsWithoutRef<Omit<JSX.IntrinsicElements['a'], 'children'>> {
+interface Props extends PropsWithoutRef<Omit<JSX.IntrinsicElements["a"], "children">> {
   children?: ChildrenFunction<ChildrenProps>
   label?: string
 }
 
 export function LineItemRemoveLink(props: Props): JSX.Element {
-  const { label = 'Remove', onClick } = props
+  const { label = "Remove", onClick } = props
   const { lineItem } = useCustomContext({
     context: LineItemChildrenContext,
-    contextComponentName: 'LineItem',
-    currentComponentName: 'LineItemRemoveLink',
-    key: 'lineItem'
+    contextComponentName: "LineItem",
+    currentComponentName: "LineItemRemoveLink",
+    key: "lineItem",
   })
   const { deleteLineItem } = useContext(LineItemContext)
   const handleRemove = (e: React.MouseEvent<HTMLAnchorElement>): void => {
     e.preventDefault()
-    if (deleteLineItem != null && lineItem != null)
-      deleteLineItem(lineItem.id)
+    if (deleteLineItem != null && lineItem != null) deleteLineItem(lineItem.id)
     if (onClick != null) onClick(e)
   }
   const parentProps = {
     handleRemove,
     lineItem,
-    ...props
+    ...props,
   }
   return props.children ? (
     <Parent {...parentProps}>{props.children}</Parent>
   ) : (
     <a
-      data-testid={`line-item-remove-link-${lineItem?.sku_code ?? ''}`}
+      data-testid={`line-item-remove-link-${lineItem?.sku_code ?? ""}`}
       {...props}
-      href='#'
+      href="#"
       onClick={handleRemove}
     >
       {label}
diff --git a/packages/react-components/src/components/line_items/LineItemsContainer.tsx b/packages/react-components/src/components/line_items/LineItemsContainer.tsx
index 805fabd6..5454796f 100644
--- a/packages/react-components/src/components/line_items/LineItemsContainer.tsx
+++ b/packages/react-components/src/components/line_items/LineItemsContainer.tsx
@@ -1,15 +1,13 @@
-import { useEffect, useReducer, useContext, type JSX } from 'react';
+import { useEffect, useReducer, useContext, type JSX } from "react"
 import lineItemReducer, {
   lineItemInitialState,
   updateLineItem,
-  deleteLineItem
-} from '#reducers/LineItemReducer'
-import OrderContext from '#context/OrderContext'
-import LineItemContext, {
-  type LineItemContextValue
-} from '#context/LineItemContext'
-import CommerceLayerContext from '#context/CommerceLayerContext'
-import type { DefaultChildrenType } from '#typings/globals'
+  deleteLineItem,
+} from "#reducers/LineItemReducer"
+import OrderContext from "#context/OrderContext"
+import LineItemContext, { type LineItemContextValue } from "#context/LineItemContext"
+import CommerceLayerContext from "#context/CommerceLayerContext"
+import type { DefaultChildrenType } from "#typings/globals"
 
 interface Props {
   children: DefaultChildrenType
@@ -18,46 +16,40 @@ interface Props {
 }
 
 export function LineItemsContainer(props: Props): JSX.Element {
-  const { children, loader = 'Loading...' } = props
-  const {
-    order,
-    addResourceToInclude,
-    include,
-    orderId,
-    getOrder,
-    includeLoaded
-  } = useContext(OrderContext)
+  const { children, loader = "Loading..." } = props
+  const { order, addResourceToInclude, include, orderId, getOrder, includeLoaded } =
+    useContext(OrderContext)
   const config = useContext(CommerceLayerContext)
   const [state, dispatch] = useReducer(lineItemReducer, lineItemInitialState)
   useEffect(() => {
-    if (!include?.includes('line_items.line_item_options.sku_option')) {
+    if (!include?.includes("line_items.line_item_options.sku_option")) {
       addResourceToInclude({
-        newResource: ['line_items.line_item_options.sku_option']
+        newResource: ["line_items.line_item_options.sku_option"],
       })
-    } else if (!includeLoaded?.['line_items.line_item_options.sku_option']) {
+    } else if (!includeLoaded?.["line_items.line_item_options.sku_option"]) {
       addResourceToInclude({
         newResourceLoaded: {
-          'line_items.line_item_options.sku_option': true
-        }
+          "line_items.line_item_options.sku_option": true,
+        },
       })
     }
-    if (!include?.includes('line_items.item')) {
+    if (!include?.includes("line_items.item")) {
       addResourceToInclude({
-        newResource: ['line_items.item']
+        newResource: ["line_items.item"],
       })
-    } else if (!includeLoaded?.['line_items.item']) {
+    } else if (!includeLoaded?.["line_items.item"]) {
       addResourceToInclude({
         newResourceLoaded: {
-          'line_items.item': true
-        }
+          "line_items.item": true,
+        },
       })
     }
   }, [include, includeLoaded])
   useEffect(() => {
     if (order?.line_items) {
       dispatch({
-        type: 'setLineItems',
-        payload: { lineItems: order.line_items }
+        type: "setLineItems",
+        payload: { lineItems: order.line_items },
       })
     }
   }, [order?.line_items])
@@ -73,8 +65,8 @@ export function LineItemsContainer(props: Props): JSX.Element {
         dispatch,
         config,
         getOrder,
-        orderId: orderId ?? '',
-        errors: state.errors
+        orderId: orderId ?? "",
+        errors: state.errors,
       })
     },
     deleteLineItem: async (lineItemId) => {
@@ -83,10 +75,10 @@ export function LineItemsContainer(props: Props): JSX.Element {
         dispatch,
         config,
         getOrder,
-        orderId: orderId ?? '',
-        errors: state.errors
+        orderId: orderId ?? "",
+        errors: state.errors,
       })
-    }
+    },
   }
   return (
     <LineItemContext.Provider value={lineItemValue}>
diff --git a/packages/react-components/src/components/line_items/LineItemsCount.tsx b/packages/react-components/src/components/line_items/LineItemsCount.tsx
index bc8c4a96..074b686e 100644
--- a/packages/react-components/src/components/line_items/LineItemsCount.tsx
+++ b/packages/react-components/src/components/line_items/LineItemsCount.tsx
@@ -1,15 +1,15 @@
-import { useState, useEffect, type JSX } from 'react';
-import Parent from '#components/utils/Parent'
-import getLineItemsCount, { type TypeAccepted } from '#utils/getLineItemsCount'
-import LineItemContext from '#context/LineItemContext'
-import type { ChildrenFunction } from '#typings/index'
-import useCustomContext from '#utils/hooks/useCustomContext'
+import { useState, useEffect, type JSX } from "react"
+import Parent from "#components/utils/Parent"
+import getLineItemsCount, { type TypeAccepted } from "#utils/getLineItemsCount"
+import LineItemContext from "#context/LineItemContext"
+import type { ChildrenFunction } from "#typings/index"
+import useCustomContext from "#utils/hooks/useCustomContext"
 
-interface ChildrenProps extends Omit<Props, 'children'> {
+interface ChildrenProps extends Omit<Props, "children"> {
   quantity: number
 }
 
-interface Props extends Omit<JSX.IntrinsicElements['span'], 'children'> {
+interface Props extends Omit<JSX.IntrinsicElements["span"], "children"> {
   children?: ChildrenFunction<ChildrenProps>
   typeAccepted?: TypeAccepted[]
 }
@@ -18,16 +18,16 @@ export function LineItemsCount(props: Props): JSX.Element {
   const { children, typeAccepted, ...p } = props
   const { lineItems } = useCustomContext({
     context: LineItemContext,
-    contextComponentName: 'LineItemsContainer',
-    currentComponentName: 'LineItemsCount',
-    key: 'lineItems'
+    contextComponentName: "LineItemsContainer",
+    currentComponentName: "LineItemsCount",
+    key: "lineItems",
   })
   const [quantity, setQuantity] = useState(0)
   useEffect(() => {
     if (lineItems && lineItems.length > 0) {
       const qty = getLineItemsCount({
         lineItems: lineItems || [],
-        typeAccepted
+        typeAccepted,
       })
       setQuantity(qty)
     }
@@ -38,13 +38,9 @@ export function LineItemsCount(props: Props): JSX.Element {
   const parentProps = {
     quantity,
     typeAccepted,
-    ...p
+    ...p,
   }
-  return children ? (
-    <Parent {...parentProps}>{children}</Parent>
-  ) : (
-    <span {...p}>{quantity}</span>
-  )
+  return children ? <Parent {...parentProps}>{children}</Parent> : <span {...p}>{quantity}</span>
 }
 
 export default LineItemsCount
diff --git a/packages/react-components/src/components/line_items/LineItemsEmpty.tsx b/packages/react-components/src/components/line_items/LineItemsEmpty.tsx
index f656f4b7..2885c796 100644
--- a/packages/react-components/src/components/line_items/LineItemsEmpty.tsx
+++ b/packages/react-components/src/components/line_items/LineItemsEmpty.tsx
@@ -1,21 +1,21 @@
-import { useContext, useState, useEffect, type JSX } from 'react';
-import Parent from '#components/utils/Parent'
-import getLineItemsCount from '#utils/getLineItemsCount'
-import LineItemContext from '#context/LineItemContext'
-import type { ChildrenFunction } from '#typings/index'
+import { useContext, useState, useEffect, type JSX } from "react"
+import Parent from "#components/utils/Parent"
+import getLineItemsCount from "#utils/getLineItemsCount"
+import LineItemContext from "#context/LineItemContext"
+import type { ChildrenFunction } from "#typings/index"
 
-interface ChildrenProps extends Omit<Props, 'children'> {
+interface ChildrenProps extends Omit<Props, "children"> {
   quantity: number
   text: string
 }
 
-interface Props extends Omit<JSX.IntrinsicElements['span'], 'children'> {
+interface Props extends Omit<JSX.IntrinsicElements["span"], "children"> {
   children?: ChildrenFunction<ChildrenProps>
   text?: string
 }
 
 export function LineItemsEmpty(props: Props): JSX.Element | null {
-  const { children, text = 'Your shopping bag is empty', ...p } = props
+  const { children, text = "Your shopping bag is empty", ...p } = props
   const { lineItems } = useContext(LineItemContext)
   const [quantity, setQuantity] = useState<undefined | number>()
   const emptyText = quantity === 0 ? <span {...p}>{text}</span> : null
@@ -35,7 +35,7 @@ export function LineItemsEmpty(props: Props): JSX.Element | null {
   const parentProps = {
     quantity,
     text,
-    ...p
+    ...p,
   }
   return children ? <Parent {...parentProps}>{children}</Parent> : emptyText
 }
diff --git a/packages/react-components/src/components/orders/AddToCartButton.tsx b/packages/react-components/src/components/orders/AddToCartButton.tsx
index 4a5a006c..0fc5f7b0 100644
--- a/packages/react-components/src/components/orders/AddToCartButton.tsx
+++ b/packages/react-components/src/components/orders/AddToCartButton.tsx
@@ -3,11 +3,7 @@ import { useContext, useState, type PropsWithoutRef, type JSX } from "react"
 import Parent from "../utils/Parent"
 import OrderContext from "#context/OrderContext"
 import type { ChildrenFunction } from "#typings/index"
-import type {
-  AddToCartReturn,
-  CustomLineItem,
-  LineItemOption,
-} from "#reducers/OrderReducer"
+import type { AddToCartReturn, CustomLineItem, LineItemOption } from "#reducers/OrderReducer"
 import SkuListsContext from "#context/SkuListsContext"
 import ExternalFunctionContext from "#context/ExternalFunctionContext"
 import SkuChildrenContext from "#context/SkuChildrenContext"
@@ -59,9 +55,7 @@ type THostedCart =
       protocol?: never
     }
 
-type TButton = PropsWithoutRef<
-  Omit<JSX.IntrinsicElements["button"], "children">
->
+type TButton = PropsWithoutRef<Omit<JSX.IntrinsicElements["button"], "children">>
 
 type Props = {
   /**
@@ -213,7 +207,7 @@ export function AddToCartButton(props: Props): JSX.Element {
         if (redirectToHostedCart && accessToken != null) {
           const { organization } = jwt(accessToken)
           const slug = organization.slug
-          const domain = 'commercelayer.io'
+          const domain = "commercelayer.io"
           const orderId = res?.orderId
           if (hostedCartUrl && orderId) {
             location.href = `${protocol}://${hostedCartUrl}/${orderId}?accessToken=${accessToken}`
diff --git a/packages/react-components/src/components/orders/AdjustmentAmount.tsx b/packages/react-components/src/components/orders/AdjustmentAmount.tsx
index bd748ed1..a22fb5a4 100644
--- a/packages/react-components/src/components/orders/AdjustmentAmount.tsx
+++ b/packages/react-components/src/components/orders/AdjustmentAmount.tsx
@@ -1,10 +1,10 @@
-import BaseOrderPrice from '../utils/BaseOrderPrice'
-import type { BaseAmountComponent } from '#typings'
+import BaseOrderPrice from "../utils/BaseOrderPrice"
+import type { BaseAmountComponent } from "#typings"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
 export function AdjustmentAmount(props: BaseAmountComponent): JSX.Element {
-  return <BaseOrderPrice base='amount' type='adjustment' {...props} />
+  return <BaseOrderPrice base="amount" type="adjustment" {...props} />
 }
 
 export default AdjustmentAmount
diff --git a/packages/react-components/src/components/orders/CheckoutLink.tsx b/packages/react-components/src/components/orders/CheckoutLink.tsx
index ab88e1ca..31d4546e 100644
--- a/packages/react-components/src/components/orders/CheckoutLink.tsx
+++ b/packages/react-components/src/components/orders/CheckoutLink.tsx
@@ -1,13 +1,13 @@
-import { useContext, type JSX, type ReactNode, type MouseEvent } from 'react'
-import OrderContext from '#context/OrderContext'
-import Parent from '../utils/Parent'
-import type { ChildrenFunction } from '#typings/index'
-import CommerceLayerContext from '#context/CommerceLayerContext'
-import { getApplicationLink } from '#utils/getApplicationLink'
-import { jwt } from '#utils/jwt'
-import { getOrganizationConfig } from '#utils/organization'
+import { useContext, type JSX, type ReactNode, type MouseEvent } from "react"
+import OrderContext from "#context/OrderContext"
+import Parent from "../utils/Parent"
+import type { ChildrenFunction } from "#typings/index"
+import CommerceLayerContext from "#context/CommerceLayerContext"
+import { getApplicationLink } from "#utils/getApplicationLink"
+import { jwt } from "#utils/jwt"
+import { getOrganizationConfig } from "#utils/organization"
 
-interface ChildrenProps extends Omit<Props, 'children'> {
+interface ChildrenProps extends Omit<Props, "children"> {
   /**
    * The `checkout_url` attribute of the order, if set
    */
@@ -30,7 +30,7 @@ interface ChildrenProps extends Omit<Props, 'children'> {
   accessToken?: string
 }
 
-interface Props extends Omit<JSX.IntrinsicElements['a'], 'children'> {
+interface Props extends Omit<JSX.IntrinsicElements["a"], "children"> {
   children?: ChildrenFunction<ChildrenProps>
   /**
    * Label for the checkout link
@@ -63,22 +63,21 @@ export function CheckoutLink(props: Props): JSX.Element | null {
   const { label, hostedCheckout = true, children, customDomain, target, ...p } = props
   const { order } = useContext(OrderContext)
   const { accessToken } = useContext(CommerceLayerContext)
-  if (accessToken == null)
-    throw new Error('Cannot use `CheckoutLink` outside of `CommerceLayer`')
+  if (accessToken == null) throw new Error("Cannot use `CheckoutLink` outside of `CommerceLayer`")
   const { organization } = jwt(accessToken)
   const slug = organization.slug
-  const domain = 'commercelayer.io'
+  const domain = "commercelayer.io"
   const href =
     hostedCheckout && order?.id
       ? getApplicationLink({
           slug,
           orderId: order.id,
           accessToken,
-          applicationType: 'checkout',
+          applicationType: "checkout",
           domain,
           customDomain,
         })
-      : (order?.checkout_url ?? '')
+      : (order?.checkout_url ?? "")
 
   const handleClick = async (e: MouseEvent<HTMLAnchorElement>): Promise<void> => {
     e.preventDefault()
@@ -93,9 +92,9 @@ export function CheckoutLink(props: Props): JSX.Element | null {
           orderId: order.id,
         },
       })
-      window.open(config?.links?.checkout ?? currentHref, target ?? '_self')
+      window.open(config?.links?.checkout ?? currentHref, target ?? "_self")
     } else {
-      window.open(currentHref, target ?? '_self')
+      window.open(currentHref, target ?? "_self")
     }
   }
 
diff --git a/packages/react-components/src/components/orders/DiscountAmount.tsx b/packages/react-components/src/components/orders/DiscountAmount.tsx
index 23f05601..ab0c65fe 100644
--- a/packages/react-components/src/components/orders/DiscountAmount.tsx
+++ b/packages/react-components/src/components/orders/DiscountAmount.tsx
@@ -1,10 +1,10 @@
-import BaseOrderPrice from '../utils/BaseOrderPrice'
-import type { BaseAmountComponent } from '#typings'
+import BaseOrderPrice from "../utils/BaseOrderPrice"
+import type { BaseAmountComponent } from "#typings"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
 export function DiscountAmount(props: BaseAmountComponent): JSX.Element {
-  return <BaseOrderPrice base='amount' type='discount' {...props} />
+  return <BaseOrderPrice base="amount" type="discount" {...props} />
 }
 
 export default DiscountAmount
diff --git a/packages/react-components/src/components/orders/HostedCart.tsx b/packages/react-components/src/components/orders/HostedCart.tsx
index ecaa2126..cad617b0 100644
--- a/packages/react-components/src/components/orders/HostedCart.tsx
+++ b/packages/react-components/src/components/orders/HostedCart.tsx
@@ -95,8 +95,7 @@ const defaultStyle = {
   iconContainer: defaultIconContainer,
 } satisfies Styles
 
-interface Props
-  extends Omit<JSX.IntrinsicElements["div"], "children" | "style"> {
+interface Props extends Omit<JSX.IntrinsicElements["div"], "children" | "style"> {
   /**
    * The style of the cart.
    */
@@ -226,7 +225,7 @@ export function HostedCart({
           break
       }
     },
-    [type, isOpen, handleOpen, getOrder],
+    [type, isOpen, handleOpen, getOrder]
   )
 
   useEffect(() => {
@@ -253,12 +252,7 @@ export function HostedCart({
     if (openAdd && type === "mini") {
       subscribe("open-cart", openCartHandler)
     }
-    if (
-      src == null &&
-      resolvedOrderId == null &&
-      !ignore &&
-      isOpen
-    ) {
+    if (src == null && resolvedOrderId == null && !ignore && isOpen) {
       setOrder()
     } else if (
       resolvedOrderId != null &&
@@ -289,7 +283,7 @@ export function HostedCart({
         checkOrigin: false,
         onMessage,
       },
-      ref.current,
+      ref.current
     )
   }, [onMessage])
   /**
@@ -308,9 +302,7 @@ export function HostedCart({
           ...defaultStyle.background,
           ...style?.background,
           opacity: isOpen ? "0.5" : defaultStyle.background?.opacity,
-          pointerEvents: isOpen
-            ? "initial"
-            : defaultStyle.background?.pointerEvents,
+          pointerEvents: isOpen ? "initial" : defaultStyle.background?.pointerEvents,
         }}
         onClick={onCloseCart}
       />
@@ -319,9 +311,7 @@ export function HostedCart({
           ...defaultStyle.container,
           ...style?.container,
           right: isOpen ? "0" : defaultStyle.container?.right,
-          pointerEvents: isOpen
-            ? "initial"
-            : defaultStyle.container?.pointerEvents,
+          pointerEvents: isOpen ? "initial" : defaultStyle.container?.pointerEvents,
         }}
         {...props}
       >
@@ -341,11 +331,7 @@ export function HostedCart({
             }}
             aria-label="Close cart"
           >
-            <path
-              strokeLinecap="round"
-              strokeLinejoin="round"
-              d="M6 18L18 6M6 6l12 12"
-            />
+            <path strokeLinecap="round" strokeLinejoin="round" d="M6 18L18 6M6 6l12 12" />
           </svg>
         </div>
         <iframe
diff --git a/packages/react-components/src/components/orders/Order.tsx b/packages/react-components/src/components/orders/Order.tsx
index 12e24118..9cfffda8 100644
--- a/packages/react-components/src/components/orders/Order.tsx
+++ b/packages/react-components/src/components/orders/Order.tsx
@@ -79,9 +79,7 @@ export function Order(props: Props): JSX.Element {
     fetchOrder,
     ...storageCtx,
   })
-  return (
-    <OrderContext.Provider value={orderValue}>{children}</OrderContext.Provider>
-  )
+  return <OrderContext.Provider value={orderValue}>{children}</OrderContext.Provider>
 }
 
 export default Order
diff --git a/packages/react-components/src/components/orders/OrderContainer.tsx b/packages/react-components/src/components/orders/OrderContainer.tsx
index 1af48e1d..68c9647a 100644
--- a/packages/react-components/src/components/orders/OrderContainer.tsx
+++ b/packages/react-components/src/components/orders/OrderContainer.tsx
@@ -62,7 +62,7 @@ interface Props {
 export function OrderContainer(props: Props): JSX.Element {
   if (process.env.NODE_ENV !== "production") {
     console.warn(
-      "[commercelayer-react-components] <OrderContainer> is deprecated and will be removed in the next major version. Use <Order> instead.",
+      "[commercelayer-react-components] <OrderContainer> is deprecated and will be removed in the next major version. Use <Order> instead."
     )
   }
   return <OrderComponent {...props} />
diff --git a/packages/react-components/src/components/orders/OrderList.tsx b/packages/react-components/src/components/orders/OrderList.tsx
index e3790d02..56440cd6 100644
--- a/packages/react-components/src/components/orders/OrderList.tsx
+++ b/packages/react-components/src/components/orders/OrderList.tsx
@@ -1,11 +1,11 @@
-import { useContext, useMemo, useState, useEffect, type ReactNode, type JSX } from 'react';
-import CustomerContext from '#context/CustomerContext'
+import { useContext, useMemo, useState, useEffect, type ReactNode, type JSX } from "react"
+import CustomerContext from "#context/CustomerContext"
 import OrderListChildrenContext, {
   type TOrderList,
   type InitialOrderListContext,
-  type OrderListContent
-} from '#context/OrderListChildrenContext'
-import OrderListPagination from '#context/OrderListPaginationContext'
+  type OrderListContent,
+} from "#context/OrderListChildrenContext"
+import OrderListPagination from "#context/OrderListPaginationContext"
 import {
   useReactTable,
   getCoreRowModel,
@@ -14,64 +14,59 @@ import {
   type ColumnDef,
   type SortingState,
   flexRender,
-  type PaginationState
-} from '@tanstack/react-table'
-import { sortDescIcon, sortAscIcon } from '#utils/icons'
-import filterChildren from '#utils/filterChildren'
-import type { DefaultChildrenType, TRange } from '#typings/globals'
-import type { Order, QueryPageSize, QuerySort } from '@commercelayer/sdk'
+  type PaginationState,
+} from "@tanstack/react-table"
+import { sortDescIcon, sortAscIcon } from "#utils/icons"
+import filterChildren from "#utils/filterChildren"
+import type { DefaultChildrenType, TRange } from "#typings/globals"
+import type { Order, QueryPageSize, QuerySort } from "@commercelayer/sdk"
 
-type RowComponent = 'OrderListRow' | 'OrderListEmpty'
-type PaginationComponent =
-  | 'OrderListPaginationInfo'
-  | 'OrderListPaginationButtons'
-const rowComponents: RowComponent[] = ['OrderListRow', 'OrderListEmpty']
+type RowComponent = "OrderListRow" | "OrderListEmpty"
+type PaginationComponent = "OrderListPaginationInfo" | "OrderListPaginationButtons"
+const rowComponents: RowComponent[] = ["OrderListRow", "OrderListEmpty"]
 const paginationComponents: PaginationComponent[] = [
-  'OrderListPaginationInfo',
-  'OrderListPaginationButtons'
+  "OrderListPaginationInfo",
+  "OrderListPaginationButtons",
 ]
 
-type OrderListColumn<T extends TOrderList = 'orders'> = ColumnDef<
-  OrderListContent<T>
-> & {
+type OrderListColumn<T extends TOrderList = "orders"> = ColumnDef<OrderListContent<T>> & {
   className?: string
   titleClassName?: string
 }
 
-export type TOrderListColumn<T extends TOrderList = 'orders'> =
-  OrderListColumn<T>
+export type TOrderListColumn<T extends TOrderList = "orders"> = OrderListColumn<T>
 
 type PaginationProps =
   | {
-    /**
-     * Show table pagination. Default is false.
-     */
-    showPagination: true
-    /**
-     * Number of rows per page. Default is 10. Max is 25.
-     */
-    pageSize?: TRange<1, 26>
-  }
+      /**
+       * Show table pagination. Default is false.
+       */
+      showPagination: true
+      /**
+       * Number of rows per page. Default is 10. Max is 25.
+       */
+      pageSize?: TRange<1, 26>
+    }
   | {
-    /**
-     * Show table pagination. Default is false.
-     */
-    showPagination?: false
-    pageSize?: never
-  }
+      /**
+       * Show table pagination. Default is false.
+       */
+      showPagination?: false
+      pageSize?: never
+    }
 
 type SubscriptionFields =
   | {
-    /**
-     * Subscriptions id - Use to fetch subscriptions and shows its orders
-     */
-    id?: string
-    type?: 'subscriptions'
-  }
+      /**
+       * Subscriptions id - Use to fetch subscriptions and shows its orders
+       */
+      id?: string
+      type?: "subscriptions"
+    }
   | {
-    id?: never
-    type?: 'orders'
-  }
+      id?: never
+      type?: "orders"
+    }
 
 type Props = {
   /**
@@ -93,7 +88,7 @@ type Props = {
   /**
    * Function to assign as custom row renderer
    */
-  actionsComponent?: InitialOrderListContext['actionsComponent']
+  actionsComponent?: InitialOrderListContext["actionsComponent"]
   /**
    * Class name to assign to the custom row container
    */
@@ -120,19 +115,19 @@ type Props = {
    * Class name to assign to the table row.
    */
   rowTrClassName?: string
-} & Omit<JSX.IntrinsicElements['table'], 'children'> &
+} & Omit<JSX.IntrinsicElements["table"], "children"> &
   PaginationProps &
   SubscriptionFields
 
 export function OrderList({
   id,
-  type = 'orders',
+  type = "orders",
   children,
   columns,
   loadingElement,
   showActions = false,
   showPagination = false,
-  sortBy = [{ id: 'number', desc: true }],
+  sortBy = [{ id: "number", desc: true }],
   pageSize = 10,
   paginationContainerClassName,
   actionsComponent,
@@ -143,38 +138,43 @@ export function OrderList({
 }: Props): JSX.Element {
   const [loading, setLoading] = useState(true)
   const [sorting, setSorting] = useState<SortingState>(sortBy)
-  const [{ pageIndex, pageSize: currentPageSize }, setPagination] =
-    useState<PaginationState>({
-      pageIndex: 0,
-      pageSize
-    })
+  const [{ pageIndex, pageSize: currentPageSize }, setPagination] = useState<PaginationState>({
+    pageIndex: 0,
+    pageSize,
+  })
   const { orders, subscriptions, getCustomerOrders, getCustomerSubscriptions } =
     useContext(CustomerContext)
 
   // Calculate default server side sorting value compatible with Commerce Layer SDK if defined in component props
-  const defaultSdkSorting = sortBy.length && sortBy[0] != null ? { [sortBy[0].id]: sortBy[0].desc ? 'desc' : 'asc' } : undefined
+  const defaultSdkSorting =
+    sortBy.length && sortBy[0] != null
+      ? { [sortBy[0].id]: sortBy[0].desc ? "desc" : "asc" }
+      : undefined
 
   useEffect(() => {
     // Calculate server side sorting value compatible with Commerce Layer SDK following current sorting state
-    const sdkSorting = sorting.length && sorting[0] != null ? { [sorting[0].id]: sorting[0].desc ? 'desc' : 'asc' } : defaultSdkSorting
-    if (type === 'orders' && getCustomerOrders != null) {
+    const sdkSorting =
+      sorting.length && sorting[0] != null
+        ? { [sorting[0].id]: sorting[0].desc ? "desc" : "asc" }
+        : defaultSdkSorting
+    if (type === "orders" && getCustomerOrders != null) {
       getCustomerOrders({
         pageNumber: pageIndex + 1,
         pageSize: currentPageSize as QueryPageSize,
-        sortBy: sdkSorting as QuerySort<Order>
+        sortBy: sdkSorting as QuerySort<Order>,
       })
     }
-    if (type === 'subscriptions' && getCustomerSubscriptions != null) {
+    if (type === "subscriptions" && getCustomerSubscriptions != null) {
       getCustomerSubscriptions({
         pageNumber: pageIndex + 1,
         pageSize: currentPageSize as QueryPageSize,
         sortBy: sdkSorting as QuerySort<Order>,
-        id
+        id,
       })
     }
   }, [pageIndex, currentPageSize, sorting, id != null])
   const data = useMemo(() => {
-    if (type === 'orders') {
+    if (type === "orders") {
       return orders ?? []
     }
 
@@ -182,20 +182,17 @@ export function OrderList({
       return subscriptions ?? []
     }
 
-    if (subscriptions?.[0]?.type === 'orders') {
+    if (subscriptions?.[0]?.type === "orders") {
       return subscriptions
     }
 
     return []
   }, [orders, subscriptions])
-  const cols = useMemo<ColumnDef<OrderListContent<TOrderList>>[]>(
-    () => columns,
-    [columns]
-  )
+  const cols = useMemo<ColumnDef<OrderListContent<TOrderList>>[]>(() => columns, [columns])
   const pagination = useMemo(
     () => ({
       pageIndex,
-      pageSize: currentPageSize
+      pageSize: currentPageSize,
     }),
     [pageIndex, currentPageSize]
   )
@@ -213,22 +210,22 @@ export function OrderList({
     pageCount,
     state: {
       sorting,
-      pagination
+      pagination,
     },
     onSortingChange: setSorting,
-    onPaginationChange: setPagination
+    onPaginationChange: setPagination,
   })
-  const TableHtmlElement = 'table'
-  const TheadHtmlElement = 'thead'
-  const TbodyHtmlElement = 'tbody'
-  const ThHtmlElement = 'th'
-  const TrHtmlElement = 'tr'
+  const TableHtmlElement = "table"
+  const TheadHtmlElement = "thead"
+  const TbodyHtmlElement = "tbody"
+  const ThHtmlElement = "th"
+  const TrHtmlElement = "tr"
 
   useEffect(() => {
-    if (type === 'orders' && orders != null) {
+    if (type === "orders" && orders != null) {
       setLoading(false)
     }
-    if (type === 'subscriptions' && subscriptions != null) {
+    if (type === "subscriptions" && subscriptions != null) {
       setLoading(false)
     }
     return () => {
@@ -238,54 +235,47 @@ export function OrderList({
   const LoadingComponent = loadingElement || <div>Loading...</div>
   const headerComponent = table.getHeaderGroups().map((headerGroup) => {
     const columnsComponents = headerGroup.headers.map((header, k) => {
-      const sortLabel =
-        header.column.getIsSorted() !== false ? header.column.getIsSorted() : ''
+      const sortLabel = header.column.getIsSorted() !== false ? header.column.getIsSorted() : ""
       return (
         <ThHtmlElement
           data-testid={`thead-${k}`}
-          data-sort={`${sortLabel || ''}`}
+          data-sort={`${sortLabel || ""}`}
           key={header.id}
           className={columns[k]?.className}
         >
           <span
             {...{
-              className: `${columns[k]?.titleClassName ?? ''} ${header.column.getCanSort() ? 'cursor-pointer select-none' : ''
-                }`,
-              onClick: header.column.getToggleSortingHandler()
+              className: `${columns[k]?.titleClassName ?? ""} ${
+                header.column.getCanSort() ? "cursor-pointer select-none" : ""
+              }`,
+              onClick: header.column.getToggleSortingHandler(),
             }}
           >
-            {
-              flexRender(
-                header.column.columnDef.header,
-                header.getContext()
-              ) as ReactNode
-            }
+            {flexRender(header.column.columnDef.header, header.getContext()) as ReactNode}
             {{
               asc: sortAscIcon,
-              desc: sortDescIcon
+              desc: sortDescIcon,
             }[header.column.getIsSorted() as string] ?? null}
           </span>
         </ThHtmlElement>
       )
     })
-    return (
-      <TrHtmlElement key={headerGroup.id}>{columnsComponents}</TrHtmlElement>
-    )
+    return <TrHtmlElement key={headerGroup.id}>{columnsComponents}</TrHtmlElement>
   })
   const rowsComponents = filterChildren({
     children,
     filterBy: rowComponents,
-    componentName: 'OrderList'
+    componentName: "OrderList",
   })
   const components = table.getRowModel().rows.map((row) => {
     const childProps = {
       type,
-      orders: type === 'orders' ? orders : subscriptions,
+      orders: type === "orders" ? orders : subscriptions,
       order: row.original,
       row,
       showActions,
       actionsComponent,
-      actionsContainerClassName
+      actionsContainerClassName,
     }
     return (
       <TrHtmlElement className={rowTrClassName} key={row.id}>
@@ -298,12 +288,10 @@ export function OrderList({
   const pagComponents = filterChildren({
     children,
     filterBy: paginationComponents,
-    componentName: 'OrderList'
+    componentName: "OrderList",
   })
   const totalRows =
-    type === 'orders'
-      ? orders?.meta.recordCount ?? 0
-      : subscriptions?.meta.recordCount ?? 0
+    type === "orders" ? (orders?.meta.recordCount ?? 0) : (subscriptions?.meta.recordCount ?? 0)
 
   const Pagination = (): JSX.Element | null =>
     !showPagination ? null : (
@@ -319,7 +307,7 @@ export function OrderList({
           pageSize: table.getState().pagination.pageSize,
           previousPage: table.previousPage,
           setPageSize: table.setPageSize,
-          totalRows
+          totalRows,
         }}
       >
         {pagComponents}
@@ -328,9 +316,9 @@ export function OrderList({
   if (loading && (orders == null || subscriptions == null)) {
     return <>{LoadingComponent}</>
   }
-  return (type === 'orders' ? orders : subscriptions)?.length === 0 ? (
+  return (type === "orders" ? orders : subscriptions)?.length === 0 ? (
     <OrderListChildrenContext.Provider
-      value={{ orders: type === 'orders' ? orders : subscriptions }}
+      value={{ orders: type === "orders" ? orders : subscriptions }}
     >
       {rowsComponents}
       <Pagination />
@@ -338,9 +326,7 @@ export function OrderList({
   ) : (
     <>
       <TableHtmlElement {...p}>
-        <TheadHtmlElement className={theadClassName}>
-          {headerComponent}
-        </TheadHtmlElement>
+        <TheadHtmlElement className={theadClassName}>{headerComponent}</TheadHtmlElement>
         <TbodyHtmlElement>{components}</TbodyHtmlElement>
       </TableHtmlElement>
       {totalRows <= pageSize ? null : (
diff --git a/packages/react-components/src/components/orders/OrderListEmpty.tsx b/packages/react-components/src/components/orders/OrderListEmpty.tsx
index 3f3bd124..f1c5252c 100644
--- a/packages/react-components/src/components/orders/OrderListEmpty.tsx
+++ b/packages/react-components/src/components/orders/OrderListEmpty.tsx
@@ -1,13 +1,13 @@
-import Parent from '#components/utils/Parent'
-import OrderListChildrenContext from '#context/OrderListChildrenContext'
-import type { ChildrenFunction } from '#typings/index'
-import { useContext, type JSX } from 'react';
+import Parent from "#components/utils/Parent"
+import OrderListChildrenContext from "#context/OrderListChildrenContext"
+import type { ChildrenFunction } from "#typings/index"
+import { useContext, type JSX } from "react"
 
-interface Props extends Omit<JSX.IntrinsicElements['span'], 'children'> {
+interface Props extends Omit<JSX.IntrinsicElements["span"], "children"> {
   /**
    * Function allow you to customize the component
    */
-  children?: ChildrenFunction<Omit<Props, 'children'>>
+  children?: ChildrenFunction<Omit<Props, "children">>
   /**
    * Label to show. Default: 'No orders available.'
    */
@@ -15,7 +15,7 @@ interface Props extends Omit<JSX.IntrinsicElements['span'], 'children'> {
 }
 
 export function OrderListEmpty(props: Props): JSX.Element | null {
-  const { children, emptyText = 'No orders available', ...p } = props
+  const { children, emptyText = "No orders available", ...p } = props
   const { orders } = useContext(OrderListChildrenContext)
   const parentProps = { emptyText, ...p }
   if (orders != null && orders.length > 0) {
@@ -28,6 +28,6 @@ export function OrderListEmpty(props: Props): JSX.Element | null {
   )
 }
 
-OrderListEmpty.displayName = 'OrderListEmpty'
+OrderListEmpty.displayName = "OrderListEmpty"
 
 export default OrderListEmpty
diff --git a/packages/react-components/src/components/orders/OrderListPaginationButtons.tsx b/packages/react-components/src/components/orders/OrderListPaginationButtons.tsx
index 7fd88b41..24cd95dc 100644
--- a/packages/react-components/src/components/orders/OrderListPaginationButtons.tsx
+++ b/packages/react-components/src/components/orders/OrderListPaginationButtons.tsx
@@ -1,15 +1,14 @@
-import Parent from '#components/utils/Parent'
+import Parent from "#components/utils/Parent"
 import OrderListPaginationContext, {
-  type OrderListPaginationContext as TOrderListPaginationContext
-} from '#context/OrderListPaginationContext'
-import type { ChildrenFunction } from '#typings/index'
-import useCustomContext from '#utils/hooks/useCustomContext'
-import omit from '#utils/omit'
+  type OrderListPaginationContext as TOrderListPaginationContext,
+} from "#context/OrderListPaginationContext"
+import type { ChildrenFunction } from "#typings/index"
+import useCustomContext from "#utils/hooks/useCustomContext"
+import omit from "#utils/omit"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
-interface PaginationButton
-  extends Omit<JSX.IntrinsicElements['button'], 'children' | 'disabled'> {
+interface PaginationButton extends Omit<JSX.IntrinsicElements["button"], "children" | "disabled"> {
   /**
    * Show or hide the pagination button. Default is true.
    */
@@ -24,8 +23,7 @@ interface PaginationButton
   hideWhenDisabled?: boolean
 }
 
-interface NavigationButtons
-  extends Omit<JSX.IntrinsicElements['button'], 'children'> {
+interface NavigationButtons extends Omit<JSX.IntrinsicElements["button"], "children"> {
   /**
    * Show or hide the navigation buttons. Default is true.
    */
@@ -36,9 +34,9 @@ interface NavigationButtons
   activeClassName?: string
 }
 
-type ChildrenProps = Omit<Props, 'children'> & TOrderListPaginationContext
+type ChildrenProps = Omit<Props, "children"> & TOrderListPaginationContext
 
-interface Props extends Omit<JSX.IntrinsicElements['div'], 'children'> {
+interface Props extends Omit<JSX.IntrinsicElements["div"], "children"> {
   children?: ChildrenFunction<ChildrenProps>
   /**
    * Previous button props
@@ -66,33 +64,31 @@ export function OrderListPaginationButtons({
   const { ...navButton } = { show: true, ...navigationButtons }
   const ctx = useCustomContext({
     context: OrderListPaginationContext,
-    contextComponentName: 'OrderList',
-    currentComponentName: 'OrderListPaginationButtons',
-    key: 'totalRows'
+    contextComponentName: "OrderList",
+    currentComponentName: "OrderListPaginationButtons",
+    key: "totalRows",
   })
   const PrevButton = prevButton.show ? (
-    prevButton.hideWhenDisabled === true &&
-    ctx?.canPreviousPage === false ? null : (
+    prevButton.hideWhenDisabled === true && ctx?.canPreviousPage === false ? null : (
       <button
-        data-testid='prev-button'
-        {...omit(prevButton, ['show', 'hideWhenDisabled'])}
+        data-testid="prev-button"
+        {...omit(prevButton, ["show", "hideWhenDisabled"])}
         disabled={ctx?.canPreviousPage === false}
         onClick={() => ctx?.previousPage()}
       >
-        {previousPageButton?.label ?? '<'}
+        {previousPageButton?.label ?? "<"}
       </button>
     )
   ) : null
   const NextButton = nextButton.show ? (
-    nextButton.hideWhenDisabled === true &&
-    ctx?.canNextPage === false ? null : (
+    nextButton.hideWhenDisabled === true && ctx?.canNextPage === false ? null : (
       <button
-        data-testid='next-button'
-        {...omit(nextButton, ['show', 'hideWhenDisabled'])}
+        data-testid="next-button"
+        {...omit(nextButton, ["show", "hideWhenDisabled"])}
         disabled={ctx?.canNextPage === false}
         onClick={() => ctx?.nextPage()}
       >
-        {nextButton?.label ?? '>'}
+        {nextButton?.label ?? ">"}
       </button>
     )
   ) : null
@@ -103,23 +99,19 @@ export function OrderListPaginationButtons({
         ? ctx?.pageOptions
             .slice(ctx?.pageOptions.length - 3, ctx?.pageOptions.length)
             .map((v) => v + 1)
-        : ctx?.pageOptions
-            .slice(ctx?.pageIndex - 1, ctx?.pageIndex + 2)
-            .map((v) => v + 1)
+        : ctx?.pageOptions.slice(ctx?.pageIndex - 1, ctx?.pageIndex + 2).map((v) => v + 1)
   const NavButtons = navButton.show
     ? pagesToShow?.map((v) => {
         const currentPage = ctx?.pageIndex != null ? ctx?.pageIndex + 1 : 1
         const className =
           currentPage === v
-            ? `${navButton?.className ?? ''} ${
-                navButton?.activeClassName ?? ''
-              }`
+            ? `${navButton?.className ?? ""} ${navButton?.activeClassName ?? ""}`
             : navButton?.className
         return (
           <button
             data-testid={`page-${v}`}
             key={`page-${v}`}
-            {...omit(navButton, ['show', 'activeClassName', 'className'])}
+            {...omit(navButton, ["show", "activeClassName", "className"])}
             className={className}
             onClick={() => ctx?.gotoPage(v - 1)}
           >
@@ -133,7 +125,7 @@ export function OrderListPaginationButtons({
     prevButton,
     nextButton,
     ...ctx,
-    ...props
+    ...props,
   }
   return children == null ? (
     ctx?.totalRows === 0 ? null : (
@@ -148,6 +140,6 @@ export function OrderListPaginationButtons({
   )
 }
 
-OrderListPaginationButtons.displayName = 'OrderListPaginationButtons'
+OrderListPaginationButtons.displayName = "OrderListPaginationButtons"
 
 export default OrderListPaginationButtons
diff --git a/packages/react-components/src/components/orders/OrderListPaginationInfo.tsx b/packages/react-components/src/components/orders/OrderListPaginationInfo.tsx
index 15d7dde7..d1776261 100644
--- a/packages/react-components/src/components/orders/OrderListPaginationInfo.tsx
+++ b/packages/react-components/src/components/orders/OrderListPaginationInfo.tsx
@@ -1,13 +1,13 @@
-import Parent from '#components/utils/Parent'
-import OrderListPaginationContext from '#context/OrderListPaginationContext'
-import type { ChildrenFunction } from '#typings/index'
-import useCustomContext from '#utils/hooks/useCustomContext'
+import Parent from "#components/utils/Parent"
+import OrderListPaginationContext from "#context/OrderListPaginationContext"
+import type { ChildrenFunction } from "#typings/index"
+import useCustomContext from "#utils/hooks/useCustomContext"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
-type TAsComponent = keyof Pick<JSX.IntrinsicElements, 'p' | 'span' | 'div'>
+type TAsComponent = keyof Pick<JSX.IntrinsicElements, "p" | "span" | "div">
 
-type ChildrenProps<A extends TAsComponent> = Omit<Props<A>, 'children'> & {
+type ChildrenProps<A extends TAsComponent> = Omit<Props<A>, "children"> & {
   /**
    * Current number of the first page row to display
    */
@@ -28,18 +28,18 @@ type Props<A extends TAsComponent> = {
    * HTML Tag to display
    */
   as?: TAsComponent
-} & Omit<JSX.IntrinsicElements[A], 'children' | 'ref'>
+} & Omit<JSX.IntrinsicElements[A], "children" | "ref">
 
-export function OrderListPaginationInfo<A extends TAsComponent = 'span'>({
-  as = 'span',
+export function OrderListPaginationInfo<A extends TAsComponent = "span">({
+  as = "span",
   children,
   ...props
 }: Props<A>): JSX.Element | null {
   const ctx = useCustomContext({
     context: OrderListPaginationContext,
-    contextComponentName: 'OrderList',
-    currentComponentName: 'OrderListPaginationInfo',
-    key: 'totalRows'
+    contextComponentName: "OrderList",
+    currentComponentName: "OrderListPaginationInfo",
+    key: "totalRows",
   })
   const TagElement = as
   const totRows = ctx?.totalRows ?? 0
@@ -57,15 +57,13 @@ export function OrderListPaginationInfo<A extends TAsComponent = 'span'>({
   const parentProps = { ...props, as, firstRow, lastRow, totRows }
   return children == null ? (
     totRows === 0 ? null : (
-      <TagElement {...props}>
-        {`${firstRow} - ${lastRow} of ${totRows}`}
-      </TagElement>
+      <TagElement {...props}>{`${firstRow} - ${lastRow} of ${totRows}`}</TagElement>
     )
   ) : (
     <Parent {...parentProps}>{children}</Parent>
   )
 }
 
-OrderListPaginationInfo.displayName = 'OrderListPaginationInfo'
+OrderListPaginationInfo.displayName = "OrderListPaginationInfo"
 
 export default OrderListPaginationInfo
diff --git a/packages/react-components/src/components/orders/OrderListRow.tsx b/packages/react-components/src/components/orders/OrderListRow.tsx
index 2189f9a3..2328b46b 100644
--- a/packages/react-components/src/components/orders/OrderListRow.tsx
+++ b/packages/react-components/src/components/orders/OrderListRow.tsx
@@ -1,14 +1,14 @@
-import { type ReactNode, useContext, type JSX } from 'react';
-import Parent from '#components/utils/Parent'
+import { type ReactNode, useContext, type JSX } from "react"
+import Parent from "#components/utils/Parent"
 import OrderListChildrenContext, {
   type TOrderList,
   type OrderListContent,
-  type TableAccessor
-} from '#context/OrderListChildrenContext'
-import isDate from '#utils/isDate'
-import { flexRender, type Row } from '@tanstack/react-table'
+  type TableAccessor,
+} from "#context/OrderListChildrenContext"
+import isDate from "#utils/isDate"
+import { flexRender, type Row } from "@tanstack/react-table"
 
-interface ChildrenProps extends Omit<Props, 'children'> {
+interface ChildrenProps extends Omit<Props, "children"> {
   /**
    * The order resource
    */
@@ -20,12 +20,10 @@ interface ChildrenProps extends Omit<Props, 'children'> {
   /**
    * The current cell
    */
-  cell: Array<
-    ReturnType<Row<OrderListContent<TOrderList>>['getVisibleCells']>[number]
-  >
+  cell: Array<ReturnType<Row<OrderListContent<TOrderList>>["getVisibleCells"]>[number]>
 }
 
-interface Props extends Omit<JSX.IntrinsicElements['td'], 'children'> {
+interface Props extends Omit<JSX.IntrinsicElements["td"], "children"> {
   children?: (props: ChildrenProps) => JSX.Element
   /**
    * The order field to show
@@ -34,24 +32,15 @@ interface Props extends Omit<JSX.IntrinsicElements['td'], 'children'> {
 }
 
 export function OrderListRow({ field, children, ...p }: Props): JSX.Element {
-  const {
-    order,
-    row,
-    showActions,
-    actionsComponent,
-    actionsContainerClassName
-  } = useContext(OrderListChildrenContext)
+  const { order, row, showActions, actionsComponent, actionsContainerClassName } =
+    useContext(OrderListChildrenContext)
   const cell = row?.getVisibleCells().filter((cell) => cell.column.id === field)
   const isLastRow = row?.getVisibleCells().at(-1)?.column.id === field
-  const As = 'td'
+  const As = "td"
   const ActionRow = (): JSX.Element | null => {
     return (
       (showActions && isLastRow && actionsComponent && (
-        <As
-          data-testid='action-cell'
-          {...p}
-          className={actionsContainerClassName}
-        >
+        <As data-testid="action-cell" {...p} className={actionsContainerClassName}>
           <Parent {...parentProps}>{actionsComponent}</Parent>
         </As>
       )) ||
@@ -63,7 +52,7 @@ export function OrderListRow({ field, children, ...p }: Props): JSX.Element {
     field,
     order,
     row,
-    cell
+    cell,
   }
   return children ? (
     <>
@@ -78,10 +67,7 @@ export function OrderListRow({ field, children, ...p }: Props): JSX.Element {
         const cellValue = cell.getValue<string>()
         const value = isDate(cellValue)
           ? new Date(Date.parse(cellValue)).toLocaleString()
-          : (flexRender(
-              cell.column.columnDef.cell,
-              cell.getContext()
-            ) as ReactNode)
+          : (flexRender(cell.column.columnDef.cell, cell.getContext()) as ReactNode)
         return (
           <As data-testid={`cell-${k}`} {...p} key={cell.id}>
             {value}
@@ -93,6 +79,6 @@ export function OrderListRow({ field, children, ...p }: Props): JSX.Element {
   )
 }
 
-OrderListRow.displayName = 'OrderListRow'
+OrderListRow.displayName = "OrderListRow"
 
 export default OrderListRow
diff --git a/packages/react-components/src/components/orders/OrderNumber.tsx b/packages/react-components/src/components/orders/OrderNumber.tsx
index 71ad7586..ff5d0c98 100644
--- a/packages/react-components/src/components/orders/OrderNumber.tsx
+++ b/packages/react-components/src/components/orders/OrderNumber.tsx
@@ -1,11 +1,11 @@
-import BaseField, { type BaseFieldProps } from '../utils/BaseField'
+import BaseField, { type BaseFieldProps } from "../utils/BaseField"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
-type Props = Omit<BaseFieldProps, 'attribute'>
+type Props = Omit<BaseFieldProps, "attribute">
 
 export function OrderNumber(props: Props): JSX.Element {
-  return <BaseField attribute='number' {...props} />
+  return <BaseField attribute="number" {...props} />
 }
 
 export default OrderNumber
diff --git a/packages/react-components/src/components/orders/OrderStorage.tsx b/packages/react-components/src/components/orders/OrderStorage.tsx
index ab0c7864..f99dc046 100644
--- a/packages/react-components/src/components/orders/OrderStorage.tsx
+++ b/packages/react-components/src/components/orders/OrderStorage.tsx
@@ -1,10 +1,6 @@
-import type { ReactNode, JSX } from 'react';
-import OrderStorageContext from '#context/OrderStorageContext'
-import {
-  getLocalOrder,
-  setLocalOrder,
-  deleteLocalOrder
-} from '#utils/localStorage'
+import type { ReactNode, JSX } from "react"
+import OrderStorageContext from "#context/OrderStorageContext"
+import { getLocalOrder, setLocalOrder, deleteLocalOrder } from "#utils/localStorage"
 
 interface Props {
   children: ReactNode
@@ -44,7 +40,7 @@ export function OrderStorage(props: Props): JSX.Element {
         setLocalOrder,
         getLocalOrder,
         deleteLocalOrder,
-        clearWhenPlaced
+        clearWhenPlaced,
       }}
     >
       {children}
diff --git a/packages/react-components/src/components/orders/PaymentMethodAmount.tsx b/packages/react-components/src/components/orders/PaymentMethodAmount.tsx
index c0803259..f2d74c7b 100644
--- a/packages/react-components/src/components/orders/PaymentMethodAmount.tsx
+++ b/packages/react-components/src/components/orders/PaymentMethodAmount.tsx
@@ -1,10 +1,10 @@
-import BaseOrderPrice from '#components/utils/BaseOrderPrice'
-import type { BaseAmountComponent } from '#typings'
+import BaseOrderPrice from "#components/utils/BaseOrderPrice"
+import type { BaseAmountComponent } from "#typings"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
 export function PaymentMethodAmount(props: BaseAmountComponent): JSX.Element {
-  return <BaseOrderPrice base='amount' type='payment_method' {...props} />
+  return <BaseOrderPrice base="amount" type="payment_method" {...props} />
 }
 
 export default PaymentMethodAmount
diff --git a/packages/react-components/src/components/orders/PlaceOrderButton.tsx b/packages/react-components/src/components/orders/PlaceOrderButton.tsx
index fd26a05b..65718f15 100644
--- a/packages/react-components/src/components/orders/PlaceOrderButton.tsx
+++ b/packages/react-components/src/components/orders/PlaceOrderButton.tsx
@@ -26,8 +26,7 @@ interface ChildrenProps extends Omit<Props, "children"> {
   handleClick: () => Promise<void>
 }
 
-interface Props
-  extends Omit<JSX.IntrinsicElements["button"], "children" | "onClick"> {
+interface Props extends Omit<JSX.IntrinsicElements["button"], "children" | "onClick"> {
   children?: ChildrenFunction<ChildrenProps>
   /**
    * The label of the button
@@ -44,11 +43,7 @@ interface Props
   /**
    * Callback function that is fired when the button is clicked
    */
-  onClick?: (response: {
-    placed: boolean
-    order?: Order
-    errors?: BaseError[]
-  }) => void
+  onClick?: (response: { placed: boolean; order?: Order; errors?: BaseError[] }) => void
 }
 
 export function PlaceOrderButton(props: Props): JSX.Element {
@@ -112,17 +107,12 @@ export function PlaceOrderButton(props: Props): JSX.Element {
           card.brand = "credit-card"
         }
         if (
-          ((isFree && isPermitted) ||
-            currentPaymentMethodRef?.current?.onsubmit ||
-            card.brand) &&
+          ((isFree && isPermitted) || currentPaymentMethodRef?.current?.onsubmit || card.brand) &&
           isPermitted
         ) {
           setNotPermitted(false)
         }
-        if (
-          !currentPaymentMethodRef?.current?.onsubmit &&
-          paymentSourceStatus === "declined"
-        ) {
+        if (!currentPaymentMethodRef?.current?.onsubmit && paymentSourceStatus === "declined") {
           setNotPermitted(true)
         }
       } else if (isFree && isPermitted) {
@@ -145,14 +135,8 @@ export function PlaceOrderButton(props: Props): JSX.Element {
     order?.total_amount_with_taxes_cents,
   ])
   useEffect(() => {
-    const giftCardCouponFields = [
-      "gift_card_code",
-      "coupon_code",
-      "gift_card_or_coupon_code",
-    ]
-    const blockingErrors = errors?.filter(
-      (e) => !giftCardCouponFields.includes(e.field ?? ""),
-    )
+    const giftCardCouponFields = ["gift_card_code", "coupon_code", "gift_card_or_coupon_code"]
+    const blockingErrors = errors?.filter((e) => !giftCardCouponFields.includes(e.field ?? ""))
     if (
       (blockingErrors && blockingErrors.length > 0) ||
       (paymentMethodErrors && paymentMethodErrors.length > 0)
@@ -189,8 +173,7 @@ export function PlaceOrderButton(props: Props): JSX.Element {
     ) {
       // @ts-expect-error no type
       const publicApiKey = order?.payment_source?.publishable_key
-      const paymentIntentClientSecret =
-        options?.stripe?.paymentIntentClientSecret
+      const paymentIntentClientSecret = options?.stripe?.paymentIntentClientSecret
 
       const getPaymentIntent = async (): Promise<void> => {
         const paymentIntentResult = await checkPaymentIntent({
@@ -239,11 +222,7 @@ export function PlaceOrderButton(props: Props): JSX.Element {
       const paymentMethodType =
         // @ts-expect-error no type
         order?.payment_source?.payment_response?.paymentMethod?.type
-      if (
-        paymentType === "adyen_payments" &&
-        options?.adyen?.redirectResult &&
-        !paymentDetails
-      ) {
+      if (paymentType === "adyen_payments" && options?.adyen?.redirectResult && !paymentDetails) {
         const attributes = {
           payment_request_details: {
             details: {
@@ -263,10 +242,7 @@ export function PlaceOrderButton(props: Props): JSX.Element {
           const errorCode = res?.payment_response?.errorCode
           // @ts-expect-error no type
           const message = res?.payment_response?.message
-          if (
-            ["Authorised", "Pending", "Received"].includes(resultCode) &&
-            autoPlaceOrder
-          ) {
+          if (["Authorised", "Pending", "Received"].includes(resultCode) && autoPlaceOrder) {
             handleClick()
           } else if (errorCode != null) {
             setPaymentMethodErrors([
@@ -290,9 +266,7 @@ export function PlaceOrderButton(props: Props): JSX.Element {
         // NOTE: This is a workaround for the case when the user reloads the page after selecting a customer payment source
         if (
           // @ts-expect-error no type
-          order?.payment_source?.payment_response?.merchantReference?.includes(
-            order?.number,
-          )
+          order?.payment_source?.payment_response?.merchantReference?.includes(order?.number)
         ) {
           handleClick()
         }
@@ -308,9 +282,7 @@ export function PlaceOrderButton(props: Props): JSX.Element {
         // NOTE: This is a workaround for the case when the user reloads the page after selecting a customer payment source
         if (
           // @ts-expect-error no type
-          order?.payment_source?.payment_response?.merchantReference?.includes(
-            order?.number,
-          )
+          order?.payment_source?.payment_response?.merchantReference?.includes(order?.number)
         ) {
           handleClick()
         }
@@ -357,9 +329,7 @@ export function PlaceOrderButton(props: Props): JSX.Element {
           })
           // @ts-expect-error no type
           const paymentStatus: string = res?.payment_response?.status
-          const isValidStatus = ["authorized", "captured"].includes(
-            paymentStatus?.toLowerCase(),
-          )
+          const isValidStatus = ["authorized", "captured"].includes(paymentStatus?.toLowerCase())
           if (paymentStatus && isValidStatus) {
             handleClick()
           } else {
@@ -425,9 +395,7 @@ export function PlaceOrderButton(props: Props): JSX.Element {
         break
     }
   }, [status != null])
-  const handleClick = async (
-    e?: MouseEvent<HTMLButtonElement>,
-  ): Promise<void> => {
+  const handleClick = async (e?: MouseEvent<HTMLButtonElement>): Promise<void> => {
     e?.preventDefault()
     e?.stopPropagation()
     const sdk = sdkClient()
@@ -443,11 +411,10 @@ export function PlaceOrderButton(props: Props): JSX.Element {
        * and to prevent placing a draft order
        * @see https://docs.commercelayer.io/core/how-tos/placing-orders/checkout/placing-the-order
        */
-      const { status, payment_status: paymentStatus } =
-        await sdk.orders.retrieve(order?.id, {
-          fields: ["status", "payment_status", "payment_source"],
-          include: ["payment_source"],
-        })
+      const { status, payment_status: paymentStatus } = await sdk.orders.retrieve(order?.id, {
+        fields: ["status", "payment_status", "payment_source"],
+        include: ["payment_source"],
+      })
       const isAlreadyPlaced = status === "placed"
       const isDraftOrder = status === "draft"
       currentPaymentStatus = paymentStatus ?? "unpaid"
@@ -510,11 +477,9 @@ export function PlaceOrderButton(props: Props): JSX.Element {
       })
     if (
       currentPaymentMethodRef?.current?.onsubmit &&
-      [
-        !options?.paypalPayerId,
-        !options?.adyen?.MD,
-        !options?.checkoutCom?.session_id,
-      ].every(Boolean)
+      [!options?.paypalPayerId, !options?.adyen?.MD, !options?.checkoutCom?.session_id].every(
+        Boolean
+      )
     ) {
       isValid = (await currentPaymentMethodRef.current?.onsubmit({
         // @ts-expect-error no type
@@ -580,11 +545,7 @@ export function PlaceOrderButton(props: Props): JSX.Element {
     }
   }
   const disabledButton = disabled !== undefined ? disabled : notPermitted
-  const labelButton = isLoading
-    ? loadingLabel
-    : typeof label === 'function'
-      ? label()
-      : label
+  const labelButton = isLoading ? loadingLabel : typeof label === "function" ? label() : label
   const parentProps = {
     ...p,
     label,
diff --git a/packages/react-components/src/components/orders/PlaceOrderContainer.tsx b/packages/react-components/src/components/orders/PlaceOrderContainer.tsx
index b2505f65..0954d379 100644
--- a/packages/react-components/src/components/orders/PlaceOrderContainer.tsx
+++ b/packages/react-components/src/components/orders/PlaceOrderContainer.tsx
@@ -1,12 +1,5 @@
 import PlaceOrderContext from "#context/PlaceOrderContext"
-import {
-  type ReactNode,
-  type RefObject,
-  useContext,
-  useEffect,
-  useReducer,
-  type JSX,
-} from "react"
+import { type ReactNode, type RefObject, useContext, useEffect, useReducer, type JSX } from "react"
 import placeOrderReducer, {
   placeOrderInitialState,
   type PlaceOrderOptions,
@@ -26,23 +19,14 @@ interface Props {
 }
 export function PlaceOrderContainer(props: Props): JSX.Element {
   const { children, options } = props
-  const [state, dispatch] = useReducer(
-    placeOrderReducer,
-    placeOrderInitialState,
-  )
-  const {
-    order,
-    setOrder,
-    setOrderErrors,
-    include,
-    addResourceToInclude,
-    includeLoaded,
-  } = useCustomContext({
-    context: OrderContext,
-    contextComponentName: "Order",
-    currentComponentName: "PlaceOrderContainer",
-    key: "order",
-  })
+  const [state, dispatch] = useReducer(placeOrderReducer, placeOrderInitialState)
+  const { order, setOrder, setOrderErrors, include, addResourceToInclude, includeLoaded } =
+    useCustomContext({
+      context: OrderContext,
+      contextComponentName: "Order",
+      currentComponentName: "PlaceOrderContainer",
+      key: "order",
+    })
   const config = useContext(CommerceLayerContext)
   const organizationConfig = useOrganizationConfig({
     accessToken: config.accessToken,
@@ -123,9 +107,7 @@ export function PlaceOrderContainer(props: Props): JSX.Element {
         setOrder,
         currentCustomerPaymentSourceId,
       }),
-    setPlaceOrderStatus: ({
-      status,
-    }: Parameters<typeof setPlaceOrderStatus>[0]) => {
+    setPlaceOrderStatus: ({ status }: Parameters<typeof setPlaceOrderStatus>[0]) => {
       setPlaceOrderStatus({ status, dispatch })
     },
     placeOrderPermitted: () => {
@@ -144,11 +126,7 @@ export function PlaceOrderContainer(props: Props): JSX.Element {
       setButtonRef(ref, dispatch)
     },
   }
-  return (
-    <PlaceOrderContext.Provider value={contextValue}>
-      {children}
-    </PlaceOrderContext.Provider>
-  )
+  return <PlaceOrderContext.Provider value={contextValue}>{children}</PlaceOrderContext.Provider>
 }
 
 export default PlaceOrderContainer
diff --git a/packages/react-components/src/components/orders/PrivacyAndTermsCheckbox.tsx b/packages/react-components/src/components/orders/PrivacyAndTermsCheckbox.tsx
index b9d1d1c0..3db25915 100644
--- a/packages/react-components/src/components/orders/PrivacyAndTermsCheckbox.tsx
+++ b/packages/react-components/src/components/orders/PrivacyAndTermsCheckbox.tsx
@@ -5,9 +5,7 @@ import PlaceOrderContext from "#context/PlaceOrderContext"
 import { useOrganizationConfig } from "#utils/organization"
 import BaseInput, { type BaseInputProps } from "../utils/BaseInput"
 
-export function PrivacyAndTermsCheckbox(
-  props: Partial<BaseInputProps>,
-): JSX.Element {
+export function PrivacyAndTermsCheckbox(props: Partial<BaseInputProps>): JSX.Element {
   const { accessToken } = useContext(CommerceLayerContext)
   const { order } = useContext(OrderContext)
   const { placeOrderPermitted } = useContext(PlaceOrderContext)
@@ -19,9 +17,7 @@ export function PrivacyAndTermsCheckbox(
   const privacyUrl = order?.privacy_url ?? organizationConfig?.urls?.privacy
   const termsUrl = order?.terms_url ?? organizationConfig?.urls?.terms
 
-  const handleChange = (
-    e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,
-  ): void => {
+  const handleChange = (e: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>): void => {
     const v = (e.target as HTMLInputElement)?.checked
     setChecked(v)
     localStorage.setItem(fieldName, v.toString())
diff --git a/packages/react-components/src/components/orders/ShippingAmount.tsx b/packages/react-components/src/components/orders/ShippingAmount.tsx
index 27403fd2..a0f3597d 100644
--- a/packages/react-components/src/components/orders/ShippingAmount.tsx
+++ b/packages/react-components/src/components/orders/ShippingAmount.tsx
@@ -1,10 +1,10 @@
-import BaseOrderPrice from '../utils/BaseOrderPrice'
-import type { BaseAmountComponent } from '#typings'
+import BaseOrderPrice from "../utils/BaseOrderPrice"
+import type { BaseAmountComponent } from "#typings"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
 export function ShippingAmount(props: BaseAmountComponent): JSX.Element {
-  return <BaseOrderPrice base='amount' type='shipping' {...props} />
+  return <BaseOrderPrice base="amount" type="shipping" {...props} />
 }
 
 export default ShippingAmount
diff --git a/packages/react-components/src/components/orders/SubTotalAmount.tsx b/packages/react-components/src/components/orders/SubTotalAmount.tsx
index 3c7ea9d5..d6a3d457 100644
--- a/packages/react-components/src/components/orders/SubTotalAmount.tsx
+++ b/packages/react-components/src/components/orders/SubTotalAmount.tsx
@@ -1,10 +1,10 @@
-import BaseOrderPrice from '../utils/BaseOrderPrice'
-import type { BaseAmountComponent } from '#typings'
+import BaseOrderPrice from "../utils/BaseOrderPrice"
+import type { BaseAmountComponent } from "#typings"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
 export function SubTotalAmount(props: BaseAmountComponent): JSX.Element {
-  return <BaseOrderPrice base='amount' type='subtotal' {...props} />
+  return <BaseOrderPrice base="amount" type="subtotal" {...props} />
 }
 
 export default SubTotalAmount
diff --git a/packages/react-components/src/components/orders/TaxesAmount.tsx b/packages/react-components/src/components/orders/TaxesAmount.tsx
index cfcc0dca..5a5ad5d0 100644
--- a/packages/react-components/src/components/orders/TaxesAmount.tsx
+++ b/packages/react-components/src/components/orders/TaxesAmount.tsx
@@ -1,10 +1,10 @@
-import BaseOrderPrice from '../utils/BaseOrderPrice'
-import type { BaseAmountComponent } from '#typings'
+import BaseOrderPrice from "../utils/BaseOrderPrice"
+import type { BaseAmountComponent } from "#typings"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
 export function TaxesAmount(props: BaseAmountComponent): JSX.Element {
-  return <BaseOrderPrice base='amount' type='total_tax' {...props} />
+  return <BaseOrderPrice base="amount" type="total_tax" {...props} />
 }
 
 export default TaxesAmount
diff --git a/packages/react-components/src/components/orders/TotalAmount.tsx b/packages/react-components/src/components/orders/TotalAmount.tsx
index e142cc2a..17b263f5 100644
--- a/packages/react-components/src/components/orders/TotalAmount.tsx
+++ b/packages/react-components/src/components/orders/TotalAmount.tsx
@@ -9,8 +9,7 @@ export function TotalAmount(props: BaseAmountComponent): JSX.Element | null {
   const { managePaymentProviderGiftCards, order } = useContext(OrderContext)
   if (managePaymentProviderGiftCards) {
     const giftCardData = manageGiftCard({ order })
-    if (!giftCardData)
-      return <BaseOrderPrice base="total_amount" type="with_taxes" {...props} />
+    if (!giftCardData) return <BaseOrderPrice base="total_amount" type="with_taxes" {...props} />
     const parentProps = {
       price: `${giftCardData?.formattedOrderTotal}`,
       ...props,
diff --git a/packages/react-components/src/components/parcels/ParcelField.tsx b/packages/react-components/src/components/parcels/ParcelField.tsx
index 8fb95ceb..aa17048d 100644
--- a/packages/react-components/src/components/parcels/ParcelField.tsx
+++ b/packages/react-components/src/components/parcels/ParcelField.tsx
@@ -1,16 +1,16 @@
-import type { ConditionalElement } from '#typings'
+import type { ConditionalElement } from "#typings"
 import GenericFieldComponent, {
   type TGenericChildrenProps,
   type TResourceKey,
-  type TResources
-} from '#components/utils/GenericFieldComponent'
-import ParcelChildrenContext from '#context/ParcelChildrenContext'
+  type TResources,
+} from "#components/utils/GenericFieldComponent"
+import ParcelChildrenContext from "#context/ParcelChildrenContext"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
-type ParcelFieldChildrenProps = TGenericChildrenProps<TResources['Parcel']>
+type ParcelFieldChildrenProps = TGenericChildrenProps<TResources["Parcel"]>
 
-type TCondition = ConditionalElement<Exclude<TResources['Parcel'], 'resource'>>
+type TCondition = ConditionalElement<Exclude<TResources["Parcel"], "resource">>
 
 type Props = {
   children?: (props: ParcelFieldChildrenProps) => JSX.Element
@@ -20,10 +20,10 @@ type Props = {
  * @returns
  */
 export function ParcelField<P extends Props>(props: P): JSX.Element {
-  const { attribute, tagElement = 'span', children, ...p } = props
+  const { attribute, tagElement = "span", children, ...p } = props
   return (
-    <GenericFieldComponent<TResourceKey['Parcel']>
-      resource='parcel'
+    <GenericFieldComponent<TResourceKey["Parcel"]>
+      resource="parcel"
       attribute={attribute}
       tagElement={tagElement}
       context={ParcelChildrenContext}
diff --git a/packages/react-components/src/components/parcels/ParcelLineItem.tsx b/packages/react-components/src/components/parcels/ParcelLineItem.tsx
index 1ebfdfe7..1ba5ee6b 100644
--- a/packages/react-components/src/components/parcels/ParcelLineItem.tsx
+++ b/packages/react-components/src/components/parcels/ParcelLineItem.tsx
@@ -1,7 +1,7 @@
-import ParcelChildrenContext from '#context/ParcelChildrenContext'
-import ParcelLineItemChildrenContext from '#context/ParcelLineItemChildrenContext'
-import type { DefaultChildrenType } from '#typings/globals'
-import { useContext, type JSX } from 'react';
+import ParcelChildrenContext from "#context/ParcelChildrenContext"
+import ParcelLineItemChildrenContext from "#context/ParcelLineItemChildrenContext"
+import type { DefaultChildrenType } from "#typings/globals"
+import { useContext, type JSX } from "react"
 
 interface Props {
   children: DefaultChildrenType
@@ -11,10 +11,7 @@ export function ParcelLineItem({ children }: Props): JSX.Element {
   const { parcel } = useContext(ParcelChildrenContext)
   const components = parcel?.parcel_line_items?.map((parcelLineItem, key) => {
     return (
-      <ParcelLineItemChildrenContext.Provider
-        key={key}
-        value={{ parcelLineItem }}
-      >
+      <ParcelLineItemChildrenContext.Provider key={key} value={{ parcelLineItem }}>
         {children}
       </ParcelLineItemChildrenContext.Provider>
     )
diff --git a/packages/react-components/src/components/parcels/ParcelLineItemField.tsx b/packages/react-components/src/components/parcels/ParcelLineItemField.tsx
index 7019b532..d3df6701 100644
--- a/packages/react-components/src/components/parcels/ParcelLineItemField.tsx
+++ b/packages/react-components/src/components/parcels/ParcelLineItemField.tsx
@@ -1,20 +1,16 @@
-import type { ConditionalElement } from '#typings'
+import type { ConditionalElement } from "#typings"
 import GenericFieldComponent, {
   type TGenericChildrenProps,
   type TResourceKey,
-  type TResources
-} from '#components/utils/GenericFieldComponent'
-import ParcelLineItemChildrenContext from '#context/ParcelLineItemChildrenContext'
+  type TResources,
+} from "#components/utils/GenericFieldComponent"
+import ParcelLineItemChildrenContext from "#context/ParcelLineItemChildrenContext"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
-type ParcelLineItemFieldChildrenProps = TGenericChildrenProps<
-  TResources['ParcelLineItem']
->
+type ParcelLineItemFieldChildrenProps = TGenericChildrenProps<TResources["ParcelLineItem"]>
 
-type TCondition = ConditionalElement<
-  Exclude<TResources['ParcelLineItem'], 'resource'>
->
+type TCondition = ConditionalElement<Exclude<TResources["ParcelLineItem"], "resource">>
 
 type Props = {
   children?: (props: ParcelLineItemFieldChildrenProps) => JSX.Element
@@ -24,10 +20,10 @@ type Props = {
  * @returns
  */
 export function ParcelLineItemField<P extends Props>(props: P): JSX.Element {
-  const { attribute, tagElement = 'span', children, ...p } = props
+  const { attribute, tagElement = "span", children, ...p } = props
   return (
-    <GenericFieldComponent<TResourceKey['ParcelLineItem']>
-      resource='parcelLineItem'
+    <GenericFieldComponent<TResourceKey["ParcelLineItem"]>
+      resource="parcelLineItem"
       attribute={attribute}
       tagElement={tagElement}
       context={ParcelLineItemChildrenContext}
diff --git a/packages/react-components/src/components/parcels/ParcelLineItemsCount.tsx b/packages/react-components/src/components/parcels/ParcelLineItemsCount.tsx
index bc361834..2b3c46cc 100644
--- a/packages/react-components/src/components/parcels/ParcelLineItemsCount.tsx
+++ b/packages/react-components/src/components/parcels/ParcelLineItemsCount.tsx
@@ -1,12 +1,12 @@
-import Parent from '#components/utils/Parent'
-import ParcelChildrenContext from '#context/ParcelChildrenContext'
-import type { ChildrenFunction } from '#typings/index'
-import useCustomContext from '#utils/hooks/useCustomContext'
-import type { Parcel } from '@commercelayer/sdk'
+import Parent from "#components/utils/Parent"
+import ParcelChildrenContext from "#context/ParcelChildrenContext"
+import type { ChildrenFunction } from "#typings/index"
+import useCustomContext from "#utils/hooks/useCustomContext"
+import type { Parcel } from "@commercelayer/sdk"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
-interface ChildrenProps extends Omit<Props, 'children'> {
+interface ChildrenProps extends Omit<Props, "children"> {
   /**
    * Parcel of the current shipment
    */
@@ -17,28 +17,24 @@ interface ChildrenProps extends Omit<Props, 'children'> {
   quantity: number
 }
 
-interface Props extends Omit<JSX.IntrinsicElements['span'], 'children'> {
+interface Props extends Omit<JSX.IntrinsicElements["span"], "children"> {
   children?: ChildrenFunction<ChildrenProps>
 }
 
 export function ParcelLineItemsCount({ children, ...p }: Props): JSX.Element {
   const { parcel } = useCustomContext({
     context: ParcelChildrenContext,
-    contextComponentName: 'Parcels',
-    currentComponentName: 'ParcelLineItemsCount',
-    key: 'parcel'
+    contextComponentName: "Parcels",
+    currentComponentName: "ParcelLineItemsCount",
+    key: "parcel",
   })
   const quantity = parcel?.parcel_line_items?.length ?? 0
   const childrenProps: ChildrenProps = {
     ...p,
     quantity,
-    parcel
+    parcel,
   }
-  return children ? (
-    <Parent {...childrenProps}>{children}</Parent>
-  ) : (
-    <span {...p}>{quantity}</span>
-  )
+  return children ? <Parent {...childrenProps}>{children}</Parent> : <span {...p}>{quantity}</span>
 }
 
 export default ParcelLineItemsCount
diff --git a/packages/react-components/src/components/parcels/Parcels.tsx b/packages/react-components/src/components/parcels/Parcels.tsx
index b5eb3422..a0e6200c 100644
--- a/packages/react-components/src/components/parcels/Parcels.tsx
+++ b/packages/react-components/src/components/parcels/Parcels.tsx
@@ -1,6 +1,6 @@
-import ParcelChildrenContext from '#context/ParcelChildrenContext'
-import ShipmentChildrenContext from '#context/ShipmentChildrenContext'
-import { useContext, type JSX } from 'react';
+import ParcelChildrenContext from "#context/ParcelChildrenContext"
+import ShipmentChildrenContext from "#context/ShipmentChildrenContext"
+import { useContext, type JSX } from "react"
 
 interface Props {
   children: JSX.Element | JSX.Element[]
diff --git a/packages/react-components/src/components/parcels/ParcelsCount.tsx b/packages/react-components/src/components/parcels/ParcelsCount.tsx
index d6645367..9ef3622c 100644
--- a/packages/react-components/src/components/parcels/ParcelsCount.tsx
+++ b/packages/react-components/src/components/parcels/ParcelsCount.tsx
@@ -1,12 +1,12 @@
-import Parent from '#components/utils/Parent'
-import ShipmentChildrenContext from '#context/ShipmentChildrenContext'
-import type { ChildrenFunction } from '#typings/index'
-import useCustomContext from '#utils/hooks/useCustomContext'
-import type { Parcel } from '@commercelayer/sdk'
+import Parent from "#components/utils/Parent"
+import ShipmentChildrenContext from "#context/ShipmentChildrenContext"
+import type { ChildrenFunction } from "#typings/index"
+import useCustomContext from "#utils/hooks/useCustomContext"
+import type { Parcel } from "@commercelayer/sdk"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
-interface ChildrenProps extends Omit<Props, 'children'> {
+interface ChildrenProps extends Omit<Props, "children"> {
   /**
    * Shipments of the current order
    */
@@ -17,28 +17,24 @@ interface ChildrenProps extends Omit<Props, 'children'> {
   quantity: number
 }
 
-interface Props extends Omit<JSX.IntrinsicElements['span'], 'children'> {
+interface Props extends Omit<JSX.IntrinsicElements["span"], "children"> {
   children?: ChildrenFunction<ChildrenProps>
 }
 
 export function ParcelsCount({ children, ...p }: Props): JSX.Element {
   const { parcels } = useCustomContext({
     context: ShipmentChildrenContext,
-    contextComponentName: 'ShipmentsContainer',
-    currentComponentName: 'ParcelsCount',
-    key: 'parcels'
+    contextComponentName: "ShipmentsContainer",
+    currentComponentName: "ParcelsCount",
+    key: "parcels",
   })
   const quantity = parcels?.length ?? 0
   const childrenProps: ChildrenProps = {
     ...p,
     quantity,
-    parcels
+    parcels,
   }
-  return children ? (
-    <Parent {...childrenProps}>{children}</Parent>
-  ) : (
-    <span {...p}>{quantity}</span>
-  )
+  return children ? <Parent {...childrenProps}>{children}</Parent> : <span {...p}>{quantity}</span>
 }
 
 export default ParcelsCount
diff --git a/packages/react-components/src/components/payment_gateways/AdyenGateway.tsx b/packages/react-components/src/components/payment_gateways/AdyenGateway.tsx
index 6240b170..efdf3621 100644
--- a/packages/react-components/src/components/payment_gateways/AdyenGateway.tsx
+++ b/packages/react-components/src/components/payment_gateways/AdyenGateway.tsx
@@ -32,8 +32,7 @@ export function AdyenGateway(props: Props): JSX.Element | null {
   const { accessToken } = useContext(CommerceLayerContext)
   const { payment } = useContext(PaymentMethodChildrenContext)
   const { payments, isGuest } = useContext(CustomerContext)
-  const { currentPaymentMethodId, config, paymentSource } =
-    useContext(PaymentMethodContext)
+  const { currentPaymentMethodId, config, paymentSource } = useContext(PaymentMethodContext)
   const paymentResource: PaymentResource = "adyen_payments"
   const locale = order?.language_code as StripeElementLocale
   if (!readonly && payment?.id !== currentPaymentMethodId) return null
@@ -64,9 +63,7 @@ export function AdyenGateway(props: Props): JSX.Element | null {
     })
     const value = { ...card, showCard, handleEditClick, readonly }
     return isEmpty(card) ? null : (
-      <PaymentSourceContext.Provider value={value}>
-        {children}
-      </PaymentSourceContext.Provider>
+      <PaymentSourceContext.Provider value={value}>{children}</PaymentSourceContext.Provider>
     )
   }
   let hasStoredPaymentMethods =
diff --git a/packages/react-components/src/components/payment_gateways/BraintreeGateway.tsx b/packages/react-components/src/components/payment_gateways/BraintreeGateway.tsx
index cf3bc2d8..a454ae01 100644
--- a/packages/react-components/src/components/payment_gateways/BraintreeGateway.tsx
+++ b/packages/react-components/src/components/payment_gateways/BraintreeGateway.tsx
@@ -1,17 +1,17 @@
-import BraintreePayment from '#components/payment_source/BraintreePayment'
-import type { GatewayBaseType } from '#components/payment_gateways/PaymentGateway'
-import CustomerContext from '#context/CustomerContext'
-import OrderContext from '#context/OrderContext'
-import PaymentMethodChildrenContext from '#context/PaymentMethodChildrenContext'
-import PaymentMethodContext from '#context/PaymentMethodContext'
-import PaymentSourceContext from '#context/PaymentSourceContext'
-import type { PaymentResource } from '#reducers/PaymentMethodReducer'
-import getCardDetails from '#utils/getCardDetails'
-import type { StripeElementLocale } from '@stripe/stripe-js'
-import { isEmpty } from '#utils/isEmpty'
-import { useContext, type JSX } from 'react';
-import PaymentCardsTemplate from '../utils/PaymentCardsTemplate'
-import { getPaymentAttributes } from '#utils/getPaymentAttributes'
+import BraintreePayment from "#components/payment_source/BraintreePayment"
+import type { GatewayBaseType } from "#components/payment_gateways/PaymentGateway"
+import CustomerContext from "#context/CustomerContext"
+import OrderContext from "#context/OrderContext"
+import PaymentMethodChildrenContext from "#context/PaymentMethodChildrenContext"
+import PaymentMethodContext from "#context/PaymentMethodContext"
+import PaymentSourceContext from "#context/PaymentSourceContext"
+import type { PaymentResource } from "#reducers/PaymentMethodReducer"
+import getCardDetails from "#utils/getCardDetails"
+import type { StripeElementLocale } from "@stripe/stripe-js"
+import { isEmpty } from "#utils/isEmpty"
+import { useContext, type JSX } from "react"
+import PaymentCardsTemplate from "../utils/PaymentCardsTemplate"
+import { getPaymentAttributes } from "#utils/getPaymentAttributes"
 
 type Props = GatewayBaseType
 
@@ -30,9 +30,8 @@ export function BraintreeGateway(props: Props): JSX.Element | null {
   const { order } = useContext(OrderContext)
   const { payment } = useContext(PaymentMethodChildrenContext)
   const { payments, isGuest } = useContext(CustomerContext)
-  const { currentPaymentMethodId, config, paymentSource } =
-    useContext(PaymentMethodContext)
-  const paymentResource: PaymentResource = 'braintree_payments'
+  const { currentPaymentMethodId, config, paymentSource } = useContext(PaymentMethodContext)
+  const paymentResource: PaymentResource = "braintree_payments"
   const locale = order?.language_code as StripeElementLocale
 
   if (!readonly && payment?.id !== currentPaymentMethodId) return null
@@ -41,27 +40,25 @@ export function BraintreeGateway(props: Props): JSX.Element | null {
   const braintreeConfig = getPaymentAttributes({
     resource: paymentResource,
     config: config ?? {},
-    keys: ['braintree_payments']
+    keys: ["braintree_payments"],
   })
   const paymentConfig = braintreeConfig?.braintreePayment
   const customerPayments =
     !isEmpty(payments) && payments
       ? payments.filter((customerPayment) => {
-          return customerPayment.payment_source?.type === 'braintree_payments'
+          return customerPayment.payment_source?.type === "braintree_payments"
         })
       : []
   if (readonly || showCard) {
     const card = getCardDetails({
       customerPayment: {
-        payment_source: paymentSource
+        payment_source: paymentSource,
       },
-      paymentType: paymentResource
+      paymentType: paymentResource,
     })
     const value = { ...card, showCard, handleEditClick, readonly }
     return isEmpty(card) ? null : (
-      <PaymentSourceContext.Provider value={value}>
-        {children}
-      </PaymentSourceContext.Provider>
+      <PaymentSourceContext.Provider value={value}>{children}</PaymentSourceContext.Provider>
     )
   }
   if (!isGuest && templateCustomerCards) {
@@ -83,13 +80,7 @@ export function BraintreeGateway(props: Props): JSX.Element | null {
       </>
     )
   }
-  return (
-    <BraintreePayment
-      locale={locale}
-      authorization={authorization}
-      config={paymentConfig}
-    />
-  )
+  return <BraintreePayment locale={locale} authorization={authorization} config={paymentConfig} />
 }
 
 export default BraintreeGateway
diff --git a/packages/react-components/src/components/payment_gateways/CheckoutComGateway.tsx b/packages/react-components/src/components/payment_gateways/CheckoutComGateway.tsx
index 0da033d3..5825d825 100644
--- a/packages/react-components/src/components/payment_gateways/CheckoutComGateway.tsx
+++ b/packages/react-components/src/components/payment_gateways/CheckoutComGateway.tsx
@@ -9,10 +9,7 @@ import OrderContext from "#context/OrderContext"
 import PaymentMethodChildrenContext from "#context/PaymentMethodChildrenContext"
 import PaymentMethodContext from "#context/PaymentMethodContext"
 import PaymentSourceContext from "#context/PaymentSourceContext"
-import {
-  getPaymentConfig,
-  type PaymentResource,
-} from "#reducers/PaymentMethodReducer"
+import { getPaymentConfig, type PaymentResource } from "#reducers/PaymentMethodReducer"
 import getCardDetails from "#utils/getCardDetails"
 
 type Props = GatewayBaseType
@@ -31,8 +28,7 @@ export function CheckoutComGateway(props: Props): JSX.Element | null {
   const { order } = React.useContext(OrderContext)
   const { payment } = React.useContext(PaymentMethodChildrenContext)
   const { payments, isGuest } = React.useContext(CustomerContext)
-  const { currentPaymentMethodId, config, paymentSource } =
-    React.useContext(PaymentMethodContext)
+  const { currentPaymentMethodId, config, paymentSource } = React.useContext(PaymentMethodContext)
   const paymentResource: PaymentResource = "checkout_com_payments"
   const locale = order?.language_code as StripeElementLocale
 
@@ -57,9 +53,7 @@ export function CheckoutComGateway(props: Props): JSX.Element | null {
     })
     const value = { ...card, showCard, handleEditClick, readonly }
     return !card.brand ? null : (
-      <PaymentSourceContext.Provider value={value}>
-        {children}
-      </PaymentSourceContext.Provider>
+      <PaymentSourceContext.Provider value={value}>{children}</PaymentSourceContext.Provider>
     )
   }
   if (!isGuest && templateCustomerCards) {
@@ -83,14 +77,7 @@ export function CheckoutComGateway(props: Props): JSX.Element | null {
     )
   }
 
-  return (
-    <CheckoutComPayment
-      show={show}
-      publicKey={publicKey}
-      locale={locale}
-      {...paymentConfig}
-    />
-  )
+  return <CheckoutComPayment show={show} publicKey={publicKey} locale={locale} {...paymentConfig} />
 }
 
 export default CheckoutComGateway
diff --git a/packages/react-components/src/components/payment_gateways/ExternalGateway.tsx b/packages/react-components/src/components/payment_gateways/ExternalGateway.tsx
index 7fb5023f..5bf718fd 100644
--- a/packages/react-components/src/components/payment_gateways/ExternalGateway.tsx
+++ b/packages/react-components/src/components/payment_gateways/ExternalGateway.tsx
@@ -5,10 +5,7 @@ import OrderContext from "#context/OrderContext"
 import PaymentMethodChildrenContext from "#context/PaymentMethodChildrenContext"
 import PaymentMethodContext from "#context/PaymentMethodContext"
 import PaymentSourceContext from "#context/PaymentSourceContext"
-import {
-  getPaymentConfig,
-  type PaymentResource,
-} from "#reducers/PaymentMethodReducer"
+import { getPaymentConfig, type PaymentResource } from "#reducers/PaymentMethodReducer"
 import getCardDetails from "#utils/getCardDetails"
 import type { StripeElementLocale } from "@stripe/stripe-js"
 import { isEmpty } from "#utils/isEmpty"
@@ -33,17 +30,14 @@ export function ExternalGateway(props: Props): JSX.Element | null {
   const { order } = React.useContext(OrderContext)
   const { payment } = React.useContext(PaymentMethodChildrenContext)
   const { payments, isGuest } = React.useContext(CustomerContext)
-  const { currentPaymentMethodId, config, paymentSource } =
-    React.useContext(PaymentMethodContext)
+  const { currentPaymentMethodId, config, paymentSource } = React.useContext(PaymentMethodContext)
   const paymentResource: PaymentResource = "external_payments"
   const locale = order?.language_code as StripeElementLocale
 
   if (!readonly && payment?.id !== currentPaymentMethodId) return null
   // @ts-expect-error no type
   const paymentSourceToken = paymentSource?.payment_source_token
-  const getConfig = config
-    ? getPaymentConfig<"external_payments">(paymentResource, config)
-    : {}
+  const getConfig = config ? getPaymentConfig<"external_payments">(paymentResource, config) : {}
   const paymentConfig = getConfig?.externalPayment
   const customerPayments =
     !isEmpty(payments) && payments
@@ -61,9 +55,7 @@ export function ExternalGateway(props: Props): JSX.Element | null {
     })
     const value = { ...card, showCard, handleEditClick, readonly }
     return isEmpty(card) ? null : (
-      <PaymentSourceContext.Provider value={value}>
-        {children}
-      </PaymentSourceContext.Provider>
+      <PaymentSourceContext.Provider value={value}>{children}</PaymentSourceContext.Provider>
     )
   }
   if (!isGuest && templateCustomerCards) {
diff --git a/packages/react-components/src/components/payment_gateways/KlarnaGateway.tsx b/packages/react-components/src/components/payment_gateways/KlarnaGateway.tsx
index de4c1f5f..2f89a8da 100644
--- a/packages/react-components/src/components/payment_gateways/KlarnaGateway.tsx
+++ b/packages/react-components/src/components/payment_gateways/KlarnaGateway.tsx
@@ -1,18 +1,15 @@
-import React, { type JSX } from 'react';
-import KlarnaPayment from '#components/payment_source/KlarnaPayment'
-import type { GatewayBaseType } from '#components/payment_gateways/PaymentGateway'
-import CustomerContext from '#context/CustomerContext'
-import OrderContext from '#context/OrderContext'
-import PaymentMethodChildrenContext from '#context/PaymentMethodChildrenContext'
-import PaymentMethodContext from '#context/PaymentMethodContext'
-import PaymentSourceContext from '#context/PaymentSourceContext'
-import {
-  getPaymentConfig,
-  type PaymentResource
-} from '#reducers/PaymentMethodReducer'
-import { isEmpty } from '#utils/isEmpty'
-import PaymentCardsTemplate from '#components/utils/PaymentCardsTemplate'
-import getCardDetails from '#utils/getCardDetails'
+import React, { type JSX } from "react"
+import KlarnaPayment from "#components/payment_source/KlarnaPayment"
+import type { GatewayBaseType } from "#components/payment_gateways/PaymentGateway"
+import CustomerContext from "#context/CustomerContext"
+import OrderContext from "#context/OrderContext"
+import PaymentMethodChildrenContext from "#context/PaymentMethodChildrenContext"
+import PaymentMethodContext from "#context/PaymentMethodContext"
+import PaymentSourceContext from "#context/PaymentSourceContext"
+import { getPaymentConfig, type PaymentResource } from "#reducers/PaymentMethodReducer"
+import { isEmpty } from "#utils/isEmpty"
+import PaymentCardsTemplate from "#components/utils/PaymentCardsTemplate"
+import getCardDetails from "#utils/getCardDetails"
 
 type Props = GatewayBaseType
 
@@ -30,17 +27,14 @@ export function KlarnaGateway(props: Props): JSX.Element | null {
   const { order } = React.useContext(OrderContext)
   const { payment } = React.useContext(PaymentMethodChildrenContext)
   const { payments, isGuest } = React.useContext(CustomerContext)
-  const { currentPaymentMethodId, config, paymentSource } =
-    React.useContext(PaymentMethodContext)
-  const paymentResource: PaymentResource = 'klarna_payments'
+  const { currentPaymentMethodId, config, paymentSource } = React.useContext(PaymentMethodContext)
+  const paymentResource: PaymentResource = "klarna_payments"
   const locale = order?.language_code
 
   if (!readonly && payment?.id !== currentPaymentMethodId) return null
   // @ts-expect-error no type
   const clientToken = paymentSource?.client_token
-  const klarnaConfig = config
-    ? getPaymentConfig<'klarna_payments'>(paymentResource, config)
-    : {}
+  const klarnaConfig = config ? getPaymentConfig<"klarna_payments">(paymentResource, config) : {}
   const customerPayments =
     !isEmpty(payments) && payments
       ? payments.filter((customerPayment) => {
@@ -51,15 +45,13 @@ export function KlarnaGateway(props: Props): JSX.Element | null {
   if (readonly || showCard) {
     const card = getCardDetails({
       customerPayment: {
-        payment_source: paymentSource
+        payment_source: paymentSource,
       },
-      paymentType: paymentResource
+      paymentType: paymentResource,
     })
     const value = { ...card, showCard, handleEditClick, readonly }
     return isEmpty(card) ? null : (
-      <PaymentSourceContext.Provider value={value}>
-        {children}
-      </PaymentSourceContext.Provider>
+      <PaymentSourceContext.Provider value={value}>{children}</PaymentSourceContext.Provider>
     )
   }
   if (!isGuest && templateCustomerCards) {
@@ -72,22 +64,12 @@ export function KlarnaGateway(props: Props): JSX.Element | null {
             </PaymentCardsTemplate>
           </div>
         )}
-        <KlarnaPayment
-          clientToken={clientToken}
-          locale={locale}
-          {...klarnaConfig}
-        />
+        <KlarnaPayment clientToken={clientToken} locale={locale} {...klarnaConfig} />
       </>
     )
   }
 
-  return (
-    <KlarnaPayment
-      clientToken={clientToken}
-      locale={locale}
-      {...klarnaConfig}
-    />
-  )
+  return <KlarnaPayment clientToken={clientToken} locale={locale} {...klarnaConfig} />
 }
 
 export default KlarnaGateway
diff --git a/packages/react-components/src/components/payment_gateways/PaymentGateway.tsx b/packages/react-components/src/components/payment_gateways/PaymentGateway.tsx
index aa9f7fae..d0363fdc 100644
--- a/packages/react-components/src/components/payment_gateways/PaymentGateway.tsx
+++ b/packages/react-components/src/components/payment_gateways/PaymentGateway.tsx
@@ -98,8 +98,7 @@ export function PaymentGateway({
           })
         }
         if (
-          ((errors != null && errors?.length > 0) ||
-            order?.payment_source === null) &&
+          ((errors != null && errors?.length > 0) || order?.payment_source === null) &&
           paymentMethods &&
           paymentMethods?.length === 1
         ) {
@@ -111,16 +110,10 @@ export function PaymentGateway({
         }
         if (getCustomerPaymentSources) getCustomerPaymentSources()
       }
-      if (
-        !paymentSource &&
-        order?.payment_method.id &&
-        show &&
-        !expressPayments
-      ) {
+      if (!paymentSource && order?.payment_method.id && show && !expressPayments) {
         setPaymentSources()
       } else if (
-        ((!paymentSource && !expressPayments) ||
-          paymentSource?.type !== paymentResource) &&
+        ((!paymentSource && !expressPayments) || paymentSource?.type !== paymentResource) &&
         show
       ) {
         setPaymentSources()
@@ -182,9 +175,7 @@ export function PaymentGateway({
     case "braintree_payments":
       return <BraintreeGateway {...gatewayConfig}>{children}</BraintreeGateway>
     case "checkout_com_payments":
-      return (
-        <CheckoutComGateway {...gatewayConfig}>{children}</CheckoutComGateway>
-      )
+      return <CheckoutComGateway {...gatewayConfig}>{children}</CheckoutComGateway>
     case "external_payments":
       return <ExternalGateway {...gatewayConfig}>{children}</ExternalGateway>
     case "klarna_payments":
@@ -192,9 +183,7 @@ export function PaymentGateway({
     case "stripe_payments":
       return <StripeGateway {...gatewayConfig}>{children}</StripeGateway>
     case "wire_transfers":
-      return (
-        <WireTransferGateway {...gatewayConfig}>{children}</WireTransferGateway>
-      )
+      return <WireTransferGateway {...gatewayConfig}>{children}</WireTransferGateway>
     case "paypal_payments":
       return <PaypalGateway {...gatewayConfig}>{children}</PaypalGateway>
     default:
diff --git a/packages/react-components/src/components/payment_gateways/PaypalGateway.tsx b/packages/react-components/src/components/payment_gateways/PaypalGateway.tsx
index 1640c997..fbcd94d9 100644
--- a/packages/react-components/src/components/payment_gateways/PaypalGateway.tsx
+++ b/packages/react-components/src/components/payment_gateways/PaypalGateway.tsx
@@ -1,14 +1,14 @@
-import type { GatewayBaseType } from '#components/payment_gateways/PaymentGateway'
-import PaypalPayment from '#components/payment_source/PaypalPayment'
-import OrderContext from '#context/OrderContext'
-import PaymentMethodChildrenContext from '#context/PaymentMethodChildrenContext'
-import PaymentMethodContext from '#context/PaymentMethodContext'
-import PaymentSourceContext from '#context/PaymentSourceContext'
-import type { PaymentResource } from '#reducers/PaymentMethodReducer'
-import getCardDetails from '#utils/getCardDetails'
-import { getPaymentAttributes } from '#utils/getPaymentAttributes'
-import { isEmpty } from '#utils/isEmpty'
-import { useContext, type JSX } from 'react';
+import type { GatewayBaseType } from "#components/payment_gateways/PaymentGateway"
+import PaypalPayment from "#components/payment_source/PaypalPayment"
+import OrderContext from "#context/OrderContext"
+import PaymentMethodChildrenContext from "#context/PaymentMethodChildrenContext"
+import PaymentMethodContext from "#context/PaymentMethodContext"
+import PaymentSourceContext from "#context/PaymentSourceContext"
+import type { PaymentResource } from "#reducers/PaymentMethodReducer"
+import getCardDetails from "#utils/getCardDetails"
+import { getPaymentAttributes } from "#utils/getPaymentAttributes"
+import { isEmpty } from "#utils/isEmpty"
+import { useContext, type JSX } from "react"
 
 type Props = Partial<GatewayBaseType>
 
@@ -16,29 +16,26 @@ export function PaypalGateway(props: Props): JSX.Element | null {
   const { readonly, showCard, handleEditClick, children, ...p } = props
   const { order } = useContext(OrderContext)
   const { payment } = useContext(PaymentMethodChildrenContext)
-  const { currentPaymentMethodId, config, paymentSource } =
-    useContext(PaymentMethodContext)
-  const paymentResource: PaymentResource = 'paypal_payments'
+  const { currentPaymentMethodId, config, paymentSource } = useContext(PaymentMethodContext)
+  const paymentResource: PaymentResource = "paypal_payments"
 
   if (!readonly && payment?.id !== currentPaymentMethodId) return null
   if (readonly) {
     const card = getCardDetails({
       customerPayment: {
-        payment_source: order?.payment_source || paymentSource
+        payment_source: order?.payment_source || paymentSource,
       },
-      paymentType: paymentResource
+      paymentType: paymentResource,
     })
     const value = { ...card, showCard, handleEditClick, readonly }
     return isEmpty(card) ? null : (
-      <PaymentSourceContext.Provider value={value}>
-        {children}
-      </PaymentSourceContext.Provider>
+      <PaymentSourceContext.Provider value={value}>{children}</PaymentSourceContext.Provider>
     )
   }
   const attributes = getPaymentAttributes({
     resource: paymentResource,
     config: config ?? {},
-    keys: ['paypal_payments']
+    keys: ["paypal_payments"],
   })
   const infoMessage = attributes?.paypalPayment?.infoMessage
   delete p.show
diff --git a/packages/react-components/src/components/payment_gateways/StripeGateway.tsx b/packages/react-components/src/components/payment_gateways/StripeGateway.tsx
index 37f210b4..a4eee7e2 100644
--- a/packages/react-components/src/components/payment_gateways/StripeGateway.tsx
+++ b/packages/react-components/src/components/payment_gateways/StripeGateway.tsx
@@ -8,10 +8,7 @@ import OrderContext from "#context/OrderContext"
 import PaymentMethodChildrenContext from "#context/PaymentMethodChildrenContext"
 import PaymentMethodContext from "#context/PaymentMethodContext"
 import PaymentSourceContext from "#context/PaymentSourceContext"
-import {
-  getPaymentConfig,
-  type PaymentResource,
-} from "#reducers/PaymentMethodReducer"
+import { getPaymentConfig, type PaymentResource } from "#reducers/PaymentMethodReducer"
 import getCardDetails from "#utils/getCardDetails"
 import PaymentCardsTemplate from "../utils/PaymentCardsTemplate"
 
@@ -31,8 +28,7 @@ export function StripeGateway(props: Props): JSX.Element | null {
   const { order } = useContext(OrderContext)
   const { payment, expressPayments } = useContext(PaymentMethodChildrenContext)
   const { payments, isGuest } = useContext(CustomerContext)
-  const { currentPaymentMethodId, config, paymentSource } =
-    useContext(PaymentMethodContext)
+  const { currentPaymentMethodId, config, paymentSource } = useContext(PaymentMethodContext)
   const paymentResource: PaymentResource = "stripe_payments"
   const locale = order?.language_code as StripeElementLocale
 
@@ -72,9 +68,7 @@ export function StripeGateway(props: Props): JSX.Element | null {
       paymentSource,
     }
     return card?.brand == null ? null : (
-      <PaymentSourceContext.Provider value={value}>
-        {children}
-      </PaymentSourceContext.Provider>
+      <PaymentSourceContext.Provider value={value}>{children}</PaymentSourceContext.Provider>
     )
   }
   if (!isGuest && templateCustomerCards) {
diff --git a/packages/react-components/src/components/payment_gateways/WireTransferGateway.tsx b/packages/react-components/src/components/payment_gateways/WireTransferGateway.tsx
index 9214d0ff..6a3c0d33 100644
--- a/packages/react-components/src/components/payment_gateways/WireTransferGateway.tsx
+++ b/packages/react-components/src/components/payment_gateways/WireTransferGateway.tsx
@@ -1,16 +1,13 @@
-import type { GatewayBaseType } from '#components/payment_gateways/PaymentGateway'
-import WireTransferPayment from '#components/payment_source/WireTransferPayment'
-import OrderContext from '#context/OrderContext'
-import PaymentMethodChildrenContext from '#context/PaymentMethodChildrenContext'
-import PaymentMethodContext from '#context/PaymentMethodContext'
-import PaymentSourceContext from '#context/PaymentSourceContext'
-import {
-  getPaymentConfig,
-  type PaymentResource
-} from '#reducers/PaymentMethodReducer'
-import getCardDetails from '#utils/getCardDetails'
-import { isEmpty } from '#utils/isEmpty'
-import { useContext, type JSX } from 'react';
+import type { GatewayBaseType } from "#components/payment_gateways/PaymentGateway"
+import WireTransferPayment from "#components/payment_source/WireTransferPayment"
+import OrderContext from "#context/OrderContext"
+import PaymentMethodChildrenContext from "#context/PaymentMethodChildrenContext"
+import PaymentMethodContext from "#context/PaymentMethodContext"
+import PaymentSourceContext from "#context/PaymentSourceContext"
+import { getPaymentConfig, type PaymentResource } from "#reducers/PaymentMethodReducer"
+import getCardDetails from "#utils/getCardDetails"
+import { isEmpty } from "#utils/isEmpty"
+import { useContext, type JSX } from "react"
 
 type Props = GatewayBaseType
 
@@ -18,29 +15,24 @@ export function WireTransferGateway(props: Props): JSX.Element | null {
   const { readonly, showCard, handleEditClick, children, ...p } = props
   const { payment } = useContext(PaymentMethodChildrenContext)
   const { order } = useContext(OrderContext)
-  const { currentPaymentMethodId, config, paymentSource } =
-    useContext(PaymentMethodContext)
-  const paymentResource: PaymentResource = 'wire_transfers'
+  const { currentPaymentMethodId, config, paymentSource } = useContext(PaymentMethodContext)
+  const paymentResource: PaymentResource = "wire_transfers"
 
   if (!readonly && payment?.id !== currentPaymentMethodId) return null
   if (readonly) {
     const card = getCardDetails({
       customerPayment: {
-        payment_source: order?.payment_source || paymentSource
+        payment_source: order?.payment_source || paymentSource,
       },
-      paymentType: paymentResource
+      paymentType: paymentResource,
     })
     const value = { ...card, showCard, handleEditClick, readonly }
     return isEmpty(card) ? null : (
-      <PaymentSourceContext.Provider value={value}>
-        {children}
-      </PaymentSourceContext.Provider>
+      <PaymentSourceContext.Provider value={value}>{children}</PaymentSourceContext.Provider>
     )
   }
   const wireTransferConfig =
-    config && paymentResource
-      ? getPaymentConfig<'wire_transfers'>(paymentResource, config)
-      : {}
+    config && paymentResource ? getPaymentConfig<"wire_transfers">(paymentResource, config) : {}
   return <WireTransferPayment {...p} {...wireTransferConfig?.wireTransfer} />
 }
 
diff --git a/packages/react-components/src/components/payment_methods/PaymentMethod.tsx b/packages/react-components/src/components/payment_methods/PaymentMethod.tsx
index 5820843d..5243a920 100644
--- a/packages/react-components/src/components/payment_methods/PaymentMethod.tsx
+++ b/packages/react-components/src/components/payment_methods/PaymentMethod.tsx
@@ -1,14 +1,5 @@
-import type {
-  Order,
-  PaymentMethod as PaymentMethodType,
-} from "@commercelayer/sdk"
-import {
-  type JSX,
-  type MouseEvent,
-  useContext,
-  useEffect,
-  useState,
-} from "react"
+import type { Order, PaymentMethod as PaymentMethodType } from "@commercelayer/sdk"
+import { type JSX, type MouseEvent, useContext, useEffect, useState } from "react"
 import CustomerContext from "#context/CustomerContext"
 import OrderContext from "#context/OrderContext"
 import PaymentMethodChildrenContext from "#context/PaymentMethodChildrenContext"
@@ -122,8 +113,7 @@ export function PaymentMethod({
           setLoadingPlaceOrder({ loading: true })
           setPaymentSelected(paymentMethod.id)
           const paymentMethodId = paymentMethod?.id
-          const paymentResource =
-            paymentMethod?.payment_source_type as PaymentResource
+          const paymentResource = paymentMethod?.payment_source_type as PaymentResource
           await setPaymentMethod({ paymentResource, paymentMethodId })
           const ps = await setPaymentSource({
             paymentResource,
@@ -166,23 +156,16 @@ export function PaymentMethod({
               setLoadingPlaceOrder({ loading: true })
               setPaymentSelected(paymentMethod.id)
               const paymentMethodId = paymentMethod?.id
-              const paymentResource =
-                paymentMethod?.payment_source_type as PaymentResource
+              const paymentResource = paymentMethod?.payment_source_type as PaymentResource
               await setPaymentMethod({ paymentResource, paymentMethodId })
               let attributes: Record<string, unknown> | undefined = {}
               if (config != null && paymentResource === "paypal_payments") {
                 attributes = getPaypalAttributes(paymentResource, config)
               }
               if (config != null && paymentResource === "external_payments") {
-                attributes = getExternalPaymentAttributes(
-                  paymentResource,
-                  config,
-                )
+                attributes = getExternalPaymentAttributes(paymentResource, config)
               }
-              if (
-                config != null &&
-                paymentResource === "checkout_com_payments"
-              ) {
+              if (config != null && paymentResource === "checkout_com_payments") {
                 attributes = getCkoAttributes(paymentResource, config)
               }
               const ps = await setPaymentSource({
@@ -211,11 +194,7 @@ export function PaymentMethod({
             }
           } else {
             setTimeout(() => {
-              if (
-                showLoader &&
-                errors?.length === 0 &&
-                paymentSourceStatus !== "declined"
-              ) {
+              if (showLoader && errors?.length === 0 && paymentSourceStatus !== "declined") {
                 setLoading(showLoader)
               } else {
                 setLoading(false)
@@ -237,11 +216,7 @@ export function PaymentMethod({
       if (isSingle && autoSelectSinglePaymentMethod) {
         if (paymentSource) {
           setTimeout(() => {
-            if (
-              showLoader &&
-              errors?.length === 0 &&
-              paymentSourceStatus !== "declined"
-            ) {
+            if (showLoader && errors?.length === 0 && paymentSourceStatus !== "declined") {
               setLoading(showLoader)
             } else {
               setLoading(false)
@@ -249,11 +224,7 @@ export function PaymentMethod({
           }, 200)
         }
       } else {
-        if (
-          showLoader &&
-          errors?.length === 0 &&
-          paymentSourceStatus !== "declined"
-        ) {
+        if (showLoader && errors?.length === 0 && paymentSourceStatus !== "declined") {
           setLoading(showLoader)
         } else {
           setLoading(false)
@@ -329,9 +300,7 @@ export function PaymentMethod({
         <div
           data-testid={paymentResource}
           key={paymentResource}
-          className={`${className ?? ""} ${
-            isActive && activeClass != null ? activeClass : ""
-          }`}
+          className={`${className ?? ""} ${isActive && activeClass != null ? activeClass : ""}`}
           onClick={(e) => {
             if (onClickable != null) {
               onClickable(e)
diff --git a/packages/react-components/src/components/payment_methods/PaymentMethodName.tsx b/packages/react-components/src/components/payment_methods/PaymentMethodName.tsx
index 15f2c381..29b122fe 100644
--- a/packages/react-components/src/components/payment_methods/PaymentMethodName.tsx
+++ b/packages/react-components/src/components/payment_methods/PaymentMethodName.tsx
@@ -1,24 +1,24 @@
-import PaymentMethodChildrenContext from '#context/PaymentMethodChildrenContext'
-import Parent from '#components/utils/Parent'
-import useCustomContext from '#utils/hooks/useCustomContext'
-import type { ChildrenFunction } from '#typings/index'
+import PaymentMethodChildrenContext from "#context/PaymentMethodChildrenContext"
+import Parent from "#components/utils/Parent"
+import useCustomContext from "#utils/hooks/useCustomContext"
+import type { ChildrenFunction } from "#typings/index"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
-interface ChildrenProps extends Omit<Props, 'children'> {
+interface ChildrenProps extends Omit<Props, "children"> {
   labelName: string
 }
 
-interface Props extends Omit<JSX.IntrinsicElements['label'], 'children'> {
+interface Props extends Omit<JSX.IntrinsicElements["label"], "children"> {
   children?: ChildrenFunction<ChildrenProps>
 }
 
 export function PaymentMethodName(props: Props): JSX.Element {
   const { payment } = useCustomContext({
     context: PaymentMethodChildrenContext,
-    contextComponentName: 'PaymentMethod',
-    currentComponentName: 'PaymentMethodName',
-    key: 'payment'
+    contextComponentName: "PaymentMethod",
+    currentComponentName: "PaymentMethodName",
+    key: "payment",
   })
   const labelName = payment?.name
   const htmlFor = payment?.payment_source_type
@@ -27,7 +27,7 @@ export function PaymentMethodName(props: Props): JSX.Element {
     htmlFor,
     labelName,
     paymentGateway,
-    ...props
+    ...props,
   }
   return props.children ? (
     <Parent {...parentProps}>{props.children}</Parent>
diff --git a/packages/react-components/src/components/payment_methods/PaymentMethodPrice.tsx b/packages/react-components/src/components/payment_methods/PaymentMethodPrice.tsx
index 3240fab5..919cf053 100644
--- a/packages/react-components/src/components/payment_methods/PaymentMethodPrice.tsx
+++ b/packages/react-components/src/components/payment_methods/PaymentMethodPrice.tsx
@@ -1,44 +1,39 @@
-import { useState, useEffect, type JSX } from 'react';
-import getAmount from '#utils/getAmount'
-import PaymentMethodChildrenContext from '#context/PaymentMethodChildrenContext'
-import Parent from '#components/utils/Parent'
-import type { BaseAmountComponent } from '#typings/index'
-import useCustomContext from '#utils/hooks/useCustomContext'
+import { useState, useEffect, type JSX } from "react"
+import getAmount from "#utils/getAmount"
+import PaymentMethodChildrenContext from "#context/PaymentMethodChildrenContext"
+import Parent from "#components/utils/Parent"
+import type { BaseAmountComponent } from "#typings/index"
+import useCustomContext from "#utils/hooks/useCustomContext"
 
 interface Props extends BaseAmountComponent {
-  type?: 'amount'
+  type?: "amount"
   labelFree?: string
 }
 
 export function PaymentMethodPrice(props: Props): JSX.Element {
-  const {
-    format = 'formatted',
-    type = 'amount',
-    labelFree = 'Free',
-    ...p
-  } = props
+  const { format = "formatted", type = "amount", labelFree = "Free", ...p } = props
   const { payment } = useCustomContext({
     context: PaymentMethodChildrenContext,
-    contextComponentName: 'PaymentMethod',
-    currentComponentName: 'PaymentMethodPrice',
-    key: 'payment'
+    contextComponentName: "PaymentMethod",
+    currentComponentName: "PaymentMethodPrice",
+    key: "payment",
   })
-  const [price, setPrice] = useState('')
+  const [price, setPrice] = useState("")
   const [priceCents, setPriceCents] = useState(0)
   useEffect(() => {
     if (payment) {
-      const p = getAmount({ base: 'price', type, format, obj: payment })
+      const p = getAmount({ base: "price", type, format, obj: payment })
       setPrice(p)
       const c = getAmount<number>({
-        base: 'price',
+        base: "price",
         type,
-        format: 'cents',
-        obj: payment
+        format: "cents",
+        obj: payment,
       })
       setPriceCents(c)
     }
     return (): void => {
-      setPrice('')
+      setPrice("")
       setPriceCents(0)
     }
   }, [payment])
@@ -46,7 +41,7 @@ export function PaymentMethodPrice(props: Props): JSX.Element {
     labelFree,
     price,
     priceCents,
-    ...p
+    ...p,
   }
   return props.children ? (
     <Parent {...parentProps}>{props.children}</Parent>
diff --git a/packages/react-components/src/components/payment_methods/PaymentMethodRadioButton.tsx b/packages/react-components/src/components/payment_methods/PaymentMethodRadioButton.tsx
index 435c98a9..aafa315b 100644
--- a/packages/react-components/src/components/payment_methods/PaymentMethodRadioButton.tsx
+++ b/packages/react-components/src/components/payment_methods/PaymentMethodRadioButton.tsx
@@ -1,15 +1,15 @@
-import { useContext, useEffect, useState, type ChangeEvent, type JSX } from 'react';
-import PaymentMethodChildrenContext from '#context/PaymentMethodChildrenContext'
-import Parent from '#components/utils/Parent'
-import PaymentMethodContext from '#context/PaymentMethodContext'
-import type { Order, PaymentMethod } from '@commercelayer/sdk'
-import type { PaymentResource } from '#reducers/PaymentMethodReducer'
-import OrderContext from '#context/OrderContext'
-import useCustomContext from '#utils/hooks/useCustomContext'
-import type { ChildrenFunction } from '#typings/index'
-import PlaceOrderContext from '#context/PlaceOrderContext'
+import { useContext, useEffect, useState, type ChangeEvent, type JSX } from "react"
+import PaymentMethodChildrenContext from "#context/PaymentMethodChildrenContext"
+import Parent from "#components/utils/Parent"
+import PaymentMethodContext from "#context/PaymentMethodContext"
+import type { Order, PaymentMethod } from "@commercelayer/sdk"
+import type { PaymentResource } from "#reducers/PaymentMethodReducer"
+import OrderContext from "#context/OrderContext"
+import useCustomContext from "#utils/hooks/useCustomContext"
+import type { ChildrenFunction } from "#typings/index"
+import PlaceOrderContext from "#context/PlaceOrderContext"
 
-interface ChildrenProps extends Omit<Props, 'children'> {
+interface ChildrenProps extends Omit<Props, "children"> {
   checked: boolean
   handleOnChange: (event: ChangeEvent<HTMLInputElement>) => Promise<void>
 }
@@ -22,37 +22,34 @@ interface TOnChangeParams {
 type Props = {
   children?: ChildrenFunction<ChildrenProps>
   onChange?: (params: TOnChangeParams) => void
-} & JSX.IntrinsicElements['input']
+} & JSX.IntrinsicElements["input"]
 
 export function PaymentMethodRadioButton(props: Props): JSX.Element {
   const { onChange, ...p } = props
-  const { payment, paymentSelected, setPaymentSelected, clickableContainer } =
-    useCustomContext({
-      context: PaymentMethodChildrenContext,
-      contextComponentName: 'PaymentMethod',
-      currentComponentName: 'PaymentMethodRadioButton',
-      key: 'payment'
-    })
+  const { payment, paymentSelected, setPaymentSelected, clickableContainer } = useCustomContext({
+    context: PaymentMethodChildrenContext,
+    contextComponentName: "PaymentMethod",
+    currentComponentName: "PaymentMethodRadioButton",
+    key: "payment",
+  })
   const { order } = useContext(OrderContext)
   const { setPaymentMethod, setLoading } = useContext(PaymentMethodContext)
   const { status } = useContext(PlaceOrderContext)
   const [disabled, setDisabled] = useState(false)
-  const orderId = order?.id || ''
+  const orderId = order?.id || ""
   const paymentResource = payment?.payment_source_type as PaymentResource
-  const paymentMethodId = payment?.id ?? ''
+  const paymentMethodId = payment?.id ?? ""
   const name = `payment-${orderId}`
   const checked = paymentSelected === payment?.id
   useEffect(() => {
-    if (status === 'placing') {
+    if (status === "placing") {
       setDisabled(true)
     } else {
       setDisabled(false)
     }
   }, [status])
 
-  const handleOnChange = async (
-    e: ChangeEvent<HTMLInputElement>
-  ): Promise<void> => {
+  const handleOnChange = async (e: ChangeEvent<HTMLInputElement>): Promise<void> => {
     e.stopPropagation()
     if (checked) return
     if (setPaymentSelected) setPaymentSelected(paymentMethodId)
@@ -60,7 +57,7 @@ export function PaymentMethodRadioButton(props: Props): JSX.Element {
     if (!clickableContainer) {
       const { order } = await setPaymentMethod({
         paymentResource,
-        paymentMethodId
+        paymentMethodId,
       })
       if (onChange) onChange({ payment, order })
     }
@@ -73,14 +70,14 @@ export function PaymentMethodRadioButton(props: Props): JSX.Element {
     id,
     name,
     disabled,
-    ...props
+    ...props,
   }
   return props.children ? (
     <Parent {...parentProps}>{props.children}</Parent>
   ) : (
     <input
       title={name}
-      type='radio'
+      type="radio"
       id={id}
       onChange={(e) => {
         handleOnChange(e)
diff --git a/packages/react-components/src/components/payment_methods/PaymentMethodsContainer.tsx b/packages/react-components/src/components/payment_methods/PaymentMethodsContainer.tsx
index fe624856..97579655 100644
--- a/packages/react-components/src/components/payment_methods/PaymentMethodsContainer.tsx
+++ b/packages/react-components/src/components/payment_methods/PaymentMethodsContainer.tsx
@@ -1,16 +1,7 @@
-import {
-  type JSX,
-  type ReactNode,
-  useContext,
-  useEffect,
-  useMemo,
-  useReducer,
-} from "react"
+import { type JSX, type ReactNode, useContext, useEffect, useMemo, useReducer } from "react"
 import CommerceLayerContext from "#context/CommerceLayerContext"
 import OrderContext from "#context/OrderContext"
-import PaymentMethodContext, {
-  defaultPaymentMethodContext,
-} from "#context/PaymentMethodContext"
+import PaymentMethodContext, { defaultPaymentMethodContext } from "#context/PaymentMethodContext"
 import paymentMethodReducer, {
   getPaymentMethods,
   type PaymentMethodConfig,
@@ -36,10 +27,7 @@ interface Props {
 }
 export function PaymentMethodsContainer(props: Props): JSX.Element {
   const { children, config } = props
-  const [state, dispatch] = useReducer(
-    paymentMethodReducer,
-    paymentMethodInitialState,
-  )
+  const [state, dispatch] = useReducer(paymentMethodReducer, paymentMethodInitialState)
   const {
     order,
     getOrder,
@@ -80,8 +68,7 @@ export function PaymentMethodsContainer(props: Props): JSX.Element {
         },
       })
     }
-    if (config && isEmpty(state.config))
-      setPaymentMethodConfig(config, dispatch)
+    if (config && isEmpty(state.config)) setPaymentMethodConfig(config, dispatch)
     if (credentials && order && !state.paymentMethods) {
       getPayMethods()
     }
@@ -103,12 +90,7 @@ export function PaymentMethodsContainer(props: Props): JSX.Element {
     ) {
       getOrder(order.id)
     }
-  }, [
-    order,
-    credentials,
-    include?.length,
-    Object.keys(includeLoaded ?? []).length,
-  ])
+  }, [order, credentials, include?.length, Object.keys(includeLoaded ?? []).length])
   const contextValue = useMemo(() => {
     return {
       ...state,
@@ -159,9 +141,7 @@ export function PaymentMethodsContainer(props: Props): JSX.Element {
     }
   }, [state])
   return (
-    <PaymentMethodContext.Provider value={contextValue}>
-      {children}
-    </PaymentMethodContext.Provider>
+    <PaymentMethodContext.Provider value={contextValue}>{children}</PaymentMethodContext.Provider>
   )
 }
 
diff --git a/packages/react-components/src/components/payment_source/AdyenPayment.tsx b/packages/react-components/src/components/payment_source/AdyenPayment.tsx
index 55473ce5..9163ad8c 100644
--- a/packages/react-components/src/components/payment_source/AdyenPayment.tsx
+++ b/packages/react-components/src/components/payment_source/AdyenPayment.tsx
@@ -14,18 +14,8 @@ import {
   type UIElement,
   type UIElementProps,
 } from "@adyen/adyen-web/auto"
-import type {
-  AdyenPayment as AdyenPaymentType,
-  Order,
-} from "@commercelayer/sdk"
-import {
-  type FormEvent,
-  type JSX,
-  useContext,
-  useEffect,
-  useRef,
-  useState,
-} from "react"
+import type { AdyenPayment as AdyenPaymentType, Order } from "@commercelayer/sdk"
+import { type FormEvent, type JSX, useContext, useEffect, useRef, useState } from "react"
 import Parent from "#components/utils/Parent"
 import CommerceLayerContext from "#context/CommerceLayerContext"
 import CustomerContext from "#context/CustomerContext"
@@ -43,13 +33,7 @@ interface PaymentMethodsStyle {
   paypal?: PayPalConfiguration["style"]
 }
 
-type PaymentMethodType =
-  | "scheme"
-  | "giftcard"
-  | "paypal"
-  | "applepay"
-  | "googlepay"
-  | (string & {})
+type PaymentMethodType = "scheme" | "giftcard" | "paypal" | "applepay" | "googlepay" | (string & {})
 
 /**
  * Configuration options for the Adyen payment component.
@@ -143,9 +127,7 @@ export function AdyenPayment({
     ...config,
   }
   const [loadAdyen, setLoadAdyen] = useState(false)
-  const [checkout, setCheckout] = useState<
-    UIElement<UIElementProps> | undefined
-  >()
+  const [checkout, setCheckout] = useState<UIElement<UIElementProps> | undefined>()
   const [giftcardError, setGiftcardError] = useState<string | null>(null)
   const {
     setPaymentSource,
@@ -157,21 +139,18 @@ export function AdyenPayment({
   } = useContext(PaymentMethodContext)
   const { order, updateOrder, getOrderByFields } = useContext(OrderContext)
   const authConfig = useContext(CommerceLayerContext)
-  const { placeOrderButtonRef, setPlaceOrder, status } =
-    useContext(PlaceOrderContext)
+  const { placeOrderButtonRef, setPlaceOrder, status } = useContext(PlaceOrderContext)
   const { customers } = useContext(CustomerContext)
   const ref = useRef<null | HTMLFormElement>(null)
   const dropinRef = useRef<Dropin | null>(null)
-  const handleSubmit = async (
-    e: FormEvent<HTMLFormElement>,
-  ): Promise<boolean> => {
+  const handleSubmit = async (e: FormEvent<HTMLFormElement>): Promise<boolean> => {
     const savePaymentSourceToCustomerWallet: string =
       // @ts-expect-error no type
       e?.elements?.save_payment_source_to_customer_wallet?.checked
     if (savePaymentSourceToCustomerWallet)
       setCustomerOrderParam(
         "_save_payment_source_to_customer_wallet",
-        savePaymentSourceToCustomerWallet,
+        savePaymentSourceToCustomerWallet
       )
     if (dropinRef.current) {
       dropinRef.current.submit()
@@ -182,9 +161,7 @@ export function AdyenPayment({
     if (state.isValid) {
       if (ref.current) {
         ref.current.onsubmit = async () => {
-          return await handleSubmit(
-            ref.current as unknown as FormEvent<HTMLFormElement>,
-          )
+          return await handleSubmit(ref.current as unknown as FormEvent<HTMLFormElement>)
         }
         setPaymentMethodErrors([])
         setPaymentRef({ ref })
@@ -196,7 +173,7 @@ export function AdyenPayment({
   }
   const handleOnAdditionalDetails = async (
     state: AdditionalDetailsData,
-    component?: UIElement<UIElementProps>,
+    component?: UIElement<UIElementProps>
   ): Promise<CheckoutAdvancedFlowResponse> => {
     const attributes = {
       payment_request_details: state.data,
@@ -250,7 +227,7 @@ export function AdyenPayment({
   }
   const onSubmit = async (
     state: SubmitData,
-    component: UIElement<UIElementProps>,
+    component: UIElement<UIElementProps>
   ): Promise<
     CheckoutAdvancedFlowResponse & {
       paymentMethodType?: string
@@ -328,8 +305,7 @@ export function AdyenPayment({
         const currentBalance = giftCardBalanceCheck?.balance ?? 0
         const totalAmount = order?.total_amount_with_taxes_cents ?? 0
         if (currentBalance === 0) {
-          const message =
-            "The gift card has no balance. Please use a different one."
+          const message = "The gift card has no balance. Please use a different one."
           setPaymentMethodErrors([
             {
               code: "PAYMENT_INTENT_AUTHENTICATION_FAILURE",
@@ -370,8 +346,7 @@ export function AdyenPayment({
           orderUpdated?.payment_source?.payment_response?.action
         const paymentStatus = orderUpdated?.payment_status
         if (
-          (["Cancelled", "Refused"].includes(resultCode) &&
-            refusalReasonCode !== "12") ||
+          (["Cancelled", "Refused"].includes(resultCode) && refusalReasonCode !== "12") ||
           errorCode
         ) {
           const message =
@@ -413,10 +388,7 @@ export function AdyenPayment({
       // @ts-expect-error no type
       const issuerType = res?.payment_instrument?.issuer_type
       if (["Authorised", "Pending", "Received"].includes(resultCode)) {
-        if (
-          ["apple pay", "google pay"].includes(issuerType) &&
-          setPlaceOrder != null
-        ) {
+        if (["apple pay", "google pay"].includes(issuerType) && setPlaceOrder != null) {
           await setPlaceOrder({
             paymentSource: res,
             currentCustomerPaymentSourceId,
@@ -505,9 +477,7 @@ export function AdyenPayment({
         : [],
     }
     if (paymentMethodsResponse.paymentMethods.length === 0) {
-      console.error(
-        "Payment methods are not available. Please, check your Adyen configuration.",
-      )
+      console.error("Payment methods are not available. Please, check your Adyen configuration.")
     }
     let showStoredPaymentMethods =
       // @ts-expect-error no type
@@ -527,11 +497,9 @@ export function AdyenPayment({
        * because they are not supported in subscriptions
        */
       paymentMethodsResponse.paymentMethods =
-        subscriptionPaymentMethods != null &&
-        subscriptionPaymentMethods.length > 0
-          ? paymentMethodsResponse.paymentMethods.filter(
-              (pm: { type: PaymentMethodType }) =>
-                subscriptionPaymentMethods.includes(pm.type),
+        subscriptionPaymentMethods != null && subscriptionPaymentMethods.length > 0
+          ? paymentMethodsResponse.paymentMethods.filter((pm: { type: PaymentMethodType }) =>
+              subscriptionPaymentMethods.includes(pm.type)
             )
           : paymentMethodsResponse.paymentMethods
     }
@@ -564,10 +532,7 @@ export function AdyenPayment({
       },
       onSubmit: (state, element, actions) => {
         const handleSubmit = async (): Promise<void> => {
-          const { resultCode, action, message, paymentStatus } = await onSubmit(
-            state,
-            element,
-          )
+          const { resultCode, action, message, paymentStatus } = await onSubmit(state, element)
           if (["Cancelled", "Refused"].includes(resultCode)) {
             actions.reject()
             if (message) {
@@ -588,8 +553,7 @@ export function AdyenPayment({
         handleSubmit()
       },
     } satisfies CoreConfiguration
-    if (!ref && clientKey)
-      setCustomerOrderParam("_save_payment_source_to_customer_wallet", "false")
+    if (!ref && clientKey) setCustomerOrderParam("_save_payment_source_to_customer_wallet", "false")
     if (clientKey && !loadAdyen && window && !checkout) {
       const initializeAdyen = async (): Promise<void> => {
         const checkout = await AdyenCheckout(options)
@@ -649,14 +613,9 @@ export function AdyenPayment({
                  * For payment methods different from card, we remove the onsubmit handler
                  * to manage the submission via Adyen Drop-in and the place order button remains disabled
                  */
-                if (
-                  id.search("paypal") === -1 &&
-                  id.search("giftcard") === -1
-                ) {
+                if (id.search("paypal") === -1 && id.search("giftcard") === -1) {
                   ref.current.onsubmit = async () => {
-                    return await handleSubmit(
-                      ref.current as unknown as FormEvent<HTMLFormElement>,
-                    )
+                    return await handleSubmit(ref.current as unknown as FormEvent<HTMLFormElement>)
                   }
                 } else {
                   ref.current.onsubmit = null
@@ -667,9 +626,7 @@ export function AdyenPayment({
             if (isValid) {
               if (ref.current) {
                 ref.current.onsubmit = async () => {
-                  return await handleSubmit(
-                    ref.current as unknown as FormEvent<HTMLFormElement>,
-                  )
+                  return await handleSubmit(ref.current as unknown as FormEvent<HTMLFormElement>)
                 }
                 setPaymentMethodErrors([])
                 setPaymentRef({ ref })
diff --git a/packages/react-components/src/components/payment_source/BraintreePayment.tsx b/packages/react-components/src/components/payment_source/BraintreePayment.tsx
index c14874b5..6287fcc1 100644
--- a/packages/react-components/src/components/payment_source/BraintreePayment.tsx
+++ b/packages/react-components/src/components/payment_source/BraintreePayment.tsx
@@ -1,16 +1,16 @@
 /* eslint-disable @typescript-eslint/no-var-requires */
-import { type FormEvent, useContext, useEffect, useRef, useState, type JSX } from 'react';
-import PaymentMethodContext from '#context/PaymentMethodContext'
-import { isEmpty } from '#utils/isEmpty'
-import OrderContext from '#context/OrderContext'
-import Parent from '#components/utils/Parent'
-import type { PaymentSourceProps } from './PaymentSource'
-import { setCustomerOrderParam } from '#utils/localStorage'
-import promisify from '#utils/promisify'
-import type { HostedFieldFieldOptions, ThreeDSecure } from 'braintree-web'
-import type { BraintreePayment as BraintreePaymentType } from '@commercelayer/sdk'
-import type { HostedFieldsHostedFieldsFieldName } from 'braintree-web/hosted-fields'
-import type { ThreeDSecureVerifyOptions } from 'braintree-web/three-d-secure'
+import { type FormEvent, useContext, useEffect, useRef, useState, type JSX } from "react"
+import PaymentMethodContext from "#context/PaymentMethodContext"
+import { isEmpty } from "#utils/isEmpty"
+import OrderContext from "#context/OrderContext"
+import Parent from "#components/utils/Parent"
+import type { PaymentSourceProps } from "./PaymentSource"
+import { setCustomerOrderParam } from "#utils/localStorage"
+import promisify from "#utils/promisify"
+import type { HostedFieldFieldOptions, ThreeDSecure } from "braintree-web"
+import type { BraintreePayment as BraintreePaymentType } from "@commercelayer/sdk"
+import type { HostedFieldsHostedFieldsFieldName } from "braintree-web/hosted-fields"
+import type { ThreeDSecureVerifyOptions } from "braintree-web/three-d-secure"
 type BraintreeHostedFields<Type> = {
   [Property in keyof Type]: {
     label?: string
@@ -37,7 +37,7 @@ export interface BraintreeConfig {
 interface Props {
   authorization: string
   config?: BraintreeConfig
-  templateCustomerSaveToWallet?: PaymentSourceProps['templateCustomerSaveToWallet']
+  templateCustomerSaveToWallet?: PaymentSourceProps["templateCustomerSaveToWallet"]
   locale?: string
 }
 
@@ -52,60 +52,60 @@ const defaultConfig: BraintreeConfig = {
   styles: {
     // Style all elements
     input: {
-      'font-size': '16px',
-      color: '#3A3A3A'
+      "font-size": "16px",
+      color: "#3A3A3A",
     },
 
     // Styling a specific field
     // Custom web fonts are not supported. Only use system installed fonts.
-    '.number': {
-      'font-family': 'monospace'
+    ".number": {
+      "font-family": "monospace",
     },
 
     // Styling element state
-    ':focus': {
-      color: 'blue'
+    ":focus": {
+      color: "blue",
     },
-    '.valid': {
-      color: 'green'
+    ".valid": {
+      color: "green",
     },
-    '.invalid': {
-      color: 'red'
+    ".invalid": {
+      color: "red",
     },
 
     // Media queries
     // Note that these apply to the iframe, not the root window.
-    '@media screen and (max-width: 700px)': {
+    "@media screen and (max-width: 700px)": {
       // @ts-expect-error no type
       input: {
-        'font-size': '14px'
-      }
-    }
+        "font-size": "14px",
+      },
+    },
   },
   fields: {
     number: {
-      label: 'Card Number',
-      selector: '#card-number',
-      placeholder: '4111 1111 1111 1111'
+      label: "Card Number",
+      selector: "#card-number",
+      placeholder: "4111 1111 1111 1111",
     },
     cvv: {
-      label: 'CVV',
-      selector: '#cvv',
-      placeholder: '123'
+      label: "CVV",
+      selector: "#cvv",
+      placeholder: "123",
     },
     expirationDate: {
-      label: 'Expiration Date',
-      selector: '#expiration-date',
-      placeholder: '10/2022'
-    }
+      label: "Expiration Date",
+      selector: "#expiration-date",
+      placeholder: "10/2022",
+    },
   },
-  submitLabel: 'Set payment method'
+  submitLabel: "Set payment method",
 }
 
 export function BraintreePayment({
   authorization,
   config,
-  templateCustomerSaveToWallet
+  templateCustomerSaveToWallet,
 }: Props): JSX.Element | null {
   const {
     fields,
@@ -117,7 +117,7 @@ export function BraintreePayment({
     fieldLabelClassName,
     cvvContainerClassName,
     inputWrapperClassName,
-    cardDetailsContainerClassName
+    cardDetailsContainerClassName,
   } = { ...defaultConfig, ...config }
   const [loadBraintree, setLoadBraintree] = useState(false)
   const {
@@ -125,28 +125,26 @@ export function BraintreePayment({
     paymentSource,
     setPaymentMethodErrors,
     currentPaymentMethodType,
-    setPaymentRef
+    setPaymentRef,
   } = useContext(PaymentMethodContext)
   const { order } = useContext(OrderContext)
   const ref = useRef<null | HTMLFormElement>(null)
   const handleSubmitForm = async ({
     event,
     hostedFieldsInstance,
-    threeDSInstance
+    threeDSInstance,
   }: SubmitProps): Promise<boolean> => {
     const savePaymentSourceToCustomerWallet: string =
       // @ts-expect-error no type
       event?.elements?.save_payment_source_to_customer_wallet?.checked
     if (savePaymentSourceToCustomerWallet)
       setCustomerOrderParam(
-        '_save_payment_source_to_customer_wallet',
+        "_save_payment_source_to_customer_wallet",
         savePaymentSourceToCustomerWallet
       )
     if (hostedFieldsInstance) {
       try {
-        const payload = await promisify(hostedFieldsInstance).then(
-          (payload) => payload
-        )
+        const payload = await promisify(hostedFieldsInstance).then((payload) => payload)
         const billingAddress = order?.billing_address
         const verifyCardOptions: ThreeDSecureVerifyOptions & {
           onLookupComplete: unknown
@@ -154,31 +152,28 @@ export function BraintreePayment({
           nonce: payload.nonce,
           bin: payload.details.bin,
           amount: `${order?.total_amount_with_taxes_float}`,
-          email: order?.customer_email ?? '',
+          email: order?.customer_email ?? "",
           billingAddress: {
-            givenName: billingAddress?.first_name ?? '',
-            surname: billingAddress?.last_name ?? '',
+            givenName: billingAddress?.first_name ?? "",
+            surname: billingAddress?.last_name ?? "",
             phoneNumber: billingAddress?.phone,
             streetAddress: billingAddress?.line_1,
             countryCodeAlpha2: billingAddress?.country_code,
-            postalCode: billingAddress?.zip_code ?? '',
+            postalCode: billingAddress?.zip_code ?? "",
             region: billingAddress?.state_code ?? undefined,
-            locality: billingAddress?.city
+            locality: billingAddress?.city,
           },
           onLookupComplete: (_data: any, next: any) => {
             next()
-          }
+          },
         }
-        const response = (await threeDSInstance.verifyCard(
-          verifyCardOptions
-        )) as any
+        const response = (await threeDSInstance.verifyCard(verifyCardOptions)) as any
         const validStatus =
-          response?.liabilityShiftPossible === true &&
-          response?.liabilityShifted === true
+          response?.liabilityShiftPossible === true && response?.liabilityShifted === true
         if (validStatus && paymentSource != null) {
           await setPaymentSource({
             paymentSourceId: paymentSource.id,
-            paymentResource: 'braintree_payments',
+            paymentResource: "braintree_payments",
             attributes: {
               payment_method_nonce: response.nonce,
               options: {
@@ -187,26 +182,24 @@ export function BraintreePayment({
                   last4: response.details.lastFour,
                   exp_year: response.details.expirationYear,
                   exp_month: response.details.expirationMonth,
-                  brand: response.details.cardType.toLowerCase()
-                }
-              }
-            }
+                  brand: response.details.cardType.toLowerCase(),
+                },
+              },
+            },
           })
           return true
         } else {
-          throw new Error(
-            `3D Secure authentication failed - ${response?.threeDSecureInfo?.status}`
-          )
+          throw new Error(`3D Secure authentication failed - ${response?.threeDSecureInfo?.status}`)
         }
       } catch (error: any) {
         console.error(error)
         setPaymentMethodErrors([
           {
-            code: 'PAYMENT_INTENT_AUTHENTICATION_FAILURE',
-            resource: 'payment_methods',
+            code: "PAYMENT_INTENT_AUTHENTICATION_FAILURE",
+            resource: "payment_methods",
             field: currentPaymentMethodType,
-            message: error.message as string
-          }
+            message: error.message as string,
+          },
         ])
         return false
       }
@@ -215,15 +208,15 @@ export function BraintreePayment({
   }
   useEffect(() => {
     if (!ref && authorization)
-      setCustomerOrderParam('_save_payment_source_to_customer_wallet', 'false')
+      setCustomerOrderParam("_save_payment_source_to_customer_wallet", "false")
     if (authorization && !loadBraintree && !isEmpty(window)) {
-      const braintreeClient = require('braintree-web/client')
-      const hostedFields = require('braintree-web/hosted-fields')
-      const threeDSecure = require('braintree-web/three-d-secure')
+      const braintreeClient = require("braintree-web/client")
+      const hostedFields = require("braintree-web/hosted-fields")
+      const threeDSecure = require("braintree-web/three-d-secure")
       braintreeClient.create(
         {
           authorization,
-          challengeRequested: config?.challengeRequested ?? true
+          challengeRequested: config?.challengeRequested ?? true,
         },
         (clientErr: any, clientInstance: any) => {
           if (clientErr) {
@@ -234,12 +227,9 @@ export function BraintreePayment({
             {
               client: clientInstance,
               fields: fields as HostedFieldFieldOptions,
-              styles
+              styles,
             },
-            (
-              hostedFieldsErr: any,
-              hostedFieldsInstance: HostedFieldsHostedFieldsFieldName
-            ) => {
+            (hostedFieldsErr: any, hostedFieldsInstance: HostedFieldsHostedFieldsFieldName) => {
               if (hostedFieldsErr) {
                 console.error(hostedFieldsErr)
                 return
@@ -248,19 +238,19 @@ export function BraintreePayment({
               threeDSecure.create(
                 {
                   authorization,
-                  version: 2
+                  version: 2,
                 },
                 (threeDSecureErr: any, threeDSInstance: ThreeDSecure) => {
                   if (threeDSecureErr) {
                     // Handle error in 3D Secure component creation
-                    console.error('3DSecure error', threeDSecureErr)
+                    console.error("3DSecure error", threeDSecureErr)
                     setPaymentMethodErrors([
                       {
-                        code: 'PAYMENT_INTENT_AUTHENTICATION_FAILURE',
-                        resource: 'payment_methods',
+                        code: "PAYMENT_INTENT_AUTHENTICATION_FAILURE",
+                        resource: "payment_methods",
                         field: currentPaymentMethodType,
-                        message: threeDSecureErr.message as string
-                      }
+                        message: threeDSecureErr.message as string,
+                      },
                     ])
                   }
                   if (ref.current) {
@@ -269,7 +259,7 @@ export function BraintreePayment({
                         event: ref.current as any,
                         hostedFieldsInstance,
                         threeDSInstance,
-                        paymentSource
+                        paymentSource,
                       })
                     }
                     setPaymentRef({ ref })
@@ -290,35 +280,35 @@ export function BraintreePayment({
     <div className={containerClassName}>
       <form
         ref={ref}
-        id='braintree-form'
+        id="braintree-form"
         onSubmit={handleSubmitForm as any}
         className={containerClassName}
       >
         <div className={fieldsContainerClassName}>
           <div className={cardContainerClassName}>
-            <label className={fieldLabelClassName} htmlFor='card-number'>
+            <label className={fieldLabelClassName} htmlFor="card-number">
               {fields?.number?.label}
             </label>
-            <div className={inputWrapperClassName} id='card-number' />
+            <div className={inputWrapperClassName} id="card-number" />
           </div>
           <div className={cardDetailsContainerClassName}>
             <div className={expDateContainerClassName}>
-              <label className={fieldLabelClassName} htmlFor='expiration-date'>
+              <label className={fieldLabelClassName} htmlFor="expiration-date">
                 {fields?.expirationDate?.label}
               </label>
-              <div className={inputWrapperClassName} id='expiration-date' />
+              <div className={inputWrapperClassName} id="expiration-date" />
             </div>
             <div className={cvvContainerClassName}>
-              <label className={fieldLabelClassName} htmlFor='cvv'>
+              <label className={fieldLabelClassName} htmlFor="cvv">
                 {fields?.cvv?.label}
               </label>
-              <div className={inputWrapperClassName} id='cvv' />
+              <div className={inputWrapperClassName} id="cvv" />
             </div>
           </div>
         </div>
         <div className={fieldsContainerClassName}>
           {templateCustomerSaveToWallet && (
-            <Parent {...{ name: 'save_payment_source_to_customer_wallet' }}>
+            <Parent {...{ name: "save_payment_source_to_customer_wallet" }}>
               {templateCustomerSaveToWallet}
             </Parent>
           )}
diff --git a/packages/react-components/src/components/payment_source/CheckoutComPayment.tsx b/packages/react-components/src/components/payment_source/CheckoutComPayment.tsx
index af1962b3..e135ae18 100644
--- a/packages/react-components/src/components/payment_source/CheckoutComPayment.tsx
+++ b/packages/react-components/src/components/payment_source/CheckoutComPayment.tsx
@@ -67,7 +67,7 @@ interface CheckoutWebComponent {
       status: string
       id: string
       type: string
-    },
+    }
   ) => Promise<void>
   onChange?: (component: Component) => void
   onError?: (component: Component, error: unknown) => void
@@ -122,23 +122,14 @@ type Props = Partial<PaymentMethodConfig["checkoutComPayment"]> &
     templateCustomerSaveToWallet?: PaymentSourceProps["templateCustomerSaveToWallet"]
   }
 
-export function CheckoutComPayment({
-  publicKey,
-  options,
-  ...p
-}: Props): JSX.Element | null {
+export function CheckoutComPayment({ publicKey, options, ...p }: Props): JSX.Element | null {
   const ref = useRef<null | HTMLFormElement>(null)
   const loaded = useExternalScript(scriptUrl)
   const { setPaymentRef, setPaymentSource } = useContext(PaymentMethodContext)
   const { accessToken } = useContext(CommerceLayerContext)
   const { order } = useContext(OrderContext)
   const { setPlaceOrderStatus } = useContext(PlaceOrderContext)
-  const {
-    containerClassName,
-    templateCustomerSaveToWallet,
-    show,
-    ...divProps
-  } = p
+  const { containerClassName, templateCustomerSaveToWallet, show, ...divProps } = p
   useEffect(() => {
     const ps = order?.payment_source
     if (loaded && window && ps && accessToken) {
@@ -177,7 +168,7 @@ export function CheckoutComPayment({
                     if (savePaymentSourceToCustomerWallet)
                       setCustomerOrderParam(
                         "_save_payment_source_to_customer_wallet",
-                        savePaymentSourceToCustomerWallet,
+                        savePaymentSourceToCustomerWallet
                       )
                     const { data } = await component.tokenize()
                     const token = data?.token
diff --git a/packages/react-components/src/components/payment_source/KlarnaPayment.tsx b/packages/react-components/src/components/payment_source/KlarnaPayment.tsx
index 7b342f96..5399c1f3 100644
--- a/packages/react-components/src/components/payment_source/KlarnaPayment.tsx
+++ b/packages/react-components/src/components/payment_source/KlarnaPayment.tsx
@@ -23,9 +23,7 @@ type KlarnaPaymentProps = PaymentMethodConfig["klarnaPayment"] &
     locale?: string | null
   }
 
-function typeOfLine(
-  lineItemType: string | null | undefined,
-): OrderLine["type"] {
+function typeOfLine(lineItemType: string | null | undefined): OrderLine["type"] {
   switch (lineItemType) {
     case "percentage_discount_promotions":
       return "discount"
@@ -70,12 +68,8 @@ export default function KlarnaPayment({
   ...p
 }: KlarnaPaymentProps): JSX.Element | null {
   const ref = useRef<null | HTMLFormElement>(null)
-  const {
-    paymentSource,
-    currentPaymentMethodType,
-    setPaymentRef,
-    setPaymentSource,
-  } = useContext(PaymentMethodContext)
+  const { paymentSource, currentPaymentMethodType, setPaymentRef, setPaymentSource } =
+    useContext(PaymentMethodContext)
   const { order } = useContext(OrderContext)
   const loaded = useExternalScript("https://x.klarnacdn.net/kp/lib/v1/api.js")
   const [klarna, setKlarna] = useState<any>()
@@ -86,13 +80,7 @@ export default function KlarnaPayment({
     }
   }, [loaded, window.Klarna])
   useEffect(() => {
-    if (
-      ref.current &&
-      paymentSource &&
-      currentPaymentMethodType &&
-      loaded &&
-      klarna
-    ) {
+    if (ref.current && paymentSource && currentPaymentMethodType && loaded && klarna) {
       ref.current.onsubmit = async (props: any) => {
         handleClick(klarna, props)
       }
@@ -164,7 +152,7 @@ export default function KlarnaPayment({
             }
           }
         }
-      },
+      }
     )
   }
   if (klarna && clientToken) {
diff --git a/packages/react-components/src/components/payment_source/PaymentSource.tsx b/packages/react-components/src/components/payment_source/PaymentSource.tsx
index ae29bb87..5404807b 100644
--- a/packages/react-components/src/components/payment_source/PaymentSource.tsx
+++ b/packages/react-components/src/components/payment_source/PaymentSource.tsx
@@ -18,15 +18,12 @@ export interface CustomerSaveToWalletProps {
   name: "save_payment_source_to_customer_wallet"
 }
 
-export interface PaymentSourceProps
-  extends Omit<JSX.IntrinsicElements["div"], "children"> {
+export interface PaymentSourceProps extends Omit<JSX.IntrinsicElements["div"], "children"> {
   children?: JSX.Element | JSX.Element[]
   readonly?: boolean
   templateCustomerCards?: CustomerCardsTemplateChildren
   onClickCustomerCards?: () => void
-  templateCustomerSaveToWallet?: (
-    props: CustomerSaveToWalletProps,
-  ) => JSX.Element
+  templateCustomerSaveToWallet?: (props: CustomerSaveToWalletProps) => JSX.Element
   loader?: LoaderType
 }
 
@@ -48,8 +45,7 @@ export function PaymentSource(props: PaymentSourceProps): JSX.Element {
 
   useEffect(() => {
     const isCustomerPaymentSource =
-      currentCustomerPaymentSourceId != null &&
-      currentCustomerPaymentSourceId === paymentSource?.id
+      currentCustomerPaymentSourceId != null && currentCustomerPaymentSourceId === paymentSource?.id
     const checkPaymentSourceStatus =
       // @ts-expect-error no type
       paymentSource?.payment_response?.status?.toLowerCase?.()
@@ -69,15 +65,9 @@ export function PaymentSource(props: PaymentSourceProps): JSX.Element {
       if (isCustomerPaymentSource && card.brand === "") {
         // Force creadit card icon for customer payment source imported by API
         card.brand =
-          card.issuer_type != null && card.issuer_type !== ""
-            ? card.issuer_type
-            : "credit-card"
+          card.issuer_type != null && card.issuer_type !== "" ? card.issuer_type : "credit-card"
       }
-      if (
-        card.brand &&
-        errors?.length === 0 &&
-        checkPaymentSourceStatus !== "declined"
-      ) {
+      if (card.brand && errors?.length === 0 && checkPaymentSourceStatus !== "declined") {
         if (card.brand !== "giftcard") {
           setShowCard(true)
         }
@@ -89,10 +79,7 @@ export function PaymentSource(props: PaymentSourceProps): JSX.Element {
         setShowCard(false)
       }
       setShow(true)
-    } else if (
-      expressPayments &&
-      currentPaymentMethodType === "stripe_payments"
-    ) {
+    } else if (expressPayments && currentPaymentMethodType === "stripe_payments") {
       setShow(true)
     }
     return () => {
diff --git a/packages/react-components/src/components/payment_source/PaymentSourceBrandIcon.tsx b/packages/react-components/src/components/payment_source/PaymentSourceBrandIcon.tsx
index d6d8d055..36da094d 100644
--- a/packages/react-components/src/components/payment_source/PaymentSourceBrandIcon.tsx
+++ b/packages/react-components/src/components/payment_source/PaymentSourceBrandIcon.tsx
@@ -1,40 +1,33 @@
-import PaymentSourceContext, {
-  type IconBrand
-} from '#context/PaymentSourceContext'
-import { useContext, useRef, type JSX } from 'react';
-import Parent from '#components/utils/Parent'
-import type { ChildrenFunction } from '#typings'
-import CustomerPaymentSourceContext from '#context/CustomerPaymentSourceContext'
+import PaymentSourceContext, { type IconBrand } from "#context/PaymentSourceContext"
+import { useContext, useRef, type JSX } from "react"
+import Parent from "#components/utils/Parent"
+import type { ChildrenFunction } from "#typings"
+import CustomerPaymentSourceContext from "#context/CustomerPaymentSourceContext"
 
-interface ChildrenProps extends Omit<Props, 'children'> {
+interface ChildrenProps extends Omit<Props, "children"> {
   brand: IconBrand
   defaultSrc: string
   url: string
 }
 
-interface Props extends Omit<JSX.IntrinsicElements['img'], 'children'> {
+interface Props extends Omit<JSX.IntrinsicElements["img"], "children"> {
   children?: ChildrenFunction<ChildrenProps>
   width?: number
   height?: number
 }
-export function PaymentSourceBrandIcon({
-  src,
-  width = 32,
-  children,
-  ...p
-}: Props): JSX.Element {
+export function PaymentSourceBrandIcon({ src, width = 32, children, ...p }: Props): JSX.Element {
   const { brand, issuer_type: issuerType } = useContext(PaymentSourceContext)
-  const { brand: customerCardBrand, issuer_type: customerIssuerType } =
-    useContext(CustomerPaymentSourceContext)
-  const cardBrand =
-    brand ?? customerCardBrand ?? issuerType ?? customerIssuerType
+  const { brand: customerCardBrand, issuer_type: customerIssuerType } = useContext(
+    CustomerPaymentSourceContext
+  )
+  const cardBrand = brand ?? customerCardBrand ?? issuerType ?? customerIssuerType
   const ref = useRef<HTMLImageElement>(null)
   const defaultSrc =
-    '//data.commercelayer.app/assets/images/icons/credit-cards/color/credit-card.svg'
+    "//data.commercelayer.app/assets/images/icons/credit-cards/color/credit-card.svg"
   const url =
     src ||
     `//data.commercelayer.app/assets/images/icons/credit-cards/color/${
-      cardBrand ?? 'credit-card'
+      cardBrand ?? "credit-card"
     }.svg`
   const handleError = (): void => {
     if (ref.current) ref.current.src = defaultSrc
@@ -44,7 +37,7 @@ export function PaymentSourceBrandIcon({
     defaultSrc,
     url,
     width,
-    ...p
+    ...p,
   }
   return children ? (
     <Parent {...parentProps}>{children}</Parent>
diff --git a/packages/react-components/src/components/payment_source/PaymentSourceBrandName.tsx b/packages/react-components/src/components/payment_source/PaymentSourceBrandName.tsx
index 3cb77b41..88c70575 100644
--- a/packages/react-components/src/components/payment_source/PaymentSourceBrandName.tsx
+++ b/packages/react-components/src/components/payment_source/PaymentSourceBrandName.tsx
@@ -1,35 +1,29 @@
-import PaymentSourceContext, {
-  type IconBrand
-} from '#context/PaymentSourceContext'
-import { useContext, type JSX } from 'react';
-import Parent from '#components/utils/Parent'
-import type { ChildrenFunction } from '#typings'
-import CustomerPaymentSourceContext from '#context/CustomerPaymentSourceContext'
+import PaymentSourceContext, { type IconBrand } from "#context/PaymentSourceContext"
+import { useContext, type JSX } from "react"
+import Parent from "#components/utils/Parent"
+import type { ChildrenFunction } from "#typings"
+import CustomerPaymentSourceContext from "#context/CustomerPaymentSourceContext"
 
-interface CustomComponent extends Omit<Props, 'children'> {
+interface CustomComponent extends Omit<Props, "children"> {
   brand: IconBrand
 }
 
-interface Props extends Omit<JSX.IntrinsicElements['span'], 'children'> {
+interface Props extends Omit<JSX.IntrinsicElements["span"], "children"> {
   children?: ChildrenFunction<CustomComponent>
   label?: string
 }
 
-export function PaymentSourceBrandName({
-  children,
-  label,
-  ...props
-}: Props): JSX.Element {
+export function PaymentSourceBrandName({ children, label, ...props }: Props): JSX.Element {
   const { brand } = useContext(PaymentSourceContext)
   const { brand: customerCardBrand } = useContext(CustomerPaymentSourceContext)
   const cardBrand = brand ?? customerCardBrand
   const capitalizeStr = (str?: string): string =>
-    str ? str.charAt(0).toUpperCase() + str.slice(1).toLowerCase() : ''
-  const brandName = cardBrand && capitalizeStr(cardBrand.replace(/_|-/gm, ' '))
+    str ? str.charAt(0).toUpperCase() + str.slice(1).toLowerCase() : ""
+  const brandName = cardBrand && capitalizeStr(cardBrand.replace(/_|-/gm, " "))
   const parentProps = {
     brand: brandName,
     label,
-    ...props
+    ...props,
   }
   return children ? (
     <Parent {...parentProps}>{children}</Parent>
diff --git a/packages/react-components/src/components/payment_source/PaymentSourceDeleteButton.tsx b/packages/react-components/src/components/payment_source/PaymentSourceDeleteButton.tsx
index 29d60b46..d0a41638 100644
--- a/packages/react-components/src/components/payment_source/PaymentSourceDeleteButton.tsx
+++ b/packages/react-components/src/components/payment_source/PaymentSourceDeleteButton.tsx
@@ -3,7 +3,7 @@ import Parent from "#components/utils/Parent"
 import CustomerPaymentSourceContext from "#context/CustomerPaymentSourceContext"
 import type { ChildrenFunction } from "#typings"
 
-interface CustomComponent extends Omit<Props, "children"> { }
+interface CustomComponent extends Omit<Props, "children"> {}
 
 type Props = {
   children?: ChildrenFunction<CustomComponent>
diff --git a/packages/react-components/src/components/payment_source/PaymentSourceDetail.tsx b/packages/react-components/src/components/payment_source/PaymentSourceDetail.tsx
index d0e08bb5..37f59636 100644
--- a/packages/react-components/src/components/payment_source/PaymentSourceDetail.tsx
+++ b/packages/react-components/src/components/payment_source/PaymentSourceDetail.tsx
@@ -1,46 +1,34 @@
-import PaymentSourceContext from '#context/PaymentSourceContext'
-import { useContext, type JSX } from 'react';
-import Parent from '#components/utils/Parent'
-import type { ChildrenFunction } from '#typings'
-import CustomerPaymentSourceContext from '#context/CustomerPaymentSourceContext'
+import PaymentSourceContext from "#context/PaymentSourceContext"
+import { useContext, type JSX } from "react"
+import Parent from "#components/utils/Parent"
+import type { ChildrenFunction } from "#typings"
+import CustomerPaymentSourceContext from "#context/CustomerPaymentSourceContext"
 
-export type PaymentSourceDetailType = 'last4' | 'exp_year' | 'exp_month'
+export type PaymentSourceDetailType = "last4" | "exp_year" | "exp_month"
 
-interface ChildrenProps extends Omit<Props, 'children'> {
+interface ChildrenProps extends Omit<Props, "children"> {
   text: string
 }
 
-interface Props extends Omit<JSX.IntrinsicElements['span'], 'children'> {
+interface Props extends Omit<JSX.IntrinsicElements["span"], "children"> {
   children?: ChildrenFunction<ChildrenProps>
   /**
    * Type of detail to display
    */
   type: PaymentSourceDetailType
 }
-export function PaymentSourceDetail({
-  type,
-  children,
-  ...p
-}: Props): JSX.Element {
+export function PaymentSourceDetail({ type, children, ...p }: Props): JSX.Element {
   const card = useContext(PaymentSourceContext)
   const customerCard = useContext(CustomerPaymentSourceContext)
   const cardObj = Object.keys(card).length > 0 ? card : customerCard
   const text =
-    type in cardObj && cardObj[type] != null
-      ? cardObj[type]
-      : type === 'last4'
-        ? '****'
-        : '**'
+    type in cardObj && cardObj[type] != null ? cardObj[type] : type === "last4" ? "****" : "**"
   const parentProps = {
     type,
     text,
-    ...p
+    ...p,
   }
-  return children ? (
-    <Parent {...parentProps}>{children}</Parent>
-  ) : (
-    <span {...p}>{text}</span>
-  )
+  return children ? <Parent {...parentProps}>{children}</Parent> : <span {...p}>{text}</span>
 }
 
 export default PaymentSourceDetail
diff --git a/packages/react-components/src/components/payment_source/PaymentSourceEditButton.tsx b/packages/react-components/src/components/payment_source/PaymentSourceEditButton.tsx
index 9d6f8cd6..578ff680 100644
--- a/packages/react-components/src/components/payment_source/PaymentSourceEditButton.tsx
+++ b/packages/react-components/src/components/payment_source/PaymentSourceEditButton.tsx
@@ -1,26 +1,25 @@
-import PaymentSourceContext from '#context/PaymentSourceContext'
-import { type ReactNode, useContext, type JSX } from 'react';
-import Parent from '#components/utils/Parent'
-import type { ChildrenFunction } from '#typings'
+import PaymentSourceContext from "#context/PaymentSourceContext"
+import { type ReactNode, useContext, type JSX } from "react"
+import Parent from "#components/utils/Parent"
+import type { ChildrenFunction } from "#typings"
 
-interface CustomComponent extends Omit<Props, 'children'> {}
+interface CustomComponent extends Omit<Props, "children"> {}
 
 type Props = {
   children?: ChildrenFunction<CustomComponent>
   label?: string | ReactNode
-} & Omit<JSX.IntrinsicElements['button'], 'onClick'>
+} & Omit<JSX.IntrinsicElements["button"], "onClick">
 export function PaymentSourceEditButton({
   children,
-  label = 'Edit',
+  label = "Edit",
   ...props
 }: Props): JSX.Element | null {
-  const { showCard, handleEditClick, readonly } =
-    useContext(PaymentSourceContext)
+  const { showCard, handleEditClick, readonly } = useContext(PaymentSourceContext)
   const parentProps = {
     showCard,
     label,
     handleEditClick,
-    ...props
+    ...props,
   }
   return children ? (
     <Parent {...parentProps}>{children}</Parent>
diff --git a/packages/react-components/src/components/payment_source/PaypalPayment.tsx b/packages/react-components/src/components/payment_source/PaypalPayment.tsx
index 5769fa1f..f7ec12cd 100644
--- a/packages/react-components/src/components/payment_source/PaypalPayment.tsx
+++ b/packages/react-components/src/components/payment_source/PaypalPayment.tsx
@@ -1,5 +1,5 @@
-import PaymentMethodContext from '#context/PaymentMethodContext'
-import { type ReactNode, useContext, useEffect, useRef, type JSX } from 'react';
+import PaymentMethodContext from "#context/PaymentMethodContext"
+import { type ReactNode, useContext, useEffect, useRef, type JSX } from "react"
 
 export interface PaypalConfig {
   return_url: string
@@ -11,21 +11,13 @@ export interface PaypalConfig {
 }
 
 const defaultMessage =
-  'by placing the order, you will be redirected to the PayPal website to sign in and authorize the payment'
+  "by placing the order, you will be redirected to the PayPal website to sign in and authorize the payment"
 
-type Props = Omit<PaypalConfig, 'return_url' | 'cancel_url'> &
-  JSX.IntrinsicElements['div']
-export function PaypalPayment({
-  infoMessage,
-  ...p
-}: Props): JSX.Element | null {
+type Props = Omit<PaypalConfig, "return_url" | "cancel_url"> & JSX.IntrinsicElements["div"]
+export function PaypalPayment({ infoMessage, ...p }: Props): JSX.Element | null {
   const ref = useRef<null | HTMLFormElement>(null)
-  const {
-    setPaymentSource,
-    paymentSource,
-    currentPaymentMethodType,
-    setPaymentRef
-  } = useContext(PaymentMethodContext)
+  const { setPaymentSource, paymentSource, currentPaymentMethodType, setPaymentRef } =
+    useContext(PaymentMethodContext)
   useEffect(() => {
     if (
       ref.current &&
@@ -53,11 +45,11 @@ export function PaypalPayment({
             metadata: {
               card: {
                 id: paymentSource.id,
-                brand: 'paypal',
-                last4: ''
-              }
-            }
-          }
+                brand: "paypal",
+                last4: "",
+              },
+            },
+          },
         })
         return true
       } catch (e) {
@@ -70,7 +62,7 @@ export function PaypalPayment({
     <form ref={ref}>
       <div {...p}>
         <span className={infoMessage?.className}>
-          {typeof infoMessage?.text === 'function'
+          {typeof infoMessage?.text === "function"
             ? infoMessage?.text()
             : infoMessage?.text || defaultMessage}
         </span>
diff --git a/packages/react-components/src/components/payment_source/StripeExpressPayment.tsx b/packages/react-components/src/components/payment_source/StripeExpressPayment.tsx
index 99da5da9..86090d87 100644
--- a/packages/react-components/src/components/payment_source/StripeExpressPayment.tsx
+++ b/packages/react-components/src/components/payment_source/StripeExpressPayment.tsx
@@ -20,13 +20,9 @@ interface Props {
   clientSecret: string
 }
 
-export function StripeExpressPayment({
-  clientSecret,
-}: Props): JSX.Element | null {
+export function StripeExpressPayment({ clientSecret }: Props): JSX.Element | null {
   const stripe = useStripe()
-  const [paymentRequest, setPaymentRequest] = useState<null | PaymentRequest>(
-    null,
-  )
+  const [paymentRequest, setPaymentRequest] = useState<null | PaymentRequest>(null)
   const { accessToken } = useContext(CommerceLayerContext)
   const { order } = useContext(OrderContext)
   const { paymentMethods, paymentSource } = useContext(PaymentMethodContext)
@@ -133,8 +129,7 @@ export function StripeExpressPayment({
       if (paymentMethod == null) throw new Error("Payment method is null")
       if (paymentSource == null) throw new Error("Payment source is null")
       const requiresBillingInfo = order?.requires_billing_info ?? false
-      const paymentResource =
-        paymentMethod?.payment_source_type as PaymentResource
+      const paymentResource = paymentMethod?.payment_source_type as PaymentResource
       if (accessToken != null) {
         const [firstName, lastName] = ev.payerName?.split(" ") ?? []
         const [line] = ev.shippingAddress?.addressLine ?? ""
@@ -178,12 +173,11 @@ export function StripeExpressPayment({
         }
         await setExpressPlaceOrder(placeOrderParams)
         // Confirm the PaymentIntent without handling potential next actions (yet).
-        const { paymentIntent, error: confirmError } =
-          await stripe.confirmCardPayment(
-            clientSecret,
-            { payment_method: ev.paymentMethod.id },
-            { handleActions: false },
-          )
+        const { paymentIntent, error: confirmError } = await stripe.confirmCardPayment(
+          clientSecret,
+          { payment_method: ev.paymentMethod.id },
+          { handleActions: false }
+        )
         if (confirmError) {
           // Report to the browser that the payment failed, prompting it to
           // re-show the payment interface, or show an error message and close
@@ -254,10 +248,7 @@ export function StripeExpressPayment({
     })
     return (
       <>
-        <PaymentRequestButtonElement
-          className=""
-          options={{ paymentRequest }}
-        />
+        <PaymentRequestButtonElement className="" options={{ paymentRequest }} />
       </>
     )
   }
diff --git a/packages/react-components/src/components/payment_source/StripePayment.tsx b/packages/react-components/src/components/payment_source/StripePayment.tsx
index 4eb976c7..3fb20d5b 100644
--- a/packages/react-components/src/components/payment_source/StripePayment.tsx
+++ b/packages/react-components/src/components/payment_source/StripePayment.tsx
@@ -67,12 +67,8 @@ function StripePaymentForm({
   stripe,
 }: StripePaymentFormProps): JSX.Element {
   const ref = useRef<null | HTMLFormElement>(null)
-  const {
-    errors,
-    currentPaymentMethodType,
-    setPaymentMethodErrors,
-    setPaymentRef,
-  } = useContext(PaymentMethodContext)
+  const { errors, currentPaymentMethodType, setPaymentMethodErrors, setPaymentRef } =
+    useContext(PaymentMethodContext)
   const { order, setOrderErrors } = useContext(OrderContext)
   const { sdkClient } = useCommerceLayer()
   const { setPlaceOrderStatus } = useContext(PlaceOrderContext)
@@ -92,11 +88,7 @@ function StripePaymentForm({
       setPaymentRef({ ref: { current: null } })
     }
   }, [ref, stripe, elements])
-  const onSubmit = async ({
-    event,
-    stripe,
-    elements,
-  }: OnSubmitArgs): Promise<boolean> => {
+  const onSubmit = async ({ event, stripe, elements }: OnSubmitArgs): Promise<boolean> => {
     if (!stripe) return false
     const sdk = sdkClient()
     if (sdk == null) return false
@@ -132,7 +124,7 @@ function StripePaymentForm({
     if (savePaymentSourceToCustomerWallet)
       setCustomerOrderParam(
         "_save_payment_source_to_customer_wallet",
-        savePaymentSourceToCustomerWallet,
+        savePaymentSourceToCustomerWallet
       )
     if (elements != null) {
       const billingInfo = order?.billing_address
diff --git a/packages/react-components/src/components/payment_source/WireTransferPayment.tsx b/packages/react-components/src/components/payment_source/WireTransferPayment.tsx
index fa63ee56..24f1637f 100644
--- a/packages/react-components/src/components/payment_source/WireTransferPayment.tsx
+++ b/packages/react-components/src/components/payment_source/WireTransferPayment.tsx
@@ -1,5 +1,5 @@
-import PaymentMethodContext from '#context/PaymentMethodContext'
-import { useContext, useEffect, useRef, type JSX } from 'react';
+import PaymentMethodContext from "#context/PaymentMethodContext"
+import { useContext, useEffect, useRef, type JSX } from "react"
 
 export interface WireTransferConfig {
   infoMessage?: {
@@ -9,20 +9,15 @@ export interface WireTransferConfig {
 }
 
 const defaultMessage =
-  'after placing the order, you will need to manually complete the payment with your bank'
+  "after placing the order, you will need to manually complete the payment with your bank"
 
-type Props = WireTransferConfig &
-  JSX.IntrinsicElements['div'] & { 'data-testid'?: string }
+type Props = WireTransferConfig & JSX.IntrinsicElements["div"] & { "data-testid"?: string }
 
 export function WireTransferPayment({ infoMessage, ...p }: Props): JSX.Element {
-  const { className, 'data-testid': dataTestId } = p
+  const { className, "data-testid": dataTestId } = p
   const ref = useRef<null | HTMLFormElement>(null)
-  const {
-    setPaymentSource,
-    paymentSource,
-    currentPaymentMethodType,
-    setPaymentRef
-  } = useContext(PaymentMethodContext)
+  const { setPaymentSource, paymentSource, currentPaymentMethodType, setPaymentRef } =
+    useContext(PaymentMethodContext)
   useEffect(() => {
     if (ref.current && paymentSource && currentPaymentMethodType) {
       ref.current.onsubmit = async () => {
@@ -44,11 +39,11 @@ export function WireTransferPayment({ infoMessage, ...p }: Props): JSX.Element {
             metadata: {
               card: {
                 id: paymentSource.id,
-                brand: 'wire-transfer',
-                last4: ''
-              }
-            }
-          }
+                brand: "wire-transfer",
+                last4: "",
+              },
+            },
+          },
         })
         return true
       } catch (error) {
@@ -60,9 +55,7 @@ export function WireTransferPayment({ infoMessage, ...p }: Props): JSX.Element {
   return (
     <form ref={ref}>
       <div className={className} data-testid={dataTestId}>
-        <span className={infoMessage?.className}>
-          {infoMessage?.text ?? defaultMessage}
-        </span>
+        <span className={infoMessage?.className}>{infoMessage?.text ?? defaultMessage}</span>
       </div>
     </form>
   )
diff --git a/packages/react-components/src/components/prices/Price.tsx b/packages/react-components/src/components/prices/Price.tsx
index 8daf212e..0bdc99b1 100644
--- a/packages/react-components/src/components/prices/Price.tsx
+++ b/packages/react-components/src/components/prices/Price.tsx
@@ -14,8 +14,7 @@ interface PriceChildrenProps extends Omit<PriceProps, "children"> {
   prices: PriceType[]
 }
 
-export interface PriceProps
-  extends Omit<JSX.IntrinsicElements["span"], "children" | "ref"> {
+export interface PriceProps extends Omit<JSX.IntrinsicElements["span"], "children" | "ref"> {
   children?: ChildrenFunction<PriceChildrenProps>
   /**
    * CSS class name to be added for the compare price
@@ -78,10 +77,7 @@ export function Price(props: PriceProps): ReactNode {
     isLoading: batchLoading,
     registerSku,
     unregisterSku,
-  } = usePrices(
-    isStandalone ? (accessToken ?? "") : "",
-    isStandalone ? interceptors : undefined,
-  )
+  } = usePrices(isStandalone ? (accessToken ?? "") : "", isStandalone ? interceptors : undefined)
 
   // Standalone: register/unregister this SKU
   useEffect(() => {
diff --git a/packages/react-components/src/components/prices/PricesContainer.tsx b/packages/react-components/src/components/prices/PricesContainer.tsx
index 50d1198d..1c3d7109 100644
--- a/packages/react-components/src/components/prices/PricesContainer.tsx
+++ b/packages/react-components/src/components/prices/PricesContainer.tsx
@@ -1,14 +1,6 @@
 import { usePrices } from "@commercelayer/hooks"
 import type { QueryPageSize } from "@commercelayer/sdk"
-import {
-  type JSX,
-  useCallback,
-  useContext,
-  useEffect,
-  useMemo,
-  useRef,
-  useState,
-} from "react"
+import { type JSX, useCallback, useContext, useEffect, useMemo, useRef, useState } from "react"
 import CommerceLayerContext from "#context/CommerceLayerContext"
 import PricesContext, { type PricesContextValue } from "#context/PricesContext"
 import SkuContext from "#context/SkuContext"
@@ -65,9 +57,7 @@ export function PricesContainer({
 }: Props): JSX.Element {
   const config = useContext(CommerceLayerContext)
   const { skuCodes: contextSkuCodes } = useContext(SkuContext)
-  const [skuCodes, setSkuCodesState] = useState<string[]>(
-    skuCode ? [skuCode] : [],
-  )
+  const [skuCodes, setSkuCodesState] = useState<string[]>(skuCode ? [skuCode] : [])
   const {
     prices: pricesList,
     isLoading,
@@ -75,8 +65,7 @@ export function PricesContainer({
     clearPrices,
   } = usePrices(config.accessToken ?? "", config.interceptors)
 
-  const sCode =
-    contextSkuCodes != null && contextSkuCodes.length > 0 ? "" : skuCode
+  const sCode = contextSkuCodes != null && contextSkuCodes.length > 0 ? "" : skuCode
 
   // Sync skuCodes from SkuContext (e.g. when used inside <SkusContainer>)
   useEffect(() => {
@@ -92,10 +81,7 @@ export function PricesContainer({
   const filtersKey = JSON.stringify(filters)
   // biome-ignore lint/correctness/useExhaustiveDependencies: fetchPrices/clearPrices are stable; filtersKey stringifies filters for stable comparison
   useEffect(() => {
-    const codes =
-      contextSkuCodes != null && contextSkuCodes.length > 0
-        ? contextSkuCodes
-        : skuCodes
+    const codes = contextSkuCodes != null && contextSkuCodes.length > 0 ? contextSkuCodes : skuCodes
     if (config.accessToken != null && codes.length > 0) {
       if (fetchTimerRef.current != null) clearTimeout(fetchTimerRef.current)
       fetchTimerRef.current = setTimeout(() => {
@@ -111,16 +97,13 @@ export function PricesContainer({
     }
   }, [config.accessToken, skuCodes, contextSkuCodes, filtersKey, perPage])
 
-  const setSkuCodes = useCallback(
-    ({ skuCodes: newCodes }: { skuCodes: string[] }) => {
-      // Functional update so concurrent Price children don't overwrite each other
-      setSkuCodesState((prev) => {
-        const merged = Array.from(new Set([...prev, ...newCodes]))
-        return merged.length === prev.length ? prev : merged
-      })
-    },
-    [],
-  )
+  const setSkuCodes = useCallback(({ skuCodes: newCodes }: { skuCodes: string[] }) => {
+    // Functional update so concurrent Price children don't overwrite each other
+    setSkuCodesState((prev) => {
+      const merged = Array.from(new Set([...prev, ...newCodes]))
+      return merged.length === prev.length ? prev : merged
+    })
+  }, [])
 
   const pricesMap = useMemo(() => getPricesMap(pricesList), [pricesList])
 
@@ -134,14 +117,10 @@ export function PricesContainer({
       loader,
       setSkuCodes,
     }),
-    [isLoading, pricesMap, skuCodes, sCode, loader, setSkuCodes],
+    [isLoading, pricesMap, skuCodes, sCode, loader, setSkuCodes]
   )
 
-  return (
-    <PricesContext.Provider value={contextValue}>
-      {children}
-    </PricesContext.Provider>
-  )
+  return <PricesContext.Provider value={contextValue}>{children}</PricesContext.Provider>
 }
 
 export default PricesContainer
diff --git a/packages/react-components/src/components/shipments/Shipment.tsx b/packages/react-components/src/components/shipments/Shipment.tsx
index ab43c292..5fa8272b 100644
--- a/packages/react-components/src/components/shipments/Shipment.tsx
+++ b/packages/react-components/src/components/shipments/Shipment.tsx
@@ -1,12 +1,12 @@
-import { useContext, type ReactNode, useState, useEffect, type JSX } from 'react';
-import ShipmentContext from '#context/ShipmentContext'
+import { useContext, type ReactNode, useState, useEffect, type JSX } from "react"
+import ShipmentContext from "#context/ShipmentContext"
 import ShipmentChildrenContext, {
-  type InitialShipmentContext
-} from '#context/ShipmentChildrenContext'
-import getLoaderComponent from '#utils/getLoaderComponent'
-import type { LoaderType } from '#typings'
-import type { Order } from '@commercelayer/sdk'
-import OrderContext from '#context/OrderContext'
+  type InitialShipmentContext,
+} from "#context/ShipmentChildrenContext"
+import getLoaderComponent from "#utils/getLoaderComponent"
+import type { LoaderType } from "#typings"
+import type { Order } from "@commercelayer/sdk"
+import OrderContext from "#context/OrderContext"
 
 interface ShipmentProps {
   children: ReactNode
@@ -16,12 +16,11 @@ interface ShipmentProps {
 
 export function Shipment({
   children,
-  loader = 'Loading...',
-  autoSelectSingleShippingMethod = false
+  loader = "Loading...",
+  autoSelectSingleShippingMethod = false,
 }: ShipmentProps): JSX.Element {
   const [loading, setLoading] = useState(true)
-  const { shipments, deliveryLeadTimes, setShippingMethod } =
-    useContext(ShipmentContext)
+  const { shipments, deliveryLeadTimes, setShippingMethod } = useContext(ShipmentContext)
   const { order } = useContext(OrderContext)
   useEffect(() => {
     if (shipments != null) {
@@ -30,17 +29,10 @@ export function Shipment({
           for (const shipment of shipments) {
             const isSingle = shipment?.available_shipping_methods?.length === 1
             if (!shipment?.shipping_method && isSingle) {
-              const [shippingMethod] =
-                shipment?.available_shipping_methods || []
+              const [shippingMethod] = shipment?.available_shipping_methods || []
               if (shippingMethod && setShippingMethod != null) {
-                const { success, order } = await setShippingMethod(
-                  shipment.id,
-                  shippingMethod.id
-                )
-                if (
-                  typeof autoSelectSingleShippingMethod === 'function' &&
-                  success
-                ) {
+                const { success, order } = await setShippingMethod(shipment.id, shippingMethod.id)
+                if (typeof autoSelectSingleShippingMethod === "function" && success) {
                   autoSelectSingleShippingMethod(order)
                 }
               }
@@ -70,9 +62,7 @@ export function Shipment({
     })
     const shippingMethods = shipment.available_shipping_methods
     const currentShippingMethodId =
-      autoSelectSingleShippingMethod &&
-      shippingMethods &&
-      shippingMethods.length === 1
+      autoSelectSingleShippingMethod && shippingMethods && shippingMethods.length === 1
         ? shippingMethods[0]?.id
         : shipment.shipping_method?.id
     const stockTransfers = shipment.stock_transfers
@@ -88,7 +78,7 @@ export function Shipment({
       stockTransfers,
       deliveryLeadTimes: times,
       shipment,
-      keyNumber: shipment?.id
+      keyNumber: shipment?.id,
     }
     return (
       <ShipmentChildrenContext.Provider key={k} value={shipmentProps}>
diff --git a/packages/react-components/src/components/shipments/ShipmentField.tsx b/packages/react-components/src/components/shipments/ShipmentField.tsx
index 3e3aa69e..60070947 100644
--- a/packages/react-components/src/components/shipments/ShipmentField.tsx
+++ b/packages/react-components/src/components/shipments/ShipmentField.tsx
@@ -1,22 +1,22 @@
-import { useContext, type JSX } from 'react';
-import Parent from '#components/utils/Parent'
-import type { Shipment } from '@commercelayer/sdk'
-import ShipmentChildrenContext from '#context/ShipmentChildrenContext'
+import { useContext, type JSX } from "react"
+import Parent from "#components/utils/Parent"
+import type { Shipment } from "@commercelayer/sdk"
+import ShipmentChildrenContext from "#context/ShipmentChildrenContext"
 
-type ShipmentFieldChildrenProps = Omit<Props, 'children'> & {
+type ShipmentFieldChildrenProps = Omit<Props, "children"> & {
   shipment: Shipment
 }
 
 export type ShipmentAttribute =
-  | 'number'
-  | 'currency_code'
-  | 'status'
-  | 'cost_amount_cents'
-  | 'cost_amount_float'
-  | 'formatted_cost_amount'
-  | 'key_number'
+  | "number"
+  | "currency_code"
+  | "status"
+  | "cost_amount_cents"
+  | "cost_amount_float"
+  | "formatted_cost_amount"
+  | "key_number"
 
-interface Props extends Omit<JSX.IntrinsicElements['span'], 'children' | 'ref'> {
+interface Props extends Omit<JSX.IntrinsicElements["span"], "children" | "ref"> {
   children?: (props: ShipmentFieldChildrenProps) => JSX.Element
   name: ShipmentAttribute
 }
@@ -26,12 +26,12 @@ export function ShipmentField(props: Props): JSX.Element {
   const { shipment, keyNumber } = useContext(ShipmentChildrenContext)
   const key = name
   const text =
-    key !== 'key_number'
+    key !== "key_number"
       ? (shipment?.[key as keyof Shipment] as string | number | undefined)
       : keyNumber
   const parentProps = {
     shipment,
-    ...props
+    ...props,
   }
   return props.children ? (
     <Parent {...parentProps}>{props.children}</Parent>
diff --git a/packages/react-components/src/components/shipments/ShipmentsContainer.tsx b/packages/react-components/src/components/shipments/ShipmentsContainer.tsx
index e0a5cec6..73ff5b53 100644
--- a/packages/react-components/src/components/shipments/ShipmentsContainer.tsx
+++ b/packages/react-components/src/components/shipments/ShipmentsContainer.tsx
@@ -1,17 +1,15 @@
-import ShipmentContext, {
-  defaultShipmentContext
-} from '#context/ShipmentContext'
-import { type ReactNode, useContext, useEffect, useMemo, useReducer, type JSX } from 'react';
+import ShipmentContext, { defaultShipmentContext } from "#context/ShipmentContext"
+import { type ReactNode, useContext, useEffect, useMemo, useReducer, type JSX } from "react"
 import shipmentReducer, {
   shipmentInitialState,
   setShipmentErrors,
   getShipments,
-  setShippingMethod
-} from '#reducers/ShipmentReducer'
-import OrderContext from '#context/OrderContext'
-import CommerceLayerContext from '#context/CommerceLayerContext'
-import type { BaseError } from '#typings/errors'
-import { isEmpty } from '#utils/isEmpty'
+  setShippingMethod,
+} from "#reducers/ShipmentReducer"
+import OrderContext from "#context/OrderContext"
+import CommerceLayerContext from "#context/CommerceLayerContext"
+import type { BaseError } from "#typings/errors"
+import { isEmpty } from "#utils/isEmpty"
 
 interface Props {
   children: ReactNode
@@ -19,31 +17,30 @@ interface Props {
 export function ShipmentsContainer(props: Props): JSX.Element {
   const { children } = props
   const [state, dispatch] = useReducer(shipmentReducer, shipmentInitialState)
-  const { order, getOrder, include, addResourceToInclude, includeLoaded } =
-    useContext(OrderContext)
+  const { order, getOrder, include, addResourceToInclude, includeLoaded } = useContext(OrderContext)
   const config = useContext(CommerceLayerContext)
   useEffect(() => {
-    if (!include?.includes('shipments.available_shipping_methods')) {
+    if (!include?.includes("shipments.available_shipping_methods")) {
       addResourceToInclude({
         newResource: [
-          'shipments.available_shipping_methods',
-          'shipments.stock_line_items.line_item',
-          'shipments.shipping_method',
-          'shipments.stock_transfers.line_item',
-          'shipments.stock_location',
-          'shipments.parcels.parcel_line_items'
-        ]
+          "shipments.available_shipping_methods",
+          "shipments.stock_line_items.line_item",
+          "shipments.shipping_method",
+          "shipments.stock_transfers.line_item",
+          "shipments.stock_location",
+          "shipments.parcels.parcel_line_items",
+        ],
       })
-    } else if (!includeLoaded?.['shipments.available_shipping_methods']) {
+    } else if (!includeLoaded?.["shipments.available_shipping_methods"]) {
       addResourceToInclude({
         newResourceLoaded: {
-          'shipments.available_shipping_methods': true,
-          'shipments.stock_line_items.line_item': true,
-          'shipments.shipping_method': true,
-          'shipments.stock_transfers.line_item': true,
-          'shipments.stock_location': true,
-          'shipments.parcels.parcel_line_items': true
-        }
+          "shipments.available_shipping_methods": true,
+          "shipments.stock_line_items.line_item": true,
+          "shipments.shipping_method": true,
+          "shipments.stock_transfers.line_item": true,
+          "shipments.stock_location": true,
+          "shipments.parcels.parcel_line_items": true,
+        },
       })
     }
   }, [include?.length, includeLoaded != null])
@@ -57,8 +54,7 @@ export function ShipmentsContainer(props: Props): JSX.Element {
       if (order.shipments && order.shipments.length > 0) {
         const hasShippingMethods = order.shipments.map((shipment) => {
           return (
-            shipment.available_shipping_methods &&
-            shipment.available_shipping_methods.length > 0
+            shipment.available_shipping_methods && shipment.available_shipping_methods.length > 0
           )
         })
         if (hasShippingMethods.includes(false)) {
@@ -66,10 +62,10 @@ export function ShipmentsContainer(props: Props): JSX.Element {
             [
               ...(state.errors || []),
               {
-                code: 'NO_SHIPPING_METHODS',
-                message: 'No shipping methods',
-                resource: 'shipments'
-              }
+                code: "NO_SHIPPING_METHODS",
+                message: "No shipping methods",
+                resource: "shipments",
+              },
             ],
             dispatch
           )
@@ -77,7 +73,7 @@ export function ShipmentsContainer(props: Props): JSX.Element {
       }
       if (order.line_items && order.line_items.length > 0) {
         const hasStocks = order.line_items
-          .filter(({ item_type: itemType }) => itemType === 'skus')
+          .filter(({ item_type: itemType }) => itemType === "skus")
           .map((lineItem) => {
             const conditions =
               // @ts-expect-error no type
@@ -93,10 +89,10 @@ export function ShipmentsContainer(props: Props): JSX.Element {
             [
               ...(state.errors || []),
               {
-                code: 'OUT_OF_STOCK',
-                message: 'No stock available',
-                resource: 'line_items'
-              }
+                code: "OUT_OF_STOCK",
+                message: "No stock available",
+                resource: "line_items",
+              },
             ],
             dispatch
           )
@@ -119,15 +115,11 @@ export function ShipmentsContainer(props: Props): JSX.Element {
           shipmentId,
           config,
           getOrder,
-          order
-        })
+          order,
+        }),
     }
   }, [state])
-  return (
-    <ShipmentContext.Provider value={contextValue}>
-      {children}
-    </ShipmentContext.Provider>
-  )
+  return <ShipmentContext.Provider value={contextValue}>{children}</ShipmentContext.Provider>
 }
 
 export default ShipmentsContainer
diff --git a/packages/react-components/src/components/shipments/ShipmentsCount.tsx b/packages/react-components/src/components/shipments/ShipmentsCount.tsx
index fcac46b8..9d7138f8 100644
--- a/packages/react-components/src/components/shipments/ShipmentsCount.tsx
+++ b/packages/react-components/src/components/shipments/ShipmentsCount.tsx
@@ -1,12 +1,12 @@
-import Parent from '#components/utils/Parent'
-import ShipmentContext from '#context/ShipmentContext'
-import type { ChildrenFunction } from '#typings/index'
-import useCustomContext from '#utils/hooks/useCustomContext'
-import type { Shipment } from '@commercelayer/sdk'
+import Parent from "#components/utils/Parent"
+import ShipmentContext from "#context/ShipmentContext"
+import type { ChildrenFunction } from "#typings/index"
+import useCustomContext from "#utils/hooks/useCustomContext"
+import type { Shipment } from "@commercelayer/sdk"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
-interface ChildrenProps extends Omit<Props, 'children'> {
+interface ChildrenProps extends Omit<Props, "children"> {
   /**
    * Shipments of the current order
    */
@@ -17,28 +17,24 @@ interface ChildrenProps extends Omit<Props, 'children'> {
   quantity: number
 }
 
-interface Props extends Omit<JSX.IntrinsicElements['span'], 'children' | 'ref'> {
+interface Props extends Omit<JSX.IntrinsicElements["span"], "children" | "ref"> {
   children?: ChildrenFunction<ChildrenProps>
 }
 
 export function ShipmentsCount({ children, ...p }: Props): JSX.Element {
   const { shipments } = useCustomContext({
     context: ShipmentContext,
-    contextComponentName: 'ShipmentsContainer',
-    currentComponentName: 'ShipmentsCount',
-    key: 'shipments'
+    contextComponentName: "ShipmentsContainer",
+    currentComponentName: "ShipmentsCount",
+    key: "shipments",
   })
   const quantity = shipments?.length ?? 0
   const childrenProps: ChildrenProps = {
     ...p,
     quantity,
-    shipments
+    shipments,
   }
-  return children ? (
-    <Parent {...childrenProps}>{children}</Parent>
-  ) : (
-    <span {...p}>{quantity}</span>
-  )
+  return children ? <Parent {...childrenProps}>{children}</Parent> : <span {...p}>{quantity}</span>
 }
 
 export default ShipmentsCount
diff --git a/packages/react-components/src/components/shipping_methods/ShippingMethod.tsx b/packages/react-components/src/components/shipping_methods/ShippingMethod.tsx
index d8b33b29..be6917d4 100644
--- a/packages/react-components/src/components/shipping_methods/ShippingMethod.tsx
+++ b/packages/react-components/src/components/shipping_methods/ShippingMethod.tsx
@@ -1,7 +1,7 @@
-import { useContext, type ReactNode, useEffect, useState, type JSX } from 'react';
-import ShippingMethodChildrenContext from '#context/ShippingMethodChildrenContext'
-import ShipmentChildrenContext from '#context/ShipmentChildrenContext'
-import { isEmpty } from '#utils/isEmpty'
+import { useContext, type ReactNode, useEffect, useState, type JSX } from "react"
+import ShippingMethodChildrenContext from "#context/ShippingMethodChildrenContext"
+import ShipmentChildrenContext from "#context/ShipmentChildrenContext"
+import { isEmpty } from "#utils/isEmpty"
 
 interface Props {
   children: ReactNode
@@ -9,17 +9,9 @@ interface Props {
   emptyText?: string
 }
 export function ShippingMethod(props: Props): JSX.Element {
-  const {
-    children,
-    readonly,
-    emptyText = `There are not any shipping method available`
-  } = props
-  const {
-    shippingMethods,
-    currentShippingMethodId,
-    deliveryLeadTimes,
-    shipment
-  } = useContext(ShipmentChildrenContext)
+  const { children, readonly, emptyText = `There are not any shipping method available` } = props
+  const { shippingMethods, currentShippingMethodId, deliveryLeadTimes, shipment } =
+    useContext(ShipmentChildrenContext)
   const [items, setItems] = useState<JSX.Element[]>([])
   useEffect(() => {
     const methods = shippingMethods
@@ -37,7 +29,7 @@ export function ShippingMethod(props: Props): JSX.Element {
           shipmentId: shipment?.id,
           shippingMethod,
           currentShippingMethodId,
-          deliveryLeadTimeForShipment
+          deliveryLeadTimeForShipment,
         }
         return (
           <ShippingMethodChildrenContext.Provider key={k} value={shippingProps}>
diff --git a/packages/react-components/src/components/shipping_methods/ShippingMethodName.tsx b/packages/react-components/src/components/shipping_methods/ShippingMethodName.tsx
index 1a42372d..389a3f2c 100644
--- a/packages/react-components/src/components/shipping_methods/ShippingMethodName.tsx
+++ b/packages/react-components/src/components/shipping_methods/ShippingMethodName.tsx
@@ -1,29 +1,29 @@
-import { useContext, type JSX } from 'react';
-import ShippingMethodChildrenContext from '#context/ShippingMethodChildrenContext'
-import Parent from '#components/utils/Parent'
-import type { ShippingMethod } from '@commercelayer/sdk'
+import { useContext, type JSX } from "react"
+import ShippingMethodChildrenContext from "#context/ShippingMethodChildrenContext"
+import Parent from "#components/utils/Parent"
+import type { ShippingMethod } from "@commercelayer/sdk"
 
-type ChildrenProps = Omit<Props, 'children'> & {
+type ChildrenProps = Omit<Props, "children"> & {
   label: string
   shippingMethod: ShippingMethod
 }
 
-interface Props extends Omit<JSX.IntrinsicElements['label'], 'children' | 'ref'> {
+interface Props extends Omit<JSX.IntrinsicElements["label"], "children" | "ref"> {
   children?: (props: ChildrenProps) => JSX.Element
 }
 
 export function ShippingMethodName(props: Props): JSX.Element {
-  const { shippingMethod, deliveryLeadTimeForShipment, shipmentId } =
-    useContext(ShippingMethodChildrenContext)
-  const htmlFor =
-    `shipment-${shipmentId ?? ''}-${shippingMethod?.id ?? ''}` || ''
+  const { shippingMethod, deliveryLeadTimeForShipment, shipmentId } = useContext(
+    ShippingMethodChildrenContext
+  )
+  const htmlFor = `shipment-${shipmentId ?? ""}-${shippingMethod?.id ?? ""}` || ""
   const labelName = shippingMethod?.name
   const parentProps = {
     shippingMethod,
     deliveryLeadTimeForShipment,
     label: labelName,
     htmlFor,
-    ...props
+    ...props,
   }
   return props.children ? (
     <Parent {...parentProps}>{props.children}</Parent>
diff --git a/packages/react-components/src/components/shipping_methods/ShippingMethodPrice.tsx b/packages/react-components/src/components/shipping_methods/ShippingMethodPrice.tsx
index 94f89fed..10d4e9a1 100644
--- a/packages/react-components/src/components/shipping_methods/ShippingMethodPrice.tsx
+++ b/packages/react-components/src/components/shipping_methods/ShippingMethodPrice.tsx
@@ -1,8 +1,8 @@
-import { useState, useEffect, useContext, type JSX } from 'react';
-import getAmount from '#utils/getAmount'
-import ShippingMethodChildrenContext from '#context/ShippingMethodChildrenContext'
-import Parent from '#components/utils/Parent'
-import type { BaseAmountComponent } from '#typings/index'
+import { useState, useEffect, useContext, type JSX } from "react"
+import getAmount from "#utils/getAmount"
+import ShippingMethodChildrenContext from "#context/ShippingMethodChildrenContext"
+import Parent from "#components/utils/Parent"
+import type { BaseAmountComponent } from "#typings/index"
 
 type Props = BaseAmountComponent & {
   /**
@@ -15,26 +15,26 @@ type Props = BaseAmountComponent & {
   labelExternal?: string
 } & (
     | {
-        type?: 'amount'
-        base?: 'freeOver'
+        type?: "amount"
+        base?: "freeOver"
       }
     | {
-        type?: 'amount' | 'amountForShipment'
-        base?: 'price'
+        type?: "amount" | "amountForShipment"
+        base?: "price"
       }
   )
 
 export function ShippingMethodPrice(props: Props): JSX.Element {
   const {
-    base = 'price_amount',
-    type = 'for_shipment',
-    format = 'formatted',
-    labelFreeOver = 'Free',
-    labelExternal = 'Price estimates after the shipping method selection',
+    base = "price_amount",
+    type = "for_shipment",
+    format = "formatted",
+    labelFreeOver = "Free",
+    labelExternal = "Price estimates after the shipping method selection",
     ...p
   } = props
   const { shippingMethod } = useContext(ShippingMethodChildrenContext)
-  const [price, setPrice] = useState('')
+  const [price, setPrice] = useState("")
   const [priceCents, setPriceCents] = useState(0)
   const scheme = shippingMethod?.scheme
   useEffect(() => {
@@ -43,32 +43,32 @@ export function ShippingMethodPrice(props: Props): JSX.Element {
         base,
         type,
         format,
-        obj: shippingMethod
+        obj: shippingMethod,
       })
       setPrice(p)
       const pCents = getAmount<number>({
-        base: 'price_amount',
-        type: 'for_shipment',
-        format: 'cents',
-        obj: shippingMethod
+        base: "price_amount",
+        type: "for_shipment",
+        format: "cents",
+        obj: shippingMethod,
       })
       setPriceCents(pCents)
     }
     return (): void => {
-      setPrice('')
+      setPrice("")
       setPriceCents(0)
     }
   }, [shippingMethod])
   const parentProps = {
     price,
     scheme,
-    ...p
+    ...p,
   }
   const finalPrice = priceCents === 0 ? labelFreeOver : price
   return props.children ? (
     <Parent {...parentProps}>{props.children}</Parent>
   ) : (
-    <span {...p}>{scheme === 'external' ? labelExternal : finalPrice}</span>
+    <span {...p}>{scheme === "external" ? labelExternal : finalPrice}</span>
   )
 }
 
diff --git a/packages/react-components/src/components/shipping_methods/ShippingMethodRadioButton.tsx b/packages/react-components/src/components/shipping_methods/ShippingMethodRadioButton.tsx
index 96cdbad9..8cb6a6a3 100644
--- a/packages/react-components/src/components/shipping_methods/ShippingMethodRadioButton.tsx
+++ b/packages/react-components/src/components/shipping_methods/ShippingMethodRadioButton.tsx
@@ -1,10 +1,10 @@
-import { useContext, useEffect, useState, type JSX } from 'react';
-import ShippingMethodChildrenContext from '#context/ShippingMethodChildrenContext'
-import Parent from '#components/utils/Parent'
-import ShipmentContext from '#context/ShipmentContext'
-import type { Order, ShippingMethod } from '@commercelayer/sdk'
+import { useContext, useEffect, useState, type JSX } from "react"
+import ShippingMethodChildrenContext from "#context/ShippingMethodChildrenContext"
+import Parent from "#components/utils/Parent"
+import ShipmentContext from "#context/ShipmentContext"
+import type { Order, ShippingMethod } from "@commercelayer/sdk"
 
-interface ShippingMethodRadioButtonType extends Omit<Props, 'children'> {
+interface ShippingMethodRadioButtonType extends Omit<Props, "children"> {
   shippingMethod: ShippingMethod
   shipmentId: string
 }
@@ -18,7 +18,7 @@ interface TOnChange {
 type Props = {
   children?: (props: ShippingMethodRadioButtonType) => JSX.Element
   onChange?: (params: TOnChange) => void
-} & Omit<JSX.IntrinsicElements['input'], 'onChange' | 'ref' | 'children'>
+} & Omit<JSX.IntrinsicElements["input"], "onChange" | "ref" | "children">
 
 export function ShippingMethodRadioButton(props: Props): JSX.Element {
   const { onChange, children, ...p } = props
@@ -29,8 +29,8 @@ export function ShippingMethodRadioButton(props: Props): JSX.Element {
   )
   const { setShippingMethod } = useContext(ShipmentContext)
   const shippingMethodId = shippingMethod?.id
-  const name = `shipment-${shipmentId ?? ''}`
-  const id = `${name}-${shippingMethodId ?? ''}`
+  const name = `shipment-${shipmentId ?? ""}`
+  const id = `${name}-${shippingMethodId ?? ""}`
   useEffect(() => {
     if (shippingMethodId === currentShippingMethodId) {
       setChecked(true)
@@ -49,7 +49,7 @@ export function ShippingMethodRadioButton(props: Props): JSX.Element {
           onChange({
             shippingMethod,
             shipmentId,
-            order
+            order,
           })
       }
     }
@@ -62,14 +62,14 @@ export function ShippingMethodRadioButton(props: Props): JSX.Element {
     name,
     id,
     disabled,
-    ...props
+    ...props,
   }
   return children ? (
     <Parent {...parentProps}>{children}</Parent>
   ) : (
     <input
       disabled={disabled}
-      type='radio'
+      type="radio"
       name={name}
       id={id}
       onChange={(e) => {
diff --git a/packages/react-components/src/components/skus/AvailabilityContainer.tsx b/packages/react-components/src/components/skus/AvailabilityContainer.tsx
index 29d34039..82ab25e4 100644
--- a/packages/react-components/src/components/skus/AvailabilityContainer.tsx
+++ b/packages/react-components/src/components/skus/AvailabilityContainer.tsx
@@ -56,16 +56,14 @@ export function AvailabilityContainer({
     currentComponentName: "AvailabilityContainer",
     key: "accessToken",
   })
-  const { availability, fetchAvailability, clearAvailability } =
-    useAvailability(accessToken ?? "", interceptors)
+  const { availability, fetchAvailability, clearAvailability } = useAvailability(
+    accessToken ?? "",
+    interceptors
+  )
   const sCode = skuCode ?? lineItem?.sku_code ?? sku?.code
 
   useEffect(() => {
-    if (
-      accessToken != null &&
-      accessToken !== "" &&
-      (sCode != null || skuId != null)
-    ) {
+    if (accessToken != null && accessToken !== "" && (sCode != null || skuId != null)) {
       fetchAvailability({ skuCode: sCode, skuId })
     }
     return () => {
@@ -79,15 +77,10 @@ export function AvailabilityContainer({
     }
   }, [availability?.quantity, getQuantity])
 
-  const contextValue = useMemo(
-    () => ({ ...availability, parent: true }),
-    [availability],
-  )
+  const contextValue = useMemo(() => ({ ...availability, parent: true }), [availability])
 
   return (
-    <AvailabilityContext.Provider value={contextValue}>
-      {children}
-    </AvailabilityContext.Provider>
+    <AvailabilityContext.Provider value={contextValue}>{children}</AvailabilityContext.Provider>
   )
 }
 
diff --git a/packages/react-components/src/components/skus/AvailabilityTemplate.tsx b/packages/react-components/src/components/skus/AvailabilityTemplate.tsx
index 462a2d76..82c54f23 100644
--- a/packages/react-components/src/components/skus/AvailabilityTemplate.tsx
+++ b/packages/react-components/src/components/skus/AvailabilityTemplate.tsx
@@ -5,9 +5,7 @@ import AvailabilityContext from "#context/AvailabilityContext"
 import type { ChildrenFunction, TimeFormat } from "#typings/index"
 import useCustomContext from "#utils/hooks/useCustomContext"
 
-interface AvailabilityTemplateChildrenProps
-  extends Omit<Props, "children">,
-    DeliveryLeadTime {
+interface AvailabilityTemplateChildrenProps extends Omit<Props, "children">, DeliveryLeadTime {
   text: string
   quantity: number
 }
@@ -62,14 +60,8 @@ type Props = {
  * </span>
  */
 export function AvailabilityTemplate(props: Props): JSX.Element {
-  const {
-    timeFormat,
-    showShippingMethodName,
-    showShippingMethodPrice,
-    children,
-    labels,
-    ...p
-  } = props
+  const { timeFormat, showShippingMethodName, showShippingMethodPrice, children, labels, ...p } =
+    props
   const {
     min,
     max,
@@ -89,17 +81,12 @@ export function AvailabilityTemplate(props: Props): JSX.Element {
     showShippingMethodPrice && shippingMethod?.formatted_price_amount
       ? `(${shippingMethod?.formatted_price_amount})`
       : ""
-  const name =
-    showShippingMethodName && shippingMethod
-      ? `with ${shippingMethod.name}`
-      : ""
+  const name = showShippingMethodName && shippingMethod ? `with ${shippingMethod.name}` : ""
   if (quantity != null) {
     if (quantity > 0) {
       text.push(labels?.available ?? "Available")
       if (mn && mx && timeFormat) {
-        text.push(
-          `in ${mn} - ${mx} ${timeFormat} ${name} ${shippingMethodPrice}`,
-        )
+        text.push(`in ${mn} - ${mx} ${timeFormat} ${name} ${shippingMethodPrice}`)
       }
     } else if (quantity === 0) {
       text.push(labels?.outOfStock ?? "Out of stock")
diff --git a/packages/react-components/src/components/skus/DeliveryLeadTime.tsx b/packages/react-components/src/components/skus/DeliveryLeadTime.tsx
index 70e1d3db..d6027715 100644
--- a/packages/react-components/src/components/skus/DeliveryLeadTime.tsx
+++ b/packages/react-components/src/components/skus/DeliveryLeadTime.tsx
@@ -2,11 +2,7 @@ import { type JSX, useContext, useEffect, useState } from "react"
 import ShippingMethodChildrenContext from "#context/ShippingMethodChildrenContext"
 import Parent from "../utils/Parent"
 
-export type DeliveryLeadTimeField =
-  | "min_hours"
-  | "max_hours"
-  | "min_days"
-  | "max_days"
+export type DeliveryLeadTimeField = "min_hours" | "max_hours" | "min_days" | "max_days"
 
 export type DeliveryLeadTimeComponentChildren = Omit<Props, "children" | "ref">
 
@@ -19,12 +15,9 @@ type Props = Partial<Omit<JSX.IntrinsicElements["span"], "ref">> & {
 export function DeliveryLeadTime(props: Props): JSX.Element {
   const { type, ...p } = props
   const [text, setText] = useState<string | number | null>()
-  const { deliveryLeadTimeForShipment } = useContext(
-    ShippingMethodChildrenContext,
-  )
+  const { deliveryLeadTimeForShipment } = useContext(ShippingMethodChildrenContext)
   useEffect(() => {
-    if (deliveryLeadTimeForShipment?.[type])
-      setText(deliveryLeadTimeForShipment[type])
+    if (deliveryLeadTimeForShipment?.[type]) setText(deliveryLeadTimeForShipment[type])
     return () => {
       setText("")
     }
diff --git a/packages/react-components/src/components/skus/Sku.tsx b/packages/react-components/src/components/skus/Sku.tsx
index 4b005879..f2c93a22 100644
--- a/packages/react-components/src/components/skus/Sku.tsx
+++ b/packages/react-components/src/components/skus/Sku.tsx
@@ -29,11 +29,7 @@ export interface SkuProps {
  * </CommerceLayer>
  * ```
  */
-export function Sku({
-  children,
-  skuCode = "",
-  loader: propLoader,
-}: SkuProps): ReactNode {
+export function Sku({ children, skuCode = "", loader: propLoader }: SkuProps): ReactNode {
   const { setSkuCodes } = useContext(SkuContext)
   const { accessToken, interceptors } = useContext(CommerceLayerContext)
   const [currentSku, setCurrentSku] = useState<SkuType | undefined>(undefined)
@@ -48,10 +44,7 @@ export function Sku({
     isLoading: batchLoading,
     registerSku,
     unregisterSku,
-  } = useSkus(
-    isStandalone ? (accessToken ?? "") : "",
-    isStandalone ? interceptors : undefined,
-  )
+  } = useSkus(isStandalone ? (accessToken ?? "") : "", isStandalone ? interceptors : undefined)
 
   // Register/unregister this SKU code with the batch store
   useEffect(() => {
diff --git a/packages/react-components/src/components/skus/SkuList.tsx b/packages/react-components/src/components/skus/SkuList.tsx
index f355510e..a5924bb2 100644
--- a/packages/react-components/src/components/skus/SkuList.tsx
+++ b/packages/react-components/src/components/skus/SkuList.tsx
@@ -1,9 +1,5 @@
 import { useSkuList } from "@commercelayer/hooks"
-import type {
-  QueryParamsRetrieve,
-  Sku,
-  SkuList as SkuListType,
-} from "@commercelayer/sdk"
+import type { QueryParamsRetrieve, Sku, SkuList as SkuListType } from "@commercelayer/sdk"
 import { type JSX, type ReactNode, useContext, useEffect, useMemo } from "react"
 import CommerceLayerContext from "#context/CommerceLayerContext"
 import SkuContext from "#context/SkuContext"
@@ -59,14 +55,14 @@ export function SkuList(props: Props): JSX.Element {
         ...params?.fields,
       },
     }),
-    [params],
+    [params]
   )
 
   const { skuList, isLoading } = useSkuList(
     isStandalone ? id : "",
     isStandalone ? (accessToken ?? "") : "",
     isStandalone ? interceptors : undefined,
-    isStandalone ? mergedParams : undefined,
+    isStandalone ? mergedParams : undefined
   )
 
   // In container mode: register this list ID with the parent container.
@@ -86,17 +82,12 @@ export function SkuList(props: Props): JSX.Element {
       loading: skusForList === undefined,
       skuCodes: (skusForList ?? []).map((s) => s.code ?? ""),
     }),
-    [skusForList],
+    [skusForList]
   )
 
-  if (isStandalone && (isLoading || skusForList == null))
-    return loader as JSX.Element
+  if (isStandalone && (isLoading || skusForList == null)) return loader as JSX.Element
 
-  return (
-    <SkuContext.Provider value={skuContextValue}>
-      {children}
-    </SkuContext.Provider>
-  )
+  return <SkuContext.Provider value={skuContextValue}>{children}</SkuContext.Provider>
 }
 
 export default SkuList
diff --git a/packages/react-components/src/components/skus/SkuListsContainer.tsx b/packages/react-components/src/components/skus/SkuListsContainer.tsx
index dc783d49..c13b034a 100644
--- a/packages/react-components/src/components/skus/SkuListsContainer.tsx
+++ b/packages/react-components/src/components/skus/SkuListsContainer.tsx
@@ -10,9 +10,7 @@ import {
   useState,
 } from "react"
 import CommerceLayerContext from "#context/CommerceLayerContext"
-import SkuListsContext, {
-  type SkuListsContextType,
-} from "#context/SkuListsContext"
+import SkuListsContext, { type SkuListsContextType } from "#context/SkuListsContext"
 
 interface Props {
   children: ReactNode
@@ -32,10 +30,7 @@ interface Props {
 export function SkuListsContainer(props: Props): JSX.Element {
   const { children, params } = props
   const config = useContext(CommerceLayerContext)
-  const { retrieveSkuList } = useSkuLists(
-    config.accessToken ?? "",
-    config.interceptors,
-  )
+  const { retrieveSkuList } = useSkuLists(config.accessToken ?? "", config.interceptors)
   const [registeredIds, setRegisteredIds] = useState<string[]>([])
   const [skuLists, setSkuLists] = useState<Record<string, Sku[]>>({})
 
@@ -59,8 +54,8 @@ export function SkuListsContainer(props: Props): JSX.Element {
           retrieveSkuList(id, mergedParams).then((skuList) => ({
             id,
             skus: (skuList?.skus ?? []) as Sku[],
-          })),
-        ),
+          }))
+        )
       ).then((results) => {
         const updated: Record<string, Sku[]> = {}
         for (const { id, skus } of results) {
@@ -78,14 +73,10 @@ export function SkuListsContainer(props: Props): JSX.Element {
       registerListId,
       setListIds: setRegisteredIds,
     }),
-    [registeredIds, skuLists, registerListId],
+    [registeredIds, skuLists, registerListId]
   )
 
-  return (
-    <SkuListsContext.Provider value={contextValue}>
-      {children}
-    </SkuListsContext.Provider>
-  )
+  return <SkuListsContext.Provider value={contextValue}>{children}</SkuListsContext.Provider>
 }
 
 export default SkuListsContainer
diff --git a/packages/react-components/src/components/skus/SkusContainer.tsx b/packages/react-components/src/components/skus/SkusContainer.tsx
index a44c9b74..fdc968a6 100644
--- a/packages/react-components/src/components/skus/SkusContainer.tsx
+++ b/packages/react-components/src/components/skus/SkusContainer.tsx
@@ -79,12 +79,10 @@ export function SkusContainer<P extends Props>(props: P): JSX.Element {
       skuCodes: skus,
       setSkuCodes: () => {},
     }),
-    [skuList, isLoading, skus],
+    [skuList, isLoading, skus]
   )
 
-  return (
-    <SkuContext.Provider value={contextValue}>{children}</SkuContext.Provider>
-  )
+  return <SkuContext.Provider value={contextValue}>{children}</SkuContext.Provider>
 }
 
 export default SkusContainer
diff --git a/packages/react-components/src/components/stock_transfers/StockTransfer.tsx b/packages/react-components/src/components/stock_transfers/StockTransfer.tsx
index 87c430b4..a17401c5 100644
--- a/packages/react-components/src/components/stock_transfers/StockTransfer.tsx
+++ b/packages/react-components/src/components/stock_transfers/StockTransfer.tsx
@@ -1,13 +1,10 @@
-import { useContext, type JSX } from 'react';
-import ShipmentChildrenContext from '#context/ShipmentChildrenContext'
+import { useContext, type JSX } from "react"
+import ShipmentChildrenContext from "#context/ShipmentChildrenContext"
 import StockTransferChildrenContext, {
-  type InitialStockTransferContext
-} from '#context/StockTransferChildrenContext'
-import type {
-  LineItem,
-  StockTransfer as TStockTransfer
-} from '@commercelayer/sdk'
-import type { DefaultChildrenType } from '#typings/globals'
+  type InitialStockTransferContext,
+} from "#context/StockTransferChildrenContext"
+import type { LineItem, StockTransfer as TStockTransfer } from "@commercelayer/sdk"
+import type { DefaultChildrenType } from "#typings/globals"
 
 interface Props {
   children: DefaultChildrenType
@@ -21,15 +18,10 @@ export function StockTransfer(props: Props): JSX.Element {
     .map((stockTransfer: TStockTransfer | LineItem, k) => {
       const stockTransferProps: InitialStockTransferContext = {
         stockTransfer:
-          stockTransfer.type === 'line_items'
-            ? stockTransfer
-            : stockTransfer?.line_item
+          stockTransfer.type === "line_items" ? stockTransfer : stockTransfer?.line_item,
       }
       return (
-        <StockTransferChildrenContext.Provider
-          key={k}
-          value={stockTransferProps}
-        >
+        <StockTransferChildrenContext.Provider key={k} value={stockTransferProps}>
           {children}
         </StockTransferChildrenContext.Provider>
       )
diff --git a/packages/react-components/src/components/stock_transfers/StockTransferField.tsx b/packages/react-components/src/components/stock_transfers/StockTransferField.tsx
index f9f31903..8306189a 100644
--- a/packages/react-components/src/components/stock_transfers/StockTransferField.tsx
+++ b/packages/react-components/src/components/stock_transfers/StockTransferField.tsx
@@ -1,30 +1,26 @@
-import StockTransferChildrenContext from '#context/StockTransferChildrenContext'
-import type { ConditionalElement } from '#typings'
+import StockTransferChildrenContext from "#context/StockTransferChildrenContext"
+import type { ConditionalElement } from "#typings"
 import GenericFieldComponent, {
   type TGenericChildrenProps,
   type TResourceKey,
-  type TResources
-} from '#components/utils/GenericFieldComponent'
+  type TResources,
+} from "#components/utils/GenericFieldComponent"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
-type StockTransferFieldChildrenProps = TGenericChildrenProps<
-  TResources['StockTransfer']
->
+type StockTransferFieldChildrenProps = TGenericChildrenProps<TResources["StockTransfer"]>
 
-type TCondition = ConditionalElement<
-  Exclude<TResources['StockTransfer'], 'resource'>
->
+type TCondition = ConditionalElement<Exclude<TResources["StockTransfer"], "resource">>
 
 type Props = {
   children?: (props: StockTransferFieldChildrenProps) => JSX.Element
 } & TCondition
 
 export function StockTransferField<P extends Props>(props: P): JSX.Element {
-  const { attribute, tagElement = 'span', children, ...p } = props
+  const { attribute, tagElement = "span", children, ...p } = props
   return (
-    <GenericFieldComponent<TResourceKey['StockTransfer']>
-      resource='stockTransfer'
+    <GenericFieldComponent<TResourceKey["StockTransfer"]>
+      resource="stockTransfer"
       attribute={attribute}
       tagElement={tagElement}
       context={StockTransferChildrenContext}
diff --git a/packages/react-components/src/components/utils/AddressCardsTemplate.tsx b/packages/react-components/src/components/utils/AddressCardsTemplate.tsx
index 83efa092..30f67a93 100644
--- a/packages/react-components/src/components/utils/AddressCardsTemplate.tsx
+++ b/packages/react-components/src/components/utils/AddressCardsTemplate.tsx
@@ -1,12 +1,11 @@
-import Parent from '#components/utils/Parent'
-import { useContext, type JSX } from 'react';
-import type { Address } from '@commercelayer/sdk'
-import AddressChildrenContext from '#context/AddressChildrenContext'
-import ShippingAddressContext from '#context/ShippingAddressContext'
-import type { ChildrenFunction } from '#typings'
+import Parent from "#components/utils/Parent"
+import { useContext, type JSX } from "react"
+import type { Address } from "@commercelayer/sdk"
+import AddressChildrenContext from "#context/AddressChildrenContext"
+import ShippingAddressContext from "#context/ShippingAddressContext"
+import type { ChildrenFunction } from "#typings"
 
-export interface TAddressCards
-  extends Pick<Props, 'customerAddresses' | 'className'> {
+export interface TAddressCards extends Pick<Props, "customerAddresses" | "className"> {
   AddressProvider: typeof AddressChildrenContext.Provider
 }
 
@@ -46,35 +45,32 @@ export default function AddressCardsTemplate({
   selectedClassName,
   className,
   disabledClassName,
-  handleSelect
+  handleSelect,
 }: Props): JSX.Element {
   const { setShippingAddress } = useContext(ShippingAddressContext)
   const addresses = customerAddresses.map((address, k) => {
     const attributes = address
     const disabled =
-      (setShippingAddress &&
-        countryLock &&
-        countryLock !== address.country_code) ||
-      false
-    const selectedClass = deselect ? '' : selectedClassName
+      (setShippingAddress && countryLock && countryLock !== address.country_code) || false
+    const selectedClass = deselect ? "" : selectedClassName
     const addressSelectedClass =
-      selected === k ? `${className ?? ''} ${selectedClass ?? ''}` : className
+      selected === k ? `${className ?? ""} ${selectedClass ?? ""}` : className
     const finalClassName = disabled
-      ? `${className ?? ''} ${disabledClassName ?? ''}`
+      ? `${className ?? ""} ${disabledClassName ?? ""}`
       : addressSelectedClass
-    const customerAddressId: string = address?.reference || ''
+    const customerAddressId: string = address?.reference || ""
     const onClick = async (): Promise<void> => {
       await handleSelect(k, address.id, customerAddressId, disabled, address)
     }
     return {
       ...attributes,
       className: finalClassName,
-      onClick
+      onClick,
     }
   })
   const value = {
     customerAddresses: addresses,
-    AddressProvider: AddressChildrenContext.Provider
+    AddressProvider: AddressChildrenContext.Provider,
   }
   return <Parent {...value}>{children}</Parent>
 }
diff --git a/packages/react-components/src/components/utils/BaseField.tsx b/packages/react-components/src/components/utils/BaseField.tsx
index 31249a10..1262884f 100644
--- a/packages/react-components/src/components/utils/BaseField.tsx
+++ b/packages/react-components/src/components/utils/BaseField.tsx
@@ -1,34 +1,25 @@
-import OrderContext from '#context/OrderContext'
-import { type FunctionComponent, useContext, useEffect, useState, type JSX } from 'react';
-import Parent from './Parent'
+import OrderContext from "#context/OrderContext"
+import { type FunctionComponent, useContext, useEffect, useState, type JSX } from "react"
+import Parent from "./Parent"
 
-type BaseFieldChildren = Omit<BaseFieldProps, 'children'>
+type BaseFieldChildren = Omit<BaseFieldProps, "children">
 
-export interface BaseFieldProps
-  extends Omit<JSX.IntrinsicElements['span'], 'children' | 'ref'> {
-  attribute: 'number' | 'id'
+export interface BaseFieldProps extends Omit<JSX.IntrinsicElements["span"], "children" | "ref"> {
+  attribute: "number" | "id"
   children?: (props: BaseFieldChildren) => JSX.Element
 }
 
-const BaseField: FunctionComponent<BaseFieldProps> = ({
-  children,
-  attribute,
-  ...p
-}) => {
+const BaseField: FunctionComponent<BaseFieldProps> = ({ children, attribute, ...p }) => {
   const { order } = useContext(OrderContext)
-  const [field, setField] = useState<string | undefined | null>('')
+  const [field, setField] = useState<string | undefined | null>("")
   useEffect(() => {
     if (order && attribute in order) setField(order[attribute])
     return () => {
-      setField('')
+      setField("")
     }
   }, [order])
   const parentProps = { attribute: field, ...p }
-  return children ? (
-    <Parent {...parentProps}>{children}</Parent>
-  ) : (
-    <span {...p}>{field}</span>
-  )
+  return children ? <Parent {...parentProps}>{children}</Parent> : <span {...p}>{field}</span>
 }
 
 export default BaseField
diff --git a/packages/react-components/src/components/utils/BaseInput.tsx b/packages/react-components/src/components/utils/BaseInput.tsx
index 122a6998..12268def 100644
--- a/packages/react-components/src/components/utils/BaseInput.tsx
+++ b/packages/react-components/src/components/utils/BaseInput.tsx
@@ -6,17 +6,10 @@ export type BaseInputProps = BaseInputComponentProps &
   Omit<JSX.IntrinsicElements["input"], "children" | "pattern"> &
   Omit<JSX.IntrinsicElements["textarea"], "children" | "pattern">
 
-const BaseInput: ForwardRefRenderFunction<any, BaseInputProps> = (
-  props,
-  ref,
-) => {
+const BaseInput: ForwardRefRenderFunction<any, BaseInputProps> = (props, ref) => {
   const { children, ...p } = props
   const input =
-    props.type === "textarea" ? (
-      <textarea ref={ref} {...p} />
-    ) : (
-      <input ref={ref} {...p} />
-    )
+    props.type === "textarea" ? <textarea ref={ref} {...p} /> : <input ref={ref} {...p} />
   return children ? (
     <Parent parentRef={ref} {...p}>
       {children}
diff --git a/packages/react-components/src/components/utils/BaseOrderPrice.tsx b/packages/react-components/src/components/utils/BaseOrderPrice.tsx
index ac66a719..d0289554 100644
--- a/packages/react-components/src/components/utils/BaseOrderPrice.tsx
+++ b/packages/react-components/src/components/utils/BaseOrderPrice.tsx
@@ -1,53 +1,46 @@
-import OrderContext from '#context/OrderContext'
-import getAmount from '#utils/getAmount'
-import Parent from './Parent'
-import { useState, useEffect, useContext, type JSX } from 'react';
-import type { PropsType } from '#utils/PropsType'
-import type { baseOrderPricePropTypes } from '#typings'
-import { isEmpty } from '#utils/isEmpty'
+import OrderContext from "#context/OrderContext"
+import getAmount from "#utils/getAmount"
+import Parent from "./Parent"
+import { useState, useEffect, useContext, type JSX } from "react"
+import type { PropsType } from "#utils/PropsType"
+import type { baseOrderPricePropTypes } from "#typings"
+import { isEmpty } from "#utils/isEmpty"
 
-export type BaseOrderPriceProps = PropsType<
-  typeof baseOrderPricePropTypes,
-  unknown
-> &
-  Omit<JSX.IntrinsicElements['span'], 'children'| 'ref'>
+export type BaseOrderPriceProps = PropsType<typeof baseOrderPricePropTypes, unknown> &
+  Omit<JSX.IntrinsicElements["span"], "children" | "ref">
 
 export function BaseOrderPrice(props: BaseOrderPriceProps): JSX.Element {
-  const { format = 'formatted', base, type, children, ...p } = props
+  const { format = "formatted", base, type, children, ...p } = props
   const { order } = useContext(OrderContext)
-  const [price, setPrice] = useState('')
+  const [price, setPrice] = useState("")
   const [cents, setCents] = useState(0)
   useEffect(() => {
     const p = getAmount({
       base,
       type,
       format: format as string,
-      obj: order || {}
+      obj: order || {},
     })
     const c = getAmount<number>({
       base,
       type,
-      format: 'cents',
-      obj: order || {}
+      format: "cents",
+      obj: order || {},
     })
     setPrice(p)
     setCents(c)
     return (): void => {
       if (isEmpty(order)) {
-        setPrice('')
+        setPrice("")
       }
     }
   }, [order])
   const parentProps = {
     priceCents: cents,
     price,
-    ...p
+    ...p,
   }
-  return children ? (
-    <Parent {...parentProps}>{children}</Parent>
-  ) : (
-    <span {...p}>{price}</span>
-  )
+  return children ? <Parent {...parentProps}>{children}</Parent> : <span {...p}>{price}</span>
 }
 
 export default BaseOrderPrice
diff --git a/packages/react-components/src/components/utils/BaseSelect.tsx b/packages/react-components/src/components/utils/BaseSelect.tsx
index 263eb735..23e6b8c4 100644
--- a/packages/react-components/src/components/utils/BaseSelect.tsx
+++ b/packages/react-components/src/components/utils/BaseSelect.tsx
@@ -1,18 +1,15 @@
-import React, { type ForwardRefRenderFunction } from 'react'
-import Parent from './Parent'
-import type { BaseSelectComponentProps } from '#typings'
+import React, { type ForwardRefRenderFunction } from "react"
+import Parent from "./Parent"
+import type { BaseSelectComponentProps } from "#typings"
 
 export type BaseSelectProps = BaseSelectComponentProps
 
-const BaseSelect: ForwardRefRenderFunction<any, BaseSelectProps> = (
-  props,
-  ref
-) => {
+const BaseSelect: ForwardRefRenderFunction<any, BaseSelectProps> = (props, ref) => {
   const {
     options = [],
     children,
-    placeholder = { label: 'Select an option', value: '' },
-    value = '',
+    placeholder = { label: "Select an option", value: "" },
+    value = "",
     ...p
   } = props
   if (placeholder != null) {
@@ -32,7 +29,7 @@ const BaseSelect: ForwardRefRenderFunction<any, BaseSelectProps> = (
   const parentProps = {
     options,
     ref,
-    ...p
+    ...p,
   }
   return children ? (
     <Parent {...parentProps}>{children}</Parent>
diff --git a/packages/react-components/src/components/utils/ErrorBoundary.tsx b/packages/react-components/src/components/utils/ErrorBoundary.tsx
index d9eef230..14635b56 100644
--- a/packages/react-components/src/components/utils/ErrorBoundary.tsx
+++ b/packages/react-components/src/components/utils/ErrorBoundary.tsx
@@ -1,4 +1,4 @@
-import { Component, type ErrorInfo, type JSX } from 'react';
+import { Component, type ErrorInfo, type JSX } from "react"
 
 interface Props {
   children: JSX.Element
@@ -10,7 +10,7 @@ interface State {
 
 export class ErrorBoundary extends Component<Props, State> {
   public state: State = {
-    hasError: false
+    hasError: false,
   }
 
   public static getDerivedStateFromError(): State {
@@ -18,8 +18,8 @@ export class ErrorBoundary extends Component<Props, State> {
   }
 
   public componentDidCatch(error: Error, errorInfo: ErrorInfo): void {
-    if (process.env.NODE_ENV !== 'test') {
-      console.error('Uncaught error:', error, errorInfo)
+    if (process.env.NODE_ENV !== "test") {
+      console.error("Uncaught error:", error, errorInfo)
     } else {
       throw error
     }
diff --git a/packages/react-components/src/components/utils/GenericFieldComponent.tsx b/packages/react-components/src/components/utils/GenericFieldComponent.tsx
index 014363ee..6fcb0056 100644
--- a/packages/react-components/src/components/utils/GenericFieldComponent.tsx
+++ b/packages/react-components/src/components/utils/GenericFieldComponent.tsx
@@ -1,31 +1,22 @@
-import type { InitialSkuContext } from '#context/SkuChildrenContext'
-import type { InitialStockTransferContext } from '#context/StockTransferChildrenContext'
-import type {
-  Customer,
-  LineItem,
-  Sku,
-  Parcel,
-  ParcelLineItem
-} from '@commercelayer/sdk'
-import Parent from './Parent'
-import type { InitialLineItemChildrenContext } from '#context/LineItemChildrenContext'
-import { type Context, useContext, type JSX } from 'react';
-import { defaultImgUrl } from '#utils/placeholderImages'
-import type { InitialCustomerContext } from '#context/CustomerContext'
-import type { InitialParcelContext } from '#context/ParcelChildrenContext'
-import type { InitialParcelLineItemContext } from '#context/ParcelLineItemChildrenContext'
+import type { InitialSkuContext } from "#context/SkuChildrenContext"
+import type { InitialStockTransferContext } from "#context/StockTransferChildrenContext"
+import type { Customer, LineItem, Sku, Parcel, ParcelLineItem } from "@commercelayer/sdk"
+import Parent from "./Parent"
+import type { InitialLineItemChildrenContext } from "#context/LineItemChildrenContext"
+import { type Context, useContext, type JSX } from "react"
+import { defaultImgUrl } from "#utils/placeholderImages"
+import type { InitialCustomerContext } from "#context/CustomerContext"
+import type { InitialParcelContext } from "#context/ParcelChildrenContext"
+import type { InitialParcelLineItemContext } from "#context/ParcelLineItemChildrenContext"
 
 export interface TResources {
-  StockTransfer: LineItem & { resource: 'stockTransfer' }
-  Sku: Sku & { resource: 'sku' }
-  LineItem: LineItem & { resource: 'lineItem' }
-  Customer: Customer & { resource: 'customers' }
-  Parcel: Parcel & { resource: 'parcel' }
-  ParcelLineItem: Pick<
-    ParcelLineItem,
-    'quantity' | 'sku_code' | 'name' | 'image_url'
-  > & {
-    resource: 'parcelLineItem'
+  StockTransfer: LineItem & { resource: "stockTransfer" }
+  Sku: Sku & { resource: "sku" }
+  LineItem: LineItem & { resource: "lineItem" }
+  Customer: Customer & { resource: "customers" }
+  Parcel: Parcel & { resource: "parcel" }
+  ParcelLineItem: Pick<ParcelLineItem, "quantity" | "sku_code" | "name" | "image_url"> & {
+    resource: "parcelLineItem"
   }
 }
 
@@ -33,10 +24,12 @@ export type TResourceKey = {
   [K in keyof TResources]: K
 }
 
-export type TGenericChildrenProps<E extends TResources[keyof TResources]> =
-  Omit<Props<E>, 'children' | 'attribute' | 'context' | 'tagElement'> & {
-    attributeValue: E[keyof E]
-  }
+export type TGenericChildrenProps<E extends TResources[keyof TResources]> = Omit<
+  Props<E>,
+  "children" | "attribute" | "context" | "tagElement"
+> & {
+  attributeValue: E[keyof E]
+}
 
 interface ResourceContext {
   stockTransfer: InitialStockTransferContext
@@ -47,13 +40,11 @@ interface ResourceContext {
   parcelLineItem: InitialParcelLineItemContext
 }
 
-type GenericContext<K extends keyof ResourceContext> = Context<
-  ResourceContext[K]
->
+type GenericContext<K extends keyof ResourceContext> = Context<ResourceContext[K]>
 
 interface Props<E extends TResources[keyof TResources]> {
   children?: (props: TGenericChildrenProps<E>) => JSX.Element
-  resource: E['resource']
+  resource: E["resource"]
   /**
    * Resource attribute to display.
    */
@@ -62,7 +53,7 @@ interface Props<E extends TResources[keyof TResources]> {
    * Html tag to render. When tag is `img` the value will be used to fill the `src` attribute.
    */
   tagElement: keyof JSX.IntrinsicElements
-  context: GenericContext<E['resource']>
+  context: GenericContext<E["resource"]>
 }
 
 export default function GenericFieldComponent<R extends keyof TResources>(
@@ -70,26 +61,32 @@ export default function GenericFieldComponent<R extends keyof TResources>(
 ): JSX.Element {
   const { children, tagElement, attribute, context, resource, ...p } = props
   const resourceContext = useContext(context)
-  let attributeValue = ''
-  const keysContext = Object.keys(resourceContext).filter(
-    (key) => key === resource
-  ) as [keyof ResourceContext[keyof ResourceContext]]
+  let attributeValue = ""
+  const keysContext = Object.keys(resourceContext).filter((key) => key === resource) as [
+    keyof ResourceContext[keyof ResourceContext],
+  ]
   if (keysContext.length === 1) {
     const [keyResource] = keysContext
     if (keyResource && attribute) {
       attributeValue = resourceContext[keyResource][attribute]
     }
   }
-  const Tag = tagElement || 'span'
-  if (Tag === 'img' && !children) {
+  const Tag = tagElement || "span"
+  if (Tag === "img" && !children) {
     const src = attributeValue || defaultImgUrl
-    const name = ''
-    return <img alt={name} src={src} {...(p as Omit<JSX.IntrinsicElements['img'], 'ref' | 'children'>)} />
+    const name = ""
+    return (
+      <img
+        alt={name}
+        src={src}
+        {...(p as Omit<JSX.IntrinsicElements["img"], "ref" | "children">)}
+      />
+    )
   }
   const parentProps = {
     attributeValue,
     tagElement,
-    ...p
+    ...p,
   }
   return children ? (
     <Parent {...parentProps}>{children}</Parent>
diff --git a/packages/react-components/src/components/utils/Parent.tsx b/packages/react-components/src/components/utils/Parent.tsx
index 0fb9571b..588e367e 100644
--- a/packages/react-components/src/components/utils/Parent.tsx
+++ b/packages/react-components/src/components/utils/Parent.tsx
@@ -1,4 +1,4 @@
-import type { Component, ForwardedRef, JSX } from 'react';
+import type { Component, ForwardedRef, JSX } from "react"
 
 export interface ParentProps {
   // Add parent ref to child
@@ -6,10 +6,7 @@ export interface ParentProps {
   children?: typeof Component | ((P: any) => JSX.Element | null)
 }
 
-export default function Parent({
-  children,
-  ...p
-}: ParentProps): JSX.Element | null {
+export default function Parent({ children, ...p }: ParentProps): JSX.Element | null {
   const Child = children
   return Child !== undefined ? <Child {...p} /> : null
 }
diff --git a/packages/react-components/src/components/utils/PaymentCardsTemplate.tsx b/packages/react-components/src/components/utils/PaymentCardsTemplate.tsx
index 0ae524dc..64e4738f 100644
--- a/packages/react-components/src/components/utils/PaymentCardsTemplate.tsx
+++ b/packages/react-components/src/components/utils/PaymentCardsTemplate.tsx
@@ -1,15 +1,13 @@
-import Parent from '#components/utils/Parent'
-import { useContext, type JSX } from 'react';
-import PaymentMethodContext from '#context/PaymentMethodContext'
-import type { PaymentResource } from '#reducers/PaymentMethodReducer'
-import PaymentSourceContext, {
-  type IconBrand
-} from '#context/PaymentSourceContext'
-import type { ChildrenFunction } from '#typings'
-import getCardDetails from '#utils/getCardDetails'
-import type { CustomerPaymentSource } from '@commercelayer/sdk'
+import Parent from "#components/utils/Parent"
+import { useContext, type JSX } from "react"
+import PaymentMethodContext from "#context/PaymentMethodContext"
+import type { PaymentResource } from "#reducers/PaymentMethodReducer"
+import PaymentSourceContext, { type IconBrand } from "#context/PaymentSourceContext"
+import type { ChildrenFunction } from "#typings"
+import getCardDetails from "#utils/getCardDetails"
+import type { CustomerPaymentSource } from "@commercelayer/sdk"
 
-interface ChildrenProps extends Pick<Props, 'customerPayments'> {
+interface ChildrenProps extends Pick<Props, "customerPayments"> {
   PaymentSourceProvider: typeof PaymentSourceContext.Provider
 }
 
@@ -50,33 +48,32 @@ interface Props {
 export default function PaymentCardsTemplate({
   customerPayments,
   children,
-  paymentResource
+  paymentResource,
 }: Props): JSX.Element {
   const { setPaymentSource } = useContext(PaymentMethodContext)
   const payments = customerPayments.map((customerPayment) => {
     const attributes = customerPayment
     const card = getCardDetails({
       customerPayment,
-      paymentType: paymentResource
+      paymentType: paymentResource,
     })
-    if (card.brand === '') {
+    if (card.brand === "") {
       card.brand =
         // @ts-expect-error missing type
-        customerPayment.payment_source?.payment_instrument?.issuer_type ??
-        'credit-card'
+        customerPayment.payment_source?.payment_instrument?.issuer_type ?? "credit-card"
     }
     const handleClick = async (e: MouseEvent): Promise<void> => {
       e.stopPropagation()
       await setPaymentSource({
         paymentResource,
-        customerPaymentSourceId: customerPayment.id
+        customerPaymentSourceId: customerPayment.id,
       })
     }
     return { ...attributes, card, handleClick }
   })
   const value = {
     customerPayments: payments,
-    PaymentSourceProvider: PaymentSourceContext.Provider
+    PaymentSourceProvider: PaymentSourceContext.Provider,
   }
   return <Parent {...value}>{children}</Parent>
 }
diff --git a/packages/react-components/src/components/utils/PriceTemplate.tsx b/packages/react-components/src/components/utils/PriceTemplate.tsx
index f9438b0a..1a2195a6 100644
--- a/packages/react-components/src/components/utils/PriceTemplate.tsx
+++ b/packages/react-components/src/components/utils/PriceTemplate.tsx
@@ -1,11 +1,11 @@
-import type { PriceProps } from '#components/prices/Price'
+import type { PriceProps } from "#components/prices/Price"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
 export type PTemplateProps = {
   formattedAmount?: string | null
   formattedCompare?: string | null
-} & Omit<PriceProps, 'children'>
+} & Omit<PriceProps, "children">
 
 export function PriceTemplate(props: PTemplateProps): JSX.Element {
   const {
@@ -19,15 +19,11 @@ export function PriceTemplate(props: PTemplateProps): JSX.Element {
   } = props
   return (
     <>
-      <span data-testid={`price-${skuCode ?? ''}`} className={className} {...p}>
+      <span data-testid={`price-${skuCode ?? ""}`} className={className} {...p}>
         {formattedAmount}
       </span>
       {showCompare && (
-        <span
-          data-testid={`compare-${skuCode ?? ''}`}
-          className={compareClassName || ''}
-          {...p}
-        >
+        <span data-testid={`compare-${skuCode ?? ""}`} className={compareClassName || ""} {...p}>
           {formattedCompare}
         </span>
       )}
diff --git a/packages/react-components/src/components/utils/getAllErrors.tsx b/packages/react-components/src/components/utils/getAllErrors.tsx
index dd7bfe58..8a3802f6 100644
--- a/packages/react-components/src/components/utils/getAllErrors.tsx
+++ b/packages/react-components/src/components/utils/getAllErrors.tsx
@@ -15,19 +15,11 @@ export interface AllErrorsParams {
 }
 
 export type GetAllErrors = <P extends AllErrorsParams>(
-  params: P,
+  params: P
 ) => Array<JSX.Element | string | undefined>
 
 const getAllErrors: GetAllErrors = (params) => {
-  const {
-    allErrors,
-    messages,
-    field,
-    props,
-    lineItem,
-    resource,
-    returnHtml = true,
-  } = params
+  const { allErrors, messages, field, props, lineItem, resource, returnHtml = true } = params
   return allErrors
     .map((v, k): JSX.Element | string | undefined => {
       const objMsg = customMessages(messages, v)
@@ -49,10 +41,7 @@ const getAllErrors: GetAllErrors = (params) => {
             )
           }
         }
-        if (
-          (field === v.field || v.detail?.includes(field)) &&
-          resource === v.resource
-        ) {
+        if ((field === v.field || v.detail?.includes(field)) && resource === v.resource) {
           return isEmpty ? undefined : returnHtml ? (
             <span key={k} {...props}>
               {text}
diff --git a/packages/react-components/src/config/currency.ts b/packages/react-components/src/config/currency.ts
index 40e699ed..83ed0193 100644
--- a/packages/react-components/src/config/currency.ts
+++ b/packages/react-components/src/config/currency.ts
@@ -1,190 +1,190 @@
 export default [
-  { value: 'AED', label: 'AED' },
-  { value: 'AFN', label: 'AFN' },
-  { value: 'ALL', label: 'ALL' },
-  { value: 'AMD', label: 'AMD' },
-  { value: 'ANG', label: 'ANG' },
-  { value: 'AOA', label: 'AOA' },
-  { value: 'ARS', label: 'ARS' },
-  { value: 'AUD', label: 'AUD' },
-  { value: 'AWG', label: 'AWG' },
-  { value: 'AZN', label: 'AZN' },
-  { value: 'BAM', label: 'BAM' },
-  { value: 'BBD', label: 'BBD' },
-  { value: 'BDT', label: 'BDT' },
-  { value: 'BGN', label: 'BGN' },
-  { value: 'BHD', label: 'BHD' },
-  { value: 'BIF', label: 'BIF' },
-  { value: 'BMD', label: 'BMD' },
-  { value: 'BND', label: 'BND' },
-  { value: 'BOB', label: 'BOB' },
-  { value: 'BRL', label: 'BRL' },
-  { value: 'BSD', label: 'BSD' },
-  { value: 'BTN', label: 'BTN' },
-  { value: 'BWP', label: 'BWP' },
-  { value: 'BYN', label: 'BYN' },
-  { value: 'BYR', label: 'BYR' },
-  { value: 'BZD', label: 'BZD' },
-  { value: 'CAD', label: 'CAD' },
-  { value: 'CDF', label: 'CDF' },
-  { value: 'CHF', label: 'CHF' },
-  { value: 'CLF', label: 'CLF' },
-  { value: 'CLP', label: 'CLP' },
-  { value: 'CNY', label: 'CNY' },
-  { value: 'COP', label: 'COP' },
-  { value: 'CRC', label: 'CRC' },
-  { value: 'CUC', label: 'CUC' },
-  { value: 'CUP', label: 'CUP' },
-  { value: 'CVE', label: 'CVE' },
-  { value: 'CZK', label: 'CZK' },
-  { value: 'DJF', label: 'DJF' },
-  { value: 'DKK', label: 'DKK' },
-  { value: 'DOP', label: 'DOP' },
-  { value: 'DZD', label: 'DZD' },
-  { value: 'EGP', label: 'EGP' },
-  { value: 'ERN', label: 'ERN' },
-  { value: 'ETB', label: 'ETB' },
-  { value: 'EUR', label: 'EUR' },
-  { value: 'FJD', label: 'FJD' },
-  { value: 'FKP', label: 'FKP' },
-  { value: 'GBP', label: 'GBP' },
-  { value: 'GEL', label: 'GEL' },
-  { value: 'GHS', label: 'GHS' },
-  { value: 'GIP', label: 'GIP' },
-  { value: 'GMD', label: 'GMD' },
-  { value: 'GNF', label: 'GNF' },
-  { value: 'GTQ', label: 'GTQ' },
-  { value: 'GYD', label: 'GYD' },
-  { value: 'HKD', label: 'HKD' },
-  { value: 'HNL', label: 'HNL' },
-  { value: 'HRK', label: 'HRK' },
-  { value: 'HTG', label: 'HTG' },
-  { value: 'HUF', label: 'HUF' },
-  { value: 'IDR', label: 'IDR' },
-  { value: 'ILS', label: 'ILS' },
-  { value: 'INR', label: 'INR' },
-  { value: 'IQD', label: 'IQD' },
-  { value: 'IRR', label: 'IRR' },
-  { value: 'ISK', label: 'ISK' },
-  { value: 'JMD', label: 'JMD' },
-  { value: 'JOD', label: 'JOD' },
-  { value: 'JPY', label: 'JPY' },
-  { value: 'KES', label: 'KES' },
-  { value: 'KGS', label: 'KGS' },
-  { value: 'KHR', label: 'KHR' },
-  { value: 'KMF', label: 'KMF' },
-  { value: 'KPW', label: 'KPW' },
-  { value: 'KRW', label: 'KRW' },
-  { value: 'KWD', label: 'KWD' },
-  { value: 'KYD', label: 'KYD' },
-  { value: 'KZT', label: 'KZT' },
-  { value: 'LAK', label: 'LAK' },
-  { value: 'LBP', label: 'LBP' },
-  { value: 'LKR', label: 'LKR' },
-  { value: 'LRD', label: 'LRD' },
-  { value: 'LSL', label: 'LSL' },
-  { value: 'LTL', label: 'LTL' },
-  { value: 'LVL', label: 'LVL' },
-  { value: 'LYD', label: 'LYD' },
-  { value: 'MAD', label: 'MAD' },
-  { value: 'MDL', label: 'MDL' },
-  { value: 'MGA', label: 'MGA' },
-  { value: 'MKD', label: 'MKD' },
-  { value: 'MMK', label: 'MMK' },
-  { value: 'MNT', label: 'MNT' },
-  { value: 'MOP', label: 'MOP' },
-  { value: 'MRO', label: 'MRO' },
-  { value: 'MUR', label: 'MUR' },
-  { value: 'MVR', label: 'MVR' },
-  { value: 'MWK', label: 'MWK' },
-  { value: 'MXN', label: 'MXN' },
-  { value: 'MYR', label: 'MYR' },
-  { value: 'MZN', label: 'MZN' },
-  { value: 'NAD', label: 'NAD' },
-  { value: 'NGN', label: 'NGN' },
-  { value: 'NIO', label: 'NIO' },
-  { value: 'NOK', label: 'NOK' },
-  { value: 'NPR', label: 'NPR' },
-  { value: 'NZD', label: 'NZD' },
-  { value: 'OMR', label: 'OMR' },
-  { value: 'PAB', label: 'PAB' },
-  { value: 'PEN', label: 'PEN' },
-  { value: 'PGK', label: 'PGK' },
-  { value: 'PHP', label: 'PHP' },
-  { value: 'PKR', label: 'PKR' },
-  { value: 'PLN', label: 'PLN' },
-  { value: 'PYG', label: 'PYG' },
-  { value: 'QAR', label: 'QAR' },
-  { value: 'RON', label: 'RON' },
-  { value: 'RSD', label: 'RSD' },
-  { value: 'RUB', label: 'RUB' },
-  { value: 'RWF', label: 'RWF' },
-  { value: 'SAR', label: 'SAR' },
-  { value: 'SBD', label: 'SBD' },
-  { value: 'SCR', label: 'SCR' },
-  { value: 'SDG', label: 'SDG' },
-  { value: 'SEK', label: 'SEK' },
-  { value: 'SGD', label: 'SGD' },
-  { value: 'SHP', label: 'SHP' },
-  { value: 'SKK', label: 'SKK' },
-  { value: 'SLL', label: 'SLL' },
-  { value: 'SOS', label: 'SOS' },
-  { value: 'SRD', label: 'SRD' },
-  { value: 'SSP', label: 'SSP' },
-  { value: 'STD', label: 'STD' },
-  { value: 'SVC', label: 'SVC' },
-  { value: 'SYP', label: 'SYP' },
-  { value: 'SZL', label: 'SZL' },
-  { value: 'THB', label: 'THB' },
-  { value: 'TJS', label: 'TJS' },
-  { value: 'TMT', label: 'TMT' },
-  { value: 'TND', label: 'TND' },
-  { value: 'TOP', label: 'TOP' },
-  { value: 'TRY', label: 'TRY' },
-  { value: 'TTD', label: 'TTD' },
-  { value: 'TWD', label: 'TWD' },
-  { value: 'TZS', label: 'TZS' },
-  { value: 'UAH', label: 'UAH' },
-  { value: 'UGX', label: 'UGX' },
-  { value: 'USD', label: 'USD' },
-  { value: 'UYU', label: 'UYU' },
-  { value: 'UZS', label: 'UZS' },
-  { value: 'VEF', label: 'VEF' },
-  { value: 'VND', label: 'VND' },
-  { value: 'VUV', label: 'VUV' },
-  { value: 'WST', label: 'WST' },
-  { value: 'XAF', label: 'XAF' },
-  { value: 'XAG', label: 'XAG' },
-  { value: 'XAU', label: 'XAU' },
-  { value: 'XBA', label: 'XBA' },
-  { value: 'XBB', label: 'XBB' },
-  { value: 'XBC', label: 'XBC' },
-  { value: 'XBD', label: 'XBD' },
-  { value: 'XCD', label: 'XCD' },
-  { value: 'XDR', label: 'XDR' },
-  { value: 'XOF', label: 'XOF' },
-  { value: 'XPD', label: 'XPD' },
-  { value: 'XPF', label: 'XPF' },
-  { value: 'XPT', label: 'XPT' },
-  { value: 'XTS', label: 'XTS' },
-  { value: 'YER', label: 'YER' },
-  { value: 'ZAR', label: 'ZAR' },
-  { value: 'ZMK', label: 'ZMK' },
-  { value: 'ZMW', label: 'ZMW' },
-  { value: 'BTC', label: 'BTC' },
-  { value: 'JEP', label: 'JEP' },
-  { value: 'GGP', label: 'GGP' },
-  { value: 'IMP', label: 'IMP' },
-  { value: 'XFU', label: 'XFU' },
-  { value: 'GBX', label: 'GBX' },
-  { value: 'CNH', label: 'CNH' },
-  { value: 'EEK', label: 'EEK' },
-  { value: 'GHS', label: 'GHS' },
-  { value: 'MTL', label: 'MTL' },
-  { value: 'TMM', label: 'TMM' },
-  { value: 'JPY', label: 'JPY' },
-  { value: 'ZWD', label: 'ZWD' },
-  { value: 'ZWL', label: 'ZWL' },
-  { value: 'ZWN', label: 'ZWN' },
-  { value: 'ZWR', label: 'ZWR' }
+  { value: "AED", label: "AED" },
+  { value: "AFN", label: "AFN" },
+  { value: "ALL", label: "ALL" },
+  { value: "AMD", label: "AMD" },
+  { value: "ANG", label: "ANG" },
+  { value: "AOA", label: "AOA" },
+  { value: "ARS", label: "ARS" },
+  { value: "AUD", label: "AUD" },
+  { value: "AWG", label: "AWG" },
+  { value: "AZN", label: "AZN" },
+  { value: "BAM", label: "BAM" },
+  { value: "BBD", label: "BBD" },
+  { value: "BDT", label: "BDT" },
+  { value: "BGN", label: "BGN" },
+  { value: "BHD", label: "BHD" },
+  { value: "BIF", label: "BIF" },
+  { value: "BMD", label: "BMD" },
+  { value: "BND", label: "BND" },
+  { value: "BOB", label: "BOB" },
+  { value: "BRL", label: "BRL" },
+  { value: "BSD", label: "BSD" },
+  { value: "BTN", label: "BTN" },
+  { value: "BWP", label: "BWP" },
+  { value: "BYN", label: "BYN" },
+  { value: "BYR", label: "BYR" },
+  { value: "BZD", label: "BZD" },
+  { value: "CAD", label: "CAD" },
+  { value: "CDF", label: "CDF" },
+  { value: "CHF", label: "CHF" },
+  { value: "CLF", label: "CLF" },
+  { value: "CLP", label: "CLP" },
+  { value: "CNY", label: "CNY" },
+  { value: "COP", label: "COP" },
+  { value: "CRC", label: "CRC" },
+  { value: "CUC", label: "CUC" },
+  { value: "CUP", label: "CUP" },
+  { value: "CVE", label: "CVE" },
+  { value: "CZK", label: "CZK" },
+  { value: "DJF", label: "DJF" },
+  { value: "DKK", label: "DKK" },
+  { value: "DOP", label: "DOP" },
+  { value: "DZD", label: "DZD" },
+  { value: "EGP", label: "EGP" },
+  { value: "ERN", label: "ERN" },
+  { value: "ETB", label: "ETB" },
+  { value: "EUR", label: "EUR" },
+  { value: "FJD", label: "FJD" },
+  { value: "FKP", label: "FKP" },
+  { value: "GBP", label: "GBP" },
+  { value: "GEL", label: "GEL" },
+  { value: "GHS", label: "GHS" },
+  { value: "GIP", label: "GIP" },
+  { value: "GMD", label: "GMD" },
+  { value: "GNF", label: "GNF" },
+  { value: "GTQ", label: "GTQ" },
+  { value: "GYD", label: "GYD" },
+  { value: "HKD", label: "HKD" },
+  { value: "HNL", label: "HNL" },
+  { value: "HRK", label: "HRK" },
+  { value: "HTG", label: "HTG" },
+  { value: "HUF", label: "HUF" },
+  { value: "IDR", label: "IDR" },
+  { value: "ILS", label: "ILS" },
+  { value: "INR", label: "INR" },
+  { value: "IQD", label: "IQD" },
+  { value: "IRR", label: "IRR" },
+  { value: "ISK", label: "ISK" },
+  { value: "JMD", label: "JMD" },
+  { value: "JOD", label: "JOD" },
+  { value: "JPY", label: "JPY" },
+  { value: "KES", label: "KES" },
+  { value: "KGS", label: "KGS" },
+  { value: "KHR", label: "KHR" },
+  { value: "KMF", label: "KMF" },
+  { value: "KPW", label: "KPW" },
+  { value: "KRW", label: "KRW" },
+  { value: "KWD", label: "KWD" },
+  { value: "KYD", label: "KYD" },
+  { value: "KZT", label: "KZT" },
+  { value: "LAK", label: "LAK" },
+  { value: "LBP", label: "LBP" },
+  { value: "LKR", label: "LKR" },
+  { value: "LRD", label: "LRD" },
+  { value: "LSL", label: "LSL" },
+  { value: "LTL", label: "LTL" },
+  { value: "LVL", label: "LVL" },
+  { value: "LYD", label: "LYD" },
+  { value: "MAD", label: "MAD" },
+  { value: "MDL", label: "MDL" },
+  { value: "MGA", label: "MGA" },
+  { value: "MKD", label: "MKD" },
+  { value: "MMK", label: "MMK" },
+  { value: "MNT", label: "MNT" },
+  { value: "MOP", label: "MOP" },
+  { value: "MRO", label: "MRO" },
+  { value: "MUR", label: "MUR" },
+  { value: "MVR", label: "MVR" },
+  { value: "MWK", label: "MWK" },
+  { value: "MXN", label: "MXN" },
+  { value: "MYR", label: "MYR" },
+  { value: "MZN", label: "MZN" },
+  { value: "NAD", label: "NAD" },
+  { value: "NGN", label: "NGN" },
+  { value: "NIO", label: "NIO" },
+  { value: "NOK", label: "NOK" },
+  { value: "NPR", label: "NPR" },
+  { value: "NZD", label: "NZD" },
+  { value: "OMR", label: "OMR" },
+  { value: "PAB", label: "PAB" },
+  { value: "PEN", label: "PEN" },
+  { value: "PGK", label: "PGK" },
+  { value: "PHP", label: "PHP" },
+  { value: "PKR", label: "PKR" },
+  { value: "PLN", label: "PLN" },
+  { value: "PYG", label: "PYG" },
+  { value: "QAR", label: "QAR" },
+  { value: "RON", label: "RON" },
+  { value: "RSD", label: "RSD" },
+  { value: "RUB", label: "RUB" },
+  { value: "RWF", label: "RWF" },
+  { value: "SAR", label: "SAR" },
+  { value: "SBD", label: "SBD" },
+  { value: "SCR", label: "SCR" },
+  { value: "SDG", label: "SDG" },
+  { value: "SEK", label: "SEK" },
+  { value: "SGD", label: "SGD" },
+  { value: "SHP", label: "SHP" },
+  { value: "SKK", label: "SKK" },
+  { value: "SLL", label: "SLL" },
+  { value: "SOS", label: "SOS" },
+  { value: "SRD", label: "SRD" },
+  { value: "SSP", label: "SSP" },
+  { value: "STD", label: "STD" },
+  { value: "SVC", label: "SVC" },
+  { value: "SYP", label: "SYP" },
+  { value: "SZL", label: "SZL" },
+  { value: "THB", label: "THB" },
+  { value: "TJS", label: "TJS" },
+  { value: "TMT", label: "TMT" },
+  { value: "TND", label: "TND" },
+  { value: "TOP", label: "TOP" },
+  { value: "TRY", label: "TRY" },
+  { value: "TTD", label: "TTD" },
+  { value: "TWD", label: "TWD" },
+  { value: "TZS", label: "TZS" },
+  { value: "UAH", label: "UAH" },
+  { value: "UGX", label: "UGX" },
+  { value: "USD", label: "USD" },
+  { value: "UYU", label: "UYU" },
+  { value: "UZS", label: "UZS" },
+  { value: "VEF", label: "VEF" },
+  { value: "VND", label: "VND" },
+  { value: "VUV", label: "VUV" },
+  { value: "WST", label: "WST" },
+  { value: "XAF", label: "XAF" },
+  { value: "XAG", label: "XAG" },
+  { value: "XAU", label: "XAU" },
+  { value: "XBA", label: "XBA" },
+  { value: "XBB", label: "XBB" },
+  { value: "XBC", label: "XBC" },
+  { value: "XBD", label: "XBD" },
+  { value: "XCD", label: "XCD" },
+  { value: "XDR", label: "XDR" },
+  { value: "XOF", label: "XOF" },
+  { value: "XPD", label: "XPD" },
+  { value: "XPF", label: "XPF" },
+  { value: "XPT", label: "XPT" },
+  { value: "XTS", label: "XTS" },
+  { value: "YER", label: "YER" },
+  { value: "ZAR", label: "ZAR" },
+  { value: "ZMK", label: "ZMK" },
+  { value: "ZMW", label: "ZMW" },
+  { value: "BTC", label: "BTC" },
+  { value: "JEP", label: "JEP" },
+  { value: "GGP", label: "GGP" },
+  { value: "IMP", label: "IMP" },
+  { value: "XFU", label: "XFU" },
+  { value: "GBX", label: "GBX" },
+  { value: "CNH", label: "CNH" },
+  { value: "EEK", label: "EEK" },
+  { value: "GHS", label: "GHS" },
+  { value: "MTL", label: "MTL" },
+  { value: "TMM", label: "TMM" },
+  { value: "JPY", label: "JPY" },
+  { value: "ZWD", label: "ZWD" },
+  { value: "ZWL", label: "ZWL" },
+  { value: "ZWN", label: "ZWN" },
+  { value: "ZWR", label: "ZWR" },
 ]
diff --git a/packages/react-components/src/context/AddressChildrenContext.ts b/packages/react-components/src/context/AddressChildrenContext.ts
index df1e66e5..2a79c087 100644
--- a/packages/react-components/src/context/AddressChildrenContext.ts
+++ b/packages/react-components/src/context/AddressChildrenContext.ts
@@ -1,12 +1,12 @@
-import { createContext } from 'react'
-import type { Address } from '@commercelayer/sdk'
+import { createContext } from "react"
+import type { Address } from "@commercelayer/sdk"
 
 export interface InitialAddressContext {
   address: Address | undefined
 }
 
 const initial: InitialAddressContext = {
-  address: undefined
+  address: undefined,
 }
 
 const AddressChildrenContext = createContext<InitialAddressContext>(initial)
diff --git a/packages/react-components/src/context/AddressContext.ts b/packages/react-components/src/context/AddressContext.ts
index d7fa98ab..2ce8208b 100644
--- a/packages/react-components/src/context/AddressContext.ts
+++ b/packages/react-components/src/context/AddressContext.ts
@@ -1,12 +1,12 @@
-import { createContext } from 'react'
+import { createContext } from "react"
 import {
   type AddressState,
   setAddress,
   type AddressResource,
   type saveAddresses,
-  type ICustomerAddress
-} from '#reducers/AddressReducer'
-import type { BaseError } from '#typings/errors'
+  type ICustomerAddress,
+} from "#reducers/AddressReducer"
+import type { BaseError } from "#typings/errors"
 
 type DefaultContext = {
   saveAddresses?: (params: {
@@ -21,7 +21,7 @@ type DefaultContext = {
 export const defaultAddressContext = {
   setCloneAddress: () => {},
   setAddress,
-  setAddressErrors: () => {}
+  setAddressErrors: () => {},
 }
 
 const AddressesContext = createContext<DefaultContext>(defaultAddressContext)
diff --git a/packages/react-components/src/context/BillingAddressContext.ts b/packages/react-components/src/context/BillingAddressContext.ts
index 240c49da..17513ba3 100644
--- a/packages/react-components/src/context/BillingAddressContext.ts
+++ b/packages/react-components/src/context/BillingAddressContext.ts
@@ -1,5 +1,5 @@
-import { createContext } from 'react'
-import type { BillingAddressState } from '#reducers/BillingAddressReducer'
+import { createContext } from "react"
+import type { BillingAddressState } from "#reducers/BillingAddressReducer"
 
 type DefaultContext = {
   setBillingAddress?: (
@@ -12,8 +12,6 @@ type DefaultContext = {
 
 export const defaultBillingAddressContext = {}
 
-const BillingAddressContext = createContext<DefaultContext>(
-  defaultBillingAddressContext
-)
+const BillingAddressContext = createContext<DefaultContext>(defaultBillingAddressContext)
 
 export default BillingAddressContext
diff --git a/packages/react-components/src/context/BillingAddressFormContext.ts b/packages/react-components/src/context/BillingAddressFormContext.ts
index 31702d80..72b8305a 100644
--- a/packages/react-components/src/context/BillingAddressFormContext.ts
+++ b/packages/react-components/src/context/BillingAddressFormContext.ts
@@ -13,10 +13,7 @@ export type AddressValuesKeys =
 export interface DefaultContextAddress {
   // eslint-disable-next-line @typescript-eslint/no-invalid-void-type
   validation?: void
-  setValue?: (
-    name: AddressValuesKeys,
-    value: string | number | readonly string[],
-  ) => void
+  setValue?: (name: AddressValuesKeys, value: string | number | readonly string[]) => void
   errors?: Record<
     string,
     {
diff --git a/packages/react-components/src/context/CouponAndGiftCardFormContext.ts b/packages/react-components/src/context/CouponAndGiftCardFormContext.ts
index 6dc45e78..2f4b47c1 100644
--- a/packages/react-components/src/context/CouponAndGiftCardFormContext.ts
+++ b/packages/react-components/src/context/CouponAndGiftCardFormContext.ts
@@ -1,9 +1,9 @@
-import type { OrderCodeType } from '#reducers/OrderReducer'
-import { createContext } from 'react'
+import type { OrderCodeType } from "#reducers/OrderReducer"
+import { createContext } from "react"
 
 interface DefaultContext {
   // biome-ignore lint/suspicious/noConfusingVoidType: <explanation>
-    validation?: void
+  validation?: void
   setValue?: (name: string, value: string) => void
   codeType?: OrderCodeType
 }
diff --git a/packages/react-components/src/context/CustomerAddressFormContext.ts b/packages/react-components/src/context/CustomerAddressFormContext.ts
index cc1e4503..4dc3bdc9 100644
--- a/packages/react-components/src/context/CustomerAddressFormContext.ts
+++ b/packages/react-components/src/context/CustomerAddressFormContext.ts
@@ -1,14 +1,11 @@
-import { createContext } from 'react'
-import type { AddressCountrySelectName, AddressInputName } from '#typings'
-import type { AddressField } from '#reducers/AddressReducer'
+import { createContext } from "react"
+import type { AddressCountrySelectName, AddressInputName } from "#typings"
+import type { AddressField } from "#reducers/AddressReducer"
 
 export interface DefaultContextAddress {
   // biome-ignore lint/suspicious/noConfusingVoidType: <explanation>
-    validation?: void
-  setValue?: (
-    name: AddressField | AddressInputName | AddressCountrySelectName,
-    value: any
-  ) => void
+  validation?: void
+  setValue?: (name: AddressField | AddressInputName | AddressCountrySelectName, value: any) => void
   errors?: Record<
     string,
     {
diff --git a/packages/react-components/src/context/CustomerContext.ts b/packages/react-components/src/context/CustomerContext.ts
index 58f7456b..dd7c7a4c 100644
--- a/packages/react-components/src/context/CustomerContext.ts
+++ b/packages/react-components/src/context/CustomerContext.ts
@@ -9,9 +9,9 @@ import type {
   getCustomerOrders,
   getCustomerSubscriptions,
   setResourceTrigger,
-  deleteCustomerPayment
-} from '#reducers/CustomerReducer'
-import { createContext } from 'react'
+  deleteCustomerPayment,
+} from "#reducers/CustomerReducer"
+import { createContext } from "react"
 
 export type InitialCustomerContext = Partial<
   {
@@ -24,9 +24,7 @@ export type InitialCustomerContext = Partial<
     getCustomerAddresses: typeof getCustomerAddresses
     createCustomerAddress: (address: TCustomerAddress) => Promise<void>
     setResourceTrigger: typeof setResourceTrigger
-    getCustomerOrders: (
-      props: Partial<Parameters<typeof getCustomerOrders>[0]>
-    ) => Promise<void>
+    getCustomerOrders: (props: Partial<Parameters<typeof getCustomerOrders>[0]>) => Promise<void>
     getCustomerSubscriptions: (
       props: Partial<Parameters<typeof getCustomerSubscriptions>[0]>
     ) => Promise<void>
@@ -36,8 +34,6 @@ export type InitialCustomerContext = Partial<
 
 export const defaultCustomerContext = {}
 
-const CustomerContext = createContext<InitialCustomerContext>(
-  defaultCustomerContext
-)
+const CustomerContext = createContext<InitialCustomerContext>(defaultCustomerContext)
 
 export default CustomerContext
diff --git a/packages/react-components/src/context/CustomerPaymentSourceContext.ts b/packages/react-components/src/context/CustomerPaymentSourceContext.ts
index ba9e8541..cff56eaf 100644
--- a/packages/react-components/src/context/CustomerPaymentSourceContext.ts
+++ b/packages/react-components/src/context/CustomerPaymentSourceContext.ts
@@ -1,5 +1,5 @@
-import { createContext } from 'react'
-import type { IconBrand } from './PaymentSourceContext'
+import { createContext } from "react"
+import type { IconBrand } from "./PaymentSourceContext"
 
 interface DefaultContext {
   brand?: IconBrand | string
diff --git a/packages/react-components/src/context/ExternalFunctionContext.ts b/packages/react-components/src/context/ExternalFunctionContext.ts
index c980f590..a889c44b 100644
--- a/packages/react-components/src/context/ExternalFunctionContext.ts
+++ b/packages/react-components/src/context/ExternalFunctionContext.ts
@@ -1,4 +1,4 @@
-import { createContext } from 'react'
+import { createContext } from "react"
 
 interface Context {
   url: string | null
@@ -10,20 +10,17 @@ type CallExternalFunction = (params: {
   data: Record<string, any>
 }) => Promise<Record<string, any>>
 
-export const callExternalFunction: CallExternalFunction = async ({
-  url,
-  data
-}) => {
+export const callExternalFunction: CallExternalFunction = async ({ url, data }) => {
   const response = await fetch(url, {
-    method: 'POST',
+    method: "POST",
     body: JSON.stringify(data),
     headers: {
-      'Content-Type': 'application/json'
-    }
+      "Content-Type": "application/json",
+    },
   })
 
   if (!response.ok) {
-    throw new Error('Failed to call external function')
+    throw new Error("Failed to call external function")
   }
 
   return await response.json()
@@ -31,7 +28,7 @@ export const callExternalFunction: CallExternalFunction = async ({
 
 const ExternalFunctionContext = createContext<Context>({
   url: null,
-  callExternalFunction
+  callExternalFunction,
 })
 
 export default ExternalFunctionContext
diff --git a/packages/react-components/src/context/GiftCardContext.ts b/packages/react-components/src/context/GiftCardContext.ts
index ec6c2834..7ab95874 100644
--- a/packages/react-components/src/context/GiftCardContext.ts
+++ b/packages/react-components/src/context/GiftCardContext.ts
@@ -1,11 +1,11 @@
-import { createContext } from 'react'
+import { createContext } from "react"
 import {
   giftCardInitialState,
   type GiftCardState,
   type GiftCardRecipientI,
-  type GiftCardI
-} from '#reducers/GiftCardReducer'
-import type { BaseError } from '#typings/errors'
+  type GiftCardI,
+} from "#reducers/GiftCardReducer"
+import type { BaseError } from "#typings/errors"
 
 export interface GCContext extends GiftCardState {
   addGiftCardRecipient: (values: GiftCardRecipientI & object) => void
diff --git a/packages/react-components/src/context/InStockSubscriptionContext.ts b/packages/react-components/src/context/InStockSubscriptionContext.ts
index ac9cb7ed..b869e62b 100644
--- a/packages/react-components/src/context/InStockSubscriptionContext.ts
+++ b/packages/react-components/src/context/InStockSubscriptionContext.ts
@@ -1,17 +1,15 @@
 import type {
   setInStockSubscription,
-  InStockSubscriptionState
-} from '#reducers/InStockSubscriptionReducer'
-import { createContext } from 'react'
+  InStockSubscriptionState,
+} from "#reducers/InStockSubscriptionReducer"
+import { createContext } from "react"
 
-export interface InitialInStockSubscriptionContext
-  extends InStockSubscriptionState {
+export interface InitialInStockSubscriptionContext extends InStockSubscriptionState {
   setInStockSubscription?: typeof setInStockSubscription
 }
 
 const initial: InitialInStockSubscriptionContext = {}
 
-const InStockSubscriptionContext =
-  createContext<InitialInStockSubscriptionContext>(initial)
+const InStockSubscriptionContext = createContext<InitialInStockSubscriptionContext>(initial)
 
 export default InStockSubscriptionContext
diff --git a/packages/react-components/src/context/LineItemChildrenContext.ts b/packages/react-components/src/context/LineItemChildrenContext.ts
index 66cd1c48..cce94a70 100644
--- a/packages/react-components/src/context/LineItemChildrenContext.ts
+++ b/packages/react-components/src/context/LineItemChildrenContext.ts
@@ -1,5 +1,5 @@
-import { createContext } from 'react'
-import type { LineItem } from '@commercelayer/sdk'
+import { createContext } from "react"
+import type { LineItem } from "@commercelayer/sdk"
 
 export type InitialLineItemChildrenContext = Partial<{
   lineItem: LineItem | null | undefined
@@ -7,7 +7,6 @@ export type InitialLineItemChildrenContext = Partial<{
 
 const initial: InitialLineItemChildrenContext = {}
 
-const LineItemChildrenContext =
-  createContext<InitialLineItemChildrenContext>(initial)
+const LineItemChildrenContext = createContext<InitialLineItemChildrenContext>(initial)
 
 export default LineItemChildrenContext
diff --git a/packages/react-components/src/context/LineItemContext.ts b/packages/react-components/src/context/LineItemContext.ts
index e5fac92b..81509493 100644
--- a/packages/react-components/src/context/LineItemContext.ts
+++ b/packages/react-components/src/context/LineItemContext.ts
@@ -1,6 +1,6 @@
-import { createContext } from 'react'
-import type { LineItemState } from '#reducers/LineItemReducer'
-import type { LineItem } from '@commercelayer/sdk'
+import { createContext } from "react"
+import type { LineItemState } from "#reducers/LineItemReducer"
+import type { LineItem } from "@commercelayer/sdk"
 
 export interface LineItemContextValue extends LineItemState {
   lineItems?: LineItem[] | null
diff --git a/packages/react-components/src/context/LineItemOptionChildrenContext.ts b/packages/react-components/src/context/LineItemOptionChildrenContext.ts
index 21a9135c..9c280606 100644
--- a/packages/react-components/src/context/LineItemOptionChildrenContext.ts
+++ b/packages/react-components/src/context/LineItemOptionChildrenContext.ts
@@ -1,5 +1,5 @@
-import { createContext } from 'react'
-import type { LineItemOption } from '@commercelayer/sdk'
+import { createContext } from "react"
+import type { LineItemOption } from "@commercelayer/sdk"
 
 export interface TLineItemOptions extends LineItemOption {}
 
@@ -9,10 +9,9 @@ export interface InitialLineItemContext {
 }
 
 const initial: InitialLineItemContext = {
-  lineItemOption: {}
+  lineItemOption: {},
 }
 
-const LineItemOptionChildrenContext =
-  createContext<InitialLineItemContext>(initial)
+const LineItemOptionChildrenContext = createContext<InitialLineItemContext>(initial)
 
 export default LineItemOptionChildrenContext
diff --git a/packages/react-components/src/context/OrderListChildrenContext.ts b/packages/react-components/src/context/OrderListChildrenContext.ts
index 1297a74d..687e7e04 100644
--- a/packages/react-components/src/context/OrderListChildrenContext.ts
+++ b/packages/react-components/src/context/OrderListChildrenContext.ts
@@ -1,16 +1,14 @@
-import type { Order, OrderSubscription } from '@commercelayer/sdk'
-import type { Row } from '@tanstack/react-table'
-import { createContext, type JSX } from 'react';
+import type { Order, OrderSubscription } from "@commercelayer/sdk"
+import type { Row } from "@tanstack/react-table"
+import { createContext, type JSX } from "react"
 
-export type TOrderList = 'orders' | 'subscriptions'
+export type TOrderList = "orders" | "subscriptions"
 
-export type TableAccessor<T extends TOrderList> = T extends 'orders'
+export type TableAccessor<T extends TOrderList> = T extends "orders"
   ? keyof Order
   : keyof OrderSubscription
 
-export type OrderListContent<T extends TOrderList> = T extends 'orders'
-  ? Order
-  : OrderSubscription
+export type OrderListContent<T extends TOrderList> = T extends "orders" ? Order : OrderSubscription
 
 export type InitialOrderListContext = Partial<{
   type: TOrderList
@@ -33,9 +31,7 @@ export type InitialOrderListContext = Partial<{
   /**
    * Function to assign as custom row renderer
    */
-  actionsComponent: (props: {
-    order: OrderListContent<TOrderList>
-  }) => JSX.Element
+  actionsComponent: (props: { order: OrderListContent<TOrderList> }) => JSX.Element
   /**
    * Class name to assign as custom row renderer
    */
@@ -47,7 +43,7 @@ export type InitialOrderListContext = Partial<{
 }>
 
 const initial: InitialOrderListContext = {
-  showActions: false
+  showActions: false,
 }
 
 const OrderListChildrenContext = createContext<InitialOrderListContext>(initial)
diff --git a/packages/react-components/src/context/OrderListPaginationContext.ts b/packages/react-components/src/context/OrderListPaginationContext.ts
index 1e2b32b9..084f17a0 100644
--- a/packages/react-components/src/context/OrderListPaginationContext.ts
+++ b/packages/react-components/src/context/OrderListPaginationContext.ts
@@ -1,4 +1,4 @@
-import { createContext } from 'react'
+import { createContext } from "react"
 
 export interface OrderListPaginationContext {
   canNextPage: boolean
diff --git a/packages/react-components/src/context/OrderStorageContext.ts b/packages/react-components/src/context/OrderStorageContext.ts
index 6458310a..1fe9012f 100644
--- a/packages/react-components/src/context/OrderStorageContext.ts
+++ b/packages/react-components/src/context/OrderStorageContext.ts
@@ -1,14 +1,6 @@
-import { createContext } from 'react'
-import type {
-  GetLocalOrder,
-  SetLocalOrder,
-  DeleteLocalOrder,
-} from "@commercelayer/core"
-import {
-  getLocalOrder,
-  setLocalOrder,
-  deleteLocalOrder
-} from '@commercelayer/core'
+import { createContext } from "react"
+import type { GetLocalOrder, SetLocalOrder, DeleteLocalOrder } from "@commercelayer/core"
+import { getLocalOrder, setLocalOrder, deleteLocalOrder } from "@commercelayer/core"
 
 export interface OrderStorageConfig {
   persistKey: string
@@ -19,11 +11,11 @@ export interface OrderStorageConfig {
 }
 
 const initial: OrderStorageConfig = {
-  persistKey: '',
+  persistKey: "",
   clearWhenPlaced: true,
   getLocalOrder,
   setLocalOrder,
-  deleteLocalOrder
+  deleteLocalOrder,
 }
 
 const OrderStorageContext = createContext<OrderStorageConfig>(initial)
diff --git a/packages/react-components/src/context/ParcelChildrenContext.ts b/packages/react-components/src/context/ParcelChildrenContext.ts
index 8aa922ca..ac8a0160 100644
--- a/packages/react-components/src/context/ParcelChildrenContext.ts
+++ b/packages/react-components/src/context/ParcelChildrenContext.ts
@@ -1,5 +1,5 @@
-import { createContext } from 'react'
-import type { Parcel } from '@commercelayer/sdk'
+import { createContext } from "react"
+import type { Parcel } from "@commercelayer/sdk"
 
 export interface InitialParcelContext {
   parcel?: Parcel
diff --git a/packages/react-components/src/context/ParcelLineItemChildrenContext.ts b/packages/react-components/src/context/ParcelLineItemChildrenContext.ts
index 714d3cc4..29225d48 100644
--- a/packages/react-components/src/context/ParcelLineItemChildrenContext.ts
+++ b/packages/react-components/src/context/ParcelLineItemChildrenContext.ts
@@ -1,5 +1,5 @@
-import { createContext } from 'react'
-import type { ParcelLineItem } from '@commercelayer/sdk'
+import { createContext } from "react"
+import type { ParcelLineItem } from "@commercelayer/sdk"
 
 export interface InitialParcelLineItemContext {
   parcelLineItem?: ParcelLineItem
diff --git a/packages/react-components/src/context/PaymentMethodChildrenContext.ts b/packages/react-components/src/context/PaymentMethodChildrenContext.ts
index 5049bd57..d52496db 100644
--- a/packages/react-components/src/context/PaymentMethodChildrenContext.ts
+++ b/packages/react-components/src/context/PaymentMethodChildrenContext.ts
@@ -1,5 +1,5 @@
-import { createContext } from 'react'
-import type { PaymentMethod } from '@commercelayer/sdk'
+import { createContext } from "react"
+import type { PaymentMethod } from "@commercelayer/sdk"
 
 export interface InitialPaymentMethodChildrenContext {
   payment?: PaymentMethod
@@ -11,7 +11,6 @@ export interface InitialPaymentMethodChildrenContext {
 
 const initial: InitialPaymentMethodChildrenContext = {}
 
-const PaymentMethodChildrenContext =
-  createContext<InitialPaymentMethodChildrenContext>(initial)
+const PaymentMethodChildrenContext = createContext<InitialPaymentMethodChildrenContext>(initial)
 
 export default PaymentMethodChildrenContext
diff --git a/packages/react-components/src/context/PaymentMethodContext.ts b/packages/react-components/src/context/PaymentMethodContext.ts
index 68d1227e..da08aa3e 100644
--- a/packages/react-components/src/context/PaymentMethodContext.ts
+++ b/packages/react-components/src/context/PaymentMethodContext.ts
@@ -1,4 +1,4 @@
-import { createContext } from 'react'
+import { createContext } from "react"
 import {
   type UpdatePaymentSource,
   updatePaymentSource,
@@ -11,8 +11,8 @@ import {
   type DestroyPaymentSource,
   type SetPaymentRef,
   setPaymentRef,
-  setLoading
-} from '#reducers/PaymentMethodReducer'
+  setLoading,
+} from "#reducers/PaymentMethodReducer"
 
 type DefaultContext = {
   setPaymentMethodErrors: SetPaymentMethodErrors
@@ -31,11 +31,9 @@ export const defaultPaymentMethodContext: DefaultContext = {
   setPaymentRef,
   destroyPaymentSource,
   updatePaymentSource,
-  setLoading
+  setLoading,
 }
 
-const PaymentMethodContext = createContext<DefaultContext>(
-  defaultPaymentMethodContext
-)
+const PaymentMethodContext = createContext<DefaultContext>(defaultPaymentMethodContext)
 
 export default PaymentMethodContext
diff --git a/packages/react-components/src/context/PaymentSourceContext.ts b/packages/react-components/src/context/PaymentSourceContext.ts
index 8549fa87..69be52e9 100644
--- a/packages/react-components/src/context/PaymentSourceContext.ts
+++ b/packages/react-components/src/context/PaymentSourceContext.ts
@@ -1,15 +1,15 @@
-import { createContext } from 'react'
+import { createContext } from "react"
 
 export type IconBrand =
-  | 'visa'
-  | 'credit-card'
-  | 'amex'
-  | 'mastercard'
-  | 'jcb'
-  | 'wire-transfer'
-  | 'maestro'
-  | 'cirrus'
-  | 'paypal'
+  | "visa"
+  | "credit-card"
+  | "amex"
+  | "mastercard"
+  | "jcb"
+  | "wire-transfer"
+  | "maestro"
+  | "cirrus"
+  | "paypal"
 
 interface DefaultContext {
   brand?: IconBrand | string
@@ -24,8 +24,6 @@ interface DefaultContext {
 
 export const defaultPaymentSourceContext = {}
 
-const PaymentSourceContext = createContext<DefaultContext>(
-  defaultPaymentSourceContext
-)
+const PaymentSourceContext = createContext<DefaultContext>(defaultPaymentSourceContext)
 
 export default PaymentSourceContext
diff --git a/packages/react-components/src/context/PlaceOrderContext.ts b/packages/react-components/src/context/PlaceOrderContext.ts
index de26f166..91ac9007 100644
--- a/packages/react-components/src/context/PlaceOrderContext.ts
+++ b/packages/react-components/src/context/PlaceOrderContext.ts
@@ -1,10 +1,10 @@
-import { createContext, type RefObject } from 'react'
+import { createContext, type RefObject } from "react"
 import {
   type PlaceOrderState,
   type setPlaceOrder,
   setPlaceOrderErrors,
-  setPlaceOrderStatus
-} from '#reducers/PlaceOrderReducer'
+  setPlaceOrderStatus,
+} from "#reducers/PlaceOrderReducer"
 
 type DefaultContext = {
   setPlaceOrderErrors?: typeof setPlaceOrderErrors
@@ -17,11 +17,9 @@ type DefaultContext = {
 export const defaultPlaceOrderContext: DefaultContext = {
   setPlaceOrderStatus,
   setPlaceOrderErrors,
-  status: 'standby'
+  status: "standby",
 }
 
-const PlaceOrderContext = createContext<DefaultContext>(
-  defaultPlaceOrderContext
-)
+const PlaceOrderContext = createContext<DefaultContext>(defaultPlaceOrderContext)
 
 export default PlaceOrderContext
diff --git a/packages/react-components/src/context/ShipmentChildrenContext.ts b/packages/react-components/src/context/ShipmentChildrenContext.ts
index d744dda0..3735aef8 100644
--- a/packages/react-components/src/context/ShipmentChildrenContext.ts
+++ b/packages/react-components/src/context/ShipmentChildrenContext.ts
@@ -1,12 +1,12 @@
-import { createContext } from 'react'
+import { createContext } from "react"
 import type {
   DeliveryLeadTime,
   LineItem,
   Parcel,
   Shipment,
   ShippingMethod,
-  StockTransfer
-} from '@commercelayer/sdk'
+  StockTransfer,
+} from "@commercelayer/sdk"
 
 export interface InitialShipmentContext {
   currentShippingMethodId?: string
@@ -23,7 +23,7 @@ const initial: InitialShipmentContext = {
   keyNumber: 0,
   lineItems: [],
   shippingMethods: [],
-  stockTransfers: []
+  stockTransfers: [],
 }
 
 const ShipmentChildrenContext = createContext<InitialShipmentContext>(initial)
diff --git a/packages/react-components/src/context/ShipmentContext.ts b/packages/react-components/src/context/ShipmentContext.ts
index f3daa2a9..f83fdd96 100644
--- a/packages/react-components/src/context/ShipmentContext.ts
+++ b/packages/react-components/src/context/ShipmentContext.ts
@@ -1,10 +1,10 @@
-import { createContext } from 'react'
+import { createContext } from "react"
 import {
   type ShipmentState,
   type SetShipmentErrors,
   setShipmentErrors,
-  type setShippingMethod
-} from '#reducers/ShipmentReducer'
+  type setShippingMethod,
+} from "#reducers/ShipmentReducer"
 
 type DefaultContext = {
   setShipmentErrors: SetShipmentErrors
@@ -15,7 +15,7 @@ type DefaultContext = {
 } & ShipmentState
 
 export const defaultShipmentContext = {
-  setShipmentErrors
+  setShipmentErrors,
 }
 
 const ShipmentContext = createContext<DefaultContext>(defaultShipmentContext)
diff --git a/packages/react-components/src/context/ShippingAddressContext.ts b/packages/react-components/src/context/ShippingAddressContext.ts
index de267b95..9468623f 100644
--- a/packages/react-components/src/context/ShippingAddressContext.ts
+++ b/packages/react-components/src/context/ShippingAddressContext.ts
@@ -1,5 +1,5 @@
-import { createContext } from 'react'
-import type { ShippingAddressState } from '#reducers/ShippingAddressReducer'
+import { createContext } from "react"
+import type { ShippingAddressState } from "#reducers/ShippingAddressReducer"
 
 type DefaultContext = {
   setShippingAddress?: (
@@ -12,8 +12,6 @@ type DefaultContext = {
 
 export const defaultShippingAddressContext = {}
 
-const ShippingAddressContext = createContext<DefaultContext>(
-  defaultShippingAddressContext
-)
+const ShippingAddressContext = createContext<DefaultContext>(defaultShippingAddressContext)
 
 export default ShippingAddressContext
diff --git a/packages/react-components/src/context/ShippingAddressFormContext.ts b/packages/react-components/src/context/ShippingAddressFormContext.ts
index d797da69..6ea9aa63 100644
--- a/packages/react-components/src/context/ShippingAddressFormContext.ts
+++ b/packages/react-components/src/context/ShippingAddressFormContext.ts
@@ -1,5 +1,5 @@
-import { createContext } from 'react'
-import type { DefaultContextAddress } from './BillingAddressFormContext'
+import { createContext } from "react"
+import type { DefaultContextAddress } from "./BillingAddressFormContext"
 
 const ShippingAddressFormContext = createContext<DefaultContextAddress>({})
 
diff --git a/packages/react-components/src/context/ShippingMethodChildrenContext.ts b/packages/react-components/src/context/ShippingMethodChildrenContext.ts
index 6f34756e..a2d316b8 100644
--- a/packages/react-components/src/context/ShippingMethodChildrenContext.ts
+++ b/packages/react-components/src/context/ShippingMethodChildrenContext.ts
@@ -1,5 +1,5 @@
-import { createContext } from 'react'
-import type { DeliveryLeadTime, ShippingMethod } from '@commercelayer/sdk'
+import { createContext } from "react"
+import type { DeliveryLeadTime, ShippingMethod } from "@commercelayer/sdk"
 
 export interface InitialShippingMethodContext {
   shippingMethod?: ShippingMethod
@@ -10,7 +10,6 @@ export interface InitialShippingMethodContext {
 
 const initial: InitialShippingMethodContext = {}
 
-const ShippingMethodChildrenContext =
-  createContext<InitialShippingMethodContext>(initial)
+const ShippingMethodChildrenContext = createContext<InitialShippingMethodContext>(initial)
 
 export default ShippingMethodChildrenContext
diff --git a/packages/react-components/src/context/SkuChildrenContext.ts b/packages/react-components/src/context/SkuChildrenContext.ts
index cf682e4b..e5e26857 100644
--- a/packages/react-components/src/context/SkuChildrenContext.ts
+++ b/packages/react-components/src/context/SkuChildrenContext.ts
@@ -1,5 +1,5 @@
-import { createContext } from 'react'
-import type { Sku } from '@commercelayer/sdk'
+import { createContext } from "react"
+import type { Sku } from "@commercelayer/sdk"
 
 export type InitialSkuContext = Partial<{
   sku: Sku
diff --git a/packages/react-components/src/context/SkuListsContext.ts b/packages/react-components/src/context/SkuListsContext.ts
index b8a0c59d..7f31cb1b 100644
--- a/packages/react-components/src/context/SkuListsContext.ts
+++ b/packages/react-components/src/context/SkuListsContext.ts
@@ -18,7 +18,6 @@ const defaultContext: SkuListsContextType = {
   registerListId: () => {},
 }
 
-export const SkuListsContext =
-  createContext<SkuListsContextType>(defaultContext)
+export const SkuListsContext = createContext<SkuListsContextType>(defaultContext)
 
 export default SkuListsContext
diff --git a/packages/react-components/src/context/StockTransferChildrenContext.ts b/packages/react-components/src/context/StockTransferChildrenContext.ts
index bfadc769..0279f0d0 100644
--- a/packages/react-components/src/context/StockTransferChildrenContext.ts
+++ b/packages/react-components/src/context/StockTransferChildrenContext.ts
@@ -1,5 +1,5 @@
-import { createContext } from 'react'
-import type { LineItem, StockTransfer } from '@commercelayer/sdk'
+import { createContext } from "react"
+import type { LineItem, StockTransfer } from "@commercelayer/sdk"
 
 export interface InitialStockTransferContext {
   stockTransfer?: StockTransfer | null | LineItem
@@ -7,7 +7,6 @@ export interface InitialStockTransferContext {
 
 const initial: InitialStockTransferContext = {}
 
-const StockTransferChildrenContext =
-  createContext<InitialStockTransferContext>(initial)
+const StockTransferChildrenContext = createContext<InitialStockTransferContext>(initial)
 
 export default StockTransferChildrenContext
diff --git a/packages/react-components/src/hooks/useCommerceLayer.ts b/packages/react-components/src/hooks/useCommerceLayer.ts
index de98e9c8..657ea255 100644
--- a/packages/react-components/src/hooks/useCommerceLayer.ts
+++ b/packages/react-components/src/hooks/useCommerceLayer.ts
@@ -1,6 +1,6 @@
-import CommerceLayerContext from '#context/CommerceLayerContext'
-import { getSdk } from '@commercelayer/core'
-import { useContext } from 'react'
+import CommerceLayerContext from "#context/CommerceLayerContext"
+import { getSdk } from "@commercelayer/core"
+import { useContext } from "react"
 
 interface ReturnProps {
   /** This is the access token used to initialize the sdk client. It need to be set as prop in the main `<CommerceLayer>` component */
@@ -14,20 +14,20 @@ interface ReturnProps {
  **/
 export function useCommerceLayer(): ReturnProps {
   const ctx = useContext(CommerceLayerContext)
-  if ('accessToken' in ctx) {
+  if ("accessToken" in ctx) {
     return {
       accessToken: ctx.accessToken,
       sdkClient: () => {
         if (ctx?.accessToken != null)
           return getSdk({
             accessToken: ctx.accessToken,
-            interceptors: ctx.interceptors
+            interceptors: ctx.interceptors,
           })
         return undefined
-      }
+      },
     }
   }
-  throw new Error('Cannot use `useCommerceLayer` outside of <CommerceLayer/>')
+  throw new Error("Cannot use `useCommerceLayer` outside of <CommerceLayer/>")
 }
 
 export default useCommerceLayer
diff --git a/packages/react-components/src/hooks/useCustomerContainer.ts b/packages/react-components/src/hooks/useCustomerContainer.ts
index e4109d32..0caeb047 100644
--- a/packages/react-components/src/hooks/useCustomerContainer.ts
+++ b/packages/react-components/src/hooks/useCustomerContainer.ts
@@ -1,24 +1,19 @@
-import CustomerContext, {
-  type InitialCustomerContext
-} from '#context/CustomerContext'
-import type {
-  setResourceTrigger,
-  CustomerState
-} from '#reducers/CustomerReducer'
-import { useContext } from 'react'
+import CustomerContext, { type InitialCustomerContext } from "#context/CustomerContext"
+import type { setResourceTrigger, CustomerState } from "#reducers/CustomerReducer"
+import { useContext } from "react"
 
-type TCustomer = Omit<CustomerState, 'errors' | 'isGuest'> & {
+type TCustomer = Omit<CustomerState, "errors" | "isGuest"> & {
   setResourceTrigger?: typeof setResourceTrigger
-} & Pick<InitialCustomerContext, 'reloadCustomerAddresses'>
+} & Pick<InitialCustomerContext, "reloadCustomerAddresses">
 
-interface TReturnCustomer extends Omit<TCustomer, 'errors' | 'isGuest'> {}
+interface TReturnCustomer extends Omit<TCustomer, "errors" | "isGuest"> {}
 
 /**
  * React Hook that provides access to the order context stored in the `<CustomerContainer>` component.
  **/
 export function useCustomerContainer(): TReturnCustomer {
   const ctx = useContext(CustomerContext)
-  if ('addresses' in ctx) {
+  if ("addresses" in ctx) {
     return {
       addresses: ctx.addresses,
       payments: ctx.payments,
@@ -27,12 +22,10 @@ export function useCustomerContainer(): TReturnCustomer {
       customerEmail: ctx.customerEmail,
       customers: ctx.customers,
       setResourceTrigger: ctx.setResourceTrigger,
-      reloadCustomerAddresses: ctx.reloadCustomerAddresses
+      reloadCustomerAddresses: ctx.reloadCustomerAddresses,
     }
   }
-  throw new Error(
-    'Cannot use `useCustomerContainer` outside of <CustomerContainer/>'
-  )
+  throw new Error("Cannot use `useCustomerContainer` outside of <CustomerContainer/>")
 }
 
 export default useCustomerContainer
diff --git a/packages/react-components/src/hooks/useOrderContainer.ts b/packages/react-components/src/hooks/useOrderContainer.ts
index cf4fa32f..11497006 100644
--- a/packages/react-components/src/hooks/useOrderContainer.ts
+++ b/packages/react-components/src/hooks/useOrderContainer.ts
@@ -1,35 +1,31 @@
-import OrderContext from '#context/OrderContext'
-import type {
-  createOrder,
-  OrderState,
-  addToCart
-} from '#reducers/OrderReducer'
-import { useContext } from 'react'
+import OrderContext from "#context/OrderContext"
+import type { createOrder, OrderState, addToCart } from "#reducers/OrderReducer"
+import { useContext } from "react"
 
 type TAddToCartParams = Omit<
   Parameters<typeof addToCart>[number],
-  | 'buyNowMode'
-  | 'state'
-  | 'dispatch'
-  | 'setLocalOrder'
-  | 'errors'
-  | 'checkoutUrl'
-  | 'persistKey'
-  | 'config'
+  | "buyNowMode"
+  | "state"
+  | "dispatch"
+  | "setLocalOrder"
+  | "errors"
+  | "checkoutUrl"
+  | "persistKey"
+  | "config"
 >
 
 type TCreateCartParams = Pick<
   Parameters<typeof createOrder>[number],
-  'orderAttributes' | 'orderMetadata'
+  "orderAttributes" | "orderMetadata"
 >
 
 interface TReturnOrder
   extends Omit<
     OrderState,
-    'loading' | 'include' | 'includeLoaded' | 'withoutIncludes' | 'orderId'
+    "loading" | "include" | "includeLoaded" | "withoutIncludes" | "orderId"
   > {
   /** Refetch the current order and update the context */
-  reloadOrder: () => Promise<OrderState['order']>
+  reloadOrder: () => Promise<OrderState["order"]>
   /** Allow to add a SKU or a Bundle to the order stored in the context */
   addToCart: (params: TAddToCartParams) => ReturnType<typeof addToCart>
   /** Allow to create a new order and store it in the OrderContainer context */
@@ -41,7 +37,7 @@ interface TReturnOrder
  **/
 export function useOrderContainer(): TReturnOrder {
   const ctx = useContext(OrderContext)
-  if ('order' in ctx) {
+  if ("order" in ctx) {
     return {
       order: ctx.order,
       reloadOrder: async () => {
@@ -51,16 +47,18 @@ export function useOrderContainer(): TReturnOrder {
       addToCart: async (params) => {
         if (ctx?.addToCart) return await ctx?.addToCart(params)
         return {
-          success: false
+          success: false,
         }
       },
       createOrder: async (params) => {
         if (ctx?.createOrder) return await ctx?.createOrder(params)
         return undefined
-      }
+      },
     }
   }
-  throw new Error('Cannot use `useOrderContainer` outside of <Order/> (or the deprecated <OrderContainer/>)')
+  throw new Error(
+    "Cannot use `useOrderContainer` outside of <Order/> (or the deprecated <OrderContainer/>)"
+  )
 }
 
 export default useOrderContainer
diff --git a/packages/react-components/src/hooks/useOrderState.ts b/packages/react-components/src/hooks/useOrderState.ts
index 809a7ebc..55ce31e1 100644
--- a/packages/react-components/src/hooks/useOrderState.ts
+++ b/packages/react-components/src/hooks/useOrderState.ts
@@ -60,7 +60,7 @@ export function useOrderState({
 
   const config: CommerceLayerConfig = useMemo(
     () => ({ accessToken, interceptors }),
-    [accessToken, interceptors],
+    [accessToken, interceptors]
   )
 
   const getOrder = useCallback(
@@ -77,7 +77,7 @@ export function useOrderState({
           state,
         }))
     },
-    [persistKey, clearWhenPlaced, config, deleteLocalOrder, state],
+    [persistKey, clearWhenPlaced, config, deleteLocalOrder, state]
   )
 
   // biome-ignore lint/correctness/useExhaustiveDependencies: persistKey intentionally the only dep — mirrors original OrderContainer behavior
@@ -131,7 +131,7 @@ export function useOrderState({
   useEffect(() => {
     const localOrder = persistKey ? getLocalOrder(persistKey) : orderId
     const startRequest = Object.keys(state?.includeLoaded || {}).filter(
-      (key) => state?.includeLoaded?.[key as ResourceIncluded] === true,
+      (key) => state?.includeLoaded?.[key as ResourceIncluded] === true
     )
     if (config.accessToken && state.loading === false && state?.order == null) {
       if (
@@ -142,11 +142,7 @@ export function useOrderState({
         !lockOrder
       ) {
         getOrder(localOrder)
-      } else if (
-        state.withoutIncludes &&
-        !state.include?.length &&
-        startRequest.length === 0
-      ) {
+      } else if (state.withoutIncludes && !state.include?.length && startRequest.length === 0) {
         getOrder(localOrder)
       }
     } else if (
@@ -154,7 +150,12 @@ export function useOrderState({
     ) {
       dispatch({ type: "setLoading", payload: { loading: false } })
     } else if (
-      [config.accessToken, state.order == null, state.loading, state.withoutIncludes === false].every(Boolean)
+      [
+        config.accessToken,
+        state.order == null,
+        state.loading,
+        state.withoutIncludes === false,
+      ].every(Boolean)
     ) {
       dispatch({ type: "setLoading", payload: { loading: false } })
     }
@@ -189,7 +190,7 @@ export function useOrderState({
         // @ts-expect-error no type
         state.order?.payment_source?.payment_request_data?.payment_method?.type === "giftcard",
       paymentSourceRequest: async (
-        params: Parameters<typeof paymentSourceRequest>[number],
+        params: Parameters<typeof paymentSourceRequest>[number]
       ): ReturnType<typeof paymentSourceRequest> =>
         await paymentSourceRequest({ ...params, dispatch, state, config }),
       setOrder: (order: Order) => setOrder(order, dispatch),
@@ -207,7 +208,7 @@ export function useOrderState({
           setLocalOrder,
         }),
       addToCart: async (
-        params: Parameters<typeof addToCart>[number],
+        params: Parameters<typeof addToCart>[number]
       ): ReturnType<typeof addToCart> =>
         await addToCart({
           ...params,
@@ -220,15 +221,16 @@ export function useOrderState({
           orderAttributes: attributes,
           setLocalOrder,
         }),
-      saveAddressToCustomerAddressBook: (
-        args: Parameters<SaveAddressToCustomerAddressBook>[0],
-      ) => {
+      saveAddressToCustomerAddressBook: (args: Parameters<SaveAddressToCustomerAddressBook>[0]) => {
         defaultOrderContext.saveAddressToCustomerAddressBook({ ...args, dispatch })
       },
       setGiftCardOrCouponCode: async ({
         code,
         codeType,
-      }: { code: string; codeType: OrderCodeType }) =>
+      }: {
+        code: string
+        codeType: OrderCodeType
+      }) =>
         await defaultOrderContext.setGiftCardOrCouponCode({
           code,
           codeType,
diff --git a/packages/react-components/src/reducers/AddressReducer.ts b/packages/react-components/src/reducers/AddressReducer.ts
index c45513fc..f0654022 100644
--- a/packages/react-components/src/reducers/AddressReducer.ts
+++ b/packages/react-components/src/reducers/AddressReducer.ts
@@ -5,13 +5,10 @@ import type { AddressValuesKeys } from "#context/BillingAddressFormContext"
 import type { CommerceLayerConfig } from "#context/CommerceLayerContext"
 import type { BaseError, CodeErrorType } from "#typings/errors"
 import type { AddressInputName } from "#typings/index"
-import {
-  invertedAddressesHandler,
-  sanitizeMetadataFields,
-} from "#utils/addressesManager"
+import { invertedAddressesHandler, sanitizeMetadataFields } from "#utils/addressesManager"
 import baseReducer from "#utils/baseReducer"
 import { formCleaner } from "#utils/formCleaner"
-import { getSdk } from '@commercelayer/core'
+import { getSdk } from "@commercelayer/core"
 import type { TCustomerAddress } from "./CustomerReducer"
 import type { updateOrder } from "./OrderReducer"
 
@@ -67,15 +64,9 @@ export const addressFields: AddressField[] = [
   "zip_code",
 ]
 
-export type AddressResource = Extract<
-  TResourceError,
-  "billing_address" | "shipping_address"
->
+export type AddressResource = Extract<TResourceError, "billing_address" | "shipping_address">
 
-export type AddressSchema = Omit<
-  Address,
-  "created_at" | "updated_at" | "id" | "type"
->
+export type AddressSchema = Omit<Address, "created_at" | "updated_at" | "id" | "type">
 
 export interface AddressActionPayload {
   errors: BaseError[]
@@ -156,7 +147,7 @@ export function setAddress<V extends TCustomerAddress>({
 type SetCloneAddress = (
   id: string,
   resource: AddressResource,
-  dispatch: Dispatch<AddressAction>,
+  dispatch: Dispatch<AddressAction>
 ) => void
 
 export const setCloneAddress: SetCloneAddress = (id, resource, dispatch) => {
@@ -212,13 +203,9 @@ export async function saveAddresses({
     if (order) {
       let orderAttributes: OrderUpdate | null = null
       const billingAddressCloneId =
-        customerAddress?.resource === "billing_address"
-          ? customerAddress?.id
-          : billingAddressId
+        customerAddress?.resource === "billing_address" ? customerAddress?.id : billingAddressId
       const shippingAddressCloneId =
-        customerAddress?.resource === "shipping_address"
-          ? customerAddress?.id
-          : shippingAddressId
+        customerAddress?.resource === "shipping_address" ? customerAddress?.id : shippingAddressId
       if (invertAddresses) {
         orderAttributes = await invertedAddressesHandler({
           billingAddress,
@@ -233,7 +220,7 @@ export async function saveAddresses({
       } else {
         const doNotShipItems = order?.line_items?.every(
           // @ts-expect-error no type for do_not_ship on SDK
-          (lineItem) => lineItem?.item?.do_not_ship === true,
+          (lineItem) => lineItem?.item?.do_not_ship === true
         )
         const currentBillingAddressRef = order?.billing_address?.reference
         orderAttributes = {
@@ -244,8 +231,7 @@ export async function saveAddresses({
         }
         if (currentBillingAddressRef === billingAddressCloneId) {
           orderAttributes._billing_address_clone_id = order?.billing_address?.id
-          orderAttributes._shipping_address_clone_id =
-            order?.shipping_address?.id
+          orderAttributes._shipping_address_clone_id = order?.shipping_address?.id
         }
         if (
           billingAddress != null &&
@@ -259,10 +245,7 @@ export async function saveAddresses({
           }
           const billingAddressWithMeta = sanitizeMetadataFields(billingAddress)
           let address: Address | undefined
-          if (
-            order?.billing_address?.id &&
-            order?.billing_address?.reference == null
-          ) {
+          if (order?.billing_address?.id && order?.billing_address?.reference == null) {
             address = await sdk.addresses.update({
               id: order.billing_address.id,
               ...billingAddressWithMeta,
@@ -270,9 +253,7 @@ export async function saveAddresses({
             orderAttributes._refresh = true
           } else {
             address = await sdk.addresses.create(billingAddressWithMeta)
-            orderAttributes.billing_address = sdk.addresses.relationship(
-              address.id,
-            )
+            orderAttributes.billing_address = sdk.addresses.relationship(address.id)
           }
         }
         if (!shipToDifferentAddress && billingAddressCloneId) {
@@ -287,18 +268,11 @@ export async function saveAddresses({
           delete orderAttributes._shipping_address_same_as_billing
           if (shippingAddressCloneId)
             orderAttributes._shipping_address_clone_id = shippingAddressCloneId
-          if (
-            shippingAddress != null &&
-            Object.keys(shippingAddress).length > 0
-          ) {
+          if (shippingAddress != null && Object.keys(shippingAddress).length > 0) {
             delete orderAttributes._shipping_address_clone_id
-            const shippingAddressWithMeta =
-              sanitizeMetadataFields(shippingAddress)
+            const shippingAddressWithMeta = sanitizeMetadataFields(shippingAddress)
             let address: Address | undefined
-            if (
-              order?.shipping_address?.id &&
-              order?.shipping_address?.reference == null
-            ) {
+            if (order?.shipping_address?.id && order?.shipping_address?.reference == null) {
               address = await sdk.addresses.update({
                 id: order.shipping_address.id,
                 ...shippingAddressWithMeta,
@@ -306,9 +280,7 @@ export async function saveAddresses({
               orderAttributes._refresh = true
             } else {
               address = await sdk.addresses.create(shippingAddressWithMeta)
-              orderAttributes.shipping_address = sdk.addresses.relationship(
-                address.id,
-              )
+              orderAttributes.shipping_address = sdk.addresses.relationship(address.id)
             }
           }
         }
@@ -336,14 +308,7 @@ const type: AddressActionType[] = [
   "cleanup",
 ]
 
-const addressReducer = (
-  state: AddressState,
-  reducer: AddressAction,
-): AddressState =>
-  baseReducer<AddressState, AddressAction, AddressActionType[]>(
-    state,
-    reducer,
-    type,
-  )
+const addressReducer = (state: AddressState, reducer: AddressAction): AddressState =>
+  baseReducer<AddressState, AddressAction, AddressActionType[]>(state, reducer, type)
 
 export default addressReducer
diff --git a/packages/react-components/src/reducers/BillingAddressReducer.ts b/packages/react-components/src/reducers/BillingAddressReducer.ts
index 9d022461..5993717e 100644
--- a/packages/react-components/src/reducers/BillingAddressReducer.ts
+++ b/packages/react-components/src/reducers/BillingAddressReducer.ts
@@ -1,14 +1,14 @@
-import baseReducer from '#utils/baseReducer'
-import type { Dispatch } from 'react'
-import type { CommerceLayerConfig } from '#context/CommerceLayerContext'
-import type { AddressUpdate, Order } from '@commercelayer/sdk'
-import { getSdk } from '@commercelayer/core'
-import type { AddressResource } from './AddressReducer'
+import baseReducer from "#utils/baseReducer"
+import type { Dispatch } from "react"
+import type { CommerceLayerConfig } from "#context/CommerceLayerContext"
+import type { AddressUpdate, Order } from "@commercelayer/sdk"
+import { getSdk } from "@commercelayer/core"
+import type { AddressResource } from "./AddressReducer"
 
 export type BillingAddressActionType =
-  | 'setBillingAddress'
-  | 'setBillingCustomerAddressId'
-  | 'cleanup'
+  | "setBillingAddress"
+  | "setBillingCustomerAddressId"
+  | "cleanup"
 
 export interface BillingAddressActionPayload {
   _billing_address_clone_id: string
@@ -23,7 +23,7 @@ export interface BillingAddressAction {
 }
 
 export const billingAddressInitialState: BillingAddressState = {
-  _billing_address_clone_id: ''
+  _billing_address_clone_id: "",
 }
 
 export type SetBillingAddress = (
@@ -41,22 +41,25 @@ export const setBillingAddress: SetBillingAddress = async (id, options) => {
   try {
     if (options?.order) {
       if (options.customerAddressId) {
-        const sdk = getSdk({ accessToken: options.config.accessToken!, interceptors: options.config.interceptors })
+        const sdk = getSdk({
+          accessToken: options.config.accessToken!,
+          interceptors: options.config.interceptors,
+        })
         const attributes: AddressUpdate = {
           id,
-          reference: options.customerAddressId
+          reference: options.customerAddressId,
         }
         await sdk.addresses.update(attributes)
       }
       options.dispatch({
-        type: 'setBillingAddress',
+        type: "setBillingAddress",
         payload: {
-          _billing_address_clone_id: id
-        }
+          _billing_address_clone_id: id,
+        },
       })
     }
   } catch (error) {
-    console.error('Set billing address', error)
+    console.error("Set billing address", error)
   }
 }
 
@@ -69,36 +72,36 @@ interface SetBillingCustomerAddressIdParams {
 export function setBillingCustomerAddressId({
   dispatch,
   order,
-  setCloneAddress
+  setCloneAddress,
 }: SetBillingCustomerAddressIdParams): void {
   const customerAddressId = order?.billing_address?.reference
   try {
     if (customerAddressId) {
       dispatch({
-        type: 'setBillingCustomerAddressId',
-        payload: { billingCustomerAddressId: customerAddressId }
+        type: "setBillingCustomerAddressId",
+        payload: { billingCustomerAddressId: customerAddressId },
       })
-      setCloneAddress(customerAddressId, 'billing_address')
+      setCloneAddress(customerAddressId, "billing_address")
     }
   } catch (error) {
-    console.error('error', error)
+    console.error("error", error)
   }
 }
 
 const type: BillingAddressActionType[] = [
-  'setBillingAddress',
-  'setBillingCustomerAddressId',
-  'cleanup'
+  "setBillingAddress",
+  "setBillingCustomerAddressId",
+  "cleanup",
 ]
 
 const billingAddressReducer = (
   state: BillingAddressState,
   reducer: BillingAddressAction
 ): BillingAddressState =>
-  baseReducer<
-    BillingAddressState,
-    BillingAddressAction,
-    BillingAddressActionType[]
-  >(state, reducer, type)
+  baseReducer<BillingAddressState, BillingAddressAction, BillingAddressActionType[]>(
+    state,
+    reducer,
+    type
+  )
 
 export default billingAddressReducer
diff --git a/packages/react-components/src/reducers/CustomerReducer.ts b/packages/react-components/src/reducers/CustomerReducer.ts
index 93eecbab..a8e6662a 100644
--- a/packages/react-components/src/reducers/CustomerReducer.ts
+++ b/packages/react-components/src/reducers/CustomerReducer.ts
@@ -1,6 +1,6 @@
-import baseReducer from '#utils/baseReducer'
-import type { Dispatch } from 'react'
-import type { BaseError } from '#typings/errors'
+import baseReducer from "#utils/baseReducer"
+import type { Dispatch } from "react"
+import type { BaseError } from "#typings/errors"
 import type {
   Address,
   AddressCreate,
@@ -12,28 +12,25 @@ import type {
   OrderSubscription,
   OrderUpdate,
   QueryPageSize,
-  QuerySort
-} from '@commercelayer/sdk'
-import type { CommerceLayerConfig } from '#context/CommerceLayerContext'
-import type { updateOrder } from './OrderReducer'
-import { getSdk } from '@commercelayer/core'
-import getErrors from '#utils/getErrors'
-import { jwt } from '#utils/jwt'
-import { getCustomerIdByToken } from '#utils/getCustomerIdByToken'
-import {
-  type TriggerAttributeHelper,
-  triggerAttributeHelper
-} from '#utils/triggerAttributeHelper'
-import { sanitizeMetadataFields } from '#utils/addressesManager'
+  QuerySort,
+} from "@commercelayer/sdk"
+import type { CommerceLayerConfig } from "#context/CommerceLayerContext"
+import type { updateOrder } from "./OrderReducer"
+import { getSdk } from "@commercelayer/core"
+import getErrors from "#utils/getErrors"
+import { jwt } from "#utils/jwt"
+import { getCustomerIdByToken } from "#utils/getCustomerIdByToken"
+import { type TriggerAttributeHelper, triggerAttributeHelper } from "#utils/triggerAttributeHelper"
+import { sanitizeMetadataFields } from "#utils/addressesManager"
 
 export type CustomerActionType =
-  | 'setErrors'
-  | 'setCustomerEmail'
-  | 'setAddresses'
-  | 'setPayments'
-  | 'setOrders'
-  | 'setSubscriptions'
-  | 'setCustomers'
+  | "setErrors"
+  | "setCustomerEmail"
+  | "setAddresses"
+  | "setPayments"
+  | "setOrders"
+  | "setSubscriptions"
+  | "setCustomers"
 
 export interface CustomerActionPayload {
   addresses: Address[] | null
@@ -84,12 +81,12 @@ export interface SaveCustomerUser {
 export async function saveCustomerUser({
   customerEmail,
   order,
-  updateOrder
+  updateOrder,
 }: SaveCustomerUser): Promise<void> {
   if (order) {
     const attributes: OrderUpdate = {
       customer_email: customerEmail,
-      id: order.id
+      id: order.id,
     }
     await updateOrder({ id: order.id, attributes })
   }
@@ -112,10 +109,10 @@ export function setCustomerErrors(
 ): void {
   if (dispatch)
     dispatch({
-      type: 'setErrors',
+      type: "setErrors",
       payload: {
-        errors
-      }
+        errors,
+      },
     })
 }
 
@@ -131,10 +128,10 @@ export function setCustomerEmail(
 ): void {
   if (dispatch)
     dispatch({
-      type: 'setCustomerEmail',
+      type: "setCustomerEmail",
       payload: {
-        customerEmail
-      }
+        customerEmail,
+      },
     })
 }
 
@@ -162,45 +159,41 @@ export async function getCustomerAddresses({
   config,
   dispatch,
   isOrderAvailable,
-  pageSize = 10
+  pageSize = 10,
 }: GetCustomerAddresses): Promise<void> {
   try {
     const addresses = [] as Address[]
     const sdk = getSdk({ accessToken: config.accessToken!, interceptors: config.interceptors })
     const customerAddresses = await sdk.customer_addresses.list({
-      include: ['address'],
-      pageSize
+      include: ["address"],
+      pageSize,
     })
     customerAddresses.forEach((customerAddress) => {
       if (customerAddress.address) {
         if (customerAddress.address.reference == null) {
           customerAddress.address.reference = customerAddress.id
         }
-        if (
-          customerAddress.id !== customerAddress.address.reference &&
-          !isOrderAvailable
-        ) {
+        if (customerAddress.id !== customerAddress.address.reference && !isOrderAvailable) {
           customerAddress.address.reference = customerAddress.id
         }
         addresses.push(customerAddress.address)
       }
     })
     addresses.sort((a, b) => {
-      if (a.full_name && b.full_name)
-        return a.full_name.localeCompare(b.full_name)
+      if (a.full_name && b.full_name) return a.full_name.localeCompare(b.full_name)
       return 0
     })
     dispatch({
-      type: 'setAddresses',
-      payload: { addresses }
+      type: "setAddresses",
+      payload: { addresses },
     })
   } catch (error: any) {
-    const errors = getErrors({ error, resource: 'addresses' })
+    const errors = getErrors({ error, resource: "addresses" })
     dispatch({
-      type: 'setErrors',
+      type: "setErrors",
       payload: {
-        errors
-      }
+        errors,
+      },
     })
   }
 }
@@ -216,20 +209,18 @@ export async function deleteCustomerAddress({
   config,
   dispatch,
   customerAddressId,
-  addresses
+  addresses,
 }: DeleteCustomerAddress): Promise<void> {
   if (config && addresses && dispatch && config) {
     try {
       const sdk = getSdk({ accessToken: config.accessToken!, interceptors: config.interceptors })
       await sdk.customer_addresses.delete(customerAddressId)
-      const newAddresses = addresses.filter(
-        ({ reference }) => reference !== customerAddressId
-      )
+      const newAddresses = addresses.filter(({ reference }) => reference !== customerAddressId)
       dispatch({
-        type: 'setAddresses',
+        type: "setAddresses",
         payload: {
-          addresses: newAddresses
-        }
+          addresses: newAddresses,
+        },
       })
     } catch (error) {
       throw new Error("Couldn't delete address")
@@ -248,16 +239,14 @@ export interface GetCustomerPaymentSources {
   order?: Order
 }
 
-export function getCustomerPaymentSources(
-  params?: GetCustomerPaymentSources
-): void {
+export function getCustomerPaymentSources(params?: GetCustomerPaymentSources): void {
   if (params) {
     const { order, dispatch } = params
     const payments = order?.available_customer_payment_sources
     if (payments != null && payments.length > 0 && dispatch) {
       dispatch({
-        type: 'setPayments',
-        payload: { payments }
+        type: "setPayments",
+        payload: { payments },
       })
     }
   }
@@ -295,21 +284,21 @@ export async function getCustomerOrders({
   dispatch,
   pageSize = 10,
   pageNumber = 1,
-  sortBy
+  sortBy,
 }: GetCustomerOrdersProps): Promise<void> {
   if (config.accessToken) {
     const { owner } = jwt(config.accessToken)
     if (owner?.id) {
       const sdk = getSdk({ accessToken: config.accessToken!, interceptors: config.interceptors })
       const orders = await sdk.customers.orders(owner.id, {
-        filters: { status_not_in: 'draft,pending' },
-        sort: sortBy ?? { number: 'desc'},
+        filters: { status_not_in: "draft,pending" },
+        sort: sortBy ?? { number: "desc" },
         pageSize,
-        pageNumber
+        pageNumber,
       })
       dispatch({
-        type: 'setOrders',
-        payload: { orders }
+        type: "setOrders",
+        payload: { orders },
       })
     }
   }
@@ -321,7 +310,7 @@ export async function getCustomerSubscriptions({
   dispatch,
   pageSize = 10,
   pageNumber = 1,
-  sortBy
+  sortBy,
 }: GetCustomerOrdersProps): Promise<void> {
   if (config.accessToken) {
     const { owner } = jwt(config.accessToken)
@@ -330,27 +319,24 @@ export async function getCustomerSubscriptions({
       if (id != null) {
         const subscriptions = await sdk.customers.orders(owner.id, {
           filters: { order_subscription_id_eq: id },
-          sort: sortBy ?? { number: 'desc'},
-          include: ['authorizations'],
+          sort: sortBy ?? { number: "desc" },
+          include: ["authorizations"],
           pageSize,
-          pageNumber
+          pageNumber,
         })
         dispatch({
-          type: 'setSubscriptions',
-          payload: { subscriptions }
+          type: "setSubscriptions",
+          payload: { subscriptions },
         })
       } else {
-        const subscriptions = await sdk.customers.order_subscriptions(
-          owner.id,
-          {
-            sort: (sortBy ?? { starts_at: 'desc'}) as QuerySort<OrderSubscription>,
-            pageSize,
-            pageNumber
-          }
-        )
+        const subscriptions = await sdk.customers.order_subscriptions(owner.id, {
+          sort: (sortBy ?? { starts_at: "desc" }) as QuerySort<OrderSubscription>,
+          pageSize,
+          pageNumber,
+        })
         dispatch({
-          type: 'setSubscriptions',
-          payload: { subscriptions }
+          type: "setSubscriptions",
+          payload: { subscriptions },
         })
       }
     }
@@ -384,7 +370,7 @@ export async function createCustomerAddress({
   address,
   config,
   dispatch,
-  state
+  state,
 }: TCreateCustomerAddress): Promise<void> {
   if (config && address) {
     const sdk = getSdk({ accessToken: config.accessToken!, interceptors: config.interceptors })
@@ -399,8 +385,8 @@ export async function createCustomerAddress({
         })
         if (dispatch) {
           dispatch({
-            type: 'setAddresses',
-            payload: { addresses: updatedAddresses }
+            type: "setAddresses",
+            payload: { addresses: updatedAddresses },
           })
         }
       } else {
@@ -410,17 +396,17 @@ export async function createCustomerAddress({
           // @ts-ignore customer_email is provided by the customer relationship in the API
           const newCustomerAddress = await sdk.customer_addresses.create({
             customer: sdk.customers.relationship(state?.customers?.id),
-            address: sdk.addresses.relationship(newAddress.id)
+            address: sdk.addresses.relationship(newAddress.id),
           })
           await sdk.addresses.update({
             id: newAddress.id,
-            reference: newCustomerAddress.id
+            reference: newCustomerAddress.id,
           })
           if (dispatch && state?.addresses) {
             newAddress.reference = newCustomerAddress.id
             dispatch({
-              type: 'setAddresses',
-              payload: { addresses: [...state.addresses, newAddress] }
+              type: "setAddresses",
+              payload: { addresses: [...state.addresses, newAddress] },
             })
           }
         }
@@ -437,23 +423,23 @@ export async function getCustomerPayments({
   config,
   dispatch,
   pageSize = 10,
-  pageNumber = 1
+  pageNumber = 1,
 }: GetCustomerPaymentsParams): Promise<void> {
   if (config?.accessToken != null && dispatch != null) {
     const sdk = getSdk({ accessToken: config.accessToken!, interceptors: config.interceptors })
     const { owner } = jwt(config.accessToken)
     if (owner?.id) {
       const payments = await sdk.customer_payment_sources.list({
-        include: ['payment_source'],
-        sort: { updated_at: 'desc' },
+        include: ["payment_source"],
+        sort: { updated_at: "desc" },
         pageNumber,
-        pageSize
+        pageSize,
       })
       dispatch({
-        type: 'setPayments',
+        type: "setPayments",
         payload: {
-          payments
-        }
+          payments,
+        },
       })
     }
   }
@@ -476,7 +462,7 @@ export async function deleteCustomerPayment({
       await sdk.customer_payment_sources.delete(customerPaymentSourceId)
       getCustomerPayments({
         config,
-        dispatch
+        dispatch,
       })
     } catch (error) {
       throw new Error("Couldn't delete payment source")
@@ -486,7 +472,7 @@ export async function deleteCustomerPayment({
 
 export async function getCustomerInfo({
   config,
-  dispatch
+  dispatch,
 }: GetCustomerPaymentsParams): Promise<void> {
   if (config.accessToken && dispatch != null) {
     const sdk = getSdk({ accessToken: config.accessToken!, interceptors: config.interceptors })
@@ -495,11 +481,11 @@ export async function getCustomerInfo({
       const customers = await sdk.customers.retrieve(customerId)
       const customerEmail = customers.email
       dispatch({
-        type: 'setCustomers',
+        type: "setCustomers",
         payload: {
           customers,
-          customerEmail
-        }
+          customerEmail,
+        },
       })
     }
   }
@@ -539,7 +525,7 @@ export async function setResourceTrigger({
   id,
   pageSize = 10,
   pageNumber = 1,
-  reloadList = false
+  reloadList = false,
 }: SetResourceTriggerParams): Promise<boolean> {
   if (config.accessToken) {
     const { owner } = jwt(config.accessToken)
@@ -548,27 +534,25 @@ export async function setResourceTrigger({
         config,
         resource,
         attribute,
-        id
+        id,
       }
-      const response = await triggerAttributeHelper(
-        params as TriggerAttributeHelper
-      )
+      const response = await triggerAttributeHelper(params as TriggerAttributeHelper)
       if (response != null && dispatch != null && reloadList) {
         switch (resource) {
-          case 'orders':
+          case "orders":
             await getCustomerOrders({
               config,
               dispatch,
               pageSize,
-              pageNumber
+              pageNumber,
             })
             break
-          case 'order_subscriptions':
+          case "order_subscriptions":
             await getCustomerSubscriptions({
               config,
               dispatch,
               pageSize,
-              pageNumber
+              pageNumber,
             })
             break
           default:
@@ -584,27 +568,20 @@ export async function setResourceTrigger({
 export const customerInitialState: CustomerState = {
   errors: [],
   addresses: null,
-  payments: null
+  payments: null,
 }
 
 const type: CustomerActionType[] = [
-  'setErrors',
-  'setCustomerEmail',
-  'setAddresses',
-  'setPayments',
-  'setOrders',
-  'setSubscriptions',
-  'setCustomers'
+  "setErrors",
+  "setCustomerEmail",
+  "setAddresses",
+  "setPayments",
+  "setOrders",
+  "setSubscriptions",
+  "setCustomers",
 ]
 
-const customerReducer = (
-  state: CustomerState,
-  reducer: CustomerAction
-): CustomerState =>
-  baseReducer<CustomerState, CustomerAction, CustomerActionType[]>(
-    state,
-    reducer,
-    type
-  )
+const customerReducer = (state: CustomerState, reducer: CustomerAction): CustomerState =>
+  baseReducer<CustomerState, CustomerAction, CustomerActionType[]>(state, reducer, type)
 
 export default customerReducer
diff --git a/packages/react-components/src/reducers/GiftCardReducer.ts b/packages/react-components/src/reducers/GiftCardReducer.ts
index 05916fd4..15a42fc1 100644
--- a/packages/react-components/src/reducers/GiftCardReducer.ts
+++ b/packages/react-components/src/reducers/GiftCardReducer.ts
@@ -1,30 +1,27 @@
 /* eslint-disable @typescript-eslint/no-unsafe-argument */
-import baseReducer from '#utils/baseReducer'
+import baseReducer from "#utils/baseReducer"
 import type {
   Customer,
   Market,
   GiftCardRecipient,
   GiftCardRecipientCreate,
   Order,
-  GiftCardRecipientUpdate
-} from '@commercelayer/sdk'
-import type { BaseMetadata } from '#typings'
-import type { Dispatch } from 'react'
-import type { CommerceLayerConfig } from '#context/CommerceLayerContext'
-import { isEmpty } from '#utils/isEmpty'
-import type { BaseError } from '#typings/errors'
-import getErrors from '#utils/getErrors'
-import { getSdk } from '@commercelayer/core'
-import type {
-  createOrder as makeOrder,
-  getOrderContext
-} from '#reducers/OrderReducer'
+  GiftCardRecipientUpdate,
+} from "@commercelayer/sdk"
+import type { BaseMetadata } from "#typings"
+import type { Dispatch } from "react"
+import type { CommerceLayerConfig } from "#context/CommerceLayerContext"
+import { isEmpty } from "#utils/isEmpty"
+import type { BaseError } from "#typings/errors"
+import getErrors from "#utils/getErrors"
+import { getSdk } from "@commercelayer/core"
+import type { createOrder as makeOrder, getOrderContext } from "#reducers/OrderReducer"
 
 export type GiftCardActionType =
-  | 'setAvailability'
-  | 'setGiftCardRecipient'
-  | 'setGiftCardErrors'
-  | 'setGiftCardLoading'
+  | "setAvailability"
+  | "setGiftCardRecipient"
+  | "setGiftCardErrors"
+  | "setGiftCardLoading"
 
 export interface GiftCardRecipientI {
   email: string
@@ -64,9 +61,7 @@ export interface GiftCardActionPayload extends GiftCardI {
 export interface GiftCardState extends GiftCardActionPayload {
   currencyCode: string
   balanceCent: number
-  addGiftCardRecipient?: (
-    values: GiftCardRecipientI & Record<string, any>
-  ) => void
+  addGiftCardRecipient?: (values: GiftCardRecipientI & Record<string, any>) => void
   addGiftCard?: (values: GiftCardI & Record<string, any>) => void
   addGiftCardError?: (errors: BaseError[]) => void
   addGiftCardLoading?: (loading: boolean) => void
@@ -78,13 +73,13 @@ export interface GiftCardAction {
 }
 
 export const giftCardInitialState: GiftCardState = {
-  currencyCode: '',
+  currencyCode: "",
   balanceCent: 0,
   singleUse: false,
   rechargeable: true,
   loading: false,
   expiresAt: null,
-  errors: []
+  errors: [],
 }
 
 export type AddGiftCardError = <V extends BaseError[]>(
@@ -106,10 +101,10 @@ export async function addGiftCardRecipient<V extends GiftCardRecipientCreate>(
     const sdk = getSdk({ accessToken: config.accessToken!, interceptors: config.interceptors })
     const recipient = await sdk.gift_card_recipients.create(values)
     dispatch({
-      type: 'setGiftCardRecipient',
+      type: "setGiftCardRecipient",
       payload: {
-        giftCardRecipient: recipient
-      }
+        giftCardRecipient: recipient,
+      },
     })
   } catch (error) {
     console.error(error)
@@ -118,10 +113,10 @@ export async function addGiftCardRecipient<V extends GiftCardRecipientCreate>(
 
 export const addGiftCardLoading: AddGiftCardLoading = (loading, dispatch) => {
   dispatch({
-    type: 'setGiftCardLoading',
+    type: "setGiftCardLoading",
     payload: {
-      loading
-    }
+      loading,
+    },
   })
 }
 
@@ -132,7 +127,7 @@ export async function addGiftCard<V extends GiftCardI>(
     dispatch,
     getOrder,
     createOrder,
-    order
+    order,
   }: {
     getOrder?: getOrderContext
     createOrder?: typeof makeOrder
@@ -148,13 +143,13 @@ export async function addGiftCard<V extends GiftCardI>(
     // TODO: Change any type
     const giftCardValue: any = {
       recipient_email: email,
-      ...val
+      ...val,
     }
     const giftCard = await sdk.gift_cards.create(giftCardValue, {
-      include: ['gift_card_recipient']
+      include: ["gift_card_recipient"],
     })
     const recipientValues: GiftCardRecipientUpdate = {
-      id: giftCard.gift_card_recipient?.id ?? ''
+      id: giftCard.gift_card_recipient?.id ?? "",
     }
     if (firstName) recipientValues.first_name = firstName
     if (lastName) recipientValues.last_name = lastName
@@ -169,25 +164,25 @@ export async function addGiftCard<V extends GiftCardI>(
         await sdk.line_items.create({
           quantity: 1,
           order,
-          item
+          item,
         })
         await getOrder(id)
       }
     }
     dispatch({
-      type: 'setGiftCardRecipient',
+      type: "setGiftCardRecipient",
       payload: {
-        ...giftCardValue
-      }
+        ...giftCardValue,
+      },
     })
     addGiftCardLoading(false, dispatch)
   } catch (error: any) {
-    const errors = getErrors({ error, resource: 'gift_cards' })
+    const errors = getErrors({ error, resource: "gift_cards" })
     dispatch({
-      type: 'setGiftCardErrors',
+      type: "setGiftCardErrors",
       payload: {
-        errors
-      }
+        errors,
+      },
     })
     addGiftCardLoading(false, dispatch)
   }
@@ -195,28 +190,21 @@ export async function addGiftCard<V extends GiftCardI>(
 
 export const addGiftCardError: AddGiftCardError = (errors, dispatch) => {
   dispatch({
-    type: 'setGiftCardErrors',
+    type: "setGiftCardErrors",
     payload: {
-      errors
-    }
+      errors,
+    },
   })
 }
 
 const type: GiftCardActionType[] = [
-  'setAvailability',
-  'setGiftCardRecipient',
-  'setGiftCardErrors',
-  'setGiftCardLoading'
+  "setAvailability",
+  "setGiftCardRecipient",
+  "setGiftCardErrors",
+  "setGiftCardLoading",
 ]
 
-const giftCardReducer = (
-  state: GiftCardState,
-  reducer: GiftCardAction
-): GiftCardState =>
-  baseReducer<GiftCardState, GiftCardAction, GiftCardActionType[]>(
-    state,
-    reducer,
-    type
-  )
+const giftCardReducer = (state: GiftCardState, reducer: GiftCardAction): GiftCardState =>
+  baseReducer<GiftCardState, GiftCardAction, GiftCardActionType[]>(state, reducer, type)
 
 export default giftCardReducer
diff --git a/packages/react-components/src/reducers/InStockSubscriptionReducer.ts b/packages/react-components/src/reducers/InStockSubscriptionReducer.ts
index 36da77e7..c2a41145 100644
--- a/packages/react-components/src/reducers/InStockSubscriptionReducer.ts
+++ b/packages/react-components/src/reducers/InStockSubscriptionReducer.ts
@@ -1,25 +1,22 @@
-import baseReducer from '#utils/baseReducer'
-import type { CommerceLayerConfig } from '#context/CommerceLayerContext'
-import { getSdk } from '@commercelayer/core'
-import type { BaseAction } from '#typings'
-import type { Dispatch } from 'react'
-import type { BaseError } from '#typings/errors'
-import type { InStockSubscriptionCreate } from '@commercelayer/sdk'
-import getErrors from '#utils/getErrors'
+import baseReducer from "#utils/baseReducer"
+import type { CommerceLayerConfig } from "#context/CommerceLayerContext"
+import { getSdk } from "@commercelayer/core"
+import type { BaseAction } from "#typings"
+import type { Dispatch } from "react"
+import type { BaseError } from "#typings/errors"
+import type { InStockSubscriptionCreate } from "@commercelayer/sdk"
+import getErrors from "#utils/getErrors"
 
-type InStockSubscriptionActionType = 'setErrors'
-type InStockSubscriptionAction = BaseAction<
-  InStockSubscriptionActionType,
-  InStockSubscriptionState
->
+type InStockSubscriptionActionType = "setErrors"
+type InStockSubscriptionAction = BaseAction<InStockSubscriptionActionType, InStockSubscriptionState>
 export interface InStockSubscriptionState {
   errors?: BaseError[]
 }
 
-const actionType: InStockSubscriptionActionType[] = ['setErrors']
+const actionType: InStockSubscriptionActionType[] = ["setErrors"]
 
 export const inStockSubscriptionInitialState: InStockSubscriptionState = {
-  errors: []
+  errors: [],
 }
 
 interface TSetInStockSubscriptionParams {
@@ -41,20 +38,18 @@ interface TSetInStockSubscriptionParams {
   dispatch?: Dispatch<InStockSubscriptionAction>
 }
 
-export async function setInStockSubscription<
-  T extends TSetInStockSubscriptionParams
->({
+export async function setInStockSubscription<T extends TSetInStockSubscriptionParams>({
   config,
   customerEmail,
   skuCode,
-  dispatch
+  dispatch,
 }: T): Promise<{ success: boolean }> {
   try {
-    if (config == null) throw new Error('Access token is required')
+    if (config == null) throw new Error("Access token is required")
     const sdk = getSdk({ accessToken: config.accessToken!, interceptors: config.interceptors })
     // @ts-expect-error OpenAPI schema is not updated
     const attributes: InStockSubscriptionCreate = {
-      sku_code: skuCode
+      sku_code: skuCode,
     }
     if (customerEmail != null) {
       attributes.customer_email = customerEmail
@@ -64,14 +59,14 @@ export async function setInStockSubscription<
   } catch (error: any) {
     const errors = getErrors({
       error,
-      resource: 'in_stock_subscriptions'
+      resource: "in_stock_subscriptions",
     })
     if (dispatch != null) {
       dispatch({
-        type: 'setErrors',
+        type: "setErrors",
         payload: {
-          errors
-        }
+          errors,
+        },
       })
     }
     return { success: false }
diff --git a/packages/react-components/src/reducers/LineItemReducer.ts b/packages/react-components/src/reducers/LineItemReducer.ts
index 104480fb..d66182fd 100644
--- a/packages/react-components/src/reducers/LineItemReducer.ts
+++ b/packages/react-components/src/reducers/LineItemReducer.ts
@@ -1,12 +1,12 @@
-import baseReducer from '#utils/baseReducer'
-import type { Dispatch } from 'react'
-import type { CommerceLayerConfig } from '#context/CommerceLayerContext'
-import type { getOrderContext } from './OrderReducer'
-import type { LoaderType } from '#typings'
-import type { BaseError } from '#typings/errors'
-import type { Order, LineItem } from '@commercelayer/sdk'
-import { getSdk } from '@commercelayer/core'
-import getErrors from '#utils/getErrors'
+import baseReducer from "#utils/baseReducer"
+import type { Dispatch } from "react"
+import type { CommerceLayerConfig } from "#context/CommerceLayerContext"
+import type { getOrderContext } from "./OrderReducer"
+import type { LoaderType } from "#typings"
+import type { BaseError } from "#typings/errors"
+import type { Order, LineItem } from "@commercelayer/sdk"
+import { getSdk } from "@commercelayer/core"
+import getErrors from "#utils/getErrors"
 
 export interface UpdateLineItemParams {
   lineItemId: string
@@ -62,80 +62,70 @@ export const getLineItems: GetLineItems = (params) => {
   order &&
     sdk.orders
       .retrieve(order?.id, {
-        include: ['line_items', 'line_items.line_item_options.sku_option'],
+        include: ["line_items", "line_items.line_item_options.sku_option"],
         fields: {
-          orders: ['line_items']
-        }
+          orders: ["line_items"],
+        },
       })
       .then((response) => {
         dispatch({
-          type: 'setLoading',
+          type: "setLoading",
           payload: {
-            loading: false
-          }
+            loading: false,
+          },
         })
         const items = response.line_items || []
         allLineItems = [...allLineItems, ...items]
         dispatch({
-          type: 'setLineItems',
+          type: "setLineItems",
           payload: {
-            lineItems: allLineItems
-          }
+            lineItems: allLineItems,
+          },
         })
       })
       .catch((error) => {
         const errors = getErrors({
           error,
-          resource: 'line_items'
+          resource: "line_items",
         })
         dispatch({
-          type: 'setErrors',
+          type: "setErrors",
           payload: {
-            errors
-          }
+            errors,
+          },
         })
       })
 }
 
-export async function updateLineItem(
-  params: UpdateLineItemParams
-): Promise<void> {
-  const {
-    config,
-    lineItemId,
-    quantity,
-    hasExternalPrice,
-    getOrder,
-    orderId,
-    dispatch
-  } = params
+export async function updateLineItem(params: UpdateLineItemParams): Promise<void> {
+  const { config, lineItemId, quantity, hasExternalPrice, getOrder, orderId, dispatch } = params
   const sdk = getSdk({ accessToken: config.accessToken!, interceptors: config.interceptors })
   try {
     await sdk.line_items.update({
       id: lineItemId,
       quantity,
-      _external_price: hasExternalPrice
+      _external_price: hasExternalPrice,
     })
     getOrder && (await getOrder(orderId))
     dispatch({
-      type: 'setErrors',
+      type: "setErrors",
       payload: {
-        errors: []
-      }
+        errors: [],
+      },
     })
   } catch (error: any) {
     const errors = getErrors({
       error,
-      resource: 'line_items',
+      resource: "line_items",
       attributes: {
-        id: lineItemId
-      }
+        id: lineItemId,
+      },
     })
     dispatch({
-      type: 'setErrors',
+      type: "setErrors",
       payload: {
-        errors
-      }
+        errors,
+      },
     })
   }
 }
@@ -147,21 +137,21 @@ export const deleteLineItem: DeleteLineItem = async (params) => {
     await sdk.line_items.delete(lineItemId)
     getOrder && (await getOrder(orderId))
     dispatch({
-      type: 'setErrors',
+      type: "setErrors",
       payload: {
-        errors: []
-      }
+        errors: [],
+      },
     })
   } catch (error: any) {
     const errors = getErrors({
       error,
-      resource: 'line_items'
+      resource: "line_items",
     })
     dispatch({
-      type: 'setErrors',
+      type: "setErrors",
       payload: {
-        errors
-      }
+        errors,
+      },
     })
   }
 }
@@ -169,25 +159,14 @@ export const deleteLineItem: DeleteLineItem = async (params) => {
 export const lineItemInitialState: LineItemState = {
   loading: false,
   errors: [],
-  lineItems: []
+  lineItems: [],
 }
 
-export type LineItemActionType = 'setLineItems' | 'setErrors' | 'setLoading'
-
-const actionType: LineItemActionType[] = [
-  'setLineItems',
-  'setErrors',
-  'setLoading'
-]
-
-const lineItemReducer = (
-  state: LineItemState,
-  reducer: LineItemAction
-): LineItemState =>
-  baseReducer<LineItemState, LineItemAction, LineItemActionType[]>(
-    state,
-    reducer,
-    actionType
-  )
+export type LineItemActionType = "setLineItems" | "setErrors" | "setLoading"
+
+const actionType: LineItemActionType[] = ["setLineItems", "setErrors", "setLoading"]
+
+const lineItemReducer = (state: LineItemState, reducer: LineItemAction): LineItemState =>
+  baseReducer<LineItemState, LineItemAction, LineItemActionType[]>(state, reducer, actionType)
 
 export default lineItemReducer
diff --git a/packages/react-components/src/reducers/OrderReducer.ts b/packages/react-components/src/reducers/OrderReducer.ts
index c63d0fd0..11bdd228 100644
--- a/packages/react-components/src/reducers/OrderReducer.ts
+++ b/packages/react-components/src/reducers/OrderReducer.ts
@@ -17,7 +17,7 @@ import baseReducer from "#utils/baseReducer"
 import { publish } from "#utils/events"
 import { getApplicationLink } from "#utils/getApplicationLink"
 import { jwt } from "#utils/jwt"
-import { getSdk } from '@commercelayer/core'
+import { getSdk } from "@commercelayer/core"
 import {
   type CustomerOrderParams,
   type DeleteLocalOrder,
@@ -53,10 +53,7 @@ type CreateOrderParams = Pick<
 >
 
 export interface AddToCartImportParams
-  extends Omit<
-    AddToCartParams,
-    "skuCode" | "skuId" | "quantity" | "option" | "lineItem"
-  > {
+  extends Omit<AddToCartParams, "skuCode" | "skuId" | "quantity" | "option" | "lineItem"> {
   lineItems: CustomLineItem[]
 }
 
@@ -150,7 +147,10 @@ export async function createOrder(params: CreateOrderParams): Promise<string> {
       setLocalOrder,
     } = params
     if (state?.orderId) return state.orderId
-    const sdk = config != null ? getSdk({ accessToken: config.accessToken!, interceptors: config.interceptors }) : undefined
+    const sdk =
+      config != null
+        ? getSdk({ accessToken: config.accessToken!, interceptors: config.interceptors })
+        : undefined
     try {
       if (sdk == null) return ""
       const o = await sdk?.orders.create({ metadata, ...orderAttributes })
@@ -182,9 +182,7 @@ export async function createOrder(params: CreateOrderParams): Promise<string> {
   return ""
 }
 
-export const getApiOrder: GetOrder = async (
-  params,
-): Promise<Order | undefined> => {
+export const getApiOrder: GetOrder = async (params): Promise<Order | undefined> => {
   const {
     id,
     dispatch,
@@ -195,7 +193,10 @@ export const getApiOrder: GetOrder = async (
     state,
     options = {},
   } = params
-  const sdk = config != null ? getSdk({ accessToken: config.accessToken!, interceptors: config.interceptors }) : undefined
+  const sdk =
+    config != null
+      ? getSdk({ accessToken: config.accessToken!, interceptors: config.interceptors })
+      : undefined
   try {
     if (sdk == null) return undefined
     if (state?.include && state.include.length > 0) {
@@ -256,7 +257,10 @@ export async function getOrderByFields(params: {
   config: CommerceLayerConfig
 }): Promise<Order> {
   const { orderId, fields, config } = params
-  const sdk = config != null ? getSdk({ accessToken: config.accessToken!, interceptors: config.interceptors }) : undefined
+  const sdk =
+    config != null
+      ? getSdk({ accessToken: config.accessToken!, interceptors: config.interceptors })
+      : undefined
   if (sdk == null) throw new Error("SDK not initialized")
   const order = await sdk.orders.retrieve(orderId, { fields })
   return order
@@ -274,13 +278,15 @@ export async function updateOrder({
   error?: { errors: BaseError[] }
   order?: Order
 }> {
-  const sdk = config != null ? getSdk({ accessToken: config.accessToken!, interceptors: config.interceptors }) : undefined
+  const sdk =
+    config != null
+      ? getSdk({ accessToken: config.accessToken!, interceptors: config.interceptors })
+      : undefined
   try {
     if (sdk == null) return { success: false }
     const resource = { ...attributes, id }
     // Take note of current total amount with taxes cents (used in some cases like Adyen and the payment source is expired and needs to be updated)
-    const currentTotalAmountWithTaxesCents =
-      state?.order?.total_amount_with_taxes_cents
+    const currentTotalAmountWithTaxesCents = state?.order?.total_amount_with_taxes_cents
     // const order = await sdk.orders.update(resource, { include })
     await sdk.orders.update(resource, { include })
     // NOTE: Retrieve doesn't response with attributes updated
@@ -336,7 +342,10 @@ export async function paymentSourceRequest({
   order,
   state,
 }: TResourceRequest): Promise<{ success: boolean; order?: Order }> {
-  const sdk = config != null ? getSdk({ accessToken: config.accessToken!, interceptors: config.interceptors }) : undefined
+  const sdk =
+    config != null
+      ? getSdk({ accessToken: config.accessToken!, interceptors: config.interceptors })
+      : undefined
   try {
     if (sdk == null) return { success: false }
     const sdkResource = sdk[resource]
@@ -359,10 +368,7 @@ export async function paymentSourceRequest({
   }
 }
 
-export const setOrder = (
-  order: Order,
-  dispatch?: Dispatch<OrderActions>,
-): void => {
+export const setOrder = (order: Order, dispatch?: Dispatch<OrderActions>): void => {
   if (dispatch) {
     dispatch({
       type: "setOrder",
@@ -402,8 +408,7 @@ export function addResourceToInclude({
     includeLoaded: undefined,
   }
   if (newResource) {
-    const resources =
-      typeof newResource === "string" ? [newResource] : newResource
+    const resources = typeof newResource === "string" ? [newResource] : newResource
     payload.include = [...new Set([...resourcesIncluded, ...resources])]
     resources.forEach((resource) => {
       const includeLoaded = {
@@ -483,7 +488,7 @@ export type AddToCartParams = Partial<{
 }>
 
 export async function addToCart(
-  params: AddToCartParams,
+  params: AddToCartParams
 ): Promise<{ success: boolean; orderId?: string }> {
   const {
     skuCode,
@@ -520,14 +525,14 @@ export async function addToCart(
               await Promise.all(
                 lineItems.map(async (lineItem) => {
                   await sdk.line_items.delete(lineItem.id)
-                }),
+                })
               )
             }
           } else {
             await Promise.all(
               state?.order?.line_items.map(async (lineItem) => {
                 await sdk.line_items.delete(lineItem.id)
-              }),
+              })
             )
           }
         }
@@ -569,15 +574,11 @@ export async function addToCart(
             },
           })
         }
-        if (
-          buyNowMode &&
-          id &&
-          config?.accessToken != null
-        ) {
+        if (buyNowMode && id && config?.accessToken != null) {
           const params = `${id}?accessToken=${config.accessToken ?? ""}`
           const { organization } = jwt(config.accessToken)
           const slug = organization.slug
-          const domain = 'commercelayer.io'
+          const domain = "commercelayer.io"
           const href = getApplicationLink({
             slug,
             orderId: id,
@@ -658,19 +659,22 @@ export type SaveAddressToCustomerAddressBook = (params: {
   type: AddressResource
   value: boolean
 }) => void
-export const saveAddressToCustomerAddressBook: SaveAddressToCustomerAddressBook =
-  ({ type, value, dispatch }) => {
-    const k: CustomerOrderParams = `_save_${type}_to_customer_address_book`
-    const v = `${value.toString()}`
-    setCustomerOrderParam(k, v)
-    if (dispatch)
-      dispatch({
-        type: "setSaveAddressToCustomerAddressBook",
-        payload: {
-          [k]: v,
-        },
-      })
-  }
+export const saveAddressToCustomerAddressBook: SaveAddressToCustomerAddressBook = ({
+  type,
+  value,
+  dispatch,
+}) => {
+  const k: CustomerOrderParams = `_save_${type}_to_customer_address_book`
+  const v = `${value.toString()}`
+  setCustomerOrderParam(k, v)
+  if (dispatch)
+    dispatch({
+      type: "setSaveAddressToCustomerAddressBook",
+      payload: {
+        [k]: v,
+      },
+    })
+}
 
 interface TSetGiftCardOrCouponCodeParams {
   code: string
@@ -795,10 +799,6 @@ export const orderInitialState: Partial<OrderState> = {
 }
 
 const orderReducer = (state: OrderState, reducer: OrderActions): OrderState =>
-  baseReducer<OrderState, OrderActions, OrderActionType[]>(
-    state,
-    reducer,
-    actionType,
-  )
+  baseReducer<OrderState, OrderActions, OrderActionType[]>(state, reducer, actionType)
 
 export default orderReducer
diff --git a/packages/react-components/src/reducers/PaymentMethodReducer.ts b/packages/react-components/src/reducers/PaymentMethodReducer.ts
index 706d4a2c..70e1dabe 100644
--- a/packages/react-components/src/reducers/PaymentMethodReducer.ts
+++ b/packages/react-components/src/reducers/PaymentMethodReducer.ts
@@ -147,13 +147,10 @@ export const paymentMethodInitialState: PaymentMethodState = {
 
 export type SetPaymentMethodErrors = <V extends BaseError[]>(
   errors: V,
-  dispatch?: Dispatch<PaymentMethodAction>,
+  dispatch?: Dispatch<PaymentMethodAction>
 ) => void
 
-export const setPaymentMethodErrors: SetPaymentMethodErrors = (
-  errors,
-  dispatch,
-) => {
+export const setPaymentMethodErrors: SetPaymentMethodErrors = (errors, dispatch) => {
   if (dispatch)
     dispatch({
       type: "setErrors",
@@ -168,10 +165,7 @@ type GetPaymentMethods = (args: {
   dispatch: Dispatch<PaymentMethodAction>
 }) => Promise<void>
 
-export const getPaymentMethods: GetPaymentMethods = async ({
-  order,
-  dispatch,
-}) => {
+export const getPaymentMethods: GetPaymentMethods = async ({ order, dispatch }) => {
   const paymentMethods = order.available_payment_methods
   const paymentMethod = order.payment_method
   const paymentSource = order.payment_source
@@ -180,8 +174,7 @@ export const getPaymentMethods: GetPaymentMethods = async ({
     payload: {
       paymentMethods,
       currentPaymentMethodId: paymentMethod?.id,
-      currentPaymentMethodType:
-        paymentMethod?.payment_source_type as PaymentResource,
+      currentPaymentMethodType: paymentMethod?.payment_source_type as PaymentResource,
       paymentSource,
     },
   })
@@ -276,17 +269,14 @@ export async function setPaymentMethod({
   }
 }
 
-type PaymentSourceTypes =
-  | (StripePayment & WireTransfer)
-  | (StripePayment | WireTransfer)
+type PaymentSourceTypes = (StripePayment & WireTransfer) | (StripePayment | WireTransfer)
 
 export type SetPaymentSourceResponse = {
   order: Order
   paymentSource: PaymentSourceTypes
 } | null
 
-export interface SetPaymentSourceParams
-  extends Omit<PaymentMethodState, "config"> {
+export interface SetPaymentSourceParams extends Omit<PaymentMethodState, "config"> {
   config?: CommerceLayerConfig
   dispatch?: Dispatch<PaymentMethodAction>
   getOrder?: getOrderContext
@@ -384,10 +374,7 @@ export async function setPaymentSource({
       const [error] = errors
       if (error?.status === "401" && getOrder != null && order != null) {
         const currentOrder = await getOrder(order?.id)
-        if (
-          currentOrder?.status != null &&
-          !["placed", "approved"].includes(currentOrder.status)
-        ) {
+        if (currentOrder?.status != null && !["placed", "approved"].includes(currentOrder.status)) {
           console.error("Set payment source:", errors)
           setErrors({
             currentErrors,
@@ -482,13 +469,10 @@ export interface PaymentMethodConfig {
 
 type SetPaymentMethodConfig = (
   config: PaymentMethodConfig,
-  dispatch: Dispatch<PaymentMethodAction>,
+  dispatch: Dispatch<PaymentMethodAction>
 ) => void
 
-export const setPaymentMethodConfig: SetPaymentMethodConfig = (
-  config,
-  dispatch,
-) => {
+export const setPaymentMethodConfig: SetPaymentMethodConfig = (config, dispatch) => {
   dispatch({
     type: "setPaymentMethodConfig",
     payload: { config },
@@ -502,7 +486,7 @@ export function getPaymentConfig<
   const resourceKeys = replace(
     replace(paymentResource, "payments", "payment"),
     "transfers",
-    "transfer",
+    "transfer"
   )
   const resource = snakeToCamelCase(resourceKeys)
   return pick(config, [resource])
@@ -519,12 +503,12 @@ const type: PaymentMethodActionType[] = [
 
 const paymentMethodReducer = (
   state: PaymentMethodState,
-  reducer: PaymentMethodAction,
+  reducer: PaymentMethodAction
 ): PaymentMethodState =>
-  baseReducer<
-    PaymentMethodState,
-    PaymentMethodAction,
-    PaymentMethodActionType[]
-  >(state, reducer, type)
+  baseReducer<PaymentMethodState, PaymentMethodAction, PaymentMethodActionType[]>(
+    state,
+    reducer,
+    type
+  )
 
 export default paymentMethodReducer
diff --git a/packages/react-components/src/reducers/PlaceOrderReducer.ts b/packages/react-components/src/reducers/PlaceOrderReducer.ts
index 72b340c2..49ebc43a 100644
--- a/packages/react-components/src/reducers/PlaceOrderReducer.ts
+++ b/packages/react-components/src/reducers/PlaceOrderReducer.ts
@@ -4,11 +4,7 @@ import type { Dispatch, RefObject } from "react"
 import type { CommerceLayerConfig } from "#context/CommerceLayerContext"
 import type { BaseError } from "#typings/errors"
 import baseReducer from "#utils/baseReducer"
-import {
-  saveBillingAddress,
-  saveShippingAddress,
-  saveToWallet,
-} from "#utils/customerOrderOptions"
+import { saveBillingAddress, saveShippingAddress, saveToWallet } from "#utils/customerOrderOptions"
 import getErrors from "#utils/getErrors"
 import { getSdk } from "@commercelayer/core"
 import { hasSubscriptions } from "#utils/hasSubscriptions"
@@ -59,7 +55,7 @@ export interface PlaceOrderActionPayload {
 
 export function setButtonRef(
   ref: RefObject<HTMLButtonElement | null>,
-  dispatch: Dispatch<PlaceOrderAction>,
+  dispatch: Dispatch<PlaceOrderAction>
 ): void {
   if (ref?.current != null) {
     dispatch({
@@ -86,7 +82,7 @@ export const placeOrderInitialState: PlaceOrderState = {
 
 export function setPlaceOrderErrors<V extends BaseError[]>(
   errors: V,
-  dispatch: Dispatch<PlaceOrderAction>,
+  dispatch: Dispatch<PlaceOrderAction>
 ): void {
   if (dispatch) {
     dispatch({
@@ -130,8 +126,7 @@ export function placeOrderPermitted({
     const shipment = shipments && shipmentsFilled(shipments)
     const paymentMethod = order.payment_method
     const paymentSource = order.payment_source
-    if (order.total_amount_with_taxes_cents !== 0 && isEmpty(paymentMethod?.id))
-      isPermitted = false
+    if (order.total_amount_with_taxes_cents !== 0 && isEmpty(paymentMethod?.id)) isPermitted = false
     if (isEmpty(billingAddress)) isPermitted = false
     if (isEmpty(shippingAddress) && !doNotShip) isPermitted = false
     if (!isEmpty(shipments) && !shipment) isPermitted = false
@@ -200,10 +195,7 @@ export async function setPlaceOrder({
           order: lastOrderStatus,
         }
       }
-      if (
-        paymentType === "paypal_payments" &&
-        paymentSource?.type === "paypal_payments"
-      ) {
+      if (paymentType === "paypal_payments" && paymentSource?.type === "paypal_payments") {
         if (!options?.paypalPayerId && paymentSource?.approval_url) {
           window.location.href = paymentSource?.approval_url
           return response
@@ -267,11 +259,7 @@ export async function setPlaceOrder({
           })
           if (setOrder) setOrder(orderUpdated)
           if (setOrderErrors) setOrderErrors([])
-          updateOrderSubscriptionCustomerPaymentSource(
-            orderUpdated,
-            paymentType,
-            sdk,
-          )
+          updateOrderSubscriptionCustomerPaymentSource(orderUpdated, paymentType, sdk)
           return {
             placed: true,
             order: orderUpdated,
@@ -301,11 +289,7 @@ export async function setPlaceOrder({
                   if (setOrderErrors) setOrderErrors(errors)
                 }),
           ]).then(() => {
-            updateOrderSubscriptionCustomerPaymentSource(
-              orderUpdated,
-              paymentType,
-              sdk,
-            )
+            updateOrderSubscriptionCustomerPaymentSource(orderUpdated, paymentType, sdk)
           })
           return {
             placed: true,
@@ -354,14 +338,7 @@ const type: PlaceOrderActionType[] = [
   "setStatus",
 ]
 
-const placeOrderReducer = (
-  state: PlaceOrderState,
-  reducer: PlaceOrderAction,
-): PlaceOrderState =>
-  baseReducer<PlaceOrderState, PlaceOrderAction, PlaceOrderActionType[]>(
-    state,
-    reducer,
-    type,
-  )
+const placeOrderReducer = (state: PlaceOrderState, reducer: PlaceOrderAction): PlaceOrderState =>
+  baseReducer<PlaceOrderState, PlaceOrderAction, PlaceOrderActionType[]>(state, reducer, type)
 
 export default placeOrderReducer
diff --git a/packages/react-components/src/reducers/ShipmentReducer.ts b/packages/react-components/src/reducers/ShipmentReducer.ts
index 225ff635..5c5251c6 100644
--- a/packages/react-components/src/reducers/ShipmentReducer.ts
+++ b/packages/react-components/src/reducers/ShipmentReducer.ts
@@ -1,21 +1,13 @@
-import baseReducer from '#utils/baseReducer'
-import type { Dispatch } from 'react'
-import type { BaseError } from '#typings/errors'
-import type {
-  DeliveryLeadTime,
-  LineItem,
-  Order,
-  Shipment
-} from '@commercelayer/sdk'
-import type { CommerceLayerConfig } from '#context/CommerceLayerContext'
-import type { getOrderContext } from './OrderReducer'
-import { getSdk } from '@commercelayer/core'
-import { canPlaceOrder } from '#utils/canPlaceOrder'
+import baseReducer from "#utils/baseReducer"
+import type { Dispatch } from "react"
+import type { BaseError } from "#typings/errors"
+import type { DeliveryLeadTime, LineItem, Order, Shipment } from "@commercelayer/sdk"
+import type { CommerceLayerConfig } from "#context/CommerceLayerContext"
+import type { getOrderContext } from "./OrderReducer"
+import { getSdk } from "@commercelayer/core"
+import { canPlaceOrder } from "#utils/canPlaceOrder"
 
-export type ShipmentActionType =
-  | 'setErrors'
-  | 'setShipments'
-  | 'setShippingMethod'
+export type ShipmentActionType = "setErrors" | "setShipments" | "setShippingMethod"
 
 export type ShipmentLineItem = LineItem & { line_item: LineItem }
 
@@ -33,7 +25,7 @@ export interface ShipmentAction {
 }
 
 export const shipmentInitialState: ShipmentState = {
-  errors: []
+  errors: [],
 }
 
 export type SetShipmentErrors = <V extends BaseError[]>(
@@ -44,10 +36,10 @@ export type SetShipmentErrors = <V extends BaseError[]>(
 export const setShipmentErrors: SetShipmentErrors = (errors, dispatch) => {
   if (dispatch) {
     dispatch({
-      type: 'setErrors',
+      type: "setErrors",
       payload: {
-        errors
-      }
+        errors,
+      },
     })
   }
 }
@@ -58,11 +50,7 @@ type GetShipments = (args: {
   config: CommerceLayerConfig
 }) => Promise<void>
 
-export const getShipments: GetShipments = async ({
-  order,
-  dispatch,
-  config
-}) => {
+export const getShipments: GetShipments = async ({ order, dispatch, config }) => {
   try {
     const sdk = getSdk({ accessToken: config.accessToken!, interceptors: config.interceptors })
     const shipments = order.shipments
@@ -71,19 +59,19 @@ export const getShipments: GetShipments = async ({
     let totalPages = 1
     do {
       const response = await sdk.delivery_lead_times.list({
-        include: ['shipping_method', 'stock_location'],
-        pageNumber: currentPage
+        include: ["shipping_method", "stock_location"],
+        pageNumber: currentPage,
       })
       allDeliveryLeadTimes = allDeliveryLeadTimes.concat(response)
       totalPages = response.meta.pageCount
       currentPage++
     } while (currentPage <= totalPages)
     dispatch({
-      type: 'setShipments',
+      type: "setShipments",
       payload: {
         shipments,
-        deliveryLeadTimes: allDeliveryLeadTimes
-      }
+        deliveryLeadTimes: allDeliveryLeadTimes,
+      },
     })
   } catch (error) {
     console.error(error)
@@ -103,7 +91,7 @@ export async function setShippingMethod({
   shipmentId,
   shippingMethodId,
   getOrder,
-  order
+  order,
 }: TSetShippingMethodParams): Promise<{ success: boolean; order?: Order }> {
   try {
     if (order != null && !canPlaceOrder(order)) {
@@ -113,7 +101,7 @@ export async function setShippingMethod({
       const sdk = getSdk({ accessToken: config.accessToken!, interceptors: config.interceptors })
       await sdk.shipments.update({
         id: shipmentId,
-        shipping_method: sdk.shipping_methods.relationship(shippingMethodId)
+        shipping_method: sdk.shipping_methods.relationship(shippingMethodId),
       })
       if (getOrder != null && order != null) {
         const currentOrder = await getOrder(order.id)
@@ -127,20 +115,9 @@ export async function setShippingMethod({
   }
 }
 
-const type: ShipmentActionType[] = [
-  'setErrors',
-  'setShipments',
-  'setShippingMethod'
-]
+const type: ShipmentActionType[] = ["setErrors", "setShipments", "setShippingMethod"]
 
-const shipmentReducer = (
-  state: ShipmentState,
-  reducer: ShipmentAction
-): ShipmentState =>
-  baseReducer<ShipmentState, ShipmentAction, ShipmentActionType[]>(
-    state,
-    reducer,
-    type
-  )
+const shipmentReducer = (state: ShipmentState, reducer: ShipmentAction): ShipmentState =>
+  baseReducer<ShipmentState, ShipmentAction, ShipmentActionType[]>(state, reducer, type)
 
 export default shipmentReducer
diff --git a/packages/react-components/src/reducers/ShippingAddressReducer.ts b/packages/react-components/src/reducers/ShippingAddressReducer.ts
index c76ad86a..c7550b32 100644
--- a/packages/react-components/src/reducers/ShippingAddressReducer.ts
+++ b/packages/react-components/src/reducers/ShippingAddressReducer.ts
@@ -1,15 +1,15 @@
-import baseReducer from '#utils/baseReducer'
-import type { Dispatch } from 'react'
-import type { CommerceLayerConfig } from '#context/CommerceLayerContext'
-import type { Order, AddressUpdate } from '@commercelayer/sdk'
-import type { getOrderContext } from '#reducers/OrderReducer'
-import type { AddressResource } from './AddressReducer'
-import { getSdk } from '@commercelayer/core'
+import baseReducer from "#utils/baseReducer"
+import type { Dispatch } from "react"
+import type { CommerceLayerConfig } from "#context/CommerceLayerContext"
+import type { Order, AddressUpdate } from "@commercelayer/sdk"
+import type { getOrderContext } from "#reducers/OrderReducer"
+import type { AddressResource } from "./AddressReducer"
+import { getSdk } from "@commercelayer/core"
 
 export type ShippingAddressActionType =
-  | 'setShippingAddress'
-  | 'setShippingCustomerAddressId'
-  | 'cleanup'
+  | "setShippingAddress"
+  | "setShippingCustomerAddressId"
+  | "cleanup"
 
 export interface ShippingAddressActionPayload {
   _shipping_address_clone_id: string
@@ -24,7 +24,7 @@ export interface ShippingAddressAction {
 }
 
 export const shippingAddressInitialState: ShippingAddressState = {
-  _shipping_address_clone_id: ''
+  _shipping_address_clone_id: "",
 }
 
 export type SetShippingAddress = (
@@ -42,18 +42,21 @@ export const setShippingAddress: SetShippingAddress = async (id, options) => {
   try {
     if (options?.order) {
       if (options.customerAddressId) {
-        const sdk = getSdk({ accessToken: options.config.accessToken!, interceptors: options.config.interceptors })
+        const sdk = getSdk({
+          accessToken: options.config.accessToken!,
+          interceptors: options.config.interceptors,
+        })
         const attributes: AddressUpdate = {
           id,
-          reference: options.customerAddressId
+          reference: options.customerAddressId,
         }
         await sdk.addresses.update(attributes)
       }
       options.dispatch({
-        type: 'setShippingAddress',
+        type: "setShippingAddress",
         payload: {
-          _shipping_address_clone_id: id
-        }
+          _shipping_address_clone_id: id,
+        },
       })
     }
   } catch (error) {
@@ -70,36 +73,36 @@ interface SetShippingCustomerAddressIdParams {
 export function setShippingCustomerAddressId({
   dispatch,
   order,
-  setCloneAddress
+  setCloneAddress,
 }: SetShippingCustomerAddressIdParams): void {
   const customerAddressId = order?.shipping_address?.reference
   try {
     if (customerAddressId) {
       dispatch({
-        type: 'setShippingCustomerAddressId',
-        payload: { shippingCustomerAddressId: customerAddressId }
+        type: "setShippingCustomerAddressId",
+        payload: { shippingCustomerAddressId: customerAddressId },
       })
-      setCloneAddress(customerAddressId, 'shipping_address')
+      setCloneAddress(customerAddressId, "shipping_address")
     }
   } catch (error) {
-    console.error('error', error)
+    console.error("error", error)
   }
 }
 
 const type: ShippingAddressActionType[] = [
-  'setShippingAddress',
-  'setShippingCustomerAddressId',
-  'cleanup'
+  "setShippingAddress",
+  "setShippingCustomerAddressId",
+  "cleanup",
 ]
 
 const shippingAddressReducer = (
   state: ShippingAddressState,
   reducer: ShippingAddressAction
 ): ShippingAddressState =>
-  baseReducer<
-    ShippingAddressState,
-    ShippingAddressAction,
-    ShippingAddressActionType[]
-  >(state, reducer, type)
+  baseReducer<ShippingAddressState, ShippingAddressAction, ShippingAddressActionType[]>(
+    state,
+    reducer,
+    type
+  )
 
 export default shippingAddressReducer
diff --git a/packages/react-components/src/typings/environment.d.ts b/packages/react-components/src/typings/environment.d.ts
index 41f7f3ba..8a13f3f7 100644
--- a/packages/react-components/src/typings/environment.d.ts
+++ b/packages/react-components/src/typings/environment.d.ts
@@ -7,6 +7,6 @@ declare namespace NodeJS {
   }
 
   interface ProcessEnv {
-    readonly NODE_ENV: 'development' | 'production' | 'test'
+    readonly NODE_ENV: "development" | "production" | "test"
   }
 }
diff --git a/packages/react-components/src/typings/globals.ts b/packages/react-components/src/typings/globals.ts
index 8c3c3cfe..f1570192 100644
--- a/packages/react-components/src/typings/globals.ts
+++ b/packages/react-components/src/typings/globals.ts
@@ -1,16 +1,10 @@
-import type { JSX } from "react";
+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
+type Enumerate<N extends number, Acc extends number[] = []> = Acc["length"] extends N
   ? Acc[number]
-  : Enumerate<N, [...Acc, Acc['length']]>
+  : Enumerate<N, [...Acc, Acc["length"]]>
 
-export type TRange<F extends number, T extends number> = Exclude<
-  Enumerate<T>,
-  Enumerate<F>
->
+export type TRange<F extends number, T extends number> = Exclude<Enumerate<T>, Enumerate<F>>
 
 export type LooseAutocomplete<T extends string> = T | Omit<string, T>
diff --git a/packages/react-components/src/typings/index.ts b/packages/react-components/src/typings/index.ts
index 17e77a67..45999454 100644
--- a/packages/react-components/src/typings/index.ts
+++ b/packages/react-components/src/typings/index.ts
@@ -9,20 +9,16 @@ export const BC = {
   name: PropTypes.string,
 }
 
-export const PTLoader = PropTypes.oneOfType([
-  PropTypes.element,
-  PropTypes.string,
-])
+export const PTLoader = PropTypes.oneOfType([PropTypes.element, PropTypes.string])
 
 export const BaseSelectComponentPropTypes = {
   children: PropTypes.func,
   options: PropTypes.arrayOf(
     PropTypes.shape({
       label: PropTypes.string.isRequired,
-      value: PropTypes.oneOfType([PropTypes.string, PropTypes.number])
-        .isRequired,
+      value: PropTypes.oneOfType([PropTypes.string, PropTypes.number]).isRequired,
       selected: PropTypes.bool,
-    }).isRequired,
+    }).isRequired
   ).isRequired,
   placeholder: PropTypes.shape({
     label: PropTypes.string.isRequired,
@@ -34,10 +30,7 @@ export const BaseSelectComponentPropTypes = {
 
 export type SelectPlaceholder = Option
 
-type BaseSelectChildrenComponentProps = Omit<
-  BaseSelectComponentProps,
-  "children"
->
+type BaseSelectChildrenComponentProps = Omit<BaseSelectComponentProps, "children">
 
 export interface Option {
   label: string
@@ -56,13 +49,8 @@ export interface BaseSelectComponentProps {
   onChange?: (event: React.ChangeEvent<HTMLSelectElement>) => void
 }
 
-type BaseInputChildrenComponentProps = Omit<
-  BaseInputComponentProps,
-  "children"
-> & {
-  handleChange: (
-    event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,
-  ) => void
+type BaseInputChildrenComponentProps = Omit<BaseInputComponentProps, "children"> & {
+  handleChange: (event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void
   parentRef: ForwardedRef<any>
 }
 
@@ -70,9 +58,7 @@ export interface BaseInputComponentProps {
   ref?: Ref<any>
   children?: (props: BaseInputChildrenComponentProps) => JSX.Element
   name: string
-  onChange?: (
-    event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>,
-  ) => void
+  onChange?: (event: React.ChangeEvent<HTMLInputElement | HTMLTextAreaElement>) => void
   placeholder?: string
 }
 
@@ -121,9 +107,7 @@ export type AddressCountrySelectName =
   | "billing_address_country_code"
   | "shipping_address_country_code"
 
-export type AddressStateSelectName =
-  | "billing_address_state_code"
-  | "shipping_address_state_code"
+export type AddressStateSelectName = "billing_address_state_code" | "shipping_address_state_code"
 
 export type LoaderType = string | JSX.Element
 
@@ -148,14 +132,10 @@ export type BaseActionType<T = string> = T[]
 
 export type BFSetStateContainer<T> = <P extends T>(param: P) => void
 
-export type BaseReducer = <
-  S extends BaseState,
-  A extends BaseAction,
-  T extends BaseActionType,
->(
+export type BaseReducer = <S extends BaseState, A extends BaseAction, T extends BaseActionType>(
   state: S,
   action: A,
-  type: T,
+  type: T
 ) => S
 
 export type BaseUnsetState<A> = (dispatch: Dispatch<A>) => void
@@ -193,9 +173,7 @@ export interface BaseAmountComponent
   labelFree?: string
 }
 
-export type ChildrenFunction<P = Record<string, any>> = (
-  props: P,
-) => JSX.Element | null
+export type ChildrenFunction<P = Record<string, any>> = (props: P) => JSX.Element | null
 
 export type ExcludeTag<T extends keyof JSX.IntrinsicElements> = Exclude<
   keyof JSX.IntrinsicElements,
diff --git a/packages/react-components/src/utils/PropsType.ts b/packages/react-components/src/utils/PropsType.ts
index 6abea1eb..4ab80f58 100644
--- a/packages/react-components/src/utils/PropsType.ts
+++ b/packages/react-components/src/utils/PropsType.ts
@@ -1,4 +1,4 @@
-import type PropTypes from 'prop-types'
+import type PropTypes from "prop-types"
 
 type Omit<T, K> = Pick<T, Exclude<keyof T, K>>
 
diff --git a/packages/react-components/src/utils/addressesManager.ts b/packages/react-components/src/utils/addressesManager.ts
index 9973b5e0..ddf10250 100644
--- a/packages/react-components/src/utils/addressesManager.ts
+++ b/packages/react-components/src/utils/addressesManager.ts
@@ -44,21 +44,13 @@ export function billingAddressController({
     if (requiredMetadataFields != null && requiredMetadataFields.length > 0)
       formFields = [...formFields, ...requiredMetadataFields]
     if (invertAddresses) {
-      billingDisable = !!(
-        billing_address && fieldsExist(billing_address, formFields)
-      )
+      billingDisable = !!(billing_address && fieldsExist(billing_address, formFields))
     } else {
       // if (requiresBillingInfo) formFields = [...formFields, "billing_info"]
-      billingDisable = !!(
-        billing_address && fieldsExist(billing_address, formFields)
-      )
+      billingDisable = !!(billing_address && fieldsExist(billing_address, formFields))
     }
   }
-  if (
-    billingDisable &&
-    !isEmpty(billingAddressId) &&
-    isEmpty(billing_address)
-  ) {
+  if (billingDisable && !isEmpty(billingAddressId) && isEmpty(billing_address)) {
     billingDisable = false
   }
   return billingDisable
@@ -95,21 +87,13 @@ export function shippingAddressController({
       formField = [...formField, ...requiredMetadataFields]
     if (invertAddresses) {
       // if (requiresBillingInfo) formField = [...formField, "billing_info"]
-      shippingDisable = !!(
-        shipping_address && fieldsExist(shipping_address, formField)
-      )
+      shippingDisable = !!(shipping_address && fieldsExist(shipping_address, formField))
     } else if (shipToDifferentAddress) {
       delete shipping_address?.billing_info
-      shippingDisable = !!(
-        shipping_address && fieldsExist(shipping_address, formField)
-      )
+      shippingDisable = !!(shipping_address && fieldsExist(shipping_address, formField))
     }
   }
-  if (
-    shippingDisable &&
-    !isEmpty(shippingAddressId) &&
-    isEmpty(shipping_address)
-  ) {
+  if (shippingDisable && !isEmpty(shippingAddressId) && isEmpty(shipping_address)) {
     shippingDisable = false
   }
   return shippingDisable
@@ -139,25 +123,19 @@ export function countryLockController({
   const doNotShipItems = lineItems
     ?.filter(
       (lineItem) =>
-        lineItem?.item?.type != null &&
-        ["skus", "bundles"].includes(lineItem?.item?.type),
+        lineItem?.item?.type != null && ["skus", "bundles"].includes(lineItem?.item?.type)
     )
     ?.every(
       (lineItem) =>
         // @ts-expect-error no type for do_not_ship on SDK
-        lineItem?.item?.do_not_ship === true,
+        lineItem?.item?.do_not_ship === true
     )
   if (doNotShipItems) return false
-  if (
-    countryCodeLock &&
-    !isEmpty(addresses) &&
-    billingAddressId &&
-    !shipToDifferentAddress
-  ) {
+  if (countryCodeLock && !isEmpty(addresses) && billingAddressId && !shipToDifferentAddress) {
     const addressLocked = addresses?.find(
       (a) =>
         (a?.id === billingAddressId || a?.reference === billingAddressId) &&
-        a?.country_code !== countryCodeLock,
+        a?.country_code !== countryCodeLock
     )
     if (!isEmpty(addressLocked)) return true
   }
@@ -167,16 +145,11 @@ export function countryLockController({
   if (countryCodeLock && !isEmpty(shipping_address) && shipToDifferentAddress) {
     return shipping_address?.country_code !== countryCodeLock
   }
-  if (
-    countryCodeLock &&
-    !isEmpty(addresses) &&
-    shippingAddressId &&
-    shipToDifferentAddress
-  ) {
+  if (countryCodeLock && !isEmpty(addresses) && shippingAddressId && shipToDifferentAddress) {
     const addressLocked = addresses?.find(
       (a) =>
         (a?.id === shippingAddressId || a?.reference === shippingAddressId) &&
-        a?.country_code !== countryCodeLock,
+        a?.country_code !== countryCodeLock
     )
     if (!isEmpty(addressLocked)) return true
   }
@@ -215,11 +188,7 @@ export async function invertedAddressesHandler({
     orderAttributes._billing_address_clone_id = order?.billing_address?.id
     orderAttributes._shipping_address_clone_id = order?.shipping_address?.id
   }
-  if (
-    shippingAddress != null &&
-    Object.keys(shippingAddress).length > 0 &&
-    !shippingAddressId
-  ) {
+  if (shippingAddress != null && Object.keys(shippingAddress).length > 0 && !shippingAddressId) {
     delete orderAttributes._billing_address_clone_id
     delete orderAttributes._shipping_address_clone_id
     orderAttributes._billing_address_same_as_shipping = true
@@ -254,8 +223,7 @@ export async function invertedAddressesHandler({
   }
   if (shipToDifferentAddress) {
     delete orderAttributes._billing_address_same_as_shipping
-    if (billingAddressId)
-      orderAttributes._billing_address_clone_id = billingAddressId
+    if (billingAddressId) orderAttributes._billing_address_clone_id = billingAddressId
     if (billingAddress != null && Object.keys(billingAddress).length > 0) {
       delete orderAttributes._billing_address_clone_id
       const hasMetadata = Object.keys(billingAddress).filter((key) => {
diff --git a/packages/react-components/src/utils/adyen/manageGiftCard.ts b/packages/react-components/src/utils/adyen/manageGiftCard.ts
index b1021909..fab1e17a 100644
--- a/packages/react-components/src/utils/adyen/manageGiftCard.ts
+++ b/packages/react-components/src/utils/adyen/manageGiftCard.ts
@@ -21,9 +21,7 @@ export function manageGiftCard({ order }: Props): ReturnTypes | null {
   if (!order) return null
   if (!order?.payment_source) return null
   const getPaymentSource =
-    order.payment_source?.type === "adyen_payments"
-      ? order.payment_source
-      : null
+    order.payment_source?.type === "adyen_payments" ? order.payment_source : null
   if (!getPaymentSource) return null
   const errorCode =
     // @ts-expect-error No type for payment_response errorCode
@@ -40,25 +38,20 @@ export function manageGiftCard({ order }: Props): ReturnTypes | null {
     getPaymentSource?.payment_response?.amount?.value ?? (0 as number)
   const giftCardData: GiftCardData = {
     cardSummary: additionalData?.cardSummary ?? "",
-    currentBalanceValue:
-      amount ?? Number.parseInt(additionalData?.currentBalanceValue) ?? 0,
+    currentBalanceValue: amount ?? Number.parseInt(additionalData?.currentBalanceValue) ?? 0,
     currentBalanceCurrency: additionalData?.currentBalanceCurrency ?? "",
-    cardBrand:
-      additionalData?.originalSelectedBrand ??
-      additionalData?.paymentMethod ??
-      "",
+    cardBrand: additionalData?.originalSelectedBrand ?? additionalData?.paymentMethod ?? "",
     formattedBalanceValue: additionalData?.currentBalanceValue ?? "",
   }
   const orderTotal =
     order?.total_amount_with_taxes_cents != null
       ? order?.total_amount_with_taxes_cents - giftCardData.currentBalanceValue
       : 0
-  const currencyCode =
-    (order?.currency_code as CurrencyCode) ?? ("USD" as CurrencyCode)
+  const currencyCode = (order?.currency_code as CurrencyCode) ?? ("USD" as CurrencyCode)
   const formattedOrderTotal = formatCentsToCurrency(orderTotal, currencyCode)
   const formattedCurrentBalance = formatCentsToCurrency(
     giftCardData.currentBalanceValue,
-    currencyCode,
+    currencyCode
   )
   giftCardData.formattedBalanceValue = formattedCurrentBalance
   if (giftCardData.cardSummary === "") return null
diff --git a/packages/react-components/src/utils/baseReducer.ts b/packages/react-components/src/utils/baseReducer.ts
index 46e1ad90..bc5ebfe4 100644
--- a/packages/react-components/src/utils/baseReducer.ts
+++ b/packages/react-components/src/utils/baseReducer.ts
@@ -1,4 +1,4 @@
-import type { BaseReducer } from '#typings'
+import type { BaseReducer } from "#typings"
 
 const baseReducer: BaseReducer = (state, action, actionTypes) => {
   const actions = actionTypes
diff --git a/packages/react-components/src/utils/browserInfo.ts b/packages/react-components/src/utils/browserInfo.ts
index 6e445560..872eafb5 100644
--- a/packages/react-components/src/utils/browserInfo.ts
+++ b/packages/react-components/src/utils/browserInfo.ts
@@ -9,15 +9,15 @@ interface TReturn {
 }
 
 export default function getBrowserInfo(): TReturn {
-  const screenWidth = window?.screen ? window.screen.width : ''
-  const screenHeight = window?.screen ? window.screen.height : ''
-  const colorDepth = window?.screen ? window.screen.colorDepth : ''
-  const userAgent = window?.navigator ? window.navigator.userAgent : ''
+  const screenWidth = window?.screen ? window.screen.width : ""
+  const screenHeight = window?.screen ? window.screen.height : ""
+  const colorDepth = window?.screen ? window.screen.colorDepth : ""
+  const userAgent = window?.navigator ? window.navigator.userAgent : ""
   const javaEnabled = window?.navigator ? navigator.javaEnabled() : false
   const acceptHeader =
-    'text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8'
+    "text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8"
 
-  let language = ''
+  let language = ""
   if (window?.navigator) language = window.navigator.language
 
   const d = new Date()
@@ -31,13 +31,13 @@ export default function getBrowserInfo(): TReturn {
     timeZoneOffset,
     language,
     javaEnabled,
-    acceptHeader
+    acceptHeader,
   }
 
   return browserInfo
 }
 
-export function cleanUrlBy(symbol: string = '&'): string {
+export function cleanUrlBy(symbol: string = "&"): string {
   const currentLocation = window?.location.href
   const [splitLocation] = currentLocation.split(symbol)
   return splitLocation ?? currentLocation
diff --git a/packages/react-components/src/utils/canPlaceOrder.ts b/packages/react-components/src/utils/canPlaceOrder.ts
index 5cbbe24b..ca5ac95b 100644
--- a/packages/react-components/src/utils/canPlaceOrder.ts
+++ b/packages/react-components/src/utils/canPlaceOrder.ts
@@ -1,8 +1,8 @@
-import type { Order } from '@commercelayer/sdk'
+import type { Order } from "@commercelayer/sdk"
 
 /**
  *  Check if the order can be placed
  */
 export function canPlaceOrder(order: Order): boolean {
-  return ['draft', 'pending'].includes(order.status)
+  return ["draft", "pending"].includes(order.status)
 }
diff --git a/packages/react-components/src/utils/checkIncludeResource.ts b/packages/react-components/src/utils/checkIncludeResource.ts
index 95a7e529..7f5ef064 100644
--- a/packages/react-components/src/utils/checkIncludeResource.ts
+++ b/packages/react-components/src/utils/checkIncludeResource.ts
@@ -1,20 +1,17 @@
-import type { ResourceIncluded } from '#reducers/OrderReducer'
-import type { Order } from '@commercelayer/sdk'
+import type { ResourceIncluded } from "#reducers/OrderReducer"
+import type { Order } from "@commercelayer/sdk"
 
 interface Params {
   order: Order
   resourceInclude: ResourceIncluded[]
 }
 
-export default function checkIncludeResources({
-  order,
-  resourceInclude
-}: Params): boolean {
+export default function checkIncludeResources({ order, resourceInclude }: Params): boolean {
   const checkKeys: boolean[] = []
   resourceInclude.forEach((v) => {
-    const isMultiKey = v.includes('.')
+    const isMultiKey = v.includes(".")
     if (isMultiKey) {
-      const [first] = v.split('.')
+      const [first] = v.split(".")
       const resource = order?.[first as keyof Order]
       if (resource === undefined) checkKeys.push(false)
     } else {
diff --git a/packages/react-components/src/utils/compareObjAttribute.ts b/packages/react-components/src/utils/compareObjAttribute.ts
index 75cb6aaf..c418674b 100644
--- a/packages/react-components/src/utils/compareObjAttribute.ts
+++ b/packages/react-components/src/utils/compareObjAttribute.ts
@@ -16,20 +16,20 @@ function sortObj<T extends Item>(obj: T): Item {
 
 export default function compareObjAttribute<A extends Item, B extends Item>({
   attributes,
-  object
+  object,
 }: TArgs<A, B>): Item {
   const returnObj: Item = {}
   Object.keys(object).forEach((v) => {
     const element = attributes[v]
     const compare = object[v]
-    if (typeof element === 'object' && element) {
+    if (typeof element === "object" && element) {
       const elementSorted = sortObj(element)
       const compareSorted = sortObj(compare)
       if (JSON.stringify(elementSorted) !== JSON.stringify(compareSorted)) {
         returnObj[v] = element
       }
     }
-    if (typeof element !== 'object' && element && element !== compare) {
+    if (typeof element !== "object" && element && element !== compare) {
       returnObj[v] = element
     }
   })
diff --git a/packages/react-components/src/utils/countryStateCity.ts b/packages/react-components/src/utils/countryStateCity.ts
index ffd2a45c..83d8e688 100644
--- a/packages/react-components/src/utils/countryStateCity.ts
+++ b/packages/react-components/src/utils/countryStateCity.ts
@@ -6,10 +6,7 @@ import { isEmpty } from "#utils/isEmpty"
  * @returns List of countries
  */
 export function getCountries(countries?: Country[]): Country[] {
-  if (
-    !isEmpty(countries) &&
-    countries?.every((c) => "value" in c && "label" in c)
-  ) {
+  if (!isEmpty(countries) && countries?.every((c) => "value" in c && "label" in c)) {
     return countries
   }
   return [...defaultCountries]
@@ -59,9 +56,7 @@ export function isValidState({
     ...states,
   }
   return Boolean(
-    statesToUse[countryCode as CountryCode]?.find(
-      (state) => state.value === stateCode,
-    ),
+    statesToUse[countryCode as CountryCode]?.find((state) => state.value === stateCode)
   )
 }
 
@@ -77,8 +72,7 @@ export function isEmptyStates({
   countriesWithPredefinedStateOptions?: string[]
 }): boolean {
   const countryLock =
-    countriesWithPredefinedStateOptions == null ||
-    isEmpty(countriesWithPredefinedStateOptions)
+    countriesWithPredefinedStateOptions == null || isEmpty(countriesWithPredefinedStateOptions)
       ? Object.keys(defaultStates)
       : countriesWithPredefinedStateOptions
   return !countryLock.includes(countryCode)
diff --git a/packages/react-components/src/utils/currencies.ts b/packages/react-components/src/utils/currencies.ts
index 9643d41f..8e1e53b6 100644
--- a/packages/react-components/src/utils/currencies.ts
+++ b/packages/react-components/src/utils/currencies.ts
@@ -2903,7 +2903,7 @@ export const currencies = {
  *  Returns a currency object for a given currency code
  */
 export function getCurrency(
-  currencyCode: CurrencyCode | Lowercase<CurrencyCode>,
+  currencyCode: CurrencyCode | Lowercase<CurrencyCode>
 ): Currency | undefined {
   return currencies[currencyCode.toLowerCase() as Lowercase<CurrencyCode>]
 }
@@ -2945,10 +2945,7 @@ export function addCurrencySymbol({
  * Example: JPY -> 0
  * Example: CLF -> 0,0000
  */
-export function makePlaceholder(
-  currency: Currency,
-  prefix: string = "",
-): string {
+export function makePlaceholder(currency: Currency, prefix: string = ""): string {
   const decimalLength = getDecimalLength(currency)
   if (decimalLength === 0) {
     return "0"
@@ -2968,7 +2965,7 @@ export function makePlaceholder(
 export function formatCentsToCurrency(
   cents: number,
   currencyCode: CurrencyCode,
-  stripZeroDecimals = false,
+  stripZeroDecimals = false
 ): string {
   const currency = getCurrency(currencyCode)
   if (currency == null) {
@@ -2978,9 +2975,7 @@ export function formatCentsToCurrency(
   const decimalLength = getDecimalLength(currency)
   const unit = cents / currency.subunit_to_unit
   const fixedDecimals =
-    stripZeroDecimals && unit % 1 === 0
-      ? unit.toFixed(0)
-      : unit.toFixed(decimalLength)
+    stripZeroDecimals && unit % 1 === 0 ? unit.toFixed(0) : unit.toFixed(decimalLength)
   const value = `${fixedDecimals}`.replace(".", currency.decimal_mark)
 
   return addCurrencySymbol({ formattedValue: value, currency })
diff --git a/packages/react-components/src/utils/customMessages.ts b/packages/react-components/src/utils/customMessages.ts
index 7abdce44..2dd18dca 100644
--- a/packages/react-components/src/utils/customMessages.ts
+++ b/packages/react-components/src/utils/customMessages.ts
@@ -1,11 +1,11 @@
-import type { BaseError } from '#typings/errors'
-import { pick } from './pick'
+import type { BaseError } from "#typings/errors"
+import { pick } from "./pick"
 
 export default function customMessages(
   messages: BaseError[] = [],
   v: BaseError
 ): null | BaseError | undefined {
-  const objFiltered = pick(v, ['field', 'code', 'resource', 'detail'])
+  const objFiltered = pick(v, ["field", "code", "resource", "detail"])
   const [msg] = messages.filter((item) => {
     switch (true) {
       case item.field === objFiltered.field &&
diff --git a/packages/react-components/src/utils/customerOrderOptions.ts b/packages/react-components/src/utils/customerOrderOptions.ts
index 9fad42bc..3ab7338a 100644
--- a/packages/react-components/src/utils/customerOrderOptions.ts
+++ b/packages/react-components/src/utils/customerOrderOptions.ts
@@ -1,8 +1,8 @@
 import {
   getSaveBillingAddressToAddressBook,
   getSavePaymentSourceToCustomerWallet,
-  getSaveShippingAddressToAddressBook
-} from './localStorage'
+  getSaveShippingAddressToAddressBook,
+} from "./localStorage"
 
 export function saveToWallet(): boolean {
   return getSavePaymentSourceToCustomerWallet()
diff --git a/packages/react-components/src/utils/events.ts b/packages/react-components/src/utils/events.ts
index fcd55980..2bc08730 100644
--- a/packages/react-components/src/utils/events.ts
+++ b/packages/react-components/src/utils/events.ts
@@ -1,16 +1,10 @@
-type TEvent = 'open-cart'
+type TEvent = "open-cart"
 
-function subscribe(
-  eventName: TEvent,
-  listener: EventListenerOrEventListenerObject
-): void {
+function subscribe(eventName: TEvent, listener: EventListenerOrEventListenerObject): void {
   document.addEventListener(eventName, listener)
 }
 
-function unsubscribe(
-  eventName: TEvent,
-  listener: EventListenerOrEventListenerObject
-): void {
+function unsubscribe(eventName: TEvent, listener: EventListenerOrEventListenerObject): void {
   document.removeEventListener(eventName, listener)
 }
 
diff --git a/packages/react-components/src/utils/expressPaymentHelper.ts b/packages/react-components/src/utils/expressPaymentHelper.ts
index dc148c72..b07c90a8 100644
--- a/packages/react-components/src/utils/expressPaymentHelper.ts
+++ b/packages/react-components/src/utils/expressPaymentHelper.ts
@@ -10,14 +10,12 @@ import type { CommerceLayerConfig } from "#context/CommerceLayerContext"
 import type { PaymentResource } from "#reducers/PaymentMethodReducer"
 import { getApplicationLink } from "./getApplicationLink"
 import { jwt } from "./jwt"
-import { getSdk } from '@commercelayer/core'
+import { getSdk } from "@commercelayer/core"
 import { getOrganizationConfig } from "./organization"
 
 const availablePaymentMethods = ["stripe_payments"]
 
-export function getAvailableExpressPayments(
-  paymentMethods: PaymentMethod[],
-): PaymentMethod[] {
+export function getAvailableExpressPayments(paymentMethods: PaymentMethod[]): PaymentMethod[] {
   return paymentMethods.filter((payment) => {
     if (!payment.payment_source_type) return false
     return availablePaymentMethods.includes(payment.payment_source_type)
@@ -64,13 +62,9 @@ export async function setExpressFakeAddress({
   return await sdk.orders.retrieve(orderId, params)
 }
 
-export function getExpressShippingMethods(
-  order: Order,
-): PaymentRequestShippingOption[] | null {
+export function getExpressShippingMethods(order: Order): PaymentRequestShippingOption[] | null {
   const isSingleShipment = order?.shipments?.length === 1
-  const shippingMethods = order?.shipments?.map(
-    (shipment) => shipment.available_shipping_methods,
-  )
+  const shippingMethods = order?.shipments?.map((shipment) => shipment.available_shipping_methods)
   if (isSingleShipment) {
     if (shippingMethods == null) return null
     return shippingMethods.flat().map((method) => {
@@ -89,9 +83,7 @@ export function getExpressShippingMethods(
     if (methods != null) {
       const [firstMethod] = methods
       if (firstMethod != null) {
-        shippingOptionsAmount.push(
-          firstMethod.price_amount_for_shipment_cents ?? 0,
-        )
+        shippingOptionsAmount.push(firstMethod.price_amount_for_shipment_cents ?? 0)
       }
     }
   })
@@ -158,18 +150,14 @@ export async function setExpressShippingMethod({
       if (firstShippingMethodId != null) {
         await sdk.shipments.update({
           id: shipmentId,
-          shipping_method: sdk.shipping_methods.relationship(
-            firstShippingMethodId,
-          ),
+          shipping_method: sdk.shipping_methods.relationship(firstShippingMethodId),
         })
       }
     } else {
       if (selectedShippingMethodId != null) {
         await sdk.shipments.update({
           id: shipmentId,
-          shipping_method: sdk.shipping_methods.relationship(
-            selectedShippingMethodId,
-          ),
+          shipping_method: sdk.shipping_methods.relationship(selectedShippingMethodId),
         })
       }
     }
@@ -180,9 +168,7 @@ export async function setExpressShippingMethod({
       if (firstShippingMethodId != null) {
         await sdk.shipments.update({
           id: shipment.id,
-          shipping_method: sdk.shipping_methods.relationship(
-            firstShippingMethodId,
-          ),
+          shipping_method: sdk.shipping_methods.relationship(firstShippingMethodId),
         })
       }
     }
@@ -230,11 +216,7 @@ export async function setExpressPlaceOrder({
 }: TSetExpressPlaceOrderParams): Promise<Order> {
   const sdk = getSdk({ accessToken: config.accessToken!, interceptors: config.interceptors })
   if (!placeTheOrder && paymentResource != null && paymentSourceId != null) {
-    const include = [
-      "shipments.shipping_method",
-      "payment_source",
-      "payment_method",
-    ]
+    const include = ["shipments.shipping_method", "payment_source", "payment_method"]
     await sdk.orders.retrieve(orderId, {
       include,
     })
@@ -278,7 +260,7 @@ export async function expressRedirectUrl({
   if (accessToken == null) throw new Error("No access token found")
   const { organization } = jwt(accessToken)
   const slug = organization.slug
-  const domain = 'commercelayer.io'
+  const domain = "commercelayer.io"
   if (slug == null) throw new Error("No slug found")
   const config = await getOrganizationConfig({
     accessToken,
diff --git a/packages/react-components/src/utils/filterChildren.ts b/packages/react-components/src/utils/filterChildren.ts
index f0c2465e..79444cee 100644
--- a/packages/react-components/src/utils/filterChildren.ts
+++ b/packages/react-components/src/utils/filterChildren.ts
@@ -1,6 +1,6 @@
-import type { DefaultChildrenType } from '#typings/globals'
+import type { DefaultChildrenType } from "#typings/globals"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
 interface Props<T> {
   children: DefaultChildrenType
@@ -14,15 +14,13 @@ interface Props<T> {
 export default function filterChildren<T = string>({
   children,
   filterBy,
-  componentName
+  componentName,
 }: Props<T>): JSX.Element | JSX.Element[] | null {
   const wrongComponents = Array.isArray(children)
-    ? children.filter((child) => typeof child.type === 'string').length > 0
-    : typeof children?.type === 'string'
+    ? children.filter((child) => typeof child.type === "string").length > 0
+    : typeof children?.type === "string"
   if (wrongComponents) {
-    throw new Error(
-      `Only library components are allowed into <${componentName}/>`
-    )
+    throw new Error(`Only library components are allowed into <${componentName}/>`)
   }
   if (Array.isArray(children)) {
     // eslint-disable-next-line @typescript-eslint/no-unsafe-argument
diff --git a/packages/react-components/src/utils/formCleaner.ts b/packages/react-components/src/utils/formCleaner.ts
index 17e461bf..c1845b38 100644
--- a/packages/react-components/src/utils/formCleaner.ts
+++ b/packages/react-components/src/utils/formCleaner.ts
@@ -1,5 +1,5 @@
 /* eslint-disable @typescript-eslint/no-dynamic-delete */
-import type { TCustomerAddress } from '#reducers/CustomerReducer'
+import type { TCustomerAddress } from "#reducers/CustomerReducer"
 
 type CombinedAddressType = TCustomerAddress | undefined
 
@@ -8,16 +8,13 @@ export function formCleaner(address: CombinedAddressType): CombinedAddressType {
     return address
   }
   Object.keys(address).forEach((key) => {
-    const keyCleaned = key
-      .replace('shipping_address_', '')
-      .replace('billing_address_', '')
-    const isNotCleaned =
-      key.startsWith('shipping_address_') || key.startsWith('billing_address_')
+    const keyCleaned = key.replace("shipping_address_", "").replace("billing_address_", "")
+    const isNotCleaned = key.startsWith("shipping_address_") || key.startsWith("billing_address_")
     if (isNotCleaned) {
       address[keyCleaned] = address[key]
       delete address[key]
     }
-    if (keyCleaned === 'save_to_customer_book') {
+    if (keyCleaned === "save_to_customer_book") {
       delete address[keyCleaned]
     }
   })
diff --git a/packages/react-components/src/utils/getApplicationLink.ts b/packages/react-components/src/utils/getApplicationLink.ts
index 32c7192f..1192edca 100644
--- a/packages/react-components/src/utils/getApplicationLink.ts
+++ b/packages/react-components/src/utils/getApplicationLink.ts
@@ -1,35 +1,34 @@
-type ApplicationType = 'checkout' | 'cart' | 'my-account' | 'identity'
+type ApplicationType = "checkout" | "cart" | "my-account" | "identity"
 
-type ApplicationTypeProps<T extends ApplicationType = ApplicationType> =
-  T extends 'my-account'
+type ApplicationTypeProps<T extends ApplicationType = ApplicationType> = T extends "my-account"
+  ? {
+      applicationType: T
+      orderId?: string
+      modeType?: "login" | "signup"
+      clientId?: string
+      scope?: string
+      returnUrl?: string
+      resetPasswordUrl?: string
+    }
+  : T extends "identity"
     ? {
         applicationType: T
         orderId?: string
-        modeType?: 'login' | 'signup'
+        modeType: "login" | "signup"
+        clientId: string
+        scope: string
+        returnUrl: string
+        resetPasswordUrl?: string
+      }
+    : {
+        applicationType: Omit<T, "my-account" | "identity">
+        orderId: string
+        modeType?: "login" | "signup"
         clientId?: string
         scope?: string
         returnUrl?: string
         resetPasswordUrl?: string
       }
-    : T extends 'identity'
-      ? {
-          applicationType: T
-          orderId?: string
-          modeType: 'login' | 'signup'
-          clientId: string
-          scope: string
-          returnUrl: string
-          resetPasswordUrl?: string
-        }
-      : {
-          applicationType: Omit<T, 'my-account' | 'identity'>
-          orderId: string
-          modeType?: 'login' | 'signup'
-          clientId?: string
-          scope?: string
-          returnUrl?: string
-          resetPasswordUrl?: string
-        }
 
 interface TArgs {
   accessToken: string
@@ -51,19 +50,19 @@ export function getApplicationLink({
   scope,
   returnUrl,
   resetPasswordUrl,
-  customDomain
+  customDomain,
 }: Props): string {
-  const env = domain === 'commercelayer.io' ? '' : 'stg.'
-  const t =
-    applicationType === 'identity' ? (modeType === 'login' ? '' : 'signup') : ''
-  const c = clientId ? `&clientId=${clientId}` : ''
-  const s = scope ? `&scope=${scope}` : ''
-  const r = returnUrl ? `&returnUrl=${returnUrl}` : ''
-  const p = resetPasswordUrl ? `&resetPasswordUrl=${resetPasswordUrl}` : ''
-  const params = applicationType === 'identity' ? `${c}${s}${r}${p}` : applicationType === 'my-account' ? r : ''
+  const env = domain === "commercelayer.io" ? "" : "stg."
+  const t = applicationType === "identity" ? (modeType === "login" ? "" : "signup") : ""
+  const c = clientId ? `&clientId=${clientId}` : ""
+  const s = scope ? `&scope=${scope}` : ""
+  const r = returnUrl ? `&returnUrl=${returnUrl}` : ""
+  const p = resetPasswordUrl ? `&resetPasswordUrl=${resetPasswordUrl}` : ""
+  const params =
+    applicationType === "identity" ? `${c}${s}${r}${p}` : applicationType === "my-account" ? r : ""
   const domainName = customDomain ?? `${slug}.${env}commercelayer.app`
-  const application = customDomain ? '' : `/${applicationType.toString()}`
+  const application = customDomain ? "" : `/${applicationType.toString()}`
   return `https://${domainName}${application}/${
-    orderId ?? t ?? ''
+    orderId ?? t ?? ""
   }?accessToken=${accessToken}${params}`
 }
diff --git a/packages/react-components/src/utils/getCardDetails.ts b/packages/react-components/src/utils/getCardDetails.ts
index e2f73930..edd7892c 100644
--- a/packages/react-components/src/utils/getCardDetails.ts
+++ b/packages/react-components/src/utils/getCardDetails.ts
@@ -1,8 +1,5 @@
 import type { IconBrand } from "#context/PaymentSourceContext"
-import type {
-  PaymentResource,
-  PaymentSourceObject,
-} from "#reducers/PaymentMethodReducer"
+import type { PaymentResource, PaymentSourceObject } from "#reducers/PaymentMethodReducer"
 import type { CustomerPaymentSource } from "@commercelayer/sdk"
 
 interface CardDetails {
@@ -18,14 +15,10 @@ interface Args {
   customerPayment: Partial<CustomerPaymentSource>
 }
 
-export default function getCardDetails({
-  paymentType,
-  customerPayment,
-}: Args): CardDetails {
+export default function getCardDetails({ paymentType, customerPayment }: Args): CardDetails {
   switch (paymentType) {
     case "checkout_com_payments": {
-      const ps =
-        customerPayment.payment_source as PaymentSourceObject[typeof paymentType]
+      const ps = customerPayment.payment_source as PaymentSourceObject[typeof paymentType]
       const source = ps?.payment_response?.source
       if (source) {
         return {
@@ -38,12 +31,9 @@ export default function getCardDetails({
       break
     }
     case "stripe_payments": {
-      const ps =
-        customerPayment.payment_source as PaymentSourceObject[typeof paymentType]
+      const ps = customerPayment.payment_source as PaymentSourceObject[typeof paymentType]
       const source =
-        (ps?.options?.card ??
-        ps?.payment_method?.card ??
-        ps?.payment_instrument)
+        (ps?.options?.card ?? ps?.payment_method?.card ?? ps?.payment_instrument)
           ? {
               brand: ps?.payment_instrument?.["card_type"],
               exp_month: ps?.payment_instrument?.["card_expiry_month"],
@@ -60,8 +50,7 @@ export default function getCardDetails({
       break
     }
     case "klarna_payments": {
-      const ps =
-        customerPayment.payment_source as PaymentSourceObject[typeof paymentType]
+      const ps = customerPayment.payment_source as PaymentSourceObject[typeof paymentType]
       const source =
         ps?.auth_token != null && ps?.payment_instrument != null
           ? {
@@ -80,8 +69,7 @@ export default function getCardDetails({
       break
     }
     case "braintree_payments": {
-      const ps =
-        customerPayment.payment_source as PaymentSourceObject[typeof paymentType]
+      const ps = customerPayment.payment_source as PaymentSourceObject[typeof paymentType]
       const source = ps?.options?.card
       if (source) {
         return {
@@ -91,8 +79,7 @@ export default function getCardDetails({
       break
     }
     case "adyen_payments": {
-      const ps =
-        customerPayment.payment_source as PaymentSourceObject[typeof paymentType]
+      const ps = customerPayment.payment_source as PaymentSourceObject[typeof paymentType]
       const source = ps?.payment_request_data?.payment_method
       const authorized = ps?.payment_response?.resultCode === "Authorised"
       const last4 =
@@ -113,8 +100,7 @@ export default function getCardDetails({
       break
     }
     default: {
-      const ps =
-        customerPayment.payment_source as PaymentSourceObject[typeof paymentType]
+      const ps = customerPayment.payment_source as PaymentSourceObject[typeof paymentType]
       if (ps?.type !== paymentType) break
       const source = ps?.metadata?.["card"] ?? {
         brand: ps?.payment_instrument?.["issuer_type"]?.replace("_", "-") ?? "",
diff --git a/packages/react-components/src/utils/getCustomerIdByToken.ts b/packages/react-components/src/utils/getCustomerIdByToken.ts
index 83fac59d..4201a296 100644
--- a/packages/react-components/src/utils/getCustomerIdByToken.ts
+++ b/packages/react-components/src/utils/getCustomerIdByToken.ts
@@ -1,4 +1,4 @@
-import { jwt } from './jwt'
+import { jwt } from "./jwt"
 
 /**
  * Get the customer id from the token
diff --git a/packages/react-components/src/utils/getDomain.ts b/packages/react-components/src/utils/getDomain.ts
index 4638c8e1..2a21ca08 100644
--- a/packages/react-components/src/utils/getDomain.ts
+++ b/packages/react-components/src/utils/getDomain.ts
@@ -1,9 +1,9 @@
 export function getDomain(endpoint: string): { slug: string; domain: string } {
   const url = new URL(endpoint)
-  const [slug] = url.hostname.split('.')
-  const domain = url.hostname.replace(`${slug ?? ''}.`, '')
+  const [slug] = url.hostname.split(".")
+  const domain = url.hostname.replace(`${slug ?? ""}.`, "")
   return {
     domain,
-    slug: slug ?? ''
+    slug: slug ?? "",
   }
 }
diff --git a/packages/react-components/src/utils/getErrors.ts b/packages/react-components/src/utils/getErrors.ts
index ec1d60d8..1b2e082f 100644
--- a/packages/react-components/src/utils/getErrors.ts
+++ b/packages/react-components/src/utils/getErrors.ts
@@ -1,6 +1,6 @@
-import type { TResourceError } from '#components/errors/Errors'
-import type { BaseError, TAPIError } from '#typings/errors'
-import type { Dispatch } from 'react'
+import type { TResourceError } from "#components/errors/Errors"
+import type { BaseError, TAPIError } from "#typings/errors"
+import type { Dispatch } from "react"
 
 interface GetErrorsParams {
   error: TAPIError
@@ -13,14 +13,14 @@ export default function getErrors({
   error,
   resource,
   field,
-  attributes
+  attributes,
 }: GetErrorsParams): BaseError[] {
   return error?.errors?.map((e: any) => {
     return {
       ...e,
       resource,
-      ...(field != null && field !== '' && { field }),
-      ...(attributes != null && attributes)
+      ...(field != null && field !== "" && { field }),
+      ...(attributes != null && attributes),
     }
   })
 }
@@ -38,24 +38,22 @@ export function setErrors<D extends Dispatch<any>>({
   currentErrors = [],
   newErrors = [],
   dispatch,
-  filterBy = 'code'
+  filterBy = "code",
 }: SetErrorsArgs<D>): BaseError[] {
   const getValue =
-    typeof filterBy === 'function'
+    typeof filterBy === "function"
       ? filterBy
       : (item: BaseError) => item[filterBy as keyof BaseError]
   const excludeValues = new Set(newErrors.map(getValue))
-  const errorsDifference = currentErrors.filter(
-    (item) => !excludeValues.has(getValue(item))
-  )
+  const errorsDifference = currentErrors.filter((item) => !excludeValues.has(getValue(item)))
   const mergeErrors = currentErrors?.length === 0 ? newErrors : errorsDifference
   const errors = [...(currentErrors || []), ...mergeErrors]
   if (dispatch != null) {
     dispatch({
-      type: 'setErrors',
+      type: "setErrors",
       payload: {
-        errors
-      }
+        errors,
+      },
     })
   }
   return errors
diff --git a/packages/react-components/src/utils/getLineItemsCount.ts b/packages/react-components/src/utils/getLineItemsCount.ts
index 07464031..b2a2eb25 100644
--- a/packages/react-components/src/utils/getLineItemsCount.ts
+++ b/packages/react-components/src/utils/getLineItemsCount.ts
@@ -1,10 +1,7 @@
-import type { TLineItem } from '#components/line_items/LineItem'
-import type { LineItem } from '@commercelayer/sdk'
+import type { TLineItem } from "#components/line_items/LineItem"
+import type { LineItem } from "@commercelayer/sdk"
 
-export type TypeAccepted = Extract<
-  TLineItem,
-  'skus' | 'gift_cards' | 'bundles' | 'adjustments'
->
+export type TypeAccepted = Extract<TLineItem, "skus" | "gift_cards" | "bundles" | "adjustments">
 
 interface Args {
   lineItems: LineItem[]
@@ -15,7 +12,7 @@ interface Args {
 export default function getLineItemsCount({
   lineItems,
   quantity = 0,
-  typeAccepted = ['skus', 'gift_cards', 'bundles', 'adjustments']
+  typeAccepted = ["skus", "gift_cards", "bundles", "adjustments"],
 }: Args): number {
   lineItems
     .filter(
diff --git a/packages/react-components/src/utils/getLoaderComponent.tsx b/packages/react-components/src/utils/getLoaderComponent.tsx
index f935fd12..67be4865 100644
--- a/packages/react-components/src/utils/getLoaderComponent.tsx
+++ b/packages/react-components/src/utils/getLoaderComponent.tsx
@@ -1,6 +1,6 @@
-import type { LoaderType } from '#typings'
+import type { LoaderType } from "#typings"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
 export default function getLoaderComponent(loader: LoaderType): JSX.Element {
   return <>{loader}</>
diff --git a/packages/react-components/src/utils/getPaymentAttributes.ts b/packages/react-components/src/utils/getPaymentAttributes.ts
index 635c2547..ba0f3230 100644
--- a/packages/react-components/src/utils/getPaymentAttributes.ts
+++ b/packages/react-components/src/utils/getPaymentAttributes.ts
@@ -18,11 +18,7 @@ interface Params<R extends PaymentResource, C extends PaymentMethodConfig> {
 }
 
 export type ResourceKeys<K extends PaymentResource> = SnakeToCamelCase<
-  StringReplace<
-    StringReplace<K, "payments", "payment">,
-    "transfers",
-    "transfer"
-  >
+  StringReplace<StringReplace<K, "payments", "payment">, "transfers", "transfer">
 >
 
 export function getPaymentAttributes<
@@ -32,15 +28,11 @@ export function getPaymentAttributes<
   const { resource, config, keys } = params
   const attributes = getPaymentConfig(resource, config)
   const keysCamelCase: ResourceKeys<R>[] = keys.map((key) => {
-    const k = replace(
-      replace(key, "payments", "payment"),
-      "transfers",
-      "transfer",
-    )
+    const k = replace(replace(key, "payments", "payment"), "transfers", "transfer")
     return snakeToCamelCase(k)
   })
   const currentResource = snakeToCamelCase(
-    replace(replace(resource, "payments", "payment"), "transfers", "transfer"),
+    replace(replace(resource, "payments", "payment"), "transfers", "transfer")
   )
   return attributes != null && currentResource in attributes
     ? pick(attributes, keysCamelCase)
@@ -49,7 +41,7 @@ export function getPaymentAttributes<
 
 export function getPaypalAttributes(
   paymentResource: PaymentResource,
-  config: PaymentMethodConfig,
+  config: PaymentMethodConfig
 ): Pick<PaypalConfig, "return_url" | "cancel_url"> | undefined {
   const attributes = getPaymentAttributes({
     resource: paymentResource,
@@ -63,7 +55,7 @@ export function getPaypalAttributes(
 
 export function getExternalPaymentAttributes(
   paymentResource: PaymentResource,
-  config: PaymentMethodConfig,
+  config: PaymentMethodConfig
 ): Pick<ExternalPayment, "payment_source_token"> | undefined {
   const attributes = getPaymentAttributes({
     resource: paymentResource,
@@ -77,7 +69,7 @@ export function getExternalPaymentAttributes(
 
 export function getStripeAttributes(
   paymentResource: PaymentResource,
-  config: PaymentMethodConfig,
+  config: PaymentMethodConfig
 ): Pick<StripeConfig, "return_url"> | undefined {
   const attributes = getPaymentAttributes({
     resource: paymentResource,
@@ -91,15 +83,14 @@ export function getStripeAttributes(
 
 export function getCkoAttributes(
   paymentResource: PaymentResource,
-  config: PaymentMethodConfig,
+  config: PaymentMethodConfig
 ): Pick<CheckoutComConfig, "success_url" | "failure_url"> | undefined {
   const attributes = getPaymentAttributes({
     resource: paymentResource,
     config,
     keys: ["checkout_com_payments"],
   })
-  return attributes?.checkoutComPayment != null &&
-    "checkoutComPayment" in attributes
+  return attributes?.checkoutComPayment != null && "checkoutComPayment" in attributes
     ? pick(attributes?.checkoutComPayment, ["success_url", "failure_url"])
     : undefined
 }
diff --git a/packages/react-components/src/utils/getPrices.tsx b/packages/react-components/src/utils/getPrices.tsx
index 0c61ad41..136f80d3 100644
--- a/packages/react-components/src/utils/getPrices.tsx
+++ b/packages/react-components/src/utils/getPrices.tsx
@@ -1,17 +1,10 @@
-import type { Price } from '@commercelayer/sdk'
-import PriceTemplate, {
-  type PTemplateProps
-} from '#components/utils/PriceTemplate'
+import type { Price } from "@commercelayer/sdk"
+import PriceTemplate, { type PTemplateProps } from "#components/utils/PriceTemplate"
 
-import type { JSX } from "react";
+import type { JSX } from "react"
 
-export function getPriceByCode(
-  skuPrices: Price[],
-  code: string = ''
-): Price | undefined {
-  return code
-    ? skuPrices.filter((p) => p.currency_code === code)[0]
-    : skuPrices[0]
+export function getPriceByCode(skuPrices: Price[], code: string = ""): Price | undefined {
+  return code ? skuPrices.filter((p) => p.currency_code === code)[0] : skuPrices[0]
 }
 
 export function getPricesComponent(
@@ -23,7 +16,7 @@ export function getPricesComponent(
   }
   return skuPrices.map((p, k) => {
     const showCompare =
-      (typeof props.showCompare === 'undefined' &&
+      (typeof props.showCompare === "undefined" &&
         p?.compare_at_amount_cents != null &&
         p?.compare_at_amount_cents > p?.amount_cents) ||
       props.showCompare
@@ -40,13 +33,11 @@ export function getPricesComponent(
   })
 }
 
-export default function getPrices<P extends Price>(
-  prices: P[]
-): Record<string, P[]> {
+export default function getPrices<P extends Price>(prices: P[]): Record<string, P[]> {
   const obj: Record<string, any> = {}
   if (Array.isArray(prices)) {
     prices.forEach((p) => {
-      const sku = p?.sku_code ?? ''
+      const sku = p?.sku_code ?? ""
       if (Object.hasOwn(obj, sku)) {
         obj[sku].push(p)
       } else {
diff --git a/packages/react-components/src/utils/getPublicIp.ts b/packages/react-components/src/utils/getPublicIp.ts
index aa758781..a74898e2 100644
--- a/packages/react-components/src/utils/getPublicIp.ts
+++ b/packages/react-components/src/utils/getPublicIp.ts
@@ -1,13 +1,13 @@
 export async function getPublicIP(): Promise<string> {
   try {
-    const response = await fetch('https://api.ipify.org?format=json')
+    const response = await fetch("https://api.ipify.org?format=json")
     if (!response.ok) {
-      throw new Error('Network response was not ok')
+      throw new Error("Network response was not ok")
     }
     const data = await response.json()
     return data.ip
   } catch (error) {
-    console.error('Error fetching public IP address:', error)
-    return ''
+    console.error("Error fetching public IP address:", error)
+    return ""
   }
 }
diff --git a/packages/react-components/src/utils/hasSubscriptions.ts b/packages/react-components/src/utils/hasSubscriptions.ts
index b7a516a9..4d535220 100644
--- a/packages/react-components/src/utils/hasSubscriptions.ts
+++ b/packages/react-components/src/utils/hasSubscriptions.ts
@@ -1,4 +1,4 @@
-import type { Order } from '@commercelayer/sdk'
+import type { Order } from "@commercelayer/sdk"
 
 /**
  * Check if a given `order` has subscriptions by checking the `frequency` attribute of the `line_items` (in case of brand new `order_subscription`) or the `subscription_created_at` attribute of the `order` itself (in case `order_subscription` is already existing)
diff --git a/packages/react-components/src/utils/hooks/useCustomContext.ts b/packages/react-components/src/utils/hooks/useCustomContext.ts
index a9f68a7a..3c6ca43b 100644
--- a/packages/react-components/src/utils/hooks/useCustomContext.ts
+++ b/packages/react-components/src/utils/hooks/useCustomContext.ts
@@ -1,4 +1,4 @@
-import { type Context, useContext } from 'react'
+import { type Context, useContext } from "react"
 
 interface TParams<C> {
   /**
@@ -23,10 +23,10 @@ export default function useCustomContext<T>({
   context,
   key,
   currentComponentName,
-  contextComponentName
+  contextComponentName,
 }: TParams<T>): T {
   const currentContext = useContext<T>(context)
-  const isProduction = process.env.NODE_ENV === 'production'
+  const isProduction = process.env.NODE_ENV === "production"
   const msg = `Cannot use <${currentComponentName}/> outside of <${contextComponentName}/>`
   // @ts-expect-error no type type is not assignable to currentContext
   if (key != null && key in currentContext) return currentContext
diff --git a/packages/react-components/src/utils/icons.tsx b/packages/react-components/src/utils/icons.tsx
index 498025c4..2de78581 100644
--- a/packages/react-components/src/utils/icons.tsx
+++ b/packages/react-components/src/utils/icons.tsx
@@ -1,33 +1,33 @@
 export const sortDescIcon = (
   <svg
-    xmlns='http://www.w3.org/2000/svg'
+    xmlns="http://www.w3.org/2000/svg"
     width={20}
-    fill='none'
-    viewBox='0 0 24 24'
-    stroke='currentColor'
+    fill="none"
+    viewBox="0 0 24 24"
+    stroke="currentColor"
   >
     <path
-      strokeLinecap='round'
-      strokeLinejoin='round'
+      strokeLinecap="round"
+      strokeLinejoin="round"
       strokeWidth={2}
-      d='M3 4h13M3 8h9m-9 4h9m5-4v12m0 0l-4-4m4 4l4-4'
+      d="M3 4h13M3 8h9m-9 4h9m5-4v12m0 0l-4-4m4 4l4-4"
     />
   </svg>
 )
 
 export const sortAscIcon = (
   <svg
-    xmlns='http://www.w3.org/2000/svg'
+    xmlns="http://www.w3.org/2000/svg"
     width={20}
-    fill='none'
-    viewBox='0 0 24 24'
-    stroke='currentColor'
+    fill="none"
+    viewBox="0 0 24 24"
+    stroke="currentColor"
   >
     <path
-      strokeLinecap='round'
-      strokeLinejoin='round'
+      strokeLinecap="round"
+      strokeLinejoin="round"
       strokeWidth={2}
-      d='M3 4h13M3 8h9m-9 4h6m4 0l4-4m0 0l4 4m-4-4v12'
+      d="M3 4h13M3 8h9m-9 4h6m4 0l4-4m0 0l4 4m-4-4v12"
     />
   </svg>
 )
diff --git a/packages/react-components/src/utils/isEmpty.ts b/packages/react-components/src/utils/isEmpty.ts
index 7d130c02..6499cf20 100644
--- a/packages/react-components/src/utils/isEmpty.ts
+++ b/packages/react-components/src/utils/isEmpty.ts
@@ -1,7 +1,7 @@
 export function isEmpty(value: unknown): boolean {
   if (value == null) return true
-  if (typeof value === 'string' || Array.isArray(value)) return value.length === 0
+  if (typeof value === "string" || Array.isArray(value)) return value.length === 0
   if (value instanceof Map || value instanceof Set) return value.size === 0
-  if (typeof value === 'object') return Object.keys(value as object).length === 0
+  if (typeof value === "object") return Object.keys(value as object).length === 0
   return false
 }
diff --git a/packages/react-components/src/utils/isGuestToken.ts b/packages/react-components/src/utils/isGuestToken.ts
index 342b84e7..19979b28 100644
--- a/packages/react-components/src/utils/isGuestToken.ts
+++ b/packages/react-components/src/utils/isGuestToken.ts
@@ -1,4 +1,4 @@
-import { jwt } from './jwt'
+import { jwt } from "./jwt"
 
 /**
  * Check if the token is a sales channel token
diff --git a/packages/react-components/src/utils/jwt.ts b/packages/react-components/src/utils/jwt.ts
index 8a9212b5..16e45dc1 100644
--- a/packages/react-components/src/utils/jwt.ts
+++ b/packages/react-components/src/utils/jwt.ts
@@ -1,9 +1,9 @@
-import { jwtDecode } from 'jwt-decode'
+import { jwtDecode } from "jwt-decode"
 
 interface JWT {
   application: {
     id: string
-    kind: 'sales_channel' | 'integration'
+    kind: "sales_channel" | "integration"
     public: boolean
   }
   exp: number
@@ -18,7 +18,7 @@ interface JWT {
     id: string
     slug: string
   }
-  owner: { id: string; type: 'Customer' }
+  owner: { id: string; type: "Customer" }
   rand: number
   test: boolean
 }
diff --git a/packages/react-components/src/utils/localStorage.ts b/packages/react-components/src/utils/localStorage.ts
index 641d7760..3b47d3fa 100644
--- a/packages/react-components/src/utils/localStorage.ts
+++ b/packages/react-components/src/utils/localStorage.ts
@@ -8,33 +8,22 @@ export type {
 export { getLocalOrder, setLocalOrder, deleteLocalOrder }
 
 export const getSavePaymentSourceToCustomerWallet = (): boolean => {
-  return (
-    localStorage.getItem('_save_payment_source_to_customer_wallet') === 'true'
-  )
+  return localStorage.getItem("_save_payment_source_to_customer_wallet") === "true"
 }
 
 export const getSaveBillingAddressToAddressBook = (): boolean => {
-  return (
-    localStorage.getItem('_save_billing_address_to_customer_address_book') ===
-    'true'
-  )
+  return localStorage.getItem("_save_billing_address_to_customer_address_book") === "true"
 }
 
 export const getSaveShippingAddressToAddressBook = (): boolean => {
-  return (
-    localStorage.getItem('_save_shipping_address_to_customer_address_book') ===
-    'true'
-  )
+  return localStorage.getItem("_save_shipping_address_to_customer_address_book") === "true"
 }
 
 export type CustomerOrderParams =
-  | '_save_payment_source_to_customer_wallet'
-  | '_save_billing_address_to_customer_address_book'
-  | '_save_shipping_address_to_customer_address_book'
+  | "_save_payment_source_to_customer_wallet"
+  | "_save_billing_address_to_customer_address_book"
+  | "_save_shipping_address_to_customer_address_book"
 
-export function setCustomerOrderParam<T extends CustomerOrderParams>(
-  key: T,
-  value: string
-): void {
+export function setCustomerOrderParam<T extends CustomerOrderParams>(key: T, value: string): void {
   setLocalOrder(key, value)
 }
diff --git a/packages/react-components/src/utils/omit.ts b/packages/react-components/src/utils/omit.ts
index a25aaef9..f5d73ec3 100644
--- a/packages/react-components/src/utils/omit.ts
+++ b/packages/react-components/src/utils/omit.ts
@@ -1,8 +1,9 @@
-export default function omit<
-  O extends Record<string, any>,
-  K extends Array<keyof O>
->(obj: O, keys: K): Pick<O, Exclude<keyof O, K[number]>> {
-  return Object.fromEntries(
-    Object.entries(obj).filter(([k, _]) => !keys.includes(k))
-  ) as Pick<O, Exclude<keyof O, K[number]>>
+export default function omit<O extends Record<string, any>, K extends Array<keyof O>>(
+  obj: O,
+  keys: K
+): Pick<O, Exclude<keyof O, K[number]>> {
+  return Object.fromEntries(Object.entries(obj).filter(([k, _]) => !keys.includes(k))) as Pick<
+    O,
+    Exclude<keyof O, K[number]>
+  >
 }
diff --git a/packages/react-components/src/utils/organization.ts b/packages/react-components/src/utils/organization.ts
index 0c33633f..056a09d5 100644
--- a/packages/react-components/src/utils/organization.ts
+++ b/packages/react-components/src/utils/organization.ts
@@ -1,7 +1,4 @@
-import {
-  type DefaultMfeConfig,
-  getMfeConfig,
-} from "@commercelayer/organization-config"
+import { type DefaultMfeConfig, getMfeConfig } from "@commercelayer/organization-config"
 import { useEffect, useState } from "react"
 import { getSdk } from "@commercelayer/core"
 import { jwt } from "./jwt"
@@ -16,7 +13,7 @@ export interface OrganizationConfig {
  *
  */
 export async function getOrganizationConfig(
-  config: OrganizationConfig,
+  config: OrganizationConfig
 ): Promise<DefaultMfeConfig | null> {
   const { market } = jwt(config.accessToken)
   const sdk = getSdk({ accessToken: config.accessToken })
@@ -36,8 +33,7 @@ export function useOrganizationConfig({
   accessToken,
   params,
 }: Partial<OrganizationConfig>): DefaultMfeConfig | null {
-  const [organizationConfig, setOrganizationConfig] =
-    useState<DefaultMfeConfig | null>(null)
+  const [organizationConfig, setOrganizationConfig] = useState<DefaultMfeConfig | null>(null)
   useEffect(() => {
     if (accessToken == null) return
     getOrganizationConfig({
diff --git a/packages/react-components/src/utils/payment-methods/sortPaymentMethods.ts b/packages/react-components/src/utils/payment-methods/sortPaymentMethods.ts
index 6edeabb6..a87debf9 100644
--- a/packages/react-components/src/utils/payment-methods/sortPaymentMethods.ts
+++ b/packages/react-components/src/utils/payment-methods/sortPaymentMethods.ts
@@ -1,8 +1,8 @@
-import type { PaymentMethod } from '@commercelayer/sdk'
+import type { PaymentMethod } from "@commercelayer/sdk"
 
 export function sortPaymentMethods(
   methods: PaymentMethod[],
-  labels: PaymentMethod['payment_source_type'][]
+  labels: PaymentMethod["payment_source_type"][]
 ): PaymentMethod[] {
   return methods.sort((a, b) => {
     const indexA = labels.indexOf(a.payment_source_type)
diff --git a/packages/react-components/src/utils/placeholderImages.ts b/packages/react-components/src/utils/placeholderImages.ts
index e20edc44..b8159190 100644
--- a/packages/react-components/src/utils/placeholderImages.ts
+++ b/packages/react-components/src/utils/placeholderImages.ts
@@ -1,4 +1,4 @@
 export const defaultImgUrl =
-  'https://data.commercelayer.app/assets/images/placeholders/img_placeholder.svg'
+  "https://data.commercelayer.app/assets/images/placeholders/img_placeholder.svg"
 export const defaultGiftCardImgUrl =
-  'https://data.commercelayer.app/assets/images/placeholders/gift_placeholder.svg'
+  "https://data.commercelayer.app/assets/images/placeholders/gift_placeholder.svg"
diff --git a/packages/react-components/src/utils/promisify.ts b/packages/react-components/src/utils/promisify.ts
index 19d336a8..5b6ee552 100644
--- a/packages/react-components/src/utils/promisify.ts
+++ b/packages/react-components/src/utils/promisify.ts
@@ -7,7 +7,7 @@ export default async function promisify(cb: any, params?: any): Promise<any> {
         if (err) reject(err)
         resolve(res)
       })
-    else if (typeof cb?.tokenize === 'function') {
+    else if (typeof cb?.tokenize === "function") {
       cb?.tokenize((err: any, payload: any) => {
         if (err) reject(err)
         resolve(payload)
diff --git a/packages/react-components/src/utils/replace.ts b/packages/react-components/src/utils/replace.ts
index 56fa29eb..25550e14 100644
--- a/packages/react-components/src/utils/replace.ts
+++ b/packages/react-components/src/utils/replace.ts
@@ -1,13 +1,9 @@
 export type StringReplace<
   TString extends string,
   TToReplace extends string,
-  TReplacement extends string
+  TReplacement extends string,
 > = TString extends `${infer TPrefix}${TToReplace}${infer TSuffix}`
-  ? `${TPrefix}${TReplacement}${StringReplace<
-      TSuffix,
-      TToReplace,
-      TReplacement
-    >}`
+  ? `${TPrefix}${TReplacement}${StringReplace<TSuffix, TToReplace, TReplacement>}`
   : TString
 
 export function replace<V extends string, R extends string, P extends string>(
diff --git a/packages/react-components/src/utils/scrollbarWidth.ts b/packages/react-components/src/utils/scrollbarWidth.ts
index 2be38997..5234294b 100644
--- a/packages/react-components/src/utils/scrollbarWidth.ts
+++ b/packages/react-components/src/utils/scrollbarWidth.ts
@@ -1,9 +1,9 @@
 export default function scrollbarWidth(): number {
-  if (typeof document === 'undefined') return 0
-  const scrollDiv = document.createElement('div')
+  if (typeof document === "undefined") return 0
+  const scrollDiv = document.createElement("div")
   scrollDiv.setAttribute(
-    'style',
-    'width: 100px; height: 100px; overflow: scroll; position:absolute; top:-9999px;'
+    "style",
+    "width: 100px; height: 100px; overflow: scroll; position:absolute; top:-9999px;"
   )
   document.body.appendChild(scrollDiv)
   const scrollbarWidth = scrollDiv.offsetWidth - scrollDiv.clientWidth
diff --git a/packages/react-components/src/utils/shipments.ts b/packages/react-components/src/utils/shipments.ts
index 2cb1fa59..1eedd84e 100644
--- a/packages/react-components/src/utils/shipments.ts
+++ b/packages/react-components/src/utils/shipments.ts
@@ -1,5 +1,5 @@
-import type { LineItem, Shipment } from '@commercelayer/sdk'
-import { isEmpty } from '#utils/isEmpty'
+import type { LineItem, Shipment } from "@commercelayer/sdk"
+import { isEmpty } from "#utils/isEmpty"
 
 export function shipmentsFilled(shipments: Shipment[]): boolean {
   const filled = shipments.filter((shipment) => !isEmpty(shipment.shipping_method))
@@ -11,7 +11,7 @@ export function isDoNotShip(lineItems?: LineItem[] | null): boolean {
   const items = lineItems
     ? lineItems
         // eslint-disable-next-line @typescript-eslint/naming-convention
-        .filter(({ item_type }) => item_type === 'skus')
+        .filter(({ item_type }) => item_type === "skus")
         .map((lineItem) => {
           // @ts-expect-error missing type
           if (lineItem.item?.do_not_ship) {
diff --git a/packages/react-components/src/utils/snakeToCamelCase.ts b/packages/react-components/src/utils/snakeToCamelCase.ts
index af2ea0fc..e9f78554 100644
--- a/packages/react-components/src/utils/snakeToCamelCase.ts
+++ b/packages/react-components/src/utils/snakeToCamelCase.ts
@@ -1,13 +1,10 @@
-export type SnakeToCamelCase<S extends string> =
-  S extends `${infer T}_${infer U}`
-    ? `${Lowercase<T>}${Capitalize<SnakeToCamelCase<U>>}`
-    : S
+export type SnakeToCamelCase<S extends string> = S extends `${infer T}_${infer U}`
+  ? `${Lowercase<T>}${Capitalize<SnakeToCamelCase<U>>}`
+  : S
 
 export type SnakeToCamelCaseNested<T> = T extends object
   ? {
-      [K in keyof T as SnakeToCamelCase<K & string>]: SnakeToCamelCaseNested<
-        T[K]
-      >
+      [K in keyof T as SnakeToCamelCase<K & string>]: SnakeToCamelCaseNested<T[K]>
     }
   : T
 
@@ -20,9 +17,7 @@ export type SnakeToCamelCaseNested<T> = T extends object
  * @returns string
  * @description Converts a string from snake_case to camelCase
  */
-export function snakeToCamelCase<S extends string>(
-  value: S,
-): SnakeToCamelCase<S> {
+export function snakeToCamelCase<S extends string>(value: S): SnakeToCamelCase<S> {
   const words = value.toLowerCase().split("_")
   const first = words[0] ?? ""
   const secondLetter = words[1]?.[0]?.toUpperCase() ?? ""
diff --git a/packages/react-components/src/utils/stripe/retrievePaymentIntent.ts b/packages/react-components/src/utils/stripe/retrievePaymentIntent.ts
index 292c5805..153095d4 100644
--- a/packages/react-components/src/utils/stripe/retrievePaymentIntent.ts
+++ b/packages/react-components/src/utils/stripe/retrievePaymentIntent.ts
@@ -5,9 +5,7 @@ interface StripePaymentIntentParams {
   paymentIntentClientSecret: string
 }
 
-type PaymentIntentResultPromise = Promise<
-  PaymentIntentResult | undefined | null
->
+type PaymentIntentResultPromise = Promise<PaymentIntentResult | undefined | null>
 
 async function retrievePaymentIntent({
   publicApiKey,
@@ -15,9 +13,7 @@ async function retrievePaymentIntent({
 }: StripePaymentIntentParams): PaymentIntentResultPromise {
   const stripe = await loadStripe(publicApiKey)
   try {
-    const paymentIntent = await stripe?.retrievePaymentIntent(
-      paymentIntentClientSecret,
-    )
+    const paymentIntent = await stripe?.retrievePaymentIntent(paymentIntentClientSecret)
     return paymentIntent
   } catch (error) {
     console.error("Error retrieving payment intent:", error)
@@ -74,7 +70,6 @@ export async function checkPaymentIntent({
   const status = paymentIntentValidation({ paymentIntent })
   return {
     status,
-    message:
-      status === "invalid" && error?.message != null ? error.message : "",
+    message: status === "invalid" && error?.message != null ? error.message : "",
   }
 }
diff --git a/packages/react-components/src/utils/triggerAttributeHelper.ts b/packages/react-components/src/utils/triggerAttributeHelper.ts
index c58616a5..6fde10b6 100644
--- a/packages/react-components/src/utils/triggerAttributeHelper.ts
+++ b/packages/react-components/src/utils/triggerAttributeHelper.ts
@@ -1,8 +1,8 @@
-import type { CommerceLayerConfig } from '#context/CommerceLayerContext'
-import type { Order, OrderSubscription } from '@commercelayer/sdk'
-import { getSdk } from '@commercelayer/core'
+import type { CommerceLayerConfig } from "#context/CommerceLayerContext"
+import type { Order, OrderSubscription } from "@commercelayer/sdk"
+import { getSdk } from "@commercelayer/core"
 
-export type HelperRequestResource = 'orders' | 'order_subscriptions'
+export type HelperRequestResource = "orders" | "order_subscriptions"
 
 export type TriggerAttributeHelper = {
   /**
@@ -18,15 +18,15 @@ export type TriggerAttributeHelper = {
       /**
        * The resource name
        */
-      resource: 'orders'
+      resource: "orders"
       /**
        * The attribute to trigger
        */
-      attribute: '_place' | '_refresh' | '_create_subscriptions'
+      attribute: "_place" | "_refresh" | "_create_subscriptions"
     }
   | {
-      resource: 'order_subscriptions'
-      attribute: '_active' | '_deactivate' | '_cancel'
+      resource: "order_subscriptions"
+      attribute: "_active" | "_deactivate" | "_cancel"
     }
 )
 
@@ -39,11 +39,11 @@ export async function triggerAttributeHelper({
   config,
   id,
   attribute,
-  resource
+  resource,
 }: TriggerAttributeHelper): TriggerAttributeHelperResponse {
   const sdk = getSdk({ accessToken: config.accessToken!, interceptors: config.interceptors })
   return await sdk[resource].update({
     id,
-    [attribute]: true
+    [attribute]: true,
   })
 }
diff --git a/packages/react-components/src/utils/updateOrderSubscriptionCustomerPaymentSource.ts b/packages/react-components/src/utils/updateOrderSubscriptionCustomerPaymentSource.ts
index 5775a5e7..9ce08797 100644
--- a/packages/react-components/src/utils/updateOrderSubscriptionCustomerPaymentSource.ts
+++ b/packages/react-components/src/utils/updateOrderSubscriptionCustomerPaymentSource.ts
@@ -1,5 +1,5 @@
-import type { PaymentResource } from '#reducers/PaymentMethodReducer'
-import type { CommerceLayerClient, Order } from '@commercelayer/sdk'
+import type { PaymentResource } from "#reducers/PaymentMethodReducer"
+import type { CommerceLayerClient, Order } from "@commercelayer/sdk"
 
 /**
  * Check if a given `order` has a linked `order_subscription` to replace its `customer_payment_source` with the `order`'s `payment_source`.
@@ -14,33 +14,26 @@ export function updateOrderSubscriptionCustomerPaymentSource(
   if (order.subscription_created_at != null) {
     sdk.orders
       .retrieve(order.id, {
-        include: ['order_subscription', 'payment_source']
+        include: ["order_subscription", "payment_source"],
       })
       .then((order) => {
-        if (
-          order.payment_source_details != null &&
-          order.order_subscription != null
-        ) {
+        if (order.payment_source_details != null && order.order_subscription != null) {
           const paymentSourceToken = getPaymentSourceToken(order, paymentType)
           if (paymentSourceToken != null) {
             const customerPaymentSources = sdk.customer_payment_sources.list({
               filters: {
-                payment_source_token_eq: paymentSourceToken
-              }
+                payment_source_token_eq: paymentSourceToken,
+              },
             })
             customerPaymentSources.then((customerPaymentSources) => {
-              if (
-                customerPaymentSources.length > 0 &&
-                order.order_subscription != null
-              ) {
+              if (customerPaymentSources.length > 0 && order.order_subscription != null) {
                 const customerPaymentSource = customerPaymentSources[0]
                 if (customerPaymentSource != null) {
                   sdk.order_subscriptions.update({
                     id: order.order_subscription?.id,
-                    customer_payment_source:
-                      sdk.customer_payment_sources.relationship(
-                        customerPaymentSource?.id
-                      )
+                    customer_payment_source: sdk.customer_payment_sources.relationship(
+                      customerPaymentSource?.id
+                    ),
                   })
                 }
               }
@@ -56,10 +49,10 @@ function getPaymentSourceToken(
   paymentType: PaymentResource | undefined
 ): string | undefined {
   switch (paymentType) {
-    case 'braintree_payments': {
+    case "braintree_payments": {
       if (
         order.payment_source != null &&
-        order.payment_source.type === 'braintree_payments' &&
+        order.payment_source.type === "braintree_payments" &&
         order.payment_source.options != null
       ) {
         return order.payment_source.options.payment_method_token
diff --git a/packages/react-components/src/utils/validateFormFields.ts b/packages/react-components/src/utils/validateFormFields.ts
index 8bc9b43e..bcced6a6 100644
--- a/packages/react-components/src/utils/validateFormFields.ts
+++ b/packages/react-components/src/utils/validateFormFields.ts
@@ -15,7 +15,7 @@ type FormField = HTMLInputElement | HTMLSelectElement
 export type ValidateFormFields = <R extends string[]>(
   fields: HTMLFormControlsCollection,
   required: R,
-  resourceType: TResourceError,
+  resourceType: TResourceError
 ) => {
   errors: BaseError[]
   values: BaseState
@@ -30,8 +30,8 @@ export type ValidateValue = <
   val: V,
   name: N,
   type: T,
-  resource: B,
-// biome-ignore lint/suspicious/noExplicitAny: generic return type for validation errors
+  resource: B
+  // biome-ignore lint/suspicious/noExplicitAny: generic return type for validation errors
 ) => BaseError | Record<string, any>
 
 export const validateValue: ValidateValue = (val, name, type, resource) => {
@@ -43,7 +43,7 @@ export const validateValue: ValidateValue = (val, name, type, resource) => {
       resource,
     }
   }
-  if (type === "email" && typeof val === 'string' && !val.match(EMAIL_PATTERN)) {
+  if (type === "email" && typeof val === "string" && !val.match(EMAIL_PATTERN)) {
     return {
       field: name,
       code: "VALIDATION_ERROR",
@@ -54,11 +54,7 @@ export const validateValue: ValidateValue = (val, name, type, resource) => {
   return {}
 }
 
-const validateFormFields: ValidateFormFields = (
-  fields,
-  required,
-  resourceType,
-) => {
+const validateFormFields: ValidateFormFields = (fields, required, resourceType) => {
   const errors: BaseError[] = []
   let values = { metadata: {} }
   Array.from(fields).forEach((v: FormField) => {
@@ -87,18 +83,15 @@ const validateFormFields: ValidateFormFields = (
 
 export function fieldsExist(
   address: AddressCreate,
-  schema: Array<AddressField | string> = addressFields,
+  schema: Array<AddressField | string> = addressFields
 ): boolean {
   if (!address.business) {
-    const required = schema.filter(
-      (v) => !["line_2", "company", "state_code"].includes(v),
-    )
+    const required = schema.filter((v) => !["line_2", "company", "state_code"].includes(v))
     const validAddress = Object.keys(address).filter((k) => required.includes(k))
     return required.length > validAddress.length
   }
   const required = schema.filter(
-    (v) =>
-      !["first_name", "last_name", "line_2", "state_code"].includes(v),
+    (v) => !["first_name", "last_name", "line_2", "state_code"].includes(v)
   )
   const validAddress = Object.keys(address).filter((k) => required.includes(k))
   return required.length > validAddress.length
@@ -141,20 +134,11 @@ const customerOptionalFields: CustomerOptionalField[] = [
   "company",
 ]
 
-export function businessMandatoryField(
-  fieldName: AddressInputName,
-  isBusiness?: boolean,
-): boolean {
-  if (
-    isBusiness &&
-    businessOptionalFields.includes(fieldName as BusinessOptionalField)
-  ) {
+export function businessMandatoryField(fieldName: AddressInputName, isBusiness?: boolean): boolean {
+  if (isBusiness && businessOptionalFields.includes(fieldName as BusinessOptionalField)) {
     return false
   }
-  if (
-    !isBusiness &&
-    customerOptionalFields.includes(fieldName as CustomerOptionalField)
-  ) {
+  if (!isBusiness && customerOptionalFields.includes(fieldName as CustomerOptionalField)) {
     return false
   }
   return true
diff --git a/packages/react-components/tsconfig.prod.esm.json b/packages/react-components/tsconfig.prod.esm.json
index 4b7b38b8..0ddd3f56 100644
--- a/packages/react-components/tsconfig.prod.esm.json
+++ b/packages/react-components/tsconfig.prod.esm.json
@@ -33,45 +33,25 @@
     // "noImplicitThis": true,                      /* Raise error on 'this' expressions with an implied 'any' type. */
     // "alwaysStrict": true,                        /* Parse in strict mode and emit "use strict" for each source file. */
     /* Additional Checks */
-    "noUnusedLocals": true, /* Report errors on unused locals. */
-    "noUnusedParameters": true, /* Report errors on unused parameters. */
-    "noImplicitReturns": true, /* Report error when not all code paths in function return a value. */
-    "noFallthroughCasesInSwitch": true, /* Report errors for fallthrough cases in switch statement. */
-    "noUncheckedIndexedAccess": true, /* Include 'undefined' in index signature results */
-    "noPropertyAccessFromIndexSignature": true, /* Require undeclared properties from index signatures to use element accesses. */
+    "noUnusedLocals": true /* Report errors on unused locals. */,
+    "noUnusedParameters": true /* Report errors on unused parameters. */,
+    "noImplicitReturns": true /* Report error when not all code paths in function return a value. */,
+    "noFallthroughCasesInSwitch": true /* Report errors for fallthrough cases in switch statement. */,
+    "noUncheckedIndexedAccess": true /* Include 'undefined' in index signature results */,
+    "noPropertyAccessFromIndexSignature": true /* Require undeclared properties from index signatures to use element accesses. */,
     /* Module Resolution Options */
     "moduleResolution": "Node" /* Specify module resolution strategy: 'node' (Node.js) or 'classic' (TypeScript pre-1.6). */,
     "paths": {
-      "@commercelayer/react-components": [
-        "./src/index"
-      ],
-      "#components/*": [
-        "./src/components/*"
-      ],
-      "#components-utils/*": [
-        "./src/components/utils/*"
-      ],
-      "#reducers/*": [
-        "./src/reducers/*"
-      ],
-      "#context/*": [
-        "./src/context/*"
-      ],
-      "#typings/*": [
-        "./src/typings/*"
-      ],
-      "#typings": [
-        "./src/typings/index"
-      ],
-      "#utils/*": [
-        "./src/utils/*"
-      ],
-      "#config/*": [
-        "./src/config/*"
-      ],
-      "#hooks/*": [
-        "./src/hooks/*"
-      ]
+      "@commercelayer/react-components": ["./src/index"],
+      "#components/*": ["./src/components/*"],
+      "#components-utils/*": ["./src/components/utils/*"],
+      "#reducers/*": ["./src/reducers/*"],
+      "#context/*": ["./src/context/*"],
+      "#typings/*": ["./src/typings/*"],
+      "#typings": ["./src/typings/index"],
+      "#utils/*": ["./src/utils/*"],
+      "#config/*": ["./src/config/*"],
+      "#hooks/*": ["./src/hooks/*"]
     } /* A series of entries which re-map imports to lookup locations relative to the 'baseUrl'. */,
     // "rootDirs": [],                              /* List of root folders whose combined content represents the structure of the project at runtime. */
     // "typeRoots": [],                             /* List of folders to include type definitions from. */
@@ -92,10 +72,6 @@
     "skipLibCheck": true /* Skip type checking of declaration files. */,
     "forceConsistentCasingInFileNames": true /* Disallow inconsistently-cased references to the same file. */
   },
-  "include": [
-    "src/**/*"
-  ],
-  "exclude": [
-    "node_modules"
-  ]
-}
\ No newline at end of file
+  "include": ["src/**/*"],
+  "exclude": ["node_modules"]
+}
diff --git a/packages/react-components/vitest.config.mts b/packages/react-components/vitest.config.mts
index e1692e03..66eacd32 100644
--- a/packages/react-components/vitest.config.mts
+++ b/packages/react-components/vitest.config.mts
@@ -1,77 +1,80 @@
-import { defineConfig } from 'vitest/config'
-import tsconfigPaths from 'vite-tsconfig-paths'
-import react from '@vitejs/plugin-react'
-import path from 'node:path'
+import { defineConfig } from "vitest/config"
+import tsconfigPaths from "vite-tsconfig-paths"
+import react from "@vitejs/plugin-react"
+import path from "node:path"
 
 export default defineConfig({
   resolve: {
-    dedupe: ['react', 'react-dom', 'swr'],
+    dedupe: ["react", "react-dom", "swr"],
     alias: {
-      'react': path.resolve(__dirname, 'node_modules/react'),
-      'react-dom': path.resolve(__dirname, 'node_modules/react-dom'),
-      'swr': path.resolve(__dirname, 'node_modules/swr'),
-      '@commercelayer/hooks': path.resolve('../hooks/src/index.ts'),
-      '@commercelayer/core': path.resolve('../core/src/index.ts'),
-      'mocks': path.resolve(__dirname, 'mocks'),
-      'specs': path.resolve(__dirname, 'specs'),
-      '#components': path.resolve(__dirname, 'src/components'),
-      '#components/auth': path.resolve(__dirname, 'src/components/auth'),
-      '#components/auth/*': path.resolve(__dirname, 'src/components/auth/*'),
-      '#components/skus': path.resolve(__dirname, 'src/components/skus'),
-      '#components/skus/*': path.resolve(__dirname, 'src/components/skus/*'),
-      '#components/utils': path.resolve(__dirname, 'src/components/utils'),
-      '#components/utils/*': path.resolve(__dirname, 'src/components/utils/*'),
-      '#components/errors': path.resolve(__dirname, 'src/components/errors'),
-      '#components/errors/*': path.resolve(__dirname, 'src/components/errors/*'),
-      '#components/orders': path.resolve(__dirname, 'src/components/orders'),
-      '#components/orders/*': path.resolve(__dirname, 'src/components/orders/*'),
-      '#components/addresses': path.resolve(__dirname, 'src/components/addresses'),
-      '#components/addresses/*': path.resolve(__dirname, 'src/components/addresses/*'),
-      '#components/gift_cards': path.resolve(__dirname, 'src/components/gift_cards'),
-      '#components/gift_cards/*': path.resolve(__dirname, 'src/components/gift_cards/*'),
-      '#components/payment_methods': path.resolve(__dirname, 'src/components/payment_methods'),
-      '#components/payment_methods/*': path.resolve(__dirname, 'src/components/payment_methods/*'),
-      '#components/payment_source': path.resolve(__dirname, 'src/components/payment_source'),
-      '#components/payment_source/*': path.resolve(__dirname, 'src/components/payment_source/*'),
-      '#components/customers': path.resolve(__dirname, 'src/components/customers'),
-      '#components/customers/*': path.resolve(__dirname, 'src/components/customers/*'),
-      '#components/in_stock_subscriptions': path.resolve(__dirname, 'src/components/in_stock_subscriptions'),
-      '#components/in_stock_subscriptions/*': path.resolve(__dirname, 'src/components/in_stock_subscriptions/*'),
-      '#components/line_items': path.resolve(__dirname, 'src/components/line_items'),
-      '#components/line_items/*': path.resolve(__dirname, 'src/components/line_items/*'),
-      '#components/parcels': path.resolve(__dirname, 'src/components/parcels'),
-      '#components/parcels/*': path.resolve(__dirname, 'src/components/parcels/*'),
-      '#components/stock_items': path.resolve(__dirname, 'src/components/stock_items'),
-      '#components/stock_items/*': path.resolve(__dirname, 'src/components/stock_items/*'),
-      '#components/subscriptions': path.resolve(__dirname, 'src/components/subscriptions'),
-      '#components/subscriptions/*': path.resolve(__dirname, 'src/components/subscriptions/*'),
-      '#components/variants': path.resolve(__dirname, 'src/components/variants'),
-      '#components/variants/*': path.resolve(__dirname, 'src/components/variants/*'),
-      '#components-utils/*': path.resolve(__dirname, 'src/components/utils/*'),
-      '#reducers/*': path.resolve(__dirname, 'src/reducers/*'),
-      '#context/*': path.resolve(__dirname, 'src/context/*'),
-      '#typings/*': path.resolve(__dirname, 'src/typings/*'),
-      '#typings': path.resolve(__dirname, 'src/typings/index'),
-      '#utils/*': path.resolve(__dirname, 'src/utils/*'),
-      '#config/*': path.resolve(__dirname, 'src/config/*'),
-      '#hooks/*': path.resolve(__dirname, 'src/hooks/*')
-    }
+      react: path.resolve(__dirname, "node_modules/react"),
+      "react-dom": path.resolve(__dirname, "node_modules/react-dom"),
+      swr: path.resolve(__dirname, "node_modules/swr"),
+      "@commercelayer/hooks": path.resolve("../hooks/src/index.ts"),
+      "@commercelayer/core": path.resolve("../core/src/index.ts"),
+      mocks: path.resolve(__dirname, "mocks"),
+      specs: path.resolve(__dirname, "specs"),
+      "#components": path.resolve(__dirname, "src/components"),
+      "#components/auth": path.resolve(__dirname, "src/components/auth"),
+      "#components/auth/*": path.resolve(__dirname, "src/components/auth/*"),
+      "#components/skus": path.resolve(__dirname, "src/components/skus"),
+      "#components/skus/*": path.resolve(__dirname, "src/components/skus/*"),
+      "#components/utils": path.resolve(__dirname, "src/components/utils"),
+      "#components/utils/*": path.resolve(__dirname, "src/components/utils/*"),
+      "#components/errors": path.resolve(__dirname, "src/components/errors"),
+      "#components/errors/*": path.resolve(__dirname, "src/components/errors/*"),
+      "#components/orders": path.resolve(__dirname, "src/components/orders"),
+      "#components/orders/*": path.resolve(__dirname, "src/components/orders/*"),
+      "#components/addresses": path.resolve(__dirname, "src/components/addresses"),
+      "#components/addresses/*": path.resolve(__dirname, "src/components/addresses/*"),
+      "#components/gift_cards": path.resolve(__dirname, "src/components/gift_cards"),
+      "#components/gift_cards/*": path.resolve(__dirname, "src/components/gift_cards/*"),
+      "#components/payment_methods": path.resolve(__dirname, "src/components/payment_methods"),
+      "#components/payment_methods/*": path.resolve(__dirname, "src/components/payment_methods/*"),
+      "#components/payment_source": path.resolve(__dirname, "src/components/payment_source"),
+      "#components/payment_source/*": path.resolve(__dirname, "src/components/payment_source/*"),
+      "#components/customers": path.resolve(__dirname, "src/components/customers"),
+      "#components/customers/*": path.resolve(__dirname, "src/components/customers/*"),
+      "#components/in_stock_subscriptions": path.resolve(
+        __dirname,
+        "src/components/in_stock_subscriptions"
+      ),
+      "#components/in_stock_subscriptions/*": path.resolve(
+        __dirname,
+        "src/components/in_stock_subscriptions/*"
+      ),
+      "#components/line_items": path.resolve(__dirname, "src/components/line_items"),
+      "#components/line_items/*": path.resolve(__dirname, "src/components/line_items/*"),
+      "#components/parcels": path.resolve(__dirname, "src/components/parcels"),
+      "#components/parcels/*": path.resolve(__dirname, "src/components/parcels/*"),
+      "#components/stock_items": path.resolve(__dirname, "src/components/stock_items"),
+      "#components/stock_items/*": path.resolve(__dirname, "src/components/stock_items/*"),
+      "#components/subscriptions": path.resolve(__dirname, "src/components/subscriptions"),
+      "#components/subscriptions/*": path.resolve(__dirname, "src/components/subscriptions/*"),
+      "#components/variants": path.resolve(__dirname, "src/components/variants"),
+      "#components/variants/*": path.resolve(__dirname, "src/components/variants/*"),
+      "#components-utils/*": path.resolve(__dirname, "src/components/utils/*"),
+      "#reducers/*": path.resolve(__dirname, "src/reducers/*"),
+      "#context/*": path.resolve(__dirname, "src/context/*"),
+      "#typings/*": path.resolve(__dirname, "src/typings/*"),
+      "#typings": path.resolve(__dirname, "src/typings/index"),
+      "#utils/*": path.resolve(__dirname, "src/utils/*"),
+      "#config/*": path.resolve(__dirname, "src/config/*"),
+      "#hooks/*": path.resolve(__dirname, "src/hooks/*"),
+    },
   },
   test: {
     globals: true,
-    environment: 'jsdom',
+    environment: "jsdom",
     testTimeout: 30000,
     coverage: {
-      provider: 'v8',
-      reporter: ['text', 'json', 'html'],
-      include: ['src/**'],
-      exclude: ['mocks', 'specs', 'src/**/*.spec.*']
+      provider: "v8",
+      reporter: ["text", "json", "html"],
+      include: ["src/**"],
+      exclude: ["mocks", "specs", "src/**/*.spec.*"],
     },
-    setupFiles: ['./mocks/setup.ts'],
-    exclude: ['**/e2e/**', '**/node_modules/**']
+    setupFiles: ["./mocks/setup.ts"],
+    exclude: ["**/e2e/**", "**/node_modules/**"],
   },
-  plugins: [
-    tsconfigPaths(),
-    react()
-  ]
+  plugins: [tsconfigPaths(), react()],
 })
diff --git a/playwright.config.ts b/playwright.config.ts
index 31b1c115..47be3997 100644
--- a/playwright.config.ts
+++ b/playwright.config.ts
@@ -1,14 +1,14 @@
 // https://github.com/playwright-community/jest-playwright/#configuration
-import { PlaywrightTestConfig } from '@playwright/test'
+import { PlaywrightTestConfig } from "@playwright/test"
 
 const config: PlaywrightTestConfig = {
   // timeout: 3000,
   webServer: {
-    command: 'pnpm start',
+    command: "pnpm start",
     port: 3000,
     reuseExistingServer: true,
   },
-  testDir: 'specs/e2e',
+  testDir: "specs/e2e",
   use: {
     // Browser options
     headless: false,
@@ -17,18 +17,18 @@ const config: PlaywrightTestConfig = {
     viewport: { width: 1280, height: 720 },
     ignoreHTTPSErrors: true,
     // Artifacts
-    screenshot: 'only-on-failure',
-    video: 'retry-with-video',
+    screenshot: "only-on-failure",
+    video: "retry-with-video",
   },
   projects: [
     {
-      name: 'Chromium',
+      name: "Chromium",
       use: {
         // Configure the browser to use.
-        browserName: 'chromium',
+        browserName: "chromium",
         // Any Chromium-specific options.
         viewport: { width: 1200, height: 800 },
-        baseURL: 'http://localhost:3000',
+        baseURL: "http://localhost:3000",
         launchOptions: {
           devtools: true,
         },

From ed609c9560d44bbba3b4f05cb4ed6fffc5b48d24 Mon Sep 17 00:00:00 2001
From: Alessandro Casazza <acasazza@commercelayer.io>
Date: Mon, 25 May 2026 11:01:12 +0200
Subject: [PATCH 10/10] =?UTF-8?q?=E2=9C=A8=20feat(stories):=20add=20target?=
 =?UTF-8?q?=20prop=20example=20to=20CartLink=20ChildrenProps=20story?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Co-authored-by: Copilot <223556219+Copilot@users.noreply.github.com>
---
 packages/document/src/stories/cart/CartLink.stories.tsx        | 2 +-
 packages/react-components/src/components/orders/HostedCart.tsx | 2 +-
 2 files changed, 2 insertions(+), 2 deletions(-)

diff --git a/packages/document/src/stories/cart/CartLink.stories.tsx b/packages/document/src/stories/cart/CartLink.stories.tsx
index 7f4127c5..8d55c632 100644
--- a/packages/document/src/stories/cart/CartLink.stories.tsx
+++ b/packages/document/src/stories/cart/CartLink.stories.tsx
@@ -175,7 +175,7 @@ export const ChildrenProps: Story = {
   name: "Children props (render prop)",
   render: () => (
     <Wrapper>
-      <CartLink>
+      <CartLink target="_blank">
         {({ href, handleClick, orderId }) => (
           <a
             href={href}
diff --git a/packages/react-components/src/components/orders/HostedCart.tsx b/packages/react-components/src/components/orders/HostedCart.tsx
index cad617b0..e9e07b6e 100644
--- a/packages/react-components/src/components/orders/HostedCart.tsx
+++ b/packages/react-components/src/components/orders/HostedCart.tsx
@@ -14,8 +14,8 @@ import OrderContext from "#context/OrderContext"
 import OrderStorageContext from "#context/OrderStorageContext"
 import { subscribe, unsubscribe } from "#utils/events"
 import { getApplicationLink } from "#utils/getApplicationLink"
-import { jwt } from "#utils/jwt"
 import useCustomContext from "#utils/hooks/useCustomContext"
+import { jwt } from "#utils/jwt"
 import { getOrganizationConfig } from "#utils/organization"
 
 const DEFAULT_DOMAIN = "commercelayer.io"