mobx-keystone-yjs 1.0.0 → 1.2.0

package/src/binding/bindYjsToMobxKeystone.ts

@@ -1,142 +1,156 @@
-import {
-  AnyDataModel,
-  AnyModel,
-  AnyStandardType,
-  ModelClass,
-  Patch,
-  TypeToData,
-  applyPatches,
-  fromSnapshot,
-  getParentToChildPath,
-  onGlobalPatches,
-  onPatches,
-  onSnapshot,
-} from "mobx-keystone"
-import * as Y from "yjs"
-import { applyMobxKeystonePatchToYjsObject } from "./applyMobxKeystonePatchToYjsObject"
-import { convertYjsEventToPatches } from "./convertYjsEventToPatches"
-
-export function bindYjsToMobxKeystone<
-  TType extends AnyStandardType | ModelClass<AnyModel> | ModelClass<AnyDataModel>,
->({
-  yjsDoc,
-  yjsObject,
-  mobxKeystoneType,
-}: {
-  yjsDoc: Y.Doc
-  yjsObject: Y.Map<unknown> | Y.Array<unknown>
-  mobxKeystoneType: TType
-}): {
-  boundObject: TypeToData<TType>
-  dispose(): void
-  yjsOrigin: symbol
-} {
-  const yjsJson = yjsObject.toJSON()
-
-  const initializationGlobalPatches: { target: object; patches: Patch[] }[] = []
-
-  const createBoundObject = () => {
-    const disposeOnGlobalPatches = onGlobalPatches((target, patches) => {
-      initializationGlobalPatches.push({ target, patches })
-    })
-
-    try {
-      return fromSnapshot(mobxKeystoneType, yjsJson as any)
-    } finally {
-      disposeOnGlobalPatches()
-    }
-  }
-
-  const boundObject = createBoundObject()
-
-  let applyingMobxKeystoneChanges = 0
-  const yjsOrigin = Symbol("bindYjsToMobxKeystoneTransactionOrigin")
-
-  // bind any changes from yjs to mobx-keystone
-  const observeDeepCb = (events: Y.YEvent<any>[]) => {
-    const patches: Patch[] = []
-    events.forEach((event) => {
-      if (event.transaction.origin !== yjsOrigin) {
-        patches.push(...convertYjsEventToPatches(event))
-      }
-    })
-
-    if (patches.length > 0) {
-      applyingMobxKeystoneChanges++
-      try {
-        applyPatches(boundObject, patches)
-      } finally {
-        applyingMobxKeystoneChanges--
-      }
-    }
-  }
-
-  yjsObject.observeDeep(observeDeepCb)
-
-  // bind any changes from mobx-keystone to yjs
-  let pendingPatches: Patch[] = []
-  const disposeOnPatches = onPatches(boundObject, (patches) => {
-    if (applyingMobxKeystoneChanges > 0) {
-      return
-    }
-
-    pendingPatches.push(...patches)
-  })
-
-  // this is only used so we can transact all patches to the snapshot boundary
-  const disposeOnSnapshot = onSnapshot(boundObject, () => {
-    if (pendingPatches.length === 0) {
-      return
-    }
-
-    const patches = pendingPatches
-    pendingPatches = []
-
-    yjsDoc.transact(() => {
-      patches.forEach((patch) => {
-        applyMobxKeystonePatchToYjsObject(patch, yjsObject)
-      })
-    }, yjsOrigin)
-  })
-
-  // sync initial patches, that might include setting defaults, IDs, etc
-  yjsDoc.transact(() => {
-    // we need to skip initializations until we hit the initialization of the bound object
-    // this is because default objects might be created and initialized before the main object
-    // but we just need to catch when those are actually assigned to the bound object
-    let boundObjectFound = false
-
-    initializationGlobalPatches.forEach(({ target, patches }) => {
-      if (!boundObjectFound) {
-        if (target !== boundObject) {
-          return // skip
-        }
-        boundObjectFound = true
-      }
-
-      const parentToChildPath = getParentToChildPath(boundObject, target)
-      // this is undefined only if target is not a child of boundModel
-      if (parentToChildPath !== undefined) {
-        patches.forEach((patch) => {
-          applyMobxKeystonePatchToYjsObject(
-            {
-              ...patch,
-              path: [...parentToChildPath, ...patch.path],
-            },
-            yjsObject
-          )
-        })
-      }
-    })
-  }, yjsOrigin)
-
-  return {
-    boundObject,
-    dispose: () => {
-      disposeOnPatches()
-      disposeOnSnapshot()
-      yjsObject.unobserveDeep(observeDeepCb)
-    },
-    yjsOrigin,
-  }
-}
+import {
+  AnyDataModel,
+  AnyModel,
+  AnyStandardType,
+  ModelClass,
+  Patch,
+  TypeToData,
+  applyPatches,
+  fromSnapshot,
+  getParentToChildPath,
+  onGlobalPatches,
+  onPatches,
+  onSnapshot,
+} from "mobx-keystone"
+import * as Y from "yjs"
+import { applyMobxKeystonePatchToYjsObject } from "./applyMobxKeystonePatchToYjsObject"
+import { convertYjsEventToPatches } from "./convertYjsEventToPatches"
+import { YjsBindingContext, yjsBindingContext } from "./yjsBindingContext"
+
+export function bindYjsToMobxKeystone<
+  TType extends AnyStandardType | ModelClass<AnyModel> | ModelClass<AnyDataModel>,
+>({
+  yjsDoc,
+  yjsObject,
+  mobxKeystoneType,
+}: {
+  yjsDoc: Y.Doc
+  yjsObject: Y.Map<unknown> | Y.Array<unknown>
+  mobxKeystoneType: TType
+}): {
+  boundObject: TypeToData<TType>
+  dispose(): void
+  yjsOrigin: symbol
+} {
+  const yjsOrigin = Symbol("bindYjsToMobxKeystoneTransactionOrigin")
+
+  const bindingContext: YjsBindingContext = {
+    yjsDoc,
+    yjsObject,
+    mobxKeystoneType,
+    yjsOrigin,
+  }
+
+  const yjsJson = yjsObject.toJSON()
+
+  const initializationGlobalPatches: { target: object; patches: Patch[] }[] = []
+
+  const createBoundObject = () => {
+    const disposeOnGlobalPatches = onGlobalPatches((target, patches) => {
+      initializationGlobalPatches.push({ target, patches })
+    })
+
+    try {
+      const boundObject = yjsBindingContext.apply(
+        () => fromSnapshot(mobxKeystoneType, yjsJson as any),
+        bindingContext
+      )
+      yjsBindingContext.set(boundObject, bindingContext)
+      return boundObject
+    } finally {
+      disposeOnGlobalPatches()
+    }
+  }
+
+  const boundObject = createBoundObject()
+
+  let applyingMobxKeystoneChanges = 0
+
+  // bind any changes from yjs to mobx-keystone
+  const observeDeepCb = (events: Y.YEvent<any>[]) => {
+    const patches: Patch[] = []
+    events.forEach((event) => {
+      if (event.transaction.origin !== yjsOrigin) {
+        patches.push(...convertYjsEventToPatches(event))
+      }
+    })
+
+    if (patches.length > 0) {
+      applyingMobxKeystoneChanges++
+      try {
+        applyPatches(boundObject, patches)
+      } finally {
+        applyingMobxKeystoneChanges--
+      }
+    }
+  }
+
+  yjsObject.observeDeep(observeDeepCb)
+
+  // bind any changes from mobx-keystone to yjs
+  let pendingPatches: Patch[] = []
+  const disposeOnPatches = onPatches(boundObject, (patches) => {
+    if (applyingMobxKeystoneChanges > 0) {
+      return
+    }
+
+    pendingPatches.push(...patches)
+  })
+
+  // this is only used so we can transact all patches to the snapshot boundary
+  const disposeOnSnapshot = onSnapshot(boundObject, () => {
+    if (pendingPatches.length === 0) {
+      return
+    }
+
+    const patches = pendingPatches
+    pendingPatches = []
+
+    yjsDoc.transact(() => {
+      patches.forEach((patch) => {
+        applyMobxKeystonePatchToYjsObject(patch, yjsObject)
+      })
+    }, yjsOrigin)
+  })
+
+  // sync initial patches, that might include setting defaults, IDs, etc
+  yjsDoc.transact(() => {
+    // we need to skip initializations until we hit the initialization of the bound object
+    // this is because default objects might be created and initialized before the main object
+    // but we just need to catch when those are actually assigned to the bound object
+    let boundObjectFound = false
+
+    initializationGlobalPatches.forEach(({ target, patches }) => {
+      if (!boundObjectFound) {
+        if (target !== boundObject) {
+          return // skip
+        }
+        boundObjectFound = true
+      }
+
+      const parentToChildPath = getParentToChildPath(boundObject, target)
+      // this is undefined only if target is not a child of boundModel
+      if (parentToChildPath !== undefined) {
+        patches.forEach((patch) => {
+          applyMobxKeystonePatchToYjsObject(
+            {
+              ...patch,
+              path: [...parentToChildPath, ...patch.path],
+            },
+            yjsObject
+          )
+        })
+      }
+    })
+  }, yjsOrigin)
+
+  return {
+    boundObject,
+    dispose: () => {
+      disposeOnPatches()
+      disposeOnSnapshot()
+      yjsObject.unobserveDeep(observeDeepCb)
+    },
+    yjsOrigin,
+  }
+}

package/src/binding/convertJsonToYjsData.ts

@@ -0,0 +1,45 @@
+import * as Y from "yjs"
+import { JsonValue, JsonArray, JsonObject, JsonPrimitive } from "../jsonTypes"
+
+function isJsonPrimitive(v: JsonValue): v is JsonPrimitive {
+  const t = typeof v
+  return t === "string" || t === "number" || t === "boolean" || v === null
+}
+
+function isJsonArray(v: JsonValue): v is JsonArray {
+  return Array.isArray(v)
+}
+
+function isJsonObject(v: JsonValue): v is JsonObject {
+  return !isJsonArray(v) && typeof v === "object"
+}
+
+export function convertJsonToYjsData(v: JsonValue) {
+  if (v === undefined || isJsonPrimitive(v)) {
+    return v
+  }
+
+  if (isJsonArray(v)) {
+    const arr = new Y.Array()
+    applyJsonArrayYArray(arr, v)
+    return arr
+  }
+
+  if (isJsonObject(v)) {
+    const map = new Y.Map()
+    applyJsonObjectToYMap(map, v)
+    return map
+  }
+
+  throw new Error(`unsupported value type: ${v}`)
+}
+
+export function applyJsonArrayYArray(dest: Y.Array<unknown>, source: JsonArray) {
+  dest.push(source.map(convertJsonToYjsData))
+}
+
+export function applyJsonObjectToYMap(dest: Y.Map<unknown>, source: JsonObject) {
+  Object.entries(source).forEach(([k, v]) => {
+    dest.set(k, convertJsonToYjsData(v))
+  })
+}

package/src/binding/convertYjsEventToPatches.ts

@@ -1,85 +1,85 @@
-import { Patch } from "mobx-keystone"
-import * as Y from "yjs"
-import { JSONArray, JSONObject, JSONValue } from "../jsonTypes"
-import { failure } from "../utils/error"
-
-export function convertYjsEventToPatches(event: Y.YEvent<any>): Patch[] {
-  const patches: Patch[] = []
-
-  if (event instanceof Y.YMapEvent) {
-    const source = event.target as Y.Map<any>
-
-    event.changes.keys.forEach((change, key) => {
-      const path = [...event.path, key]
-
-      switch (change.action) {
-        case "add":
-          patches.push({
-            op: "add",
-            path,
-            value: toPlainValue(source.get(key)),
-          })
-          break
-
-        case "update":
-          patches.push({
-            op: "replace",
-            path,
-            value: toPlainValue(source.get(key)),
-          })
-          break
-
-        case "delete":
-          patches.push({
-            op: "remove",
-            path,
-          })
-          break
-
-        default:
-          throw failure(`unsupported Yjs map event action: ${change.action}`)
-      }
-    })
-  } else if (event instanceof Y.YArrayEvent) {
-    let retain = 0
-    event.changes.delta.forEach((change) => {
-      if (change.retain) {
-        retain += change.retain
-      }
-
-      if (change.delete) {
-        // remove X items at retain position
-        const path = [...event.path, retain]
-        for (let i = 0; i < change.delete; i++) {
-          patches.push({
-            op: "remove",
-            path,
-          })
-        }
-      }
-
-      if (change.insert) {
-        const newValues = Array.isArray(change.insert) ? change.insert : [change.insert]
-        newValues.forEach((v) => {
-          const path = [...event.path, retain]
-          patches.push({
-            op: "add",
-            path,
-            value: toPlainValue(v),
-          })
-          retain++
-        })
-      }
-    })
-  }
-
-  return patches
-}
-
-function toPlainValue(v: Y.Map<any> | Y.Array<any> | JSONValue) {
-  if (v instanceof Y.Map || v instanceof Y.Array) {
-    return v.toJSON() as JSONObject | JSONArray
-  } else {
-    return v
-  }
-}
+import { Patch } from "mobx-keystone"
+import * as Y from "yjs"
+import { JsonArray, JsonObject, JsonValue } from "../jsonTypes"
+import { failure } from "../utils/error"
+
+export function convertYjsEventToPatches(event: Y.YEvent<any>): Patch[] {
+  const patches: Patch[] = []
+
+  if (event instanceof Y.YMapEvent) {
+    const source = event.target as Y.Map<any>
+
+    event.changes.keys.forEach((change, key) => {
+      const path = [...event.path, key]
+
+      switch (change.action) {
+        case "add":
+          patches.push({
+            op: "add",
+            path,
+            value: toPlainValue(source.get(key)),
+          })
+          break
+
+        case "update":
+          patches.push({
+            op: "replace",
+            path,
+            value: toPlainValue(source.get(key)),
+          })
+          break
+
+        case "delete":
+          patches.push({
+            op: "remove",
+            path,
+          })
+          break
+
+        default:
+          throw failure(`unsupported Yjs map event action: ${change.action}`)
+      }
+    })
+  } else if (event instanceof Y.YArrayEvent) {
+    let retain = 0
+    event.changes.delta.forEach((change) => {
+      if (change.retain) {
+        retain += change.retain
+      }
+
+      if (change.delete) {
+        // remove X items at retain position
+        const path = [...event.path, retain]
+        for (let i = 0; i < change.delete; i++) {
+          patches.push({
+            op: "remove",
+            path,
+          })
+        }
+      }
+
+      if (change.insert) {
+        const newValues = Array.isArray(change.insert) ? change.insert : [change.insert]
+        newValues.forEach((v) => {
+          const path = [...event.path, retain]
+          patches.push({
+            op: "add",
+            path,
+            value: toPlainValue(v),
+          })
+          retain++
+        })
+      }
+    })
+  }
+
+  return patches
+}
+
+function toPlainValue(v: Y.Map<any> | Y.Array<any> | JsonValue) {
+  if (v instanceof Y.Map || v instanceof Y.Array) {
+    return v.toJSON() as JsonObject | JsonArray
+  } else {
+    return v
+  }
+}

package/src/binding/yjsBindingContext.ts

@@ -0,0 +1,11 @@
+import { AnyType, createContext } from "mobx-keystone"
+import * as Y from "yjs"
+
+export interface YjsBindingContext {
+  yjsDoc: Y.Doc
+  yjsObject: Y.Map<unknown> | Y.Array<unknown>
+  mobxKeystoneType: AnyType
+  yjsOrigin: symbol
+}
+
+export const yjsBindingContext = createContext<YjsBindingContext | undefined>(undefined)

package/src/index.ts

@@ -1,2 +1,9 @@
-export { MobxKeystoneYjsError } from "./utils/error"
-export { bindYjsToMobxKeystone } from "./binding/bindYjsToMobxKeystone"
+export { bindYjsToMobxKeystone } from "./binding/bindYjsToMobxKeystone"
+export {
+  applyJsonArrayYArray,
+  applyJsonObjectToYMap,
+  convertJsonToYjsData,
+} from "./binding/convertJsonToYjsData"
+export { yjsBindingContext } from "./binding/yjsBindingContext"
+export type { YjsBindingContext } from "./binding/yjsBindingContext"
+export { MobxKeystoneYjsError } from "./utils/error"

package/src/jsonTypes.ts

@@ -1,4 +1,4 @@
-export type JSONPrimitive = string | number | boolean | null
-export type JSONValue = JSONPrimitive | JSONObject | JSONArray
-export type JSONObject = { [key: string]: JSONValue }
-export interface JSONArray extends Array<JSONValue> {}
+export type JsonPrimitive = string | number | boolean | null
+export type JsonValue = JsonPrimitive | JsonObject | JsonArray
+export type JsonObject = { [key: string]: JsonValue }
+export interface JsonArray extends Array<JsonValue> {}

package/dist/types/binding/toYDataType.d.ts

@@ -1,3 +0,0 @@
-import * as Y from "yjs";
-import { JSONValue, JSONPrimitive } from "../jsonTypes";
-export declare function toYDataType(v: JSONValue): JSONPrimitive | Y.Array<unknown> | Y.Map<unknown> | undefined;

package/src/binding/toYDataType.ts

@@ -1,41 +0,0 @@
-import * as Y from "yjs"
-import { JSONValue, JSONArray, JSONObject, JSONPrimitive } from "../jsonTypes"
-
-function isJSONPrimitive(v: JSONValue): v is JSONPrimitive {
-  const t = typeof v
-  return t === "string" || t === "number" || t === "boolean" || v === null
-}
-
-function isJSONArray(v: JSONValue): v is JSONArray {
-  return Array.isArray(v)
-}
-
-function isJSONObject(v: JSONValue): v is JSONObject {
-  return !isJSONArray(v) && typeof v === "object"
-}
-
-export function toYDataType(v: JSONValue) {
-  if (isJSONPrimitive(v)) {
-    return v
-  } else if (isJSONArray(v)) {
-    const arr = new Y.Array()
-    applyJsonArray(arr, v)
-    return arr
-  } else if (isJSONObject(v)) {
-    const map = new Y.Map()
-    applyJsonObject(map, v)
-    return map
-  } else {
-    return undefined
-  }
-}
-
-function applyJsonArray(dest: Y.Array<unknown>, source: JSONArray) {
-  dest.push(source.map(toYDataType))
-}
-
-function applyJsonObject(dest: Y.Map<unknown>, source: JSONObject) {
-  Object.entries(source).forEach(([k, v]) => {
-    dest.set(k, toYDataType(v))
-  })
-}