diff --git a/packages/hooks/src/utils/dom.ts b/packages/hooks/src/utils/dom.ts new file mode 100644 index 0000000000..4cee0493e1 --- /dev/null +++ b/packages/hooks/src/utils/dom.ts @@ -0,0 +1,25 @@ +/** + * Thx rc-util + * copied from https://github.com/react-component/util/blob/v5.44.3/src/Dom/findDOMNode.ts#L4-L23 + */ + +export function isDOM(node: any): node is HTMLElement | SVGElement { + // https://developer.mozilla.org/en-US/docs/Web/API/Element + // Since XULElement is also subclass of Element, we only need HTMLElement and SVGElement + return node instanceof HTMLElement || node instanceof SVGElement; +} + +/** + * Retrieves a DOM node via a ref, and does not invoke `findDOMNode`. + */ +export function getDOM(node: any): HTMLElement | SVGElement | null { + if (node && typeof node === 'object' && isDOM(node.nativeElement)) { + return node.nativeElement; + } + + if (isDOM(node)) { + return node as any; + } + + return null; +} diff --git a/packages/hooks/src/utils/domTarget.ts b/packages/hooks/src/utils/domTarget.ts index b7de1f628b..a63b0b677d 100644 --- a/packages/hooks/src/utils/domTarget.ts +++ b/packages/hooks/src/utils/domTarget.ts @@ -1,6 +1,7 @@ import type { MutableRefObject } from 'react'; import { isFunction } from './index'; import isBrowser from './isBrowser'; +import { getDOM } from './dom'; type TargetValue = T | undefined | null; @@ -30,5 +31,5 @@ export function getTargetElement(target: BasicTarget, d targetElement = target; } - return targetElement; + return getDOM(targetElement) }