uses React.RefCallback instead of custom implementation

CHANGELOG.md

@@ -5,6 +5,10 @@
 - Fixed `EuiDataGrid`'s sort popover to behave properly on mobile screens ([#2979](https://github.com/elastic/eui/pull/2979))
 - Fixed `EuiButton` and other textual components' disabled contrast ([#2874](https://github.com/elastic/eui/pull/2874))
 
+**Breaking changes**
+
+- Updated `@types/react` and `@types/react-dom` to utilize React.RefCallback type instead of custom implementation ([#2929](https://github.com/elastic/eui/pull/2929))
+
 **Theme: Amsterdam**
 
 - Buttons have a new visual style ([#2874](https://github.com/elastic/eui/pull/2874))

package.json

@@ -88,8 +88,9 @@
     "@types/classnames": "^2.2.6",
     "@types/highlight.js": "^9.12.3",
     "@types/jest": "^24.0.6",
-    "@types/react": "^16.9.11",
-    "@types/react-dom": "^16.9.4",
+    "@types/react": "^16.9.23",
+    "@types/react-dom": "^16.9.5",
+    "@types/react-input-autosize": "^2.0.1",
     "@types/react-is": "^16.7.1",
     "@types/resize-observer-browser": "^0.1.1",
     "@types/tabbable": "^3.1.0",
@@ -197,8 +198,8 @@
   },
   "peerDependencies": {
     "@elastic/datemath": "^5.0.2",
-    "@types/react": "^16.9.11",
-    "@types/react-dom": "^16.9.4",
+    "@types/react": "^16.9.23",
+    "@types/react-dom": "^16.9.5",
     "moment": "^2.13.0",
     "prop-types": "^15.5.0",
     "react": "^16.12",

src/components/combo_box/combo_box.tsx

@@ -7,8 +7,9 @@
 import React, {
   Component,
   FocusEventHandler,
-  KeyboardEventHandler,
   HTMLAttributes,
+  KeyboardEventHandler,
+  RefCallback,
 } from 'react';
 import classNames from 'classnames';
 
@@ -34,7 +35,6 @@ import { EuiComboBoxOptionsListProps } from './combo_box_options_list/combo_box_
 import {
   UpdatePositionHandler,
   OptionHandler,
-  RefCallback,
   RefInstance,
   EuiComboBoxOptionOption,
   EuiComboBoxOptionsListPosition,

src/components/combo_box/combo_box_input/combo_box_input.tsx

@@ -1,4 +1,9 @@
-import React, { Component, FocusEventHandler, ChangeEventHandler } from 'react';
+import React, {
+  ChangeEventHandler,
+  Component,
+  FocusEventHandler,
+  RefCallback,
+} from 'react';
 import classNames from 'classnames';
 import AutosizeInput from 'react-input-autosize';
 
@@ -11,7 +16,6 @@ import {
   EuiComboBoxOptionOption,
   EuiComboBoxSingleSelectionShape,
   OptionHandler,
-  RefCallback,
   UpdatePositionHandler,
 } from '../types';
 import { CommonProps } from '../../common';

src/components/combo_box/combo_box_options_list/combo_box_option.tsx

@@ -1,13 +1,14 @@
 import React, {
   Component,
-  ReactNode,
-  KeyboardEventHandler,
   HTMLAttributes,
+  KeyboardEventHandler,
+  ReactNode,
+  RefCallback,
 } from 'react';
 import classNames from 'classnames';
 
 import { ENTER, SPACE } from '../../../services/key_codes';
-import { EuiComboBoxOptionOption, OptionHandler, RefCallback } from '../types';
+import { EuiComboBoxOptionOption, OptionHandler } from '../types';
 import { CommonProps } from '../../common';
 
 export interface EuiComboBoxOptionProps<T>

src/components/combo_box/combo_box_options_list/combo_box_options_list.tsx

@@ -1,4 +1,9 @@
-import React, { Component, ReactNode, ComponentProps } from 'react';
+import React, {
+  Component,
+  ComponentProps,
+  ReactNode,
+  RefCallback,
+} from 'react';
 import classNames from 'classnames';
 import { List, ListProps } from 'react-virtualized'; // eslint-disable-line import/named
 
@@ -20,7 +25,6 @@ import {
   EuiComboBoxOptionsListPosition,
   EuiComboBoxSingleSelectionShape,
   OptionHandler,
-  RefCallback,
   RefInstance,
   UpdatePositionHandler,
 } from '../types';

src/components/combo_box/types.ts

@@ -17,11 +17,6 @@ export type UpdatePositionHandler = (
 ) => void;
 export type OptionHandler<T> = (option: EuiComboBoxOptionOption<T>) => void;
 
-// See https://github.com/DefinitelyTyped/DefinitelyTyped/pull/42482/files
-export type RefCallback<T> = {
-  bivarianceHack(instance: T | null): void;
-}['bivarianceHack'];
-
 export type RefInstance<T> = T | null;
 
 export type EuiComboBoxOptionsListPosition = 'top' | 'bottom';

src/components/common.ts

@@ -15,10 +15,6 @@ export interface CommonProps {
 
 export type NoArgCallback<T> = () => T;
 
-export type RefCallback<Element extends HTMLElement | null> = (
-  element: Element
-) => void;
-
 // utility types:
 
 /**

src/components/facet/facet_button.tsx

@@ -3,10 +3,11 @@ import React, {
   HTMLAttributes,
   MouseEventHandler,
   ReactNode,
+  RefCallback,
 } from 'react';
 import classNames from 'classnames';
 
-import { CommonProps, RefCallback } from '../common';
+import { CommonProps } from '../common';
 
 import { EuiNotificationBadge } from '../badge';
 

src/components/popover/popover.tsx

@@ -4,11 +4,12 @@ import React, {
   HTMLAttributes,
   ReactNode,
   Ref,
+  RefCallback,
 } from 'react';
 import classNames from 'classnames';
 import tabbable from 'tabbable';
 
-import { CommonProps, NoArgCallback, RefCallback } from '../common';
+import { CommonProps, NoArgCallback } from '../common';
 import { FocusTarget, EuiFocusTrap } from '../focus_trap';
 import { Props as ReactFocusLockProps } from 'react-focus-lock'; // eslint-disable-line import/named
 
@@ -66,7 +67,7 @@ export interface EuiPopoverProps {
 
   button: NonNullable<ReactNode>;
 
-  buttonRef?: RefCallback<HTMLDivElement | null>;
+  buttonRef?: RefCallback<HTMLDivElement>;
 
   closePopover: NoArgCallback<void>;
 

yarn.lock

@@ -1248,9 +1248,9 @@
   integrity sha512-//oorEZjL6sbPcKUaCdIGlIUeH26mgzimjBB77G6XRgnDl/L5wOnpyBGRe/Mmf5CVW3PwEBE1NjiMZ/ssFh4wA==
 
 "@types/prop-types@*":
-  version "15.5.9"
-  resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.5.9.tgz#f2d14df87b0739041bc53a7d75e3d77d726a3ec0"
-  integrity sha512-Nha5b+jmBI271jdTMwrHiNXM+DvThjHOfyZtMX9kj/c/LUj2xiLHsG/1L3tJ8DjAoQN48cHwUwtqBotjyXaSdQ==
+  version "15.7.3"
+  resolved "https://registry.yarnpkg.com/@types/prop-types/-/prop-types-15.7.3.tgz#2ab0d5da2e5815f94b0b9d4b95d1e5f243ab2ca7"
+  integrity sha512-KfRL3PuHmqQLOG+2tGpRO26Ctg+Cq1E01D2DMriKEATHgWLfeNDmq9e29Q9WIky0dQ3NPkd1mzYH8Lm936Z9qw==
 
 "@types/q@^1.5.1":
   version "1.5.2"
@@ -1264,10 +1264,10 @@
   dependencies:
     "@types/react" "*"
 
-"@types/react-dom@^16.9.4":
-  version "16.9.4"
-  resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-16.9.4.tgz#0b58df09a60961dcb77f62d4f1832427513420df"
-  integrity sha512-fya9xteU/n90tda0s+FtN5Ym4tbgxpq/hb/Af24dvs6uYnYn+fspaxw5USlw0R8apDNwxsqumdRoCoKitckQqw==
+"@types/react-dom@^16.9.5":
+  version "16.9.5"
+  resolved "https://registry.yarnpkg.com/@types/react-dom/-/react-dom-16.9.5.tgz#5de610b04a35d07ffd8f44edad93a71032d9aaa7"
+  integrity sha512-BX6RQ8s9D+2/gDhxrj8OW+YD4R+8hj7FEM/OJHGNR0KipE1h1mSsf39YeyC81qafkq+N3rU3h3RFbLSwE5VqUg==
   dependencies:
     "@types/react" "*"
 
@@ -1293,10 +1293,10 @@
     "@types/prop-types" "*"
     "@types/react" "*"
 
-"@types/react@*", "@types/react@^16.9.11":
-  version "16.9.13"
-  resolved "https://registry.yarnpkg.com/@types/react/-/react-16.9.13.tgz#b3ea5dd443f4a680599e2abba8cc66f5e1ce0059"
-  integrity sha512-LikzRslbiufJYHyzbHSW0GrAiff8QYLMBFeZmSxzCYGXKxi8m/1PHX+rsVOwhr7mJNq+VIu2Dhf7U6mjFERK6w==
+"@types/react@*", "@types/react@^16.9.23":
+  version "16.9.23"
+  resolved "https://registry.yarnpkg.com/@types/react/-/react-16.9.23.tgz#1a66c6d468ba11a8943ad958a8cb3e737568271c"
+  integrity sha512-SsGVT4E7L2wLN3tPYLiF20hmZTPGuzaayVunfgXzUn1x4uHVsKH6QDJQ/TdpHqwsTLd4CwrmQ2vOgxN7gE24gw==
   dependencies:
     "@types/prop-types" "*"
     csstype "^2.2.0"
@@ -4184,9 +4184,9 @@ [email protected], "cssom@>= 0.3.2 < 0.4.0":
     cssom "0.3.x"
 
 csstype@^2.2.0:
-  version "2.5.6"
-  resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.5.6.tgz#2ae1db2319642d8b80a668d2d025c6196071e788"
-  integrity sha512-tKPyhy0FmfYD2KQYXD5GzkvAYLYj96cMLXr648CKGd3wBe0QqoPipImjGiLze9c8leJK8J3n7ap90tpk3E6HGQ==
+  version "2.6.9"
+  resolved "https://registry.yarnpkg.com/csstype/-/csstype-2.6.9.tgz#05141d0cd557a56b8891394c1911c40c8a98d098"
+  integrity sha512-xz39Sb4+OaTsULgUERcCk+TJj8ylkL4aSVDQiX/ksxbELSqwkgt4d4RD7fovIdgJGSuNYqwZEiVjYY5l0ask+Q==
 
 csstype@^2.6.7:
   version "2.6.7"