Browse Source

Get rid of unused renderContent prop on PopperController

Dominik Prokop 7 years ago
parent
commit
977d53c8c9

+ 4 - 4
packages/grafana-ui/src/components/Tooltip/Popper.tsx

@@ -3,6 +3,7 @@ import * as PopperJS from 'popper.js';
 import { Manager, Popper as ReactPopper } from 'react-popper';
 import { Manager, Popper as ReactPopper } from 'react-popper';
 import { Portal } from '@grafana/ui';
 import { Portal } from '@grafana/ui';
 import Transition from 'react-transition-group/Transition';
 import Transition from 'react-transition-group/Transition';
+import { PopperContent } from './PopperController';
 
 
 const defaultTransitionStyles = {
 const defaultTransitionStyles = {
   transition: 'opacity 200ms linear',
   transition: 'opacity 200ms linear',
@@ -17,17 +18,16 @@ const transitionStyles: { [key: string]: object } = {
 };
 };
 
 
 interface Props extends React.HTMLAttributes<HTMLDivElement> {
 interface Props extends React.HTMLAttributes<HTMLDivElement> {
-  renderContent: (content: any) => any;
   show: boolean;
   show: boolean;
   placement?: PopperJS.Placement;
   placement?: PopperJS.Placement;
-  content: string | ((props: any) => JSX.Element);
+  content: PopperContent;
   referenceElement: PopperJS.ReferenceObject;
   referenceElement: PopperJS.ReferenceObject;
   arrowClassName?: string;
   arrowClassName?: string;
 }
 }
 
 
 class Popper extends PureComponent<Props> {
 class Popper extends PureComponent<Props> {
   render() {
   render() {
-    const { renderContent, show, placement, onMouseEnter, onMouseLeave, className, arrowClassName } = this.props;
+    const { show, placement, onMouseEnter, onMouseLeave, className, arrowClassName } = this.props;
     const { content } = this.props;
     const { content } = this.props;
 
 
     return (
     return (
@@ -56,7 +56,7 @@ class Popper extends PureComponent<Props> {
                       className={`popper`}
                       className={`popper`}
                     >
                     >
                       <div className={className}>
                       <div className={className}>
-                        {renderContent(content)}
+                        {content}
                         <div
                         <div
                           ref={arrowProps.ref}
                           ref={arrowProps.ref}
                           style={{ ...arrowProps.style }}
                           style={{ ...arrowProps.style }}

+ 2 - 15
packages/grafana-ui/src/components/Tooltip/PopperController.tsx

@@ -1,14 +1,13 @@
 import React from 'react';
 import React from 'react';
 import * as PopperJS from 'popper.js';
 import * as PopperJS from 'popper.js';
 
 
-type PopperContent = string | (() => JSX.Element);
+export type PopperContent = string | JSX.Element;
 
 
 export interface UsingPopperProps {
 export interface UsingPopperProps {
   show?: boolean;
   show?: boolean;
   placement?: PopperJS.Placement;
   placement?: PopperJS.Placement;
   content: PopperContent;
   content: PopperContent;
   children: JSX.Element;
   children: JSX.Element;
-  renderContent?: (content: PopperContent) => JSX.Element;
 }
 }
 
 
 type PopperControllerRenderProp = (
 type PopperControllerRenderProp = (
@@ -17,8 +16,7 @@ type PopperControllerRenderProp = (
   popperProps: {
   popperProps: {
     show: boolean;
     show: boolean;
     placement: PopperJS.Placement;
     placement: PopperJS.Placement;
-    content: string | ((props: any) => JSX.Element);
-    renderContent: (content: any) => any;
+    content: PopperContent;
   }
   }
 ) => JSX.Element;
 ) => JSX.Element;
 
 
@@ -69,16 +67,6 @@ class PopperController extends React.Component<Props, State> {
     }));
     }));
   };
   };
 
 
-  renderContent(content: PopperContent) {
-
-    if (typeof content === 'function') {
-      // If it's a function we assume it's a React component
-      const ReactComponent = content;
-      return <ReactComponent />;
-    }
-    return content;
-  }
-
   render() {
   render() {
     const { children, content } = this.props;
     const { children, content } = this.props;
     const { show, placement } = this.state;
     const { show, placement } = this.state;
@@ -87,7 +75,6 @@ class PopperController extends React.Component<Props, State> {
       show,
       show,
       placement,
       placement,
       content,
       content,
-      renderContent: this.renderContent,
     });
     });
   }
   }
 }
 }

+ 1 - 1
packages/grafana-ui/src/components/Tooltip/Tooltip.tsx

@@ -12,7 +12,7 @@ export enum Themes {
 interface TooltipProps extends UsingPopperProps {
 interface TooltipProps extends UsingPopperProps {
   theme?: Themes;
   theme?: Themes;
 }
 }
-export const Tooltip = ({ children, renderContent, theme, ...controllerProps }: TooltipProps) => {
+export const Tooltip = ({ children, theme, ...controllerProps }: TooltipProps) => {
   const tooltipTriggerRef = createRef<PopperJS.ReferenceObject>();
   const tooltipTriggerRef = createRef<PopperJS.ReferenceObject>();
   const popperBackgroundClassName = 'popper__background' + (theme ? ' ' + theme : '');
   const popperBackgroundClassName = 'popper__background' + (theme ? ' ' + theme : '');