fix(types): deprecate embeded ResizeObserverSize types (#5127)

9romise · web-flow · commit d7a070102dff · 2025-11-26T01:52:17.000Z
diff --git a/packages/core/useResizeObserver/directive.ts b/packages/core/useResizeObserver/directive.ts
@@ -1,4 +1,4 @@
-import type { ResizeObserverCallback, UseResizeObserverOptions } from '@vueuse/core'
+import type { UseResizeObserverOptions } from '@vueuse/core'
 import type { ObjectDirective } from 'vue'
 import { useResizeObserver } from '@vueuse/core'
 
diff --git a/packages/core/useResizeObserver/index.ts b/packages/core/useResizeObserver/index.ts
@@ -7,11 +7,19 @@ import { defaultWindow } from '../_configurable'
 import { unrefElement } from '../unrefElement'
 import { useSupported } from '../useSupported'
 
+/**
+ * @deprecated This interface is now available in the DOM lib.
+ * Use the global {@link globalThis.ResizeObserverSize} instead.
+ */
 export interface ResizeObserverSize {
   readonly inlineSize: number
   readonly blockSize: number
 }
 
+/**
+ * @deprecated This interface is now available in the DOM lib.
+ * Use the global {@link globalThis.ResizeObserverEntry} instead.
+ */
 export interface ResizeObserverEntry {
   readonly target: Element
   readonly contentRect: DOMRectReadOnly
@@ -20,23 +28,13 @@ export interface ResizeObserverEntry {
   readonly devicePixelContentBoxSize: ReadonlyArray<ResizeObserverSize>
 }
 
+/**
+ * @deprecated This interface is now available in the DOM lib.
+ * Use the global {@link globalThis.ResizeObserverCallback} instead.
+ */
 export type ResizeObserverCallback = (entries: ReadonlyArray<ResizeObserverEntry>, observer: ResizeObserver) => void
 
-export interface UseResizeObserverOptions extends ConfigurableWindow {
-  /**
-   * Sets which box model the observer will observe changes to. Possible values
-   * are `content-box` (the default), `border-box` and `device-pixel-content-box`.
-   *
-   * @default 'content-box'
-   */
-  box?: ResizeObserverBoxOptions
-}
-
-declare class ResizeObserver {
-  constructor(callback: ResizeObserverCallback)
-  disconnect(): void
-  observe(target: Element, options?: UseResizeObserverOptions): void
-  unobserve(target: Element): void
+export interface UseResizeObserverOptions extends ResizeObserverOptions, ConfigurableWindow {
 }
 
 /**
@@ -49,7 +47,7 @@ declare class ResizeObserver {
  */
 export function useResizeObserver(
   target: MaybeComputedElementRef | MaybeComputedElementRef[] | MaybeRefOrGetter<MaybeElement[]>,
-  callback: ResizeObserverCallback,
+  callback: globalThis.ResizeObserverCallback,
   options: UseResizeObserverOptions = {},
 ) {
   const { window = defaultWindow, ...observerOptions } = options

Original file line number	Diff line number	Diff line change
`@@ -1,4 +1,4 @@`
`1`		`-import type { ResizeObserverCallback, UseResizeObserverOptions } from '@vueuse/core'`
	`1`	`+import type { UseResizeObserverOptions } from '@vueuse/core'`
`2`	`2`	`import type { ObjectDirective } from 'vue'`
`3`	`3`	`import { useResizeObserver } from '@vueuse/core'`
`4`	`4`