feat(Popup): Expose Popup's content Ref

CHANGELOG.md

@@ -28,6 +28,7 @@ This project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.htm
 - Export `arrow-up`,`arrow-down` and `chat` SVG icon @VyshnaviDasari ([#873](https://github.com/stardust-ui/react/pull/873))
 - Export `FocusZone`'s utilities @sophieH29 ([#876](https://github.com/stardust-ui/react/pull/876))
 - Add `clearable` prop for `Dropdown` @layershifter ([#885](https://github.com/stardust-ui/react/pull/885))
+- Expose `Popup`'s content Ref @sophieH29 ([#913](https://github.com/stardust-ui/react/pull/913))
 
 ### Fixes
 - Properly handle falsy values provided as `Flex` and `Flex.Item` children @kuzhelov ([#890](https://github.com/stardust-ui/react/pull/890))

packages/react/src/components/Popup/Popup.tsx

@@ -15,6 +15,8 @@ import {
   StyledComponentProps,
   commonPropTypes,
   isFromKeyboard,
+  customPropTypes,
+  handleRef,
 } from '../../lib'
 import { ComponentEventHandler, ReactProps, ShorthandValue } from '../../types'
 
@@ -108,6 +110,9 @@ export interface PopupProps
 
   /** Element to be rendered in-place where the popup is defined. */
   trigger?: JSX.Element
+
+  /** Ref for Popup content DOM node. */
+  contentRef?: React.Ref<HTMLElement>
 }
 
 export interface PopupState {
@@ -149,6 +154,7 @@ export default class Popup extends AutoControlledComponent<ReactProps<PopupProps
     renderContent: PropTypes.func,
     target: PropTypes.any,
     trigger: PropTypes.any,
+    contentRef: customPropTypes.ref,
   }
 
   public static defaultProps: PopupProps = {
@@ -428,7 +434,7 @@ export default class Popup extends AutoControlledComponent<ReactProps<PopupProps
     // https://popper.js.org/popper-documentation.html#Popper.scheduleUpdate
     { ref, scheduleUpdate, style: popupPlacementStyles }: PopperChildrenProps,
   ) => {
-    const { content: propsContent, renderContent } = this.props
+    const { content: propsContent, renderContent, contentRef } = this.props
     const content = renderContent ? renderContent(scheduleUpdate) : propsContent
 
     const popupWrapperAttributes = {
@@ -464,6 +470,7 @@ export default class Popup extends AutoControlledComponent<ReactProps<PopupProps
         innerRef={domElement => {
           ref(domElement)
           this.popupDomElement = domElement
+          handleRef(contentRef, domElement)
         }}
       >
         {accessibility.focusTrap ? (