EnhancedPivotControls rotation annotations crash in Next.js 15 with React 19

[zamderax]

Problem

When using EnhancedPivotControls with rotation enabled (disableRotations: false) and annotations enabled (annotations: true), rotating an object causes a runtime error in Next.js 15.5.7 with React 19:

TypeError: Cannot set properties of undefined (setting 'usingClientEntryPoint')

Workaround: Setting annotations: false prevents the crash.

Root Cause Analysis

The issue is in the bundled Html component from drei, specifically in main37.mjs:

var i = m.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
client.createRoot = function(c, o) {
  i.usingClientEntryPoint = true;  // i is undefined in React 19
  try {
    return m.createRoot(c, o);
  } finally {
    i.usingClientEntryPoint = false;
  }
};

In React 19, react-dom.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED has been removed or restructured, causing i to be undefined. When the Html component (used by AxisRotator to show rotation angle annotations) tries to create a root, it crashes.

Suggested Fix

Update the drei Html component bundling to use a React 19 compatible version, or add a guard:

var i = m.__SECRET_INTERNALS_DO_NOT_USE_OR_YOU_WILL_BE_FIRED;
client.createRoot = function(c, o) {
  if (i) i.usingClientEntryPoint = true;
  try {
    return m.createRoot(c, o);
  } finally {
    if (i) i.usingClientEntryPoint = false;
  }
};

Alternatively, consider using react-dom/client directly instead of accessing React internals.

Environment

• Next.js: 15.5.7
• React: 19.0.0
• @wendylabsinc/react-three-map: 1.0.9
• @react-three/fiber: 9.4.2

Steps to Reproduce

1. Use EnhancedPivotControls with disableRotations: false and annotations: true
2. Select an object
3. Drag the rotation rings to rotate
4. Error occurs when annotation tries to render

Notes

• Works fine in Storybook (Vite) - issue is Next.js/React 19 specific
• Translation annotations may have the same issue (not tested)
• The rotation functionality itself works when annotations: false