diff --git a/package.json b/package.json index 7c85cd0b..c60efe4b 100644 --- a/package.json +++ b/package.json @@ -32,7 +32,7 @@ "autobind-decorator": "2.4.0", "blueimp-canvastoblob": "2.1.0", "classnames": "2.2.5", - "dom-helpers": "3.3.1", + "dom-helpers": "5.1.3", "downshift": "3.1.4", "echarts": "^4.1.0", "flv.js": "1.5.0", @@ -76,7 +76,6 @@ "video-react": "0.9.4" }, "devDependencies": { - "@types/dom-helpers": "^3.4.1", "@types/async": "^2.0.45", "@types/classnames": "^2.2.3", "@types/history": "^4.6.0", diff --git a/src/components/Collapse.tsx b/src/components/Collapse.tsx index 16596be4..a1694735 100644 --- a/src/components/Collapse.tsx +++ b/src/components/Collapse.tsx @@ -5,7 +5,7 @@ */ import React from 'react'; -import css = require('dom-helpers/style'); +import css from 'dom-helpers/css'; import {ClassNamesFn, themeable} from '../theme'; import Transition, { EXITED, diff --git a/src/renderers/QuickEdit.tsx b/src/renderers/QuickEdit.tsx index 32ccd5b2..da887f26 100644 --- a/src/renderers/QuickEdit.tsx +++ b/src/renderers/QuickEdit.tsx @@ -14,7 +14,7 @@ import hoistNonReactStatic = require('hoist-non-react-statics'); import onClickOutside from 'react-onclickoutside'; import {Action} from '../types'; import keycode from 'keycode'; -import matches = require('dom-helpers/query/matches'); +import matches from 'dom-helpers/matches'; import Overlay from '../components/Overlay'; import PopOver from '../components/PopOver'; @@ -208,7 +208,12 @@ export const HocQuickEdit = (config: Partial = {}) => ( case 'right': nextTd = current.nextSibling; while (nextTd) { - if (matches(nextTd, `.${ns}Field--quickEditable[tabindex]`)) { + if ( + matches( + nextTd as Element, + `.${ns}Field--quickEditable[tabindex]` + ) + ) { break; } @@ -224,7 +229,7 @@ export const HocQuickEdit = (config: Partial = {}) => ( ); if (nextTd) { - nextTd.focus(); + (nextTd as any).focus(); } } break; diff --git a/src/utils/dom.tsx b/src/utils/dom.tsx index 27f97d92..b8d58bec 100644 --- a/src/utils/dom.tsx +++ b/src/utils/dom.tsx @@ -1,10 +1,11 @@ import React from 'react'; import ReactDOM from 'react-dom'; import hoistNonReactStatic = require('hoist-non-react-statics'); -import domHelperWwnerDocument = require('dom-helpers/ownerDocument'); -import getOffset = require('dom-helpers/query/offset'); -import getPosition = require('dom-helpers/query/position'); -import getScrollTop = require('dom-helpers/query/scrollTop'); +import domOwnerDocument from 'dom-helpers/ownerDocument'; +import css from 'dom-helpers/css'; +import getOffset from 'dom-helpers/offset'; +import getPosition from 'dom-helpers/position'; +import getScrollTop from 'dom-helpers/scrollTop'; const bsMapping: { [propName: string]: string; @@ -55,7 +56,7 @@ export function getContainer(container: any, defaultContainer: any) { } export function ownerDocument(componentOrElement: any) { - return domHelperWwnerDocument(ReactDOM.findDOMNode(componentOrElement)); + return domOwnerDocument(ReactDOM.findDOMNode(componentOrElement) as Element); } function getContainerDimensions(containerNode: any) { @@ -119,6 +120,23 @@ function getLeftDelta( return 0; } +// function position(node: HTMLElement, offsetParent: HTMLElement) { +// const rect = offsetParent.getBoundingClientRect(); +// const rect2 = node.getBoundingClientRect(); +// return { +// width: +// rect2.width - +// (parseInt(css(node, 'borderLeftWidth') || '', 10) || 0) - +// parseInt(css(node, 'borderRightWidth') || '', 10) || 0, +// height: +// rect2.height - +// (parseInt(css(node, 'borderTopWidth') || '', 10) || 0) - +// parseInt(css(node, 'borderBottomWidth') || '', 10) || 0, +// top: rect2.top - rect.top, +// left: rect2.left - rect.left +// }; +// } + export function calculatePosition( placement: any, overlayNode: any,