@sb1/ffe-collapse-react 3.0.7 → 4.0.1

package/es/Collapse.js

@@ -1,81 +1,70 @@
-var _excluded = ["className", "isOpen", "onRest", "children"];
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
-function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } } return target; }
-import React, { useRef, useEffect, useState } from 'react';
-import { string, bool, func, node } from 'prop-types';
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+import React, { useRef, useEffect, useState, } from 'react';
 import classNames from 'classnames';
-export var Collapse = /*#__PURE__*/React.forwardRef(function (_ref, ref) {
-  var className = _ref.className,
-    isOpen = _ref.isOpen,
-    onRest = _ref.onRest,
-    children = _ref.children,
-    rest = _objectWithoutProperties(_ref, _excluded);
-  var internalRef = useRef();
-  var collapse = ref !== null && ref !== void 0 ? ref : internalRef;
-  var _useState = useState(!isOpen),
-    _useState2 = _slicedToArray(_useState, 2),
-    isHidden = _useState2[0],
-    setIsHidden = _useState2[1];
-  var _useState3 = useState(!!isOpen),
-    _useState4 = _slicedToArray(_useState3, 2),
-    overflowVisible = _useState4[0],
-    setOverflowVisible = _useState4[1];
-  useEffect(function () {
-    var _collapse = collapse;
-    var handleTransition = function handleTransition(startOrEnd) {
-      return function (e) {
-        if (e.target === collapse.current && e.propertyName === 'grid-template-rows') {
-          setIsHidden(!isOpen);
-          if (startOrEnd === 'start') {
-            setOverflowVisible(false);
-          } else {
-            if (isOpen) {
-              setOverflowVisible(true);
-            }
-            if (onRest) {
-              onRest();
+import { mergeRefs } from './mergeRefs';
+export var Collapse = React.forwardRef(function (_a, ref) {
+    var className = _a.className, isOpen = _a.isOpen, onRest = _a.onRest, children = _a.children, rest = __rest(_a, ["className", "isOpen", "onRest", "children"]);
+    var internalRef = useRef(null);
+    var _b = useState(!isOpen), isHidden = _b[0], setIsHidden = _b[1];
+    var _c = useState(isOpen), overflowVisible = _c[0], setOverflowVisible = _c[1];
+    useEffect(function () {
+        var handleTransition = function (startOrEnd) { return function (e) {
+            if (e.target === internalRef.current &&
+                e.propertyName === 'grid-template-rows') {
+                setIsHidden(!isOpen);
+                if (startOrEnd === 'start') {
+                    setOverflowVisible(false);
+                }
+                else {
+                    if (isOpen) {
+                        setOverflowVisible(true);
+                    }
+                    if (onRest) {
+                        onRest();
+                    }
+                }
             }
-          }
+        }; };
+        var handleTransitionStart = handleTransition('start');
+        var handleTransitionEnd = handleTransition('end');
+        var collapse = internalRef.current;
+        if (collapse) {
+            collapse.addEventListener('transitionstart', handleTransitionStart);
+            collapse.addEventListener('transitionend', handleTransitionEnd);
         }
-      };
-    };
-    var handleTransitionStart = handleTransition('start');
-    var handleTransitionEnd = handleTransition('end');
-    if (_collapse.current) {
-      _collapse.current.addEventListener('transitionstart', handleTransitionStart);
-      _collapse.current.addEventListener('transitionend', handleTransitionEnd);
-    }
-    return function () {
-      if (_collapse.current) {
-        _collapse.current.removeEventListener('transitionstart', handleTransitionStart);
-        _collapse.current.removeEventListener('transitionend', handleTransitionEnd);
-      }
-    };
-  }, [collapse, isOpen, onRest]);
-  return /*#__PURE__*/React.createElement("div", _extends({}, rest, {
-    ref: collapse,
-    className: classNames('ffe-collapse', className, {
-      'ffe-collapse--open': isOpen,
-      'ffe-collapse--hidden': isHidden
-    })
-  }), /*#__PURE__*/React.createElement("div", {
-    className: classNames('ffe-collapse__inner', {
-      'ffe-collapse__inner--visible': overflowVisible
-    })
-  }, children));
+        return function () {
+            if (collapse) {
+                collapse.removeEventListener('transitionstart', handleTransitionStart);
+                collapse.removeEventListener('transitionend', handleTransitionEnd);
+            }
+        };
+    }, [isOpen, onRest]);
+    return (React.createElement("div", __assign({}, rest, { ref: mergeRefs([internalRef, ref]), className: classNames('ffe-collapse', className, {
+            'ffe-collapse--open': isOpen,
+            'ffe-collapse--hidden': isHidden,
+        }) }),
+        React.createElement("div", { className: classNames('ffe-collapse__inner', {
+                'ffe-collapse__inner--visible': overflowVisible,
+            }) }, children)));
 });
-Collapse.displayName = 'Collapse';
-Collapse.propTypes = {
-  className: string,
-  isOpen: bool,
-  onRest: func,
-  /** The content to appear when expanded */
-  children: node.isRequired
-};

package/es/index.js

@@ -1 +1 @@
-export { Collapse } from './Collapse';
+export { Collapse } from './Collapse';

package/es/mergeRefs.js

@@ -0,0 +1,13 @@
+export function mergeRefs(refs) {
+    return function (value) {
+        refs.forEach(function (ref) {
+            if (typeof ref === 'function') {
+                ref(value);
+            }
+            else if (ref != null) {
+                // eslint-disable-next-line no-param-reassign
+                ref.current = value;
+            }
+        });
+    };
+}

package/lib/Collapse.js

@@ -1,91 +1,99 @@
 "use strict";
-
-function _typeof(o) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (o) { return typeof o; } : function (o) { return o && "function" == typeof Symbol && o.constructor === Symbol && o !== Symbol.prototype ? "symbol" : typeof o; }, _typeof(o); }
-Object.defineProperty(exports, "__esModule", {
-  value: true
+var __assign = (this && this.__assign) || function () {
+    __assign = Object.assign || function(t) {
+        for (var s, i = 1, n = arguments.length; i < n; i++) {
+            s = arguments[i];
+            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
+                t[p] = s[p];
+        }
+        return t;
+    };
+    return __assign.apply(this, arguments);
+};
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
 });
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __rest = (this && this.__rest) || function (s, e) {
+    var t = {};
+    for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p) && e.indexOf(p) < 0)
+        t[p] = s[p];
+    if (s != null && typeof Object.getOwnPropertySymbols === "function")
+        for (var i = 0, p = Object.getOwnPropertySymbols(s); i < p.length; i++) {
+            if (e.indexOf(p[i]) < 0 && Object.prototype.propertyIsEnumerable.call(s, p[i]))
+                t[p[i]] = s[p[i]];
+        }
+    return t;
+};
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
 exports.Collapse = void 0;
-var _react = _interopRequireWildcard(require("react"));
-var _propTypes = require("prop-types");
-var _classnames = _interopRequireDefault(require("classnames"));
-var _excluded = ["className", "isOpen", "onRest", "children"];
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
-function _getRequireWildcardCache(e) { if ("function" != typeof WeakMap) return null; var r = new WeakMap(), t = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(e) { return e ? t : r; })(e); }
-function _interopRequireWildcard(e, r) { if (!r && e && e.__esModule) return e; if (null === e || "object" != _typeof(e) && "function" != typeof e) return { default: e }; var t = _getRequireWildcardCache(r); if (t && t.has(e)) return t.get(e); var n = { __proto__: null }, a = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var u in e) if ("default" !== u && {}.hasOwnProperty.call(e, u)) { var i = a ? Object.getOwnPropertyDescriptor(e, u) : null; i && (i.get || i.set) ? Object.defineProperty(n, u, i) : n[u] = e[u]; } return n.default = e, t && t.set(e, n), n; }
-function _extends() { _extends = Object.assign ? Object.assign.bind() : function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
-function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
-function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
-function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
-function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
-function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
-function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } } return target; }
-var Collapse = exports.Collapse = /*#__PURE__*/_react.default.forwardRef(function (_ref, ref) {
-  var className = _ref.className,
-    isOpen = _ref.isOpen,
-    onRest = _ref.onRest,
-    children = _ref.children,
-    rest = _objectWithoutProperties(_ref, _excluded);
-  var internalRef = (0, _react.useRef)();
-  var collapse = ref !== null && ref !== void 0 ? ref : internalRef;
-  var _useState = (0, _react.useState)(!isOpen),
-    _useState2 = _slicedToArray(_useState, 2),
-    isHidden = _useState2[0],
-    setIsHidden = _useState2[1];
-  var _useState3 = (0, _react.useState)(!!isOpen),
-    _useState4 = _slicedToArray(_useState3, 2),
-    overflowVisible = _useState4[0],
-    setOverflowVisible = _useState4[1];
-  (0, _react.useEffect)(function () {
-    var _collapse = collapse;
-    var handleTransition = function handleTransition(startOrEnd) {
-      return function (e) {
-        if (e.target === collapse.current && e.propertyName === 'grid-template-rows') {
-          setIsHidden(!isOpen);
-          if (startOrEnd === 'start') {
-            setOverflowVisible(false);
-          } else {
-            if (isOpen) {
-              setOverflowVisible(true);
-            }
-            if (onRest) {
-              onRest();
+var react_1 = __importStar(require("react"));
+var classnames_1 = __importDefault(require("classnames"));
+var mergeRefs_1 = require("./mergeRefs");
+exports.Collapse = react_1.default.forwardRef(function (_a, ref) {
+    var className = _a.className, isOpen = _a.isOpen, onRest = _a.onRest, children = _a.children, rest = __rest(_a, ["className", "isOpen", "onRest", "children"]);
+    var internalRef = (0, react_1.useRef)(null);
+    var _b = (0, react_1.useState)(!isOpen), isHidden = _b[0], setIsHidden = _b[1];
+    var _c = (0, react_1.useState)(isOpen), overflowVisible = _c[0], setOverflowVisible = _c[1];
+    (0, react_1.useEffect)(function () {
+        var handleTransition = function (startOrEnd) { return function (e) {
+            if (e.target === internalRef.current &&
+                e.propertyName === 'grid-template-rows') {
+                setIsHidden(!isOpen);
+                if (startOrEnd === 'start') {
+                    setOverflowVisible(false);
+                }
+                else {
+                    if (isOpen) {
+                        setOverflowVisible(true);
+                    }
+                    if (onRest) {
+                        onRest();
+                    }
+                }
             }
-          }
+        }; };
+        var handleTransitionStart = handleTransition('start');
+        var handleTransitionEnd = handleTransition('end');
+        var collapse = internalRef.current;
+        if (collapse) {
+            collapse.addEventListener('transitionstart', handleTransitionStart);
+            collapse.addEventListener('transitionend', handleTransitionEnd);
         }
-      };
-    };
-    var handleTransitionStart = handleTransition('start');
-    var handleTransitionEnd = handleTransition('end');
-    if (_collapse.current) {
-      _collapse.current.addEventListener('transitionstart', handleTransitionStart);
-      _collapse.current.addEventListener('transitionend', handleTransitionEnd);
-    }
-    return function () {
-      if (_collapse.current) {
-        _collapse.current.removeEventListener('transitionstart', handleTransitionStart);
-        _collapse.current.removeEventListener('transitionend', handleTransitionEnd);
-      }
-    };
-  }, [collapse, isOpen, onRest]);
-  return /*#__PURE__*/_react.default.createElement("div", _extends({}, rest, {
-    ref: collapse,
-    className: (0, _classnames.default)('ffe-collapse', className, {
-      'ffe-collapse--open': isOpen,
-      'ffe-collapse--hidden': isHidden
-    })
-  }), /*#__PURE__*/_react.default.createElement("div", {
-    className: (0, _classnames.default)('ffe-collapse__inner', {
-      'ffe-collapse__inner--visible': overflowVisible
-    })
-  }, children));
+        return function () {
+            if (collapse) {
+                collapse.removeEventListener('transitionstart', handleTransitionStart);
+                collapse.removeEventListener('transitionend', handleTransitionEnd);
+            }
+        };
+    }, [isOpen, onRest]);
+    return (react_1.default.createElement("div", __assign({}, rest, { ref: (0, mergeRefs_1.mergeRefs)([internalRef, ref]), className: (0, classnames_1.default)('ffe-collapse', className, {
+            'ffe-collapse--open': isOpen,
+            'ffe-collapse--hidden': isHidden,
+        }) }),
+        react_1.default.createElement("div", { className: (0, classnames_1.default)('ffe-collapse__inner', {
+                'ffe-collapse__inner--visible': overflowVisible,
+            }) }, children)));
 });
-Collapse.displayName = 'Collapse';
-Collapse.propTypes = {
-  className: _propTypes.string,
-  isOpen: _propTypes.bool,
-  onRest: _propTypes.func,
-  /** The content to appear when expanded */
-  children: _propTypes.node.isRequired
-};

package/lib/index.js

@@ -1,12 +1,5 @@
 "use strict";
-
-Object.defineProperty(exports, "__esModule", {
-  value: true
-});
-Object.defineProperty(exports, "Collapse", {
-  enumerable: true,
-  get: function get() {
-    return _Collapse.Collapse;
-  }
-});
-var _Collapse = require("./Collapse");
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Collapse = void 0;
+var Collapse_1 = require("./Collapse");
+Object.defineProperty(exports, "Collapse", { enumerable: true, get: function () { return Collapse_1.Collapse; } });

package/lib/mergeRefs.js

@@ -0,0 +1,17 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.mergeRefs = void 0;
+function mergeRefs(refs) {
+    return function (value) {
+        refs.forEach(function (ref) {
+            if (typeof ref === 'function') {
+                ref(value);
+            }
+            else if (ref != null) {
+                // eslint-disable-next-line no-param-reassign
+                ref.current = value;
+            }
+        });
+    };
+}
+exports.mergeRefs = mergeRefs;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@sb1/ffe-collapse-react",
-    "version": "3.0.7",
+    "version": "4.0.1",
     "description": "React component for expand/collapse",
     "keywords": [
         "ffe"
@@ -22,21 +22,20 @@
         "url": "ssh://git@github.com:SpareBank1/designsystem.git"
     },
     "scripts": {
-        "build": "ffe-buildtool babel",
+        "build": "ffe-buildtool tsc",
         "watch": "ffe-buildtool babel-watch",
-        "lint": "eslint src",
-        "lint:fix": "eslint src --fix",
+        "lint": "eslint src --ext ts,tsx",
+        "lint:fix": "eslint src --fix --ext ts,tsx",
         "test": "ffe-buildtool jest",
         "test:watch": "ffe-buildtool jest --watch"
     },
     "dependencies": {
-        "@sb1/ffe-core": "^27.3.10",
+        "@sb1/ffe-core": "^27.3.11",
         "classnames": "^2.3.1"
     },
     "devDependencies": {
-        "@sb1/ffe-buildtool": "^0.6.0",
+        "@sb1/ffe-buildtool": "^0.6.1",
         "eslint": "^8.57.0",
-        "prop-types": "^15.7.2",
         "react": "^16.9.0",
         "react-dom": "^16.9.0"
     },
@@ -46,5 +45,5 @@
     "publishConfig": {
         "access": "public"
     },
-    "gitHead": "9ad9c4e14ec0db89189e0daaebace3028bf667d9"
+    "gitHead": "12285ee4ecea525ee235bc88aee2ffe38c32f0d1"
 }

package/types/Collapse.d.ts

@@ -0,0 +1,6 @@
+import React, { ComponentPropsWithRef } from 'react';
+export interface CollapseProps extends ComponentPropsWithRef<'div'> {
+    isOpen: boolean;
+    onRest?: () => void;
+}
+export declare const Collapse: React.ForwardRefExoticComponent<Omit<CollapseProps, "ref"> & React.RefAttributes<HTMLDivElement>>;

package/types/index.d.ts

@@ -1,10 +1 @@
-import * as React from 'react';
-
-export interface CollapseProps extends React.ComponentProps<'div'> {
-    isOpen: boolean;
-    onRest?: () => void;
-}
-
-declare class Collapse extends React.Component<CollapseProps, any> {}
-
-export { Collapse };
+export { Collapse, CollapseProps } from './Collapse';

package/types/mergeRefs.d.ts

@@ -0,0 +1,2 @@
+import React from 'react';
+export declare function mergeRefs<T = any>(refs: Array<React.MutableRefObject<T> | React.LegacyRef<T> | undefined | null>): React.RefCallback<T>;