diff --git a/src/components/accordion/accordion.tsx b/src/components/accordion/accordion.tsx index d186a349bb3..a6aaef40aa5 100644 --- a/src/components/accordion/accordion.tsx +++ b/src/components/accordion/accordion.tsx @@ -182,6 +182,14 @@ export class EuiAccordionClass extends Component< generatedId = htmlIdGenerator()(); + // Storing resize/observer refs as an instance variable is a performance optimization + // and also resolves https://github.com/elastic/eui/issues/5903 + resizeRef: (e: HTMLElement | null) => void = () => {}; + observerRef = (ref: HTMLDivElement) => { + this.setChildContentRef(ref); + this.resizeRef(ref); + }; + render() { const { children, @@ -384,18 +392,16 @@ export class EuiAccordionClass extends Component< id={id} > - {(resizeRef) => ( -
{ - this.setChildContentRef(ref); - resizeRef(ref); - }} - > -
- {childrenContent} + {(resizeRef) => { + this.resizeRef = resizeRef; + return ( +
+
+ {childrenContent} +
-
- )} + ); + }}
diff --git a/upcoming_changelogs/6031.md b/upcoming_changelogs/6031.md new file mode 100644 index 00000000000..fbbab0892cd --- /dev/null +++ b/upcoming_changelogs/6031.md @@ -0,0 +1,3 @@ +**Bug fixes** + +- Fixed drag and drop interactions on EuiAccordion elements