diff --git a/src/components/basic_table/basic_table.tsx b/src/components/basic_table/basic_table.tsx index 9ba13b002dd..deb089be3b8 100644 --- a/src/components/basic_table/basic_table.tsx +++ b/src/components/basic_table/basic_table.tsx @@ -349,10 +349,6 @@ export class EuiBasicTable extends Component< return null; } - // used for moving in & out of `loading` state - private cleanups: Array<() => void> = []; - private tbody: HTMLTableSectionElement | null = null; - constructor(props: EuiBasicTableProps) { super(props); this.state = { @@ -363,25 +359,13 @@ export class EuiBasicTable extends Component< } componentDidMount() { - if (this.props.loading && this.tbody) this.addLoadingListeners(this.tbody); this.getInitialSelection(); } - componentDidUpdate(prevProps: EuiBasicTableProps) { - if (prevProps.loading !== this.props.loading) { - if (this.props.loading && this.tbody) { - this.addLoadingListeners(this.tbody); - } else { - this.removeLoadingListeners(); - } - } + componentDidUpdate() { this.getInitialSelection(); } - componentWillUnmount() { - this.removeLoadingListeners(); - } - getInitialSelection() { if ( this.props.selection && @@ -398,49 +382,6 @@ export class EuiBasicTable extends Component< this.changeSelection(newSelection); } - private setTbody = (tbody: HTMLTableSectionElement | null) => { - // remove listeners from an existing element - this.removeLoadingListeners(); - - // update the ref - this.tbody = tbody; - - // if loading, add listeners - if (this.props.loading === true && tbody) { - this.addLoadingListeners(tbody); - } - }; - - private addLoadingListeners = (tbody: HTMLTableSectionElement) => { - const listener = (event: Event) => { - event.stopPropagation(); - event.preventDefault(); - }; - [ - 'mousedown', - 'mouseup', - 'mouseover', - 'mouseout', - 'mouseenter', - 'mouseleave', - 'click', - 'dblclick', - 'keydown', - 'keyup', - 'keypress', - ].forEach((event) => { - tbody.addEventListener(event, listener, true); - this.cleanups.push(() => { - tbody.removeEventListener(event, listener, true); - }); - }); - }; - - private removeLoadingListeners = () => { - this.cleanups.forEach((cleanup) => cleanup()); - this.cleanups.length = 0; - }; - buildCriteria(props: EuiBasicTableProps): Criteria { const criteria: Criteria = {}; if (hasPagination(props)) { @@ -969,10 +910,7 @@ export class EuiBasicTable extends Component< return ( {(theme) => ( - + {content} )} diff --git a/upcoming_changelogs/6543.md b/upcoming_changelogs/6543.md new file mode 100644 index 00000000000..73c773ec6f2 --- /dev/null +++ b/upcoming_changelogs/6543.md @@ -0,0 +1,3 @@ +**Breaking changes** + +- `EuiBasicTable` no longer blocks mouse/keyboard interactions while `loading`