diff --git a/components/lib/floatlabel/FloatLabel.js b/components/lib/floatlabel/FloatLabel.js index 5390c1a96a..4263c11725 100644 --- a/components/lib/floatlabel/FloatLabel.js +++ b/components/lib/floatlabel/FloatLabel.js @@ -2,22 +2,28 @@ import * as React from 'react'; import { PrimeReactContext } from '../api/Api'; import { useHandleStyle } from '../componentbase/ComponentBase'; import { useMergeProps } from '../hooks/Hooks'; -import { classNames } from '../utils/Utils'; +import { classNames, ObjectUtils } from '../utils/Utils'; import { FloatLabelBase } from './FloatLabelBase'; export const FloatLabel = React.memo( - React.forwardRef((inProps) => { + React.forwardRef((inProps, ref) => { const mergeProps = useMergeProps(); const context = React.useContext(PrimeReactContext); const props = FloatLabelBase.getProps(inProps, context); + const elementRef = React.useRef(ref); const { ptm, cx, isUnstyled } = FloatLabelBase.setMetaData({ props }); useHandleStyle(FloatLabelBase.css.styles, isUnstyled, { name: 'floatlabel' }); + React.useEffect(() => { + ObjectUtils.combinedRefs(elementRef, ref); + }, [elementRef, ref]); + const rootProps = mergeProps( { + ref: elementRef, className: classNames(cx('root')) }, FloatLabelBase.getOtherProps(props), diff --git a/components/lib/stepperpanel/StepperPanel.js b/components/lib/stepperpanel/StepperPanel.js index c8c47e18e1..cbc39232d4 100644 --- a/components/lib/stepperpanel/StepperPanel.js +++ b/components/lib/stepperpanel/StepperPanel.js @@ -1,19 +1,25 @@ import * as React from 'react'; import { PrimeReactContext } from '../api/Api'; import { useHandleStyle } from '../componentbase/ComponentBase'; +import { ObjectUtils } from '../utils/Utils'; import { StepperPanelBase } from './StepperPanelBase'; export const StepperPanel = React.memo( - React.forwardRef((inProps) => { + React.forwardRef((inProps, ref) => { const context = React.useContext(PrimeReactContext); const props = StepperPanelBase.getProps(inProps, context); + const elementRef = React.useRef(ref); const { isUnstyled } = StepperPanelBase.setMetaData({ props }); useHandleStyle(StepperPanelBase.css.styles, isUnstyled, { name: 'StepperPanel' }); - return <>{props.children}; + React.useEffect(() => { + ObjectUtils.combinedRefs(elementRef, ref); + }, [elementRef, ref]); + + return {props.children}; }) );