diff --git a/package-lock.json b/package-lock.json
index 7b4fdd248..76597c7e3 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -44,6 +44,7 @@
         "netflux-websocket": "^1.0.0",
         "notp": "^2.0.3",
         "nthen": "0.1.8",
+        "onlyoffice-api": "file:../onlyoffice-api",
         "open-sans-fontface": "^1.4.0",
         "openid-client": "^5.4.2",
         "pako": "^2.1.0",
@@ -73,6 +74,13 @@
         "url": "https://opencollective.com/cryptpad"
       }
     },
+    "../onlyoffice-api": {
+      "version": "0.0.1",
+      "license": "AGPL-3.0-or-later",
+      "devDependencies": {
+        "parcel": "^2.12.0"
+      }
+    },
     "node_modules/@aashutoshrathi/word-wrap": {
       "version": "1.2.6",
       "resolved": "https://registry.npmjs.org/@aashutoshrathi/word-wrap/-/word-wrap-1.2.6.tgz",
@@ -4099,6 +4107,10 @@
         "wrappy": "1"
       }
     },
+    "node_modules/onlyoffice-api": {
+      "resolved": "../onlyoffice-api",
+      "link": true
+    },
     "node_modules/open-sans-fontface": {
       "version": "1.4.0",
       "resolved": "https://registry.npmjs.org/open-sans-fontface/-/open-sans-fontface-1.4.0.tgz",
diff --git a/package.json b/package.json
index 7212e1465..bc1fd9e96 100644
--- a/package.json
+++ b/package.json
@@ -47,6 +47,7 @@
     "netflux-websocket": "^1.0.0",
     "notp": "^2.0.3",
     "nthen": "0.1.8",
+    "onlyoffice-api": "file:../onlyoffice-api",
     "open-sans-fontface": "^1.4.0",
     "openid-client": "^5.4.2",
     "pako": "^2.1.0",
@@ -98,5 +99,7 @@
     "clear": "node scripts/clear.js",
     "installtoken": "node scripts/install.js"
   },
-  "browserslist": ["> 0.5%, last 2 versions, Firefox ESR, not dead, not op_mini all"]
+  "browserslist": [
+    "> 0.5%, last 2 versions, Firefox ESR, not dead, not op_mini all"
+  ]
 }
diff --git a/scripts/copy-components.js b/scripts/copy-components.js
index bba138518..bc3c9621d 100644
--- a/scripts/copy-components.js
+++ b/scripts/copy-components.js
@@ -46,7 +46,8 @@ Fse.rmSync(oldComponentsPath, { recursive: true, force: true });
     "netflux-websocket",
     "drawio",
     "pako",
-    "x2js"
+    "x2js",
+    "onlyoffice-api"
 ].forEach(l => {
     const source = Path.join("node_modules", l);
     const destination = Path.join(componentsPath, l);
diff --git a/www/common/onlyoffice/inner.js b/www/common/onlyoffice/inner.js
index 1f0c19ae1..69a14505b 100644
--- a/www/common/onlyoffice/inner.js
+++ b/www/common/onlyoffice/inner.js
@@ -25,7 +25,7 @@ define([
     '/common/outer/worker-channel.js',
     '/common/outer/x2t.js',
 
-    '/common/onlyoffice/oo-api.js',
+    '/components/onlyoffice-api/dist/bundle.js',
     '/components/file-saver/FileSaver.min.js',
 
     'css!/components/bootstrap/dist/css/bootstrap.min.css',
@@ -55,6 +55,7 @@ define([
     X2T,
     OOApi)
 {
+    OOApi.helloWorld();
     var saveAs = window.saveAs;
     var Nacl = window.nacl;
     var APP = window.APP = {
diff --git a/www/common/onlyoffice/oo-api.js b/www/common/onlyoffice/oo-api.js
deleted file mode 100644
index 3fa5d33cc..000000000
--- a/www/common/onlyoffice/oo-api.js
+++ /dev/null
@@ -1,93 +0,0 @@
-define([
-    '/common/common-util.js',
-], function(
-    Util
-) {
-    class OnlyOfficeEditor {
-        constructor(placeholderId, config) {
-            let onAppReady;
-
-            this.waitForAppReady = new Promise((resolve) => {
-                onAppReady = resolve;
-            });
-
-            this.waitForAppReady.then(Util.get(config, 'events.onAppReady', Util.noop));
-
-            config = Util.deepAssign(config, {events: {onAppReady}});
-
-            this.editor = new window.DocsAPI.DocEditor(placeholderId, config);
-
-            this.fromOOHandlers = new EventHandlers();
-            this.toOOHandlers = new EventHandlers();
-
-            window.APP = window.APP || {};
-            window.APP.addToOOHandler = (h) => {
-                console.log('XXX addToOOHandler', h);
-                this.toOOHandlers.add(h);
-            };
-        }
-
-        destroyEditor() {
-            this.editor.destroyEditor();
-        }
-
-        getIframe() {
-            return document.querySelector('iframe[name="frameEditor"]');
-        }
-
-        injectCSS(css) {
-            const head = this.getIframe().contentDocument.querySelector('head');
-            const style = document.createElement('style');
-            style.innerText = css;
-            head.appendChild(style);
-        }
-
-        sendMessageToOO(msg) {
-            console.log('XXX sendMessageToOO', msg);
-            this.toOOHandlers.fire(msg);
-        }
-
-        addOnMessageFromOOHandler(onMessage) {
-            this.fromOOHandlers.add(onMessage);
-        }
-    }
-
-    class EventHandlers {
-        constructor() {
-            this.handlers = [];
-            this.queue = [];
-        }
-
-        add(handler) {
-            this.handlers.push(handler);
-            if (this.queue.length > 0) {
-                for (const e of this.queue) {
-                    console.log('XXX queue', ...e);
-                    handler(...e);
-                }
-                this.queue = [];
-            }
-        }
-
-        remove(handler) {
-            const index = this.handlers.indexOf(handler);
-            if (index > -1) {
-                this.handlers.splice(index, 1);
-            }
-        }
-
-        fire(...args) {
-            if (this.handlers.length===0) {
-                console.log('XXX fire no handlers', ...args);
-                this.queue.push(args);
-            }
-            for (const h of this.handlers) {
-                h(...args);
-            }
-        }
-    }
-
-    return {
-        OnlyOfficeEditor
-    };
-});