Stop the Drop-in reloading on every order update

.github/workflows/publish.yaml

@@ -24,10 +24,11 @@ jobs:
       - name: Node 🧰
         uses: actions/setup-node@v6
         with:
-          node-version: 20.x
+          node-version: 22.x
           registry-url: https://registry.npmjs.org
           cache: 'pnpm'
 
+      # npm >= 11.5.1 is required for trusted publishing (OIDC) on npmjs.
       - name: Update npm
         run: npm install -g npm@latest
 

lerna.json

@@ -2,10 +2,10 @@
   "$schema": "node_modules/lerna/schemas/lerna-schema.json",
   "useNx": false,
   "npmClient": "pnpm",
-  "version": "4.29.6",
+  "version": "5.0.0-beta.1",
   "command": {
     "version": {
       "preid": "beta"
     }
   }
-}
+}

package.json

@@ -24,9 +24,9 @@
     "clean": "pnpm dlx rimraf --glob **/node_modules **/pnpm-lock.yaml"
   },
   "devDependencies": {
-    "@biomejs/biome": "^2.5.4",
+    "@biomejs/biome": "^2.5.8",
     "husky": "^9.1.7",
-    "lerna": "^9.0.7",
+    "lerna": "^10.0.0",
     "typescript": "^6.0.3"
   },
   "pnpm": {}

packages/core-components/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@commercelayer/core-components",
-  "version": "1.0.0",
+  "version": "5.0.0-beta.1",
   "description": "Commerce Layer Core",
   "type": "module",
   "main": "./dist/index.js",
@@ -43,10 +43,10 @@
     "tsdown": "^0.22.12",
     "typescript": "^6.0.3",
     "vite-tsconfig-paths": "^6.1.1",
-    "vitest": "^4.1.10"
+    "vitest": "^4.1.5"
   },
   "dependencies": {
-    "@commercelayer/js-auth": "^7.4.2",
+    "@commercelayer/js-auth": "^8.0.0",
     "@commercelayer/sdk": "8.0.0-beta.11"
   }
 }

packages/docs/package.json

@@ -3,9 +3,9 @@
   "name": "docs",
   "version": "4.28.3",
   "devDependencies": {
-    "@babel/core": "^7.29.7",
-    "@babel/preset-env": "^7.29.7",
-    "@commercelayer/js-auth": "^7.4.2",
+    "@babel/core": "^8.0.1",
+    "@babel/preset-env": "^8.0.2",
+    "@commercelayer/js-auth": "^8.0.0",
     "@commercelayer/sdk": "8.0.0-beta.11",
     "@mdx-js/react": "^3.1.1",
     "@storybook/addon-actions": "^9.0.8",

packages/document/package.json

@@ -18,7 +18,7 @@
   },
   "devDependencies": {
     "@chromatic-com/storybook": "^5.2.1",
-    "@commercelayer/js-auth": "^7.4.2",
+    "@commercelayer/js-auth": "^8.0.0",
     "@storybook/addon-docs": "^10.5.3",
     "@storybook/addon-links": "^10.5.3",
     "@storybook/addon-mcp": "^0.7.0",

packages/react-components/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@commercelayer/react-components",
-  "version": "4.29.6",
+  "version": "5.0.0-beta.1",
   "description": "The Official Commerce Layer React Components",
   "type": "module",
   "main": "./dist/index.js",
@@ -65,44 +65,43 @@
     "@commercelayer/organization-config": "^2.8.4",
     "@commercelayer/react-hooks-components": "workspace:*",
     "@commercelayer/sdk": "8.0.0-beta.11",
-    "@stripe/react-stripe-js": "^6.8.0",
+    "@stripe/react-stripe-js": "^6.8.1",
     "@stripe/stripe-js": "^9.10.0",
+    "@iframe-resizer/parent": "^5.5.9",
     "@tanstack/react-table": "^8.21.3",
-    "@types/iframe-resizer": "^4.0.0",
     "braintree-web": "^3.143.0",
     "frames-react": "^1.2.4",
-    "iframe-resizer": "^4.3.6",
-    "rapid-form": "^4.0.4"
+    "rapid-form": "^5.0.0"
   },
   "devDependencies": {
     "@arethetypeswrong/cli": "^0.18.5",
-    "@babel/core": "^7.29.7",
-    "@commercelayer/js-auth": "^7.4.2",
+    "@babel/core": "^8.0.1",
+    "@commercelayer/js-auth": "^8.0.0",
     "@faker-js/faker": "^10.5.0",
     "@playwright/test": "^1.61.1",
     "@rolldown/plugin-babel": "^0.2.3",
     "@testing-library/dom": "^10.4.1",
     "@testing-library/react": "^16.3.2",
     "@types/braintree-web": "^3.96.17",
-    "@types/node": "^25.9.5",
+    "@types/node": "^26.2.0",
     "@types/react": "^19.2.17",
     "@types/react-test-renderer": "^19.1.0",
     "@types/react-window": "^2.0.0",
     "@vitejs/plugin-react": "^6.0.3",
     "@vitest/coverage-v8": "^4.1.10",
     "babel-plugin-react-compiler": "^1.0.0",
-    "jsdom": "^29.1.1",
+    "jsdom": "^30.0.1",
     "msw": "^2.15.0",
     "react": "^19.2.7",
     "react-dom": "^19.2.7",
     "react-test-renderer": "^19.2.7",
-    "swr": "^2.4.2",
+    "swr": "^2.5.1",
     "tsdown": "^0.22.12",
     "tslib": "^2.8.1",
     "typescript": "^6.0.3",
     "vite": "^8.1.5",
     "vite-tsconfig-paths": "^6.1.1",
-    "vitest": "^4.1.10"
+    "vitest": "^4.1.5"
   },
   "peerDependencies": {
     "react": ">=19.0.0"

packages/react-components/specs/addresses/BillingAddressForm.spec.tsx

@@ -206,25 +206,54 @@ describe("BillingAddressForm", () => {
     })
   })
 
-  it("calls saveAddressToCustomerAddressBook for checkbox fields", async () => {
-    const saveAddressToCustomerAddressBook = vi.fn()
-    renderForm({
+  it.each([
+    ["ticked", "true", true],
+    ["unticked", "false", false],
+  ])(
+    "reports a %s save-to-address-book checkbox from rapid-form's string value",
+    async (_label, reported, expected) => {
+      // rapid-form v5 reports a checkbox as the string "true"/"false" and carries no
+      // `type`/`checked`. Tracking it at all requires trackUnvalidatedFields, since the
+      // checkbox is not a required field.
+      const saveAddressToCustomerAddressBook = vi.fn()
+      renderForm({
+        values: {
+          billing_address_first_name: { value: "Jane", required: true },
+          billing_address_save_to_customer_book: {
+            name: "billing_address_save_to_customer_book",
+            value: reported,
+          },
+        },
+        orderOverrides: { saveAddressToCustomerAddressBook },
+      })
+
+      await waitFor(() => {
+        expect(saveAddressToCustomerAddressBook).toHaveBeenCalledWith(
+          expect.objectContaining({ type: "billing_address", value: expected })
+        )
+      })
+    }
+  )
+
+  it("keeps the checkbox out of the address attributes", async () => {
+    // "false" is a truthy string, so a checkbox leaking into the values would be
+    // PATCHed onto the address as a bogus `save_to_customer_book` attribute.
+    const { setAddress } = renderForm({
       values: {
         billing_address_first_name: { value: "Jane", required: true },
         billing_address_save_to_customer_book: {
-          value: "on",
-          type: "checkbox",
-          checked: true,
+          name: "billing_address_save_to_customer_book",
+          value: "false",
         },
       },
-      orderOverrides: { saveAddressToCustomerAddressBook },
     })
 
     await waitFor(() => {
-      expect(saveAddressToCustomerAddressBook).toHaveBeenCalledWith(
-        expect.objectContaining({ type: "billing_address", value: true })
-      )
+      expect(setAddress).toHaveBeenCalled()
     })
+    for (const call of setAddress.mock.calls) {
+      expect(call[0].values).not.toHaveProperty("save_to_customer_book")
+    }
   })
 
   it("sets address errors when input validation fails", async () => {

packages/react-components/specs/addresses/ShippingAddressForm.spec.tsx

@@ -233,25 +233,54 @@ describe("ShippingAddressForm", () => {
     })
   })
 
-  it("calls saveAddressToCustomerAddressBook for checkbox fields", async () => {
-    const saveAddressToCustomerAddressBook = vi.fn()
-    renderForm({
+  it.each([
+    ["ticked", "true", true],
+    ["unticked", "false", false],
+  ])(
+    "reports a %s save-to-address-book checkbox from rapid-form's string value",
+    async (_label, reported, expected) => {
+      // rapid-form v5 reports a checkbox as the string "true"/"false" and carries no
+      // `type`/`checked`. Tracking it at all requires trackUnvalidatedFields, since the
+      // checkbox is not a required field.
+      const saveAddressToCustomerAddressBook = vi.fn()
+      renderForm({
+        values: {
+          shipping_address_first_name: { value: "Jane", required: true },
+          shipping_address_save_to_customer_book: {
+            name: "shipping_address_save_to_customer_book",
+            value: reported,
+          },
+        },
+        orderOverrides: { saveAddressToCustomerAddressBook },
+      })
+
+      await waitFor(() => {
+        expect(saveAddressToCustomerAddressBook).toHaveBeenCalledWith(
+          expect.objectContaining({ type: "shipping_address", value: expected })
+        )
+      })
+    }
+  )
+
+  it("keeps the checkbox out of the address attributes", async () => {
+    // "false" is a truthy string, so a checkbox leaking into the values would be
+    // PATCHed onto the address as a bogus `save_to_customer_book` attribute.
+    const { setAddress } = renderForm({
       values: {
         shipping_address_first_name: { value: "Jane", required: true },
         shipping_address_save_to_customer_book: {
-          value: "on",
-          type: "checkbox",
-          checked: true,
+          name: "shipping_address_save_to_customer_book",
+          value: "false",
         },
       },
-      orderOverrides: { saveAddressToCustomerAddressBook },
     })
 
     await waitFor(() => {
-      expect(saveAddressToCustomerAddressBook).toHaveBeenCalledWith(
-        expect.objectContaining({ type: "shipping_address", value: true })
-      )
+      expect(setAddress).toHaveBeenCalled()
     })
+    for (const call of setAddress.mock.calls) {
+      expect(call[0].values).not.toHaveProperty("save_to_customer_book")
+    }
   })
 
   it("sets address errors when input validation fails (with shouldSyncShippingAddress)", async () => {

packages/react-components/specs/orders/hosted-cart.spec.tsx

@@ -7,8 +7,8 @@ import OrderStorageContext from "#context/OrderStorageContext"
 import * as applicationLinkUtils from "#utils/getApplicationLink"
 import * as organizationUtils from "#utils/organization"
 
-vi.mock("iframe-resizer", () => ({
-  iframeResizer: vi.fn(),
+vi.mock("@iframe-resizer/parent", () => ({
+  default: vi.fn(),
 }))
 
 describe("HostedCart component", () => {