@coinbase/cds-common 8.66.1 → 8.66.2

package/CHANGELOG.md

@@ -8,6 +8,12 @@ All notable changes to this project will be documented in this file.
 
 <!-- template-start -->
 
+## 8.66.2 (4/28/2026 PST)
+
+#### 🐞 Fixes
+
+- Fix: React 19 compatibility issue with useMergeRefs. [[#650](https://github.com/coinbase/cds/pull/650)]
+
 ## 8.66.1 ((4/27/2026, 12:59 PM PST))
 
 This is an artificial version bump with no new change.

package/dts/hooks/useMergeRefs.d.ts

@@ -1,3 +1,16 @@
+/**
+ * Merges multiple refs into a single ref callback. Supports both callback refs
+ * and object refs. `null`/`undefined` refs are ignored.
+ *
+ * The returned callback is referentially stable across renders as long as the
+ * underlying refs themselves are stable. This is critical under React 19,
+ * which schedules a detach (`oldRef(null)`) followed by an attach
+ * (`newRef(node)`) every time a ref-callback's identity changes. Without
+ * `useCallback` here, every render would create a new merged callback,
+ * triggering React 19's detach/attach lifecycle and — when one of the merged
+ * refs synchronously sets state during attach/detach — an infinite update
+ * loop ending in `Maximum update depth exceeded`.
+ */
 export declare const useMergeRefs: <T = any>(
   ...refs: (React.MutableRefObject<T> | React.LegacyRef<T> | undefined | null)[]
 ) => React.RefCallback<T>;

package/dts/hooks/useMergeRefs.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"useMergeRefs.d.ts","sourceRoot":"","sources":["../../src/hooks/useMergeRefs.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,YAAY,GAAI,CAAC,GAAG,GAAG,EAClC,GAAG,MAAM,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,GAAG,SAAS,GAAG,IAAI,CAAC,EAAE,KAC7E,KAAK,CAAC,WAAW,CAAC,CAAC,CAUrB,CAAC"}
+{"version":3,"file":"useMergeRefs.d.ts","sourceRoot":"","sources":["../../src/hooks/useMergeRefs.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;GAYG;AACH,eAAO,MAAM,YAAY,GAAI,CAAC,GAAG,GAAG,EAClC,GAAG,MAAM,CAAC,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,GAAG,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,GAAG,SAAS,GAAG,IAAI,CAAC,EAAE,KAC7E,KAAK,CAAC,WAAW,CAAC,CAAC,CAiBrB,CAAC"}

package/esm/hooks/useMergeRefs.js

@@ -1,8 +1,23 @@
+import { useCallback } from 'react';
+
+/**
+ * Merges multiple refs into a single ref callback. Supports both callback refs
+ * and object refs. `null`/`undefined` refs are ignored.
+ *
+ * The returned callback is referentially stable across renders as long as the
+ * underlying refs themselves are stable. This is critical under React 19,
+ * which schedules a detach (`oldRef(null)`) followed by an attach
+ * (`newRef(node)`) every time a ref-callback's identity changes. Without
+ * `useCallback` here, every render would create a new merged callback,
+ * triggering React 19's detach/attach lifecycle and — when one of the merged
+ * refs synchronously sets state during attach/detach — an infinite update
+ * loop ending in `Maximum update depth exceeded`.
+ */
 export const useMergeRefs = function () {
   for (var _len = arguments.length, refs = new Array(_len), _key = 0; _key < _len; _key++) {
     refs[_key] = arguments[_key];
   }
-  return value => {
+  return useCallback(value => {
     refs.forEach(ref => {
       if (typeof ref === 'function') {
         ref(value);
@@ -10,5 +25,10 @@ export const useMergeRefs = function () {
         ref.current = value;
       }
     });
-  };
+  },
+  // The deps are the spread refs themselves. React's `useCallback` shallow-
+  // compares each element of the deps array, so the returned callback stays
+  // stable when each underlying ref keeps the same identity across renders.
+  // eslint-disable-next-line react-hooks/exhaustive-deps
+  refs);
 };

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@coinbase/cds-common",
-  "version": "8.66.1",
+  "version": "8.66.2",
   "description": "Coinbase Design System - Common",
   "repository": {
     "type": "git",
@@ -40,7 +40,7 @@
   "dependencies": {
     "@coinbase/cds-icons": "^5.16.0",
     "@coinbase/cds-illustrations": "^4.38.0",
-    "@coinbase/cds-mcp-server": "^8.66.1",
+    "@coinbase/cds-mcp-server": "^8.66.2",
     "@coinbase/cds-utils": "^2.3.5",
     "@modelcontextprotocol/sdk": "^1.13.1",
     "d3-array": "^3.2.4",