Working

src/core/client/stream/components/Comment/Comment.tsx

@@ -27,8 +27,8 @@ const Comment: StatelessComponent<CommentProps> = props => {
       <Typography>{props.body}</Typography>
       <div>
         <Popover body={<PermalinkPopover commentId={props.id} />}>
-          {({ toggleShow }) => (
-            <button onClick={toggleShow}>
+          {({ toggleShow, ref }) => (
+            <button onClick={toggleShow} style={{ color: "red" }} ref={ref}>
               <Localized id="comments-permalink-share">
                 <span>Share</span>
               </Localized>

src/core/client/stream/components/PermalinkPopover.tsx

@@ -1,13 +1,14 @@
 import { Localized } from "fluent-react/compat";
 import React, { CSSProperties } from "react";
 import CopyToClipboard from "react-copy-to-clipboard";
+import { RefHandler } from "react-popper";
 import { Button, TextField } from "talk-ui/components";
 import * as styles from "./PermalinkPopover.css";
 
 interface InnerProps {
   commentId: string;
-  ref?: any;
   style?: CSSProperties;
+  innerRef?: RefHandler;
 }
 
 interface State {
@@ -33,11 +34,10 @@ class PermalinkPopover extends React.Component<InnerProps> {
   };
 
   public render() {
-    const { commentId, ref, style } = this.props;
+    const { commentId, style, innerRef } = this.props;
     const { copied } = this.state;
-
     return (
-      <div className={styles.root} ref={ref} style={style}>
+      <div className={styles.root} style={style} ref={innerRef}>
         <TextField defaultValue={commentId} className={styles.textField} />
         <CopyToClipboard text={commentId} onCopy={this.onCopy}>
           <Button primary>

src/core/client/ui/components/Attachment/Attachment.tsx

@@ -30,6 +30,7 @@ interface InnerProps {
 
 interface Props {
   ref: any;
+  style: CSSProperties;
 }
 
 class Attachment extends React.Component<InnerProps> {
@@ -44,11 +45,11 @@ class Attachment extends React.Component<InnerProps> {
           eventsEnabled
           positionFixed={false}
         >
-          {({ ref, style }) =>
+          {(props: Props) =>
             body
               ? React.cloneElement(body, {
-                  ref,
-                  style,
+                  innerRef: props.ref,
+                  style: props.style,
                 })
               : null
           }