y-mxgraph 0.5.2 → 0.5.6

package/README.md

@@ -91,7 +91,7 @@ pnpm --filter @y-mxgraph/ws-demo dev     # Start client on port 5174
 
 ## iframe Bridge
 
-`@y-mxgraph/iframe-bridge` enables collaborative editing in iframe-isolated environments. The **server** (parent page) manages the network connection (y-webrtc, y-websocket, etc.) and syncs Y.Doc + Awareness to one or more **providers** (iframe children) via `postMessage`.
+`@y-mxgraph/iframe-bridge` enables collaborative editing in iframe-isolated environments. The **server** (parent page) manages the network connection (y-webrtc, y-websocket, etc.) and syncs Y.Doc + Awareness to **providers** (iframe children) via `postMessage`.
 
 ```text
 ┌─────────────────────────────────────────────────────────────┐
@@ -102,20 +102,18 @@ pnpm --filter @y-mxgraph/ws-demo dev     # Start client on port 5174
 │       │              │                                      │
 │       └──────┬───────┘                                      │
 │              ▼                                              │
-│   createIframeBridgeServer(doc, awareness)                  │
+│   createIframeBridgeServer(iframe, doc, awareness)          │
 │              │ postMessage                                  │
 └──────────────│──────────────────────────────────────────────┘
                │
-    ┌──────────┴──────────┐
-    ▼                     ▼
-┌─────────────┐     ┌─────────────┐
-│ Iframe A    │     │ Iframe B    │
-│ create...   │     │ create...   │
-│ Provider()  │     │ Provider()  │
-│             │     │             │
-│ local Y.Doc │     │ local Y.Doc │
-│ + draw.io   │     │ + draw.io   │
-└─────────────┘     └─────────────┘
+               ▼
+        ┌─────────────┐
+        │   Iframe    │
+        │             │
+        │ local Y.Doc │
+        │ + Awareness │
+        │ + draw.io   │
+        └─────────────┘
 ```
 
 ```ts
@@ -135,8 +133,8 @@ const undoManager = new Y.UndoManager(doc, {
   trackedOrigins: new Set([LOCAL_ORIGIN, IFRAME_ORIGIN]),
 });
 
-const bridge = createIframeBridgeServer(doc, awareness, { undoManager });
-bridge.addIframe(iframeElement, 'child-1');
+// Create bridge server, bound directly to the target iframe
+const bridge = createIframeBridgeServer(iframeElement, doc, awareness, { undoManager });
 
 // Undo/redo from parent page
 document.getElementById('undo-btn')!.onclick = () => {

package/README.zh-CN.md

@@ -53,7 +53,7 @@ App.main((app) => {
 
 ## iframe Bridge
 
-`@y-mxgraph/iframe-bridge` 支持在 iframe 隔离环境中进行协同编辑。**Server**（父页面）管理网络连接（y-webrtc、y-websocket 等），通过 `postMessage` 将 Y.Doc 和 Awareness 同步到一个或多个 **Provider**（iframe 子页面）。
+`@y-mxgraph/iframe-bridge` 支持在 iframe 隔离环境中进行协同编辑。**Server**（父页面）管理网络连接（y-webrtc、y-websocket 等），通过 `postMessage` 将 Y.Doc 和 Awareness 同步到 **Provider**（iframe 子页面）。
 
 ```text
 ┌─────────────────────────────────────────────────────────────┐
@@ -64,20 +64,18 @@ App.main((app) => {
 │       │              │                                      │
 │       └──────┬───────┘                                      │
 │              ▼                                              │
-│   createIframeBridgeServer(doc, awareness)                  │
+│   createIframeBridgeServer(iframe, doc, awareness)          │
 │              │ postMessage                                  │
 └──────────────│──────────────────────────────────────────────┘
                │
-    ┌──────────┴──────────┐
-    ▼                     ▼
-┌─────────────┐     ┌─────────────┐
-│ Iframe A    │     │ Iframe B    │
-│ create...   │     │ create...   │
-│ Provider()  │     │ Provider()  │
-│             │     │             │
-│ 本地 Y.Doc  │     │ 本地 Y.Doc  │
-│ + draw.io   │     │ + draw.io   │
-└─────────────┘     └─────────────┘
+               ▼
+        ┌─────────────┐
+        │   Iframe    │
+        │             │
+        │ 本地 Y.Doc  │
+        │ + Awareness │
+        │ + draw.io   │
+        └─────────────┘
 ```
 
 ```ts
@@ -97,8 +95,8 @@ const undoManager = new Y.UndoManager(doc, {
   trackedOrigins: new Set([LOCAL_ORIGIN, IFRAME_ORIGIN]),
 });
 
-const bridge = createIframeBridgeServer(doc, awareness, { undoManager });
-bridge.addIframe(iframeElement, 'child-1');
+// 创建 bridge server，直接绑定到目标 iframe
+const bridge = createIframeBridgeServer(iframeElement, doc, awareness, { undoManager });
 
 // 从父页面执行撤销/重做
 document.getElementById('undo-btn')!.onclick = () => {

package/helper/throttle.d.ts

@@ -0,0 +1,2 @@
+export declare function throttle<T extends (...args: any[]) => any>(fn: T, wait: number): (...args: Parameters<T>) => ReturnType<T> | undefined;
+//# sourceMappingURL=throttle.d.ts.map

package/helper/throttle.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"throttle.d.ts","sourceRoot":"","sources":["../../src/helper/throttle.ts"],"names":[],"mappings":"AAAA,wBAAgB,QAAQ,CAAC,CAAC,SAAS,CAAC,GAAG,IAAI,EAAE,GAAG,EAAE,KAAK,GAAG,EACxD,EAAE,EAAE,CAAC,EACL,IAAI,EAAE,MAAM,GACX,CAAC,GAAG,IAAI,EAAE,UAAU,CAAC,CAAC,CAAC,KAAK,UAAU,CAAC,CAAC,CAAC,GAAG,SAAS,CAgCvD"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "y-mxgraph",
-  "version": "0.5.2",
+  "version": "0.5.6",
   "description": "Yjs binding for draw.io (mxGraph) documents",
   "keywords": [
     "yjs",
@@ -15,7 +15,6 @@
     "graph",
     "sync"
   ],
-  "type": "module",
   "main": "./y-mxgraph.cjs.js",
   "module": "./y-mxgraph.es.js",
   "types": "./index.d.ts",
@@ -38,7 +37,6 @@
   },
   "dependencies": {
     "colord": "^2.9.3",
-    "lodash-es": "^4.17.21",
     "xml-js": "^1.6.11"
   },
   "peerDependencies": {

package/y-mxgraph.cjs.js

@@ -2,7 +2,6 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
 const xmlJs = require("xml-js");
 const Y = require("yjs");
-const lodashEs = require("lodash-es");
 const colord = require("colord");
 function _interopNamespaceDefault(e) {
   const n = Object.create(null, { [Symbol.toStringTag]: { value: "Module" } });
@@ -1064,6 +1063,34 @@ function hslToHex(h, s, l) {
   const b = Math.round((b1 + m) * 255);
   return "#" + [r, g, b].map((v) => v.toString(16).padStart(2, "0")).join("");
 }
+function throttle(fn, wait) {
+  let lastTime = 0;
+  let timeoutId = null;
+  let lastArgs = null;
+  return (...args) => {
+    const now = Date.now();
+    const remaining = wait - (now - lastTime);
+    lastArgs = args;
+    if (remaining <= 0) {
+      if (timeoutId) {
+        clearTimeout(timeoutId);
+        timeoutId = null;
+      }
+      lastTime = now;
+      return fn(...args);
+    }
+    if (!timeoutId) {
+      timeoutId = setTimeout(() => {
+        lastTime = Date.now();
+        timeoutId = null;
+        if (lastArgs) {
+          fn(...lastArgs);
+        }
+      }, remaining);
+    }
+    return void 0;
+  };
+}
 function createCursorImage(color) {
   const w = 8;
   const h = 12;
@@ -1116,7 +1143,7 @@ function bindCursor(file, options) {
     },
     mouseUp: function() {
     },
-    mouseMove: lodashEs.throttle(function(_sender, event) {
+    mouseMove: throttle(function(_sender, event) {
       var _a;
       const containerRect = graph.container.getBoundingClientRect();
       const { translate, scale } = graph.view;