import React from 'react' ; import { createHook , useMountLayout , useLocalRef } from '@workday/canvas-kit-react/common' ; import { OverflowModel } from './useOverflowModel' ; const hiddenStyle = { position : 'absolute' , left : - 99999 , } ; export const useOverflowTarget = createHook ( ( model , ref ? ) => { const { elementRef , localRef } = useLocalRef ( ref ) ; const firstRender = React . useRef ( true ) ; useMountLayout ( ( ) => { firstRender . current = false ; if ( localRef . current ) { const styles = getComputedStyle ( localRef . current ) ; model . events . setOverflowTargetWidth ( { width : localRef . current . offsetWidth + parseFloat ( styles . marginLeft ) + parseFloat ( styles . marginRight ) , } ) ; } } ) ; const isHidden = ! model . state . hiddenIds . length ; return { ref : elementRef , 'aria-hidden' : isHidden , tabIndex : isHidden ? - 1 : 0 , style : isHidden ? hiddenStyle : { } , } ; } ) ;