Updated mount point for modal

i-rocky · i-rocky · commit 030be1623274 · 2018-05-23T10:14:21.000+06:00
diff --git a/index.html b/index.html
@@ -9,7 +9,10 @@
 </head>
 <body>
 <button onclick="openFileManager(callback)">Open File Manager</button>
-<div class="app"></div>
+<div class="app">
+    <p>Hello</p>
+</div>
+<p>Hello</p>
 <script src="dist/build.js"></script>
 <script>
     function callback(list) {
diff --git a/src/core/file-manager.jsx b/src/core/file-manager.jsx
@@ -26,6 +26,10 @@ const FileManager = class FileManager extends Component {
     this.store.server = props.server;
   }
 
+  setMountPoint = dom_el => {
+    this.store.mount_point = dom_el;
+  };
+
   openFileManager = (cb, config) => {
     this.store.openFileManager(cb, config);
   };
@@ -51,6 +55,7 @@ const FileManager = class FileManager extends Component {
           footer={null}
           onCancel={this.handleCancel}
           width={window.innerWidth/1.5}
+          getContainer={this.store.mount_point}
         >
           {this.store.tabs.length ? <Tabs defaultActiveKey={this.store.tabs[0].hook} prefixCls="qxui-tabs">
             {this.store.tabs
diff --git a/src/core/store.js b/src/core/store.js
@@ -24,6 +24,7 @@ const FILTERS = ["image", "video", "dir", "icon"];
 
 export default class FMStore {
   config = observable({
+    mount_point: null,
     //components and hard coded core data
     plugins: {
       new_dir: {
@@ -206,6 +207,10 @@ export default class FMStore {
     this.config.data.server = server;
   };
 
+  set mount_point(dom_el) {
+    this.config.mount_point = dom_el;
+  };
+
   setCallback = callback => {
     this.config.data.callback = callback;
   };
@@ -256,6 +261,10 @@ export default class FMStore {
     return this.config.data.callback;
   }
 
+  get mount_point() {
+    return () => this.config.mount_point;
+  }
+
   //all core information
   get data() {
     return this.config.data;
diff --git a/src/index.js b/src/index.js
@@ -18,6 +18,8 @@ export default function (server, dom) {
 
     const file_manager = render(FMElement, fm_div);
 
+    file_manager.setMountPoint(fm_div);
+
     window.ReactFileManager.registerPlugin = file_manager.registerPlugin;
     window.ReactFileManager.openFileManager = file_manager.openFileManager;
 
