react-centra-checkout: update and add data type on add*Item handlers

.changeset/green-months-hang.md

@@ -0,0 +1,5 @@
+---
+'@noaignite/react-centra-checkout': patch
+---
+
+`Context`: Update `data` type on `addBundleItem` handler

.changeset/rotten-pugs-unite.md

@@ -0,0 +1,5 @@
+---
+'@noaignite/react-centra-checkout': patch
+---
+
+Add missing `'use client'` directives

.changeset/tangy-toys-double.md

@@ -0,0 +1,5 @@
+---
+'@noaignite/react-centra-checkout': minor
+---
+
+`Context`: Add support for `data` in `addItem` handler

packages/react-centra-checkout/src/Context.tsx

@@ -1,3 +1,5 @@
+'use client'
+
 import type * as CheckoutApi from '@noaignite/centra-types'
 import { isPlainObject } from '@noaignite/utils'
 import type Cookies from 'js-cookie'
@@ -67,14 +69,63 @@ export interface ContextMethods {
   addItem?: (
     item: string,
     quantity?: number,
+    data?: {
+      /**
+       * The URL to the product added, so the item can be linked back to its origin
+       */
+      productUrl?: string
+      /**
+       * The category id of the added product, so the item can be linked back to its origin.
+       */
+      category?: string
+      /**
+       * Requires shared secret. Comment that will end up on the order line
+       */
+      comment?: string
+      /**
+       * Localized size (localizedSize) & localization definition name (localizationDefinitionName)
+       */
+      localizedProdSize?: string
+      /**
+       * The ID of subscription plan
+       */
+      subscriptionPlan?: string
+    },
   ) => Promise<CheckoutApi.Response<CheckoutApi.SelectionResponse>>
   /**
    * @param item - The Centra item id
    * @param data - Bundle data
    */
   addBundleItem?: (
     item: string,
-    data?: Record<string, unknown>,
+    data?: {
+      /**
+       * The quantity of items that should be added to the cart.
+       * Minimum should be 1.
+       * Defaults to 1.
+       */
+      quantity?: number
+      /**
+       * The URL to the product added, so the item can be linked back to its origin
+       */
+      productUrl?: string
+      /**
+       * The category id of the added product, so the item can be linked back to its origin
+       */
+      category?: string
+      /**
+       * Requires shared secret. Comment that will end up on the order line
+       */
+      comment?: string
+      /**
+       * Localized size (localizedSize) & localization definition name (localizationDefinitionName)
+       */
+      localizedProdSize?: string
+      /**
+       * The ID of subscription plan
+       */
+      subscriptionPlan?: string
+    },
   ) => Promise<CheckoutApi.Response<CheckoutApi.SelectionResponse>>
   /**
    * @param giftCertificate - The `giftCertificate` value of the gift certificate to add
@@ -355,9 +406,9 @@ export function CentraProvider(props: ProviderProps) {
   /* HANDLER METHODS */
 
   const addItem = useCallback<NonNullable<ContextMethods['addItem']>>(
-    (item, quantity = 1) =>
+    (item, quantity = 1, data) =>
       onSelectionResponse(
-        apiClient.request('POST', `items/${item}/quantity/${quantity}`),
+        apiClient.request('POST', `items/${item}/quantity/${quantity}`, data),
         selectionApiCall,
       ),
     [apiClient, selectionApiCall],

packages/react-centra-checkout/src/PaymentEmbed.tsx

@@ -1,3 +1,5 @@
+'use client'
+
 import type * as CheckoutApi from '@noaignite/centra-types'
 import { isPlainObject } from '@noaignite/utils'
 import { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react'

packages/react-centra-checkout/src/ShipwalletEmbed.tsx

@@ -1,3 +1,5 @@
+'use client'
+
 import { useEffect } from 'react'
 import { useCentraSelection } from './Context'
 import { HtmlEmbed } from './internal/HtmlEmbed'