From 51312c33199a9894f2309fb92a227e4eb2856659 Mon Sep 17 00:00:00 2001
From: Cody Bennett <hi@codyb.co>
Date: Fri, 10 Jan 2025 07:15:17 -0600
Subject: [PATCH] Revert "experiment: keep MutableRefObject"

This reverts commit 6c069501a46c39813c90bb3d77e49e5dbd3605af.
---
 packages/core/src/hooks/useInView.ts | 2 +-
 packages/core/src/hooks/useResize.ts | 6 +++---
 packages/core/src/hooks/useScroll.ts | 6 +++---
 packages/parallax/src/index.tsx      | 4 ++--
 packages/types/src/utils.ts          | 4 ++--
 5 files changed, 11 insertions(+), 11 deletions(-)

diff --git a/packages/core/src/hooks/useInView.ts b/packages/core/src/hooks/useInView.ts
index 90dc6c9067..28ec706022 100644
--- a/packages/core/src/hooks/useInView.ts
+++ b/packages/core/src/hooks/useInView.ts
@@ -8,7 +8,7 @@ import { Valid } from '../types/common'
 
 export interface IntersectionArgs
   extends Omit<IntersectionObserverInit, 'root' | 'threshold'> {
-  root?: React.MutableRefObject<HTMLElement>
+  root?: React.RefObject<HTMLElement>
   once?: boolean
   amount?: 'any' | 'all' | number | number[]
 }
diff --git a/packages/core/src/hooks/useResize.ts b/packages/core/src/hooks/useResize.ts
index c5b4c2c06b..5b3a9a86ac 100644
--- a/packages/core/src/hooks/useResize.ts
+++ b/packages/core/src/hooks/useResize.ts
@@ -1,4 +1,4 @@
-import { MutableRefObject } from 'react'
+import { RefObject } from 'react'
 import { onResize, each, useIsomorphicLayoutEffect } from '@react-spring/shared'
 
 import { SpringProps, SpringValues } from '../types'
@@ -6,7 +6,7 @@ import { SpringProps, SpringValues } from '../types'
 import { useSpring } from './useSpring'
 
 export interface UseResizeOptions extends Omit<SpringProps, 'to' | 'from'> {
-  container?: MutableRefObject<HTMLElement | null | undefined>
+  container?: RefObject<HTMLElement | null | undefined>
 }
 
 /**
@@ -30,7 +30,7 @@ export interface UseResizeOptions extends Omit<SpringProps, 'to' | 'from'> {
   ```
  * 
  * @param {UseResizeOptions} UseResizeOptions options for the useScroll hook.
- * @param {MutableRefObject<HTMLElement>} UseResizeOptions.container the container to listen to scroll events on, defaults to the window.
+ * @param {RefObject<HTMLElement>} UseResizeOptions.container the container to listen to scroll events on, defaults to the window.
  *
  * @returns {SpringValues<{width: number; height: number;}>} SpringValues the collection of values returned from the inner hook
  */
diff --git a/packages/core/src/hooks/useScroll.ts b/packages/core/src/hooks/useScroll.ts
index 58b05c7f5f..eb6520370d 100644
--- a/packages/core/src/hooks/useScroll.ts
+++ b/packages/core/src/hooks/useScroll.ts
@@ -1,4 +1,4 @@
-import { MutableRefObject } from 'react'
+import { RefObject } from 'react'
 import { each, onScroll, useIsomorphicLayoutEffect } from '@react-spring/shared'
 
 import { SpringProps, SpringValues } from '../types'
@@ -6,7 +6,7 @@ import { SpringProps, SpringValues } from '../types'
 import { useSpring } from './useSpring'
 
 export interface UseScrollOptions extends Omit<SpringProps, 'to' | 'from'> {
-  container?: MutableRefObject<HTMLElement>
+  container?: RefObject<HTMLElement>
 }
 
 /**
@@ -30,7 +30,7 @@ export interface UseScrollOptions extends Omit<SpringProps, 'to' | 'from'> {
   ```
  * 
  * @param {UseScrollOptions} useScrollOptions options for the useScroll hook.
- * @param {MutableRefObject<HTMLElement>} useScrollOptions.container the container to listen to scroll events on, defaults to the window.
+ * @param {RefObject<HTMLElement>} useScrollOptions.container the container to listen to scroll events on, defaults to the window.
  *
  * @returns {SpringValues<{scrollX: number; scrollY: number; scrollXProgress: number; scrollYProgress: number}>} SpringValues the collection of values returned from the inner hook
  */
diff --git a/packages/parallax/src/index.tsx b/packages/parallax/src/index.tsx
index 9594c852bd..4920eb89b8 100644
--- a/packages/parallax/src/index.tsx
+++ b/packages/parallax/src/index.tsx
@@ -52,8 +52,8 @@ export interface IParallax {
   current: number
   controller: Controller<{ scroll: number }>
   layers: Set<IParallaxLayer>
-  container: React.MutableRefObject<any>
-  content: React.MutableRefObject<any>
+  container: React.RefObject<any>
+  content: React.RefObject<any>
   scrollTo(offset: number): void
   update(): void
   stop(): void
diff --git a/packages/types/src/utils.ts b/packages/types/src/utils.ts
index 19807b4532..852037e823 100644
--- a/packages/types/src/utils.ts
+++ b/packages/types/src/utils.ts
@@ -23,7 +23,7 @@
  */
 
 import * as React from 'react'
-import { ReactElement, MutableRefObject } from 'react'
+import { ReactElement, RefObject } from 'react'
 
 /** Ensure each type of `T` is an array */
 export type Arrify<T> = [T, T] extends [infer T, infer DT]
@@ -139,7 +139,7 @@ export interface Disposable {
 }
 
 // react.d.ts
-export type RefProp<T> = MutableRefObject<T | null | undefined>
+export type RefProp<T> = RefObject<T | null | undefined>
 
 // https://github.com/DefinitelyTyped/DefinitelyTyped/issues/34237
 export type ElementType<P = any> =