export const PopOver = ({ children, -----------------------------------------> I get children headerText, bodyText, hasHeader, hasBody, hasFooter, cancelButtonText, okButtonText, hasCloseButton, onOkPress, onCancelPress, ...rest }: PopoverProps): JSX.Element => { return ( <Popover trigger={(triggerProps) => { return <Button {...triggerProps}>Trigger</Button>; //How do I pass trigger props to the children I get??? }} {...rest} >En el código que mencioné anteriormente, quiero devolver niños (this.props.children) en lugar del botón para hacerlo más genérico. algo al equivalente de:
return ( <Popover trigger={(triggerProps) => { return <child {...triggerProps}>Trigger</child>; }} {...rest} >Prueba esto:
<Popover trigger={triggerProps => React.Children.map(children, child => React.isValidElement(child) ? React.cloneElement(child, { ...triggerProps }) : child ) } {...rest} />Referencias: