[email protected] (#2274)

* [email protected]

* tweak ResizeObserver fake polyfill

* rc

* Fix TS1208

* simplify

* stable release

Author: nstepien

Diff for: .storybook/preview.tsx

@@ -2,11 +2,7 @@ import 'core-js/stable';
 import { ResizeObserver as Polyfill } from '@juggle/resize-observer';
 import { css } from '@linaria/core';
 
-// @ts-expect-error
-if (typeof ResizeObserver === 'undefined') {
-  // @ts-expect-error
-  window.ResizeObserver = Polyfill;
-}
+window.ResizeObserver ??= Polyfill;
 
 css`
 :global() {

Diff for: package.json

@@ -98,7 +98,7 @@
     "react-sortable-hoc": "^1.11.0",
     "rollup": "^2.39.0",
     "rollup-plugin-postcss": "^4.0.0",
-    "typescript": "~4.1.5"
+    "typescript": "~4.2.2"
   },
   "peerDependencies": {
     "react": "^16.14 || ^17.0",

Diff for: src/hooks/useGridDimensions.ts

@@ -1,25 +1,12 @@
 import { useRef, useState, useLayoutEffect } from 'react';
 
-// https://github.com/microsoft/TypeScript/issues/37861
-interface ResizeObserverEntry {
-  contentRect: {
-    width: number;
-    height: number;
-  };
-}
-
-type ResizeObserver = new (callback: (entries: readonly ResizeObserverEntry[]) => void) => {
-  observe: (target: Element) => void;
-  disconnect: () => void;
-};
-
 export function useGridDimensions(): [ref: React.RefObject<HTMLDivElement>, width: number, height: number] {
   const gridRef = useRef<HTMLDivElement>(null);
   const [gridWidth, setGridWidth] = useState(1);
   const [gridHeight, setGridHeight] = useState(1);
 
   useLayoutEffect(() => {
-    const { ResizeObserver } = window as typeof window & { ResizeObserver: ResizeObserver };
+    const { ResizeObserver } = window;
 
     // don't break in jest/jsdom and browsers that don't support ResizeObserver
     // eslint-disable-next-line @typescript-eslint/no-unnecessary-condition

Diff for: test/setup.ts

@@ -1,11 +1,18 @@
-// @ts-expect-error
-window.ResizeObserver ??= function ResizeObserver(callback: () => void) {
-  callback();
-
-  return {
-    observe() {},
-    disconnect() {}
-  };
+import 'core-js/stable';
+
+window.ResizeObserver ??= class {
+  callback: ResizeObserverCallback;
+
+  constructor(callback: ResizeObserverCallback) {
+    this.callback = callback;
+  }
+
+  observe() {
+    this.callback([], this);
+  }
+
+  unobserve() {}
+  disconnect() {}
 };
 
 // patch clientWidth/clientHeight to pretend we're rendering DataGrid at 1080p