add getPopupContainer prop (#12)

Author: vijayst

README.md

@@ -80,6 +80,7 @@ React.render(<Demo />, container);
 | onSearch | Trigger when prefix hit | (text: string, prefix: string) => void | - |
 | onFocus | Trigger when mentions get focus | React.FocusEventHandler<HTMLTextAreaElement> | - |
 | onBlur | Trigger when mentions lose focus | React.FocusEventHandler<HTMLTextAreaElement> | - |
+| getPopupContainer | DOM Container for suggestions | () => HTMLElement | - |
 
 ### Methods
 

src/KeywordTrigger.tsx

@@ -31,6 +31,7 @@ interface KeywordTriggerProps {
   placement?: Placement;
   visible?: boolean;
   transitionName?: string;
+  getPopupContainer?: () => HTMLElement;
 }
 
 class KeywordTrigger extends React.Component<KeywordTriggerProps, {}> {
@@ -42,7 +43,7 @@ class KeywordTrigger extends React.Component<KeywordTriggerProps, {}> {
   };
 
   public render() {
-    const { children, visible, placement, transitionName } = this.props;
+    const { children, visible, placement, transitionName, getPopupContainer } = this.props;
 
     const popupElement = this.getDropdownElement();
 
@@ -54,6 +55,7 @@ class KeywordTrigger extends React.Component<KeywordTriggerProps, {}> {
         popupPlacement={placement === 'top' ? 'topRight' : 'bottomRight'}
         popupTransitionName={transitionName}
         builtinPlacements={BUILT_IN_PLACEMENTS}
+        getPopupContainer={getPopupContainer}
       >
         {children}
       </Trigger>

src/Mentions.tsx

@@ -43,6 +43,7 @@ export interface MentionsProps extends BaseTextareaAttrs {
   onSearch?: (text: string, prefix: string) => void;
   onFocus?: React.FocusEventHandler<HTMLTextAreaElement>;
   onBlur?: React.FocusEventHandler<HTMLTextAreaElement>;
+  getPopupContainer?: () => HTMLElement;
 }
 interface MentionsState {
   value: string;
@@ -330,6 +331,7 @@ class Mentions extends React.Component<MentionsProps, MentionsState> {
       style,
       autoFocus,
       notFoundContent,
+      getPopupContainer,
       ...restProps
     } = this.props;
 
@@ -379,6 +381,7 @@ class Mentions extends React.Component<MentionsProps, MentionsState> {
                 placement={placement}
                 options={options}
                 visible
+                getPopupContainer={getPopupContainer}
               >
                 <span>{measurePrefix}</span>
               </KeywordTrigger>