@y/y 14.0.0-rc.2 → 14.0.0-rc.21

package/src/ytype.js

@@ -1,39 +1,40 @@
-import {
-  cleanupFormattingGap,
-  createIdSet,
-  removeEventHandlerListener,
-  callEventHandlerListeners,
-  addEventHandlerListener,
-  createEventHandler,
-  getState,
-  isVisible,
-  ContentType,
-  createID,
-  ContentAny,
-  ContentFormat,
-  ContentBinary,
-  ContentJSON,
-  ContentDeleted,
-  ContentString,
-  ContentEmbed,
-  getItemCleanStart,
-  noAttributionsManager,
-  transact,
-  ContentDoc, UpdateEncoderV1, UpdateEncoderV2, Doc, Snapshot, Transaction, EventHandler, YEvent, Item, createAttributionFromAttributionItems, AbstractAttributionManager // eslint-disable-line
-} from './internals.js'
-
-import * as contentType from './structs/ContentType.js'
-
-import * as traits from 'lib0/traits'
-import * as delta from 'lib0/delta'
+import * as binary from 'lib0/binary'
 import * as array from 'lib0/array'
-import * as map from 'lib0/map'
-import * as iterator from 'lib0/iterator'
+import * as delta from 'lib0/delta'
 import * as error from 'lib0/error'
-import * as math from 'lib0/math'
+import * as iterator from 'lib0/iterator'
 import * as log from 'lib0/logging'
+import * as map from 'lib0/map'
+import * as set from 'lib0/set'
+import * as math from 'lib0/math'
 import * as object from 'lib0/object'
 import * as s from 'lib0/schema'
+import * as traits from 'lib0/traits'
+import { ObservableV2 } from 'lib0/observable'
+import {
+  Item,
+  ContentAny,
+  ContentBinary,
+  ContentDeleted,
+  ContentEmbed,
+  ContentFormat,
+  ContentJSON,
+  ContentString,
+  ContentType,
+  YXmlFragmentRefID,
+  YXmlElementRefID,
+  YXmlHookRefID,
+  ContentDoc,
+  createContentDocFromDoc
+} from './structs/Item.js'
+import { baseRenderer } from './utils/renderer-helpers.js'
+import { removeEventHandlerListener, callEventHandlerListeners, addEventHandlerListener, createEventHandler } from './utils/EventHandler.js'
+import { createID } from './utils/ID.js'
+import { createIdSet, iterateStructsByIdSetWithoutSplits } from './utils/ids.js'
+import { getItemCleanStart, cleanupFormattingGap } from './utils/transaction-helpers.js'
+import { transact } from './utils/Transaction.js'
+import { YEvent } from './utils/YEvent.js'
+import { $ydoc } from './utils/schemas.js'
 
 /**
  * @typedef {Object<string,any>|Array<any>|number|null|string|Uint8Array|BigInt|YType<any>} YValue
@@ -46,6 +47,45 @@ export const warnPrematureAccess = () => { log.warn('Invalid access: Add Yjs typ
 
 const maxSearchMarker = 80
 
+/**
+ * @todo SHOULD NOT RETURN AN OBJECT!
+ * @param {Array<ContentAttribute<any>>?} attrs
+ * @param {boolean} deleted - whether the attributed item is deleted
+ * @return {Attribution|undefined} `undefined` when there is no attribution — under lib0's tri-state
+ * that means "skip / inherit the builder's attribution context" (NOT `null`, which would clear it).
+ */
+export const createAttributionFromAttributionItems = (attrs, deleted) => {
+  if (attrs == null) {
+    return undefined
+  }
+  /**
+   * @type {Attribution}
+   */
+  const attribution = {}
+  if (deleted) {
+    attribution.delete = []
+  } else {
+    attribution.insert = []
+  }
+  attrs.forEach(attr => {
+    switch (attr.name) {
+      // eslint-disable-next-line no-fallthrough
+      case 'insert':
+      case 'delete': {
+        // needs to be non-ambiguous: don't add existing attr if it doesn't match the actual status
+        attribution[attr.name]?.push(attr.val)
+        break
+      }
+      default: {
+        if (attr.name[0] !== '_') {
+          /** @type {any} */ (attribution)[attr.name] = attr.val
+        }
+      }
+    }
+  })
+  return attribution
+}
+
 /**
  * A unique timestamp that identifies each marker.
  *
@@ -60,15 +100,15 @@ export class ItemTextListPosition {
    * @param {Item|null} left
    * @param {Item|null} right
    * @param {number} index
-   * @param {Map<string,any>} currentAttributes
-   * @param {AbstractAttributionManager} am
+   * @param {Map<string,any>} currentFormats
+   * @param {AbstractRenderer} renderer
    */
-  constructor (left, right, index, currentAttributes, am) {
+  constructor (left, right, index, currentFormats, renderer) {
     this.left = left
     this.right = right
     this.index = index
-    this.currentAttributes = currentAttributes
-    this.am = am
+    this.currentFormats = currentFormats
+    this.renderer = renderer
   }
 
   /**
@@ -81,11 +121,11 @@ export class ItemTextListPosition {
     switch (this.right.content.constructor) {
       case ContentFormat:
         if (!this.right.deleted) {
-          updateCurrentAttributes(this.currentAttributes, /** @type {ContentFormat} */ (this.right.content))
+          updateCurrentFormats(this.currentFormats, /** @type {ContentFormat} */ (this.right.content))
         }
         break
       default:
-        this.index += this.am.contentLength(this.right)
+        this.index += this.renderer.contentLength(this.right)
         break
     }
     this.left = this.right
@@ -96,23 +136,23 @@ export class ItemTextListPosition {
    * @param {Transaction} transaction
    * @param {YType} parent
    * @param {number} length
-   * @param {Object<string,any>} attributes
+   * @param {Object<string,any>} formats
    *
    * @function
    */
-  formatText (transaction, parent, length, attributes) {
-    minimizeAttributeChanges(this, attributes)
-    const negatedAttributes = insertAttributes(transaction, parent, this, attributes)
+  formatText (transaction, parent, length, formats) {
+    minimizeFormatChanges(this, formats)
+    const negatedFormats = insertFormats(transaction, parent, this, formats)
     // iterate until first non-format or null is found
-    // delete all formats with attributes[format.key] != null
-    // also check the attributes after the first non-format as we do not want to insert redundant negated attributes there
+    // delete all formats with formats[format.key] != null
+    // also check the formats after the first non-format as we do not want to insert redundant negated formats there
     // eslint-disable-next-line no-labels
     iterationLoop: while (
       this.right !== null &&
       (length > 0 ||
         (
-          negatedAttributes.size > 0 &&
-          ((this.right.deleted && this.am.contentLength(this.right) === 0) || this.right.content.constructor === ContentFormat)
+          negatedFormats.size > 0 &&
+          ((this.right.deleted && this.renderer.contentLength(this.right) === 0) || this.right.content.constructor === ContentFormat)
         )
       )
     ) {
@@ -120,34 +160,34 @@ export class ItemTextListPosition {
         case ContentFormat: {
           if (!this.right.deleted) {
             const { key, value } = /** @type {ContentFormat} */ (this.right.content)
-            const attr = attributes[key]
+            const attr = formats[key]
             if (attr !== undefined) {
-              if (equalAttrs(attr, value)) {
-                negatedAttributes.delete(key)
+              if (equalFormats(attr, value)) {
+                negatedFormats.delete(key)
               } else {
                 if (length === 0) {
-                  // no need to further extend negatedAttributes
+                  // no need to further extend negatedFormats
                   // eslint-disable-next-line no-labels
                   break iterationLoop
                 }
-                negatedAttributes.set(key, value)
+                negatedFormats.set(key, value)
               }
               this.right.delete(transaction)
             } else {
-              this.currentAttributes.set(key, value)
+              this.currentFormats.set(key, value)
             }
           }
           break
         }
         default: {
           const item = this.right
-          const rightLen = this.am.contentLength(item)
+          const rightLen = this.renderer.contentLength(item)
           if (length < rightLen) {
             /**
-             * @type {Array<import('./internals.js').AttributedContent<any>>}
+             * @type {Array<AttributedContent<any>>}
              */
             const contents = []
-            this.am.readContent(contents, item.id.client, item.id.clock, item.deleted, item.content, 0)
+            this.renderer.readContent(contents, item.id.client, item.id.clock, item.deleted, item.content, 0)
             let i = 0
             for (; i < contents.length && length > 0; i++) {
               const c = contents[i]
@@ -170,7 +210,7 @@ export class ItemTextListPosition {
     if (length > 0) {
       throw new Error('Exceeded content range')
     }
-    insertNegatedAttributes(transaction, parent, this, negatedAttributes)
+    insertNegatedFormats(transaction, parent, this, negatedFormats)
   }
 }
 
@@ -180,32 +220,32 @@ export class ItemTextListPosition {
  * @param {Transaction} transaction
  * @param {YType} parent
  * @param {ItemTextListPosition} currPos
- * @param {Map<string,any>} negatedAttributes
+ * @param {Map<string,any>} negatedFormats
  *
  * @private
  * @function
  */
-const insertNegatedAttributes = (transaction, parent, currPos, negatedAttributes) => {
-  // check if we really need to remove attributes
+const insertNegatedFormats = (transaction, parent, currPos, negatedFormats) => {
+  // check if we really need to remove formats
   while (
     currPos.right !== null && (
-      (currPos.right.deleted && (currPos.am === noAttributionsManager || currPos.am.contentLength(currPos.right) === 0)) || (
+      (currPos.right.deleted && (currPos.renderer === baseRenderer || currPos.renderer.contentLength(currPos.right) === 0)) || (
         currPos.right.content.constructor === ContentFormat &&
-        equalAttrs(negatedAttributes.get(/** @type {ContentFormat} */ (currPos.right.content).key), /** @type {ContentFormat} */ (currPos.right.content).value)
+        equalFormats(negatedFormats.get(/** @type {ContentFormat} */ (currPos.right.content).key), /** @type {ContentFormat} */ (currPos.right.content).value)
       )
     )
   ) {
     if (!currPos.right.deleted) {
-      negatedAttributes.delete(/** @type {ContentFormat} */ (currPos.right.content).key)
+      negatedFormats.delete(/** @type {ContentFormat} */ (currPos.right.content).key)
     }
     currPos.forward()
   }
   const doc = transaction.doc
   const ownClientId = doc.clientID
-  negatedAttributes.forEach((val, key) => {
+  negatedFormats.forEach((val, key) => {
     const left = currPos.left
     const right = currPos.right
-    const nextFormat = new Item(createID(ownClientId, getState(doc.store, ownClientId)), left, left && left.lastId, right, right && right.id, parent, null, new ContentFormat(key, val))
+    const nextFormat = new Item(createID(ownClientId, doc.store.getClock(ownClientId)), left, left && left.lastId, right, right && right.id, parent, null, new ContentFormat(key, val))
     nextFormat.integrate(transaction, 0)
     currPos.right = nextFormat
     currPos.forward()
@@ -213,34 +253,34 @@ const insertNegatedAttributes = (transaction, parent, currPos, negatedAttributes
 }
 
 /**
- * @param {Map<string,any>} currentAttributes
+ * @param {Map<string,any>} currentFormats
  * @param {ContentFormat} format
  *
  * @private
  * @function
  */
-const updateCurrentAttributes = (currentAttributes, format) => {
+const updateCurrentFormats = (currentFormats, format) => {
   const { key, value } = format
   if (value === null) {
-    currentAttributes.delete(key)
+    currentFormats.delete(key)
   } else {
-    currentAttributes.set(key, value)
+    currentFormats.set(key, value)
   }
 }
 
 /**
  * @param {ItemTextListPosition} currPos
- * @param {Object<string,any>} attributes
+ * @param {Object<string,any>} formats
  *
  * @private
  * @function
  */
-const minimizeAttributeChanges = (currPos, attributes) => {
-  // go right while attributes[right.key] === right.value (or right is deleted)
+const minimizeFormatChanges = (currPos, formats) => {
+  // go right while formats[right.key] === right.value (or right is deleted)
   while (true) {
     if (currPos.right === null) {
       break
-    } else if (currPos.right.deleted ? (currPos.am.contentLength(currPos.right) === 0) : (!currPos.right.deleted && currPos.right.content.constructor === ContentFormat && equalAttrs(attributes[(/** @type {ContentFormat} */ (currPos.right.content)).key] ?? null, /** @type {ContentFormat} */ (currPos.right.content).value))) {
+    } else if (currPos.right.deleted ? (currPos.renderer.contentLength(currPos.right) === 0) : (!currPos.right.deleted && currPos.right.content.constructor === ContentFormat && equalFormats(formats[(/** @type {ContentFormat} */ (currPos.right.content)).key] ?? null, /** @type {ContentFormat} */ (currPos.right.content).value))) {
       //
     } else {
       break
@@ -253,30 +293,30 @@ const minimizeAttributeChanges = (currPos, attributes) => {
  * @param {Transaction} transaction
  * @param {YType} parent
  * @param {ItemTextListPosition} currPos
- * @param {Object<string,any>} attributes
+ * @param {Object<string,any>} formats
  * @return {Map<string,any>}
  *
  * @private
  * @function
  **/
-const insertAttributes = (transaction, parent, currPos, attributes) => {
+const insertFormats = (transaction, parent, currPos, formats) => {
   const doc = transaction.doc
   const ownClientId = doc.clientID
-  const negatedAttributes = new Map()
+  const negatedFormats = new Map()
   // insert format-start items
-  for (const key in attributes) {
-    const val = attributes[key]
-    const currentVal = currPos.currentAttributes.get(key) ?? null
-    if (!equalAttrs(currentVal, val)) {
-      // save negated attribute (set null if currentVal undefined)
-      negatedAttributes.set(key, currentVal)
+  for (const key in formats) {
+    const val = formats[key]
+    const currentVal = currPos.currentFormats.get(key) ?? null
+    if (!equalFormats(currentVal, val)) {
+      // save negated format (set null if currentVal undefined)
+      negatedFormats.set(key, currentVal)
       const { left, right } = currPos
-      currPos.right = new Item(createID(ownClientId, getState(doc.store, ownClientId)), left, left && left.lastId, right, right && right.id, parent, null, new ContentFormat(key, val))
+      currPos.right = new Item(createID(ownClientId, doc.store.getClock(ownClientId)), left, left && left.lastId, right, right && right.id, parent, null, new ContentFormat(key, val))
       currPos.right.integrate(transaction, 0)
       currPos.forward()
     }
   }
-  return negatedAttributes
+  return negatedFormats
 }
 
 /**
@@ -284,31 +324,31 @@ const insertAttributes = (transaction, parent, currPos, attributes) => {
  * @param {YType} parent
  * @param {ItemTextListPosition} currPos
  * @param {import('./structs/Item.js').AbstractContent} content
- * @param {Object<string,any>} attributes
+ * @param {Object<string,any>} formats
  *
  * @private
  * @function
  **/
-export const insertContent = (transaction, parent, currPos, content, attributes) => {
-  currPos.currentAttributes.forEach((_val, key) => {
-    if (attributes[key] === undefined) {
-      attributes[key] = null
+export const insertContent = (transaction, parent, currPos, content, formats) => {
+  currPos.currentFormats.forEach((_val, key) => {
+    if (formats[key] === undefined) {
+      formats[key] = null
     }
   })
   const doc = transaction.doc
   const ownClientId = doc.clientID
-  minimizeAttributeChanges(currPos, attributes)
-  const negatedAttributes = insertAttributes(transaction, parent, currPos, attributes)
+  minimizeFormatChanges(currPos, formats)
+  const negatedFormats = insertFormats(transaction, parent, currPos, formats)
   let { left, right, index } = currPos
   if (parent._searchMarker) {
     updateMarkerChanges(parent._searchMarker, currPos.index, content.getLength())
   }
-  right = new Item(createID(ownClientId, getState(doc.store, ownClientId)), left, left && left.lastId, right, right && right.id, parent, null, content)
+  right = new Item(createID(ownClientId, doc.store.getClock(ownClientId)), left, left && left.lastId, right, right && right.id, parent, null, content)
   right.integrate(transaction, 0)
   currPos.right = right
   currPos.index = index
   currPos.forward()
-  insertNegatedAttributes(transaction, parent, currPos, negatedAttributes)
+  insertNegatedFormats(transaction, parent, currPos, negatedFormats)
 }
 
 /**
@@ -316,27 +356,27 @@ export const insertContent = (transaction, parent, currPos, content, attributes)
  * @param {YType} parent
  * @param {ItemTextListPosition} currPos
  * @param {Array<any>|string} insert
- * @param {Object<string,any>} attributes
+ * @param {Object<string,any>} formats
  */
-export const insertContentHelper = (transaction, parent, currPos, insert, attributes) => {
+export const insertContentHelper = (transaction, parent, currPos, insert, formats) => {
   if (s.$string.check(insert)) {
-    insertContent(transaction, parent, currPos, new ContentString(insert), attributes)
+    insertContent(transaction, parent, currPos, new ContentString(insert), formats)
   } else {
     insert = insert.map(ins => delta.$deltaAny.check(ins) ? YType.from(ins) : ins)
     for (let i = 0; i < insert.length;) {
       const first = insert[i]
       if (first instanceof YType) {
-        insertContent(transaction, parent, currPos, new ContentType(first), attributes)
+        insertContent(transaction, parent, currPos, new ContentType(first), formats)
         i++
-      } else if (first instanceof Doc) {
-        insertContent(transaction, parent, currPos, new ContentDoc(first), attributes)
+      } else if ($ydoc.check(first)) {
+        insertContent(transaction, parent, currPos, createContentDocFromDoc(first), formats)
         i++
       } else {
         // insert "any" content
         // compute slice len
         let j = i + 1
-        for (; j < insert.length && !(insert[j] instanceof YType || insert[j] instanceof Doc); j++) { /* nop */ }
-        insertContent(transaction, parent, currPos, new ContentAny((i === 0 && j === insert.length) ? insert : insert.slice(i, j)), attributes)
+        for (; j < insert.length && !(insert[j] instanceof YType || $ydoc.check(insert[j])); j++) { /* nop */ }
+        insertContent(transaction, parent, currPos, new ContentAny((i === 0 && j === insert.length) ? insert : insert.slice(i, j)), formats)
         i = j
       }
     }
@@ -354,7 +394,7 @@ export const insertContentHelper = (transaction, parent, currPos, insert, attrib
  */
 export const deleteText = (transaction, currPos, length) => {
   const startLength = length
-  const startAttrs = map.copy(currPos.currentAttributes)
+  const startFormats = map.copy(currPos.currentFormats)
   const start = currPos.right
   while (length > 0 && currPos.right !== null) {
     const item = currPos.right
@@ -364,12 +404,12 @@ export const deleteText = (transaction, currPos, length) => {
       }
       length -= item.length
       item.delete(transaction)
-    } else if (currPos.am !== noAttributionsManager) {
+    } else if (currPos.renderer !== baseRenderer) {
       /**
-       * @type {Array<import('./internals.js').AttributedContent<any>>}
+       * @type {Array<AttributedContent<any>>}
        */
       const contents = []
-      currPos.am.readContent(contents, item.id.client, item.id.clock, true, item.content, 0)
+      currPos.renderer.readContent(contents, item.id.client, item.id.clock, true, item.content, 0)
       for (let i = 0; i < contents.length; i++) {
         const c = contents[i]
         if (c.content.isCountable() && c.attrs != null) {
@@ -390,7 +430,7 @@ export const deleteText = (transaction, currPos, length) => {
     currPos.forward()
   }
   if (start) {
-    cleanupFormattingGap(transaction, start, currPos.right, startAttrs, currPos.currentAttributes)
+    cleanupFormattingGap(transaction, start, currPos.right, startFormats, currPos.currentFormats)
   }
   const parent = /** @type {YType<any>} */ (/** @type {Item} */ (currPos.left || currPos.right).parent)
   if (parent._searchMarker) {
@@ -593,14 +633,25 @@ export const callTypeObservers = (type, transaction, event) => {
 }
 
 /**
- * Abstract Yjs Type class
+ * Abstract Yjs Type class.
+ *
+ * A `YType` is a {@link https://github.com/dmonad/lib0 lib0} `RDT` ("replicated data type", see
+ * `lib0/delta/rdt.js`): it emits a `'delta'` event whenever its state changes, accepts foreign
+ * changes via {@link YType#applyDelta}, exposes its delta {@link YType#$delta schema}, and can be
+ * torn down via {@link YType#destroy}. This lets a `YType` be `bind()`-ed to any other RDT (another
+ * `YType`, an in-memory delta, a DOM subtree, …). The legacy {@link YType#observe `observe`} /
+ * {@link YType#observeDeep `observeDeep`} `YEvent` API continues to work alongside the `'delta'`
+ * channel.
+ *
  * @template {delta.DeltaConf} [DConf=any]
+ * @extends {ObservableV2<{ delta: (delta: delta.Delta<DConf>) => void, destroy: (type: YType<DConf>) => void }>}
  */
-export class YType {
+export class YType extends ObservableV2 {
   /**
    * @param {delta.DeltaConfGetName<DConf>?} name
    */
   constructor (name = null) {
+    super()
     /**
      * @type {delta.DeltaConfGetName<DConf>}
      */
@@ -637,20 +688,121 @@ export class YType {
      */
     this._searchMarker = null
     /**
-     * @type {delta.DeltaBuilder<DConf>}
-     * @private
+     * Maintained deep-delta cache backing {@link YType#delta}. `null` until `delta` is first
+     * accessed; thereafter kept current on every event of this type (incrementally, by applying the
+     * deep change) and re-diffed by {@link YType#useRenderer}. Cleared by {@link YType#clearCache}.
+     * @type {delta.DeltaBuilderAny | null}
      */
-    this._content = /** @type {delta.DeltaBuilderAny} */ (delta.create())
-    this._legacyTypeRef = this.name == null ? contentType.YXmlFragmentRefID : contentType.YXmlElementRefID
+    this._delta = null
+    this._legacyTypeRef = this.name == null ? YXmlFragmentRefID : YXmlElementRefID
     /**
      * @type {Array<ArraySearchMarker>|null}
      */
     this._searchMarker = []
     /**
-     * Whether this YText contains formatting attributes.
+     * Whether this YText contains formats.
      * This flag is updated when a formatting item is integrated (see ContentFormat.integrate)
      */
     this._hasFormatting = false
+    /**
+     * The active default renderer. Used by `toDelta`, `applyDelta`, and the events whenever no
+     * explicit renderer is passed. Change it via {@link YType#useRenderer}.
+     * @type {AbstractRenderer}
+     */
+    this._renderer = baseRenderer
+  }
+
+  /**
+   * Schema of the deltas this type produces — part of the lib0 `RDT` interface.
+   *
+   * @type {s.Schema<delta.Delta<DConf>>}
+   */
+  get $delta () {
+    return /** @type {any} */ (delta.$deltaAny)
+  }
+
+  /**
+   * The deep delta of this type (the full nested content tree, children rendered as their own
+   * deltas).
+   *
+   * The returned value is the type's **live** maintained cache: it is materialized on first access
+   * and then kept current on every event fired on this type (and re-diffed by
+   * {@link YType#useRenderer}), so a reference held across edits keeps updating in place. Clone it
+   * (e.g. `type.delta.clone()`) if you need a stable snapshot, and call {@link YType#clearCache} to
+   * drop the cache.
+   *
+   * @type {delta.Delta<DConf>}
+   */
+  get delta () {
+    if (this._delta === null) {
+      this._delta = this._renderDelta()
+    }
+    return /** @type {any} */ (this._delta)
+  }
+
+  /**
+   * Render the full deep current state into a fresh `isFinal` builder (so subsequent `.apply`s of
+   * deep changes update content in place). Uses this type's active renderer.
+   *
+   * @return {delta.DeltaBuilderAny}
+   */
+  _renderDelta () {
+    const state = /** @type {delta.DeltaBuilderAny} */ (delta.create(this.name))
+    state.isFinal = true
+    state.apply(this.toDelta({ deep: true }))
+    return state
+  }
+
+  /**
+   * Discard the cached deep delta backing {@link YType#delta}.
+   *
+   * After `delta` is first accessed, the cache is updated on every event fired on this type (and
+   * re-diffed by {@link YType#useRenderer}). Call this to drop it — e.g. to reclaim memory, or to
+   * force an exact recomputation after editing while a non-base renderer is active (the incremental
+   * updates can drift from a fresh deep render in that case).
+   */
+  clearCache () {
+    this._delta = null
+  }
+
+  /**
+   * Change the default renderer used by this type. After calling `useRenderer(renderer)`, the
+   * `toDelta`, `applyDelta`, and event methods all use `renderer` whenever no explicit renderer is
+   * passed (an explicit `{ renderer }` argument still overrides it per call).
+   *
+   * If the deep-delta cache ({@link YType#delta}) is being maintained, or a `'delta'` listener is
+   * attached, the content is re-rendered with the new renderer and the difference is emitted on the
+   * `'delta'` channel only (a renderer switch is not a CRDT change, so no `YEvent` is produced).
+   *
+   * @param {AbstractRenderer} renderer
+   * @return {this}
+   */
+  useRenderer (renderer) {
+    const prev = this._renderer
+    const hasDeltaListeners = (this._observers.get('delta')?.size ?? 0) > 0
+    if (renderer !== prev && (this._delta !== null || hasDeltaListeners)) {
+      const oldState = this._delta ?? this._renderDelta()
+      this._renderer = renderer
+      const newState = this._renderDelta()
+      if (this._delta !== null) this._delta = newState
+      if (hasDeltaListeners) {
+        const d = /** @type {any} */ (delta.diff(/** @type {any} */ (oldState), /** @type {any} */ (newState)))
+        if (!d.isEmpty()) this.emit('delta', [d])
+      }
+    } else {
+      this._renderer = renderer
+    }
+    return this
+  }
+
+  /**
+   * Tear down this type as an `RDT`: emit the `'destroy'` event and unregister all `'delta'` /
+   * `'destroy'` listeners. The CRDT content and the `observe`/`observeDeep` handlers are left
+   * untouched — this only releases the RDT/binding observers.
+   */
+  destroy () {
+    this.emit('destroy', [this])
+    super.destroy()
   }
 
   /**
@@ -722,6 +874,9 @@ export class YType {
   _callObserver (transaction, parentSubs) {
     const event = new YEvent(/** @type {any} */ (this), transaction, parentSubs)
     callTypeObservers(/** @type {any} */ (this), transaction, event)
+    // Note: the RDT `'delta'` channel (and the deep-delta cache) is driven in the transaction
+    // cleanup's `changedParentTypes` loop (see Transaction.js) so it bubbles to ancestors like
+    // `observeDeep`, not here where only the directly-changed type is visible.
     if (!transaction.local && this._searchMarker) {
       this._searchMarker.length = 0
     }
@@ -782,55 +937,57 @@ export class YType {
    *
    * @template {boolean} [Deep=false]
    *
-   * @param {AbstractAttributionManager} am
    * @param {Object} [opts]
-   * @param {import('./utils/IdSet.js').IdSet?} [opts.itemsToRender]
+   * @param {AbstractRenderer} [opts.renderer] - renders the content (with attributions); defaults to this type's active renderer (see {@link YType#useRenderer}), i.e. `baseRenderer` unless changed
+   * @param {IdSet?} [opts.itemsToRender]
    * @param {boolean} [opts.retainInserts] - if true, retain rendered inserts with attributions
    * @param {boolean} [opts.retainDeletes] - if true, retain rendered+attributed deletes only
-   * @param {import('./utils/IdSet.js').IdSet?} [opts.deletedItems] - used for computing prevItem in attributes
+   * @param {IdSet?} [opts.deletedItems] - used for computing prevItem in attributes
    * @param {Map<YType,Set<string|null>>|null} [opts.modified] - set of types that should be rendered as modified children
    * @param {Deep} [opts.deep] - render child types as delta
    * @return {Deep extends true ? delta.Delta<DConf> : delta.Delta<DeltaConfDeltaToYType<DConf>>} The Delta representation of this type.
    *
    * @public
    */
-  toDelta (am = noAttributionsManager, opts = {}) {
-    const { itemsToRender = null, retainInserts = false, retainDeletes = false, deletedItems = null, modified = null, deep = false } = opts
+  toDelta (opts = {}) {
+    const { renderer = this._renderer, itemsToRender = null, retainInserts = false, retainDeletes = false, deletedItems = null, deep = false } = opts
+    const { modified = (deep && itemsToRender) ? computeModifiedFromItems(/** @type {Doc} */ (this.doc).store, itemsToRender) : null } = opts
     const renderAttrs = modified?.get(this) || null
-    const renderChildren = !!(modified == null || modified.get(this)?.has(null))
+    const renderChildren = modified == null || !modified.has(this) || /** @type {Set<string|null>} */ (modified.get(this)).has(null)
     /**
      * @type {delta.DeltaBuilderAny}
      */
     const d = /** @type {any} */ (delta.create(this.name))
-    const optsAll = modified == null ? opts : object.assign({}, opts, { modified: null })
-    typeMapGetDelta(d, /** @type {any} */ (this), renderAttrs, am, deep, modified, deletedItems, itemsToRender, opts, optsAll)
+    const optsAll = object.assign({}, opts, { renderer, modified })
+    // opts has been re-computed - do not use opts after this point!
+    typeMapGetDelta(d, /** @type {any} */ (this), renderAttrs, renderer, deep, modified, deletedItems, itemsToRender, optsAll, optsAll)
     if (renderChildren) {
       /**
-       * @type {delta.FormattingAttributes}
+       * @type {delta.Formats}
        */
-      let currentAttributes = {} // saves all current attributes for insert
-      let usingCurrentAttributes = false
+      let currentFormats = {} // saves all current formats for insert
+      let usingCurrentFormats = false
       /**
-       * @type {delta.FormattingAttributes}
+       * @type {delta.Formats}
        */
-      let changedAttributes = {} // saves changed attributes for retain
-      let usingChangedAttributes = false
+      let changedFormats = {} // saves changed formats for retain
+      let usingChangedFormats = false
       /**
-       * Logic for formatting attribute attribution
-       * Everything that comes after an formatting attribute is formatted by the user that created it.
+       * Logic for format attribution
+       * Everything that comes after a format is formatted by the user that created it.
        * Two exceptions:
        * - the user resets formatting to the previously known formatting that is not attributed
-       * - the user deletes a formatting attribute and hence restores the previously known formatting
+       * - the user deletes a format and hence restores the previously known formatting
        *   that is not attributed.
-       * @type {delta.FormattingAttributes}
+       * @type {delta.Formats}
        */
-      const previousUnattributedAttributes = {} // contains previously known unattributed formatting
+      const previousUnattributedFormats = {} // contains previously known unattributed formatting
       /**
-       * @type {delta.FormattingAttributes}
+       * @type {delta.Formats}
        */
-      const previousAttributes = {} // The value before changes
+      const previousFormats = {} // The value before changes
       /**
-       * @type {Array<import('./internals.js').AttributedContent<any>>}
+       * @type {Array<AttributedContent<any>>}
        */
       const cs = []
       for (let item = this._start; item !== null; cs.length = 0) {
@@ -844,12 +1001,12 @@ export class YType {
               if (ir !== rslice.length - 1) {
                 itemContent = itemContent.splice(idrange.len)
               }
-              am.readContent(cs, item.id.client, idrange.clock, item.deleted, content, idrange.exists ? 2 : 0)
+              renderer.readContent(cs, item.id.client, idrange.clock, item.deleted, content, idrange.exists ? 2 : 0)
             }
           }
         } else {
           for (; item !== null && cs.length < 50; item = item.right) {
-            am.readContent(cs, item.id.client, item.id.clock, item.deleted, item.content, 1)
+            renderer.readContent(cs, item.id.client, item.id.clock, item.deleted, item.content, 1)
           }
         }
         for (let i = 0; i < cs.length; i++) {
@@ -857,11 +1014,11 @@ export class YType {
           // render (attributed) content even if it was deleted
           const renderContent = c.render && (!c.deleted || c.attrs != null)
           // content that was just deleted. It is not rendered as an insertion, because it doesn't
-          // have any attributes.
+          // have any formats.
           const renderDelete = c.render && c.deleted
-          // existing content that should be retained, only adding changed attributes
+          // existing content that should be retained, only adding changed formats
           const retainContent = !c.render && (!c.deleted || c.attrs != null)
-          const attribution = (renderContent || c.content.constructor === ContentFormat) ? createAttributionFromAttributionItems(c.attrs, c.deleted) : null
+          const attribution = (renderContent || c.content.constructor === ContentFormat) ? createAttributionFromAttributionItems(c.attrs, c.deleted) : undefined
           switch (c.content.constructor) {
             case ContentDeleted: {
               if (renderDelete) d.delete(c.content.getLength())
@@ -869,18 +1026,26 @@ export class YType {
             }
             case ContentString:
               if (renderContent) {
-                d.usedAttributes = currentAttributes
-                usingCurrentAttributes = true
                 if (c.deleted ? retainDeletes : retainInserts) {
-                  d.retain(/** @type {ContentString} */ (c.content).str.length, null, attribution ?? {})
+                  // a retain expresses the format *diff* against existing (cached) content, so use
+                  // `changedFormats`: a format removed this change (e.g. its marker was deleted)
+                  // is present there as a `null` clear, whereas `currentFormats` (absolute) can
+                  // only re-assert present formats and would silently keep a stale one.
+                  d.usedFormats = changedFormats
+                  usingChangedFormats = true
+                  // change render: a retained item with no attribution means its attribution was
+                  // removed → emit `null` (clear) rather than `{}` (skip). Present attribution merges.
+                  d.retain(/** @type {ContentString} */ (c.content).str.length, undefined, attribution ?? null)
                 } else {
-                  d.insert(/** @type {ContentString} */ (c.content).str, null, attribution)
+                  d.usedFormats = currentFormats
+                  usingCurrentFormats = true
+                  d.insert(/** @type {ContentString} */ (c.content).str, undefined, attribution)
                 }
               } else if (renderDelete) {
                 d.delete(c.content.getLength())
               } else if (retainContent) {
-                d.usedAttributes = changedAttributes
-                usingChangedAttributes = true
+                d.usedFormats = changedFormats
+                usingChangedFormats = true
                 d.retain(c.content.getLength())
               }
               break
@@ -890,114 +1055,153 @@ export class YType {
             case ContentType:
             case ContentBinary:
               if (renderContent) {
-                d.usedAttributes = currentAttributes
-                usingCurrentAttributes = true
                 if (c.deleted ? retainDeletes : retainInserts) {
-                  d.retain(c.content.getLength(), null, attribution ?? {})
+                  // a retain expresses the format *diff* → use `changedFormats` (see ContentString)
+                  d.usedFormats = changedFormats
+                  usingChangedFormats = true
+                  if (c.deleted && c.content.constructor === ContentType) {
+                    // @todo use current transaction instead
+                    d.modify(/** @type {any} */ (c.content).type.toDelta(optsAll), undefined, attribution ?? null)
+                  } else {
+                    d.retain(c.content.getLength(), undefined, attribution ?? null)
+                  }
                 } else if (deep && c.content.constructor === ContentType) {
-                  d.insert([/** @type {any} */(c.content).type.toDelta(am, optsAll)], null, attribution)
+                  d.usedFormats = currentFormats
+                  usingCurrentFormats = true
+                  d.insert([/** @type {any} */(c.content).type.toDelta(optsAll)], undefined, attribution)
                 } else {
-                  d.insert(c.content.getContent(), null, attribution)
+                  d.usedFormats = currentFormats
+                  usingCurrentFormats = true
+                  d.insert(c.content.getContent(), undefined, attribution)
                 }
               } else if (renderDelete) {
                 d.delete(1)
               } else if (retainContent) {
                 if (c.content.constructor === ContentType && modified?.has(/** @type {ContentType} */ (c.content).type)) {
                   // @todo use current transaction instead
-                  d.modify(/** @type {any} */ (c.content).type.toDelta(am, opts))
+                  d.modify(/** @type {any} */ (c.content).type.toDelta(optsAll))
                 } else {
-                  d.usedAttributes = changedAttributes
-                  usingChangedAttributes = true
+                  d.usedFormats = changedFormats
+                  usingChangedFormats = true
                   d.retain(1)
                 }
               }
               break
             case ContentFormat: {
               const { key, value } = /** @type {ContentFormat} */ (c.content)
-              const currAttrVal = currentAttributes[key] ?? null
-              if (attribution != null && (c.deleted || !object.hasProperty(previousUnattributedAttributes, key))) {
-                previousUnattributedAttributes[key] = c.deleted ? value : currAttrVal
+              const currFormatVal = currentFormats[key] ?? null
+              if (attribution != null && (c.deleted || !object.hasProperty(previousUnattributedFormats, key))) {
+                previousUnattributedFormats[key] = c.deleted ? value : currFormatVal
               }
-              // @todo write a function "updateCurrentAttributes" and "updateChangedAttributes"
-              // # Update Attributes
+              // @todo write a function "updateCurrentFormats" and "updateChangedFormats"
+              // # Update Formats
               if (renderContent || renderDelete) {
                 // create fresh references
-                if (usingCurrentAttributes) {
-                  currentAttributes = object.assign({}, currentAttributes)
-                  usingCurrentAttributes = false
+                if (usingCurrentFormats) {
+                  currentFormats = object.assign({}, currentFormats)
+                  usingCurrentFormats = false
                 }
-                if (usingChangedAttributes) {
-                  usingChangedAttributes = false
-                  changedAttributes = object.assign({}, changedAttributes)
+                if (usingChangedFormats) {
+                  usingChangedFormats = false
+                  changedFormats = object.assign({}, changedFormats)
                 }
               }
               if (renderContent || renderDelete) {
                 if (c.deleted) {
                   // content was deleted, but is possibly attributed
-                  if (!equalAttrs(value, currAttrVal)) { // do nothing if nothing changed
-                    if (equalAttrs(currAttrVal, previousAttributes[key] ?? null) && changedAttributes[key] !== undefined) {
-                      delete changedAttributes[key]
+                  if (!equalFormats(value, currFormatVal)) { // do nothing if nothing changed
+                    if (equalFormats(currFormatVal, previousFormats[key] ?? null) && changedFormats[key] !== undefined) {
+                      delete changedFormats[key]
                     } else {
-                      changedAttributes[key] = currAttrVal
+                      changedFormats[key] = currFormatVal
                     }
-                    // current attributes doesn't change
-                    previousAttributes[key] = value
+                    // current formats doesn't change
+                    previousFormats[key] = value
                   }
                 } else { // !c.deleted
                   // content was inserted, and is possibly attributed
-                  if (equalAttrs(value, currAttrVal)) {
+                  if (equalFormats(value, currFormatVal)) {
                     // item.delete(transaction)
-                  } else if (equalAttrs(value, previousAttributes[key] ?? null)) {
-                    delete changedAttributes[key]
+                  } else if (equalFormats(value, previousFormats[key] ?? null)) {
+                    delete changedFormats[key]
                   } else {
-                    changedAttributes[key] = value
+                    changedFormats[key] = value
                   }
                   if (value == null) {
-                    delete currentAttributes[key]
+                    delete currentFormats[key]
                   } else {
-                    currentAttributes[key] = value
+                    currentFormats[key] = value
                   }
                 }
               } else if (retainContent && !c.deleted) {
-                // fresh reference to currentAttributes only
-                if (usingCurrentAttributes) {
-                  currentAttributes = object.assign({}, currentAttributes)
-                  usingCurrentAttributes = false
+                // fresh reference to currentFormats only
+                if (usingCurrentFormats) {
+                  currentFormats = object.assign({}, currentFormats)
+                  usingCurrentFormats = false
                 }
-                if (usingChangedAttributes && changedAttributes[key] !== undefined) {
-                  usingChangedAttributes = false
-                  changedAttributes = object.assign({}, changedAttributes)
+                if (usingChangedFormats && changedFormats[key] !== undefined) {
+                  usingChangedFormats = false
+                  changedFormats = object.assign({}, changedFormats)
                 }
                 if (value == null) {
-                  delete currentAttributes[key]
+                  delete currentFormats[key]
                 } else {
-                  currentAttributes[key] = value
+                  currentFormats[key] = value
                 }
-                delete changedAttributes[key]
-                previousAttributes[key] = value
+                delete changedFormats[key]
+                previousFormats[key] = value
               }
               // # Update Attributions
-              if (attribution != null || object.hasProperty(previousUnattributedAttributes, key)) {
+              // A format marker deleted in a change render under an *attributing* renderer nets to no
+              // attribution (its insert+delete suggestion cancels → `attribution == null`), yet it ends
+              // the attributed range it opened: the following retained content must drop the stale
+              // `{ format: { [key]: [] } }` the marker's insertion wrote to the cache. Emit an explicit
+              // `null` leaf for the key (a context-wide `useAttribution(null)` cannot carry a per-key
+              // clear). Conditions: only an attributing render (`renderer !== baseRenderer`; the base
+              // renderer has no attributions to clear), and only when the deletion actually *removes*
+              // the format — i.e. it reverts to no value (`currFormatVal == null`). If it reverts to a
+              // still-present surrounding value (e.g. deleting a `bold:null` marker re-exposes an
+              // enclosing attributed `bold:true`, as when re-bolding), the attribution is preserved.
+              const isDeletedFormatClear = attribution == null && renderer !== baseRenderer && renderDelete && c.deleted && itemsToRender != null && currFormatVal == null && !equalFormats(value, currFormatVal)
+              if (attribution != null || isDeletedFormatClear || object.hasProperty(previousUnattributedFormats, key)) {
                 /**
-                 * @type {import('./utils/AttributionManager.js').Attribution}
+                 * @type {Attribution}
                  */
                 const formattingAttribution = object.assign({}, d.usedAttribution)
-                const changedAttributedAttributes = /** @type {{ [key: string]: Array<any> }} */ (formattingAttribution.format = object.assign({}, formattingAttribution.format ?? {}))
-                if (attribution == null || equalAttrs(previousUnattributedAttributes[key], currentAttributes[key] ?? null)) {
-                  // an unattributed formatting attribute was found or an attributed formatting
-                  // attribute was found that resets to the previous status
-                  delete changedAttributedAttributes[key]
-                  delete previousUnattributedAttributes[key]
+                const changedAttributedFormats = /** @type {{ [key: string]: Array<any>|null }} */ (formattingAttribution.format = object.assign({}, formattingAttribution.format ?? {}))
+                const sameAsPreviousAttributions = equalFormats(previousUnattributedFormats[key], currentFormats[key] ?? null)
+                if (isDeletedFormatClear) {
+                  changedAttributedFormats[key] = null
+                  delete previousUnattributedFormats[key]
+                } else if (attribution == null && !sameAsPreviousAttributions) {
+                  // skip
+                } else if (attribution == null || sameAsPreviousAttributions) {
+                  // an unattributed format was found or an attributed format
+                  // was found that resets to the previous status. When this format item is
+                  // itself rendered this transaction (`renderContent || renderDelete`) in a change/diff
+                  // render (`itemsToRender != null`), it is the END of an attributed format range:
+                  // emit an explicit clear (a `null` leaf) so the retained content drops any stale
+                  // `{ format: { [key]: [] } }` from the maintained `delta` cache — a bare context-skip
+                  // (`delete`) would leave it in place. For a merely-retained (unchanged) boundary, or a
+                  // full insert render (removal is already modeled as absence in `currentFormats`),
+                  // just drop the key: a change render must not emit ops for unchanged ranges, and
+                  // inserts must stay free of a spurious `{ format: { [key]: null } }`.
+                  if (attribution != null && itemsToRender != null && (renderContent || renderDelete)) {
+                    changedAttributedFormats[key] = null
+                  } else {
+                    delete changedAttributedFormats[key]
+                  }
+                  delete previousUnattributedFormats[key]
                 } else {
-                  const by = changedAttributedAttributes[key] = (changedAttributedAttributes[key]?.slice() ?? [])
+                  const by = changedAttributedFormats[key] = (changedAttributedFormats[key]?.slice() ?? [])
                   by.push(...((c.deleted ? attribution.delete : attribution.insert) ?? []))
-                  const attributedAt = (c.deleted ? attribution.deletedAt : attribution.insertedAt)
+                  const attributedAt = (c.deleted ? attribution.deleteAt : attribution.insertAt)
                   if (attributedAt) formattingAttribution.formatAt = attributedAt
                 }
-                if (object.isEmpty(changedAttributedAttributes)) {
+                if (object.isEmpty(changedAttributedFormats)) {
                   d.useAttribution(null)
-                } else if (attribution != null) {
-                  const attributedAt = (c.deleted ? attribution.deletedAt : attribution.insertedAt)
+                } else if (attribution != null || isDeletedFormatClear) {
+                  const attributedAt = (c.deleted ? attribution?.deleteAt : attribution?.insertAt)
                   if (attributedAt != null) formattingAttribution.formatAt = attributedAt
                   d.useAttribution(formattingAttribution)
                 }
@@ -1015,28 +1219,33 @@ export class YType {
    * Render the difference to another ydoc (which can be empty) and highlight the differences with
    * attributions.
    *
-   * @param {AbstractAttributionManager} am
+   * @param {Object} [opts]
+   * @param {AbstractRenderer} [opts.renderer] - renders the content (with attributions); defaults to this type's active renderer (see {@link YType#useRenderer}), i.e. `baseRenderer` unless changed
    * @return {delta.Delta<DConf>}
    */
-  toDeltaDeep (am = noAttributionsManager) {
-    return /** @type {any} */ (this.toDelta(am, { deep: true }))
+  toDeltaDeep (opts = {}) {
+    return /** @type {any} */ (this.toDelta({ ...opts, deep: true }))
   }
 
   /**
    * Apply a {@link Delta} on this shared type.
    *
    * @param {delta.DeltaAny} d The changes to apply on this element.
-   * @param {AbstractAttributionManager} am
+   * @param {Object} [opts]
+   * @param {AbstractRenderer} [opts.renderer] - renders the content (with attributions); defaults to this type's active renderer (see {@link YType#useRenderer}), i.e. `baseRenderer` unless changed
+   * @return {null} The lib0 `RDT` "fix" of this apply — always `null`: a `YType` accepts every valid
+   * delta as-is and never needs to self-correct.
    *
    * @public
    */
-  applyDelta (d, am = noAttributionsManager) {
+  applyDelta (d, { renderer = this._renderer } = {}) {
+    if (d.isEmpty()) return null
     if (this.doc == null) {
       (this._prelim || (this._prelim = /** @type {any} */ (delta.create()))).apply(d)
-    } else {
+    } else if (this._item?.deleted !== true) {
       // @todo this was moved here from ytext. Make this more generic
       transact(this.doc, transaction => {
-        const currPos = new ItemTextListPosition(null, this._start, 0, new Map(), am)
+        const currPos = new ItemTextListPosition(null, this._start, 0, new Map(), renderer)
         for (const op of d.children) {
           if (delta.$textOp.check(op)) {
             insertContent(transaction, /** @type {any} */ (this), currPos, new ContentString(op.insert), op.format || {})
@@ -1047,11 +1256,10 @@ export class YType {
           } else if (delta.$deleteOp.check(op)) {
             deleteText(transaction, currPos, op.delete)
           } else if (delta.$modifyOp.check(op)) {
-            if (currPos.right) {
-              /** @type {ContentType} */ (currPos.right.content).type.applyDelta(op.value)
-            } else {
-              error.unexpectedCase()
-            }
+            let item = currPos.right
+            while (item != null && (item.deleted || !item.countable)) { item = item.next }
+            if (item == null || item.content.constructor !== ContentType) { error.unexpectedCase() }
+            /** @type {ContentType} */ (item.content).type.applyDelta(op.value, { renderer })
             currPos.formatText(transaction, /** @type {any} */ (this), 1, op.format || {})
           } else {
             error.unexpectedCase()
@@ -1067,12 +1275,12 @@ export class YType {
             if (!(sub instanceof YType)) {
               error.unexpectedCase()
             }
-            sub.applyDelta(op.value)
+            sub.applyDelta(op.value, { renderer })
           }
         }
       })
     }
-    return this
+    return null
   }
 
   /**
@@ -1178,7 +1386,7 @@ export class YType {
    *
    * @param {number} index The index to insert content at.
    * @param {Array<delta.DeltaConfGetChildren<DConf>>|delta.DeltaConfGetText<DConf>} content Array of content to append.
-   * @param {delta.FormattingAttributes} [format]
+   * @param {delta.Formats} [format]
    */
   insert (index, content, format) {
     this.applyDelta(delta.create().retain(index).insert(/** @type {any} */ (content), format).done())
@@ -1199,7 +1407,7 @@ export class YType {
    *
    * @param {number} index The index to insert content at.
    * @param {number} length The index to insert content at.
-   * @param {delta.FormattingAttributes} formats
+   * @param {delta.Formats} formats
    *
    */
   format (index, length, formats) {
@@ -1273,7 +1481,9 @@ export class YType {
     const children = []
     for (const child of dcontent.children) {
       if (delta.$insertOp.check(child)) {
-        children.push(...child.insert)
+        for (let i = 0; i < child.insert.length; i++) {
+          children.push(child.insert[i])
+        }
       } else if (delta.$textOp.check(child)) {
         children.push(child.insert)
       }
@@ -1428,8 +1638,8 @@ export class YType {
   _write (encoder) {
     encoder.writeTypeRef(this._legacyTypeRef)
     switch (this._legacyTypeRef) {
-      case contentType.YXmlElementRefID:
-      case contentType.YXmlHookRefID: {
+      case YXmlElementRefID:
+      case YXmlHookRefID: {
         encoder.writeKey(this.name)
         break
       }
@@ -1438,17 +1648,32 @@ export class YType {
 }
 
 /**
- * @param {import('./utils/UpdateDecoder.js').UpdateDecoderV1 | import('./utils/UpdateDecoder.js').UpdateDecoderV2} decoder
- * @return {YType}
- *
- * @private
- * @function
+ * @template {import('lib0/delta').ReadableDeltaConf} DConf
+ * @param {DConf} _dconf
+ * @return {s.Schema<YType<import('lib0/delta').ReadDeltaConf<DConf>>>}
  */
-export const readYType = decoder => {
-  const typeRef = decoder.readTypeRef()
-  const ytype = new YType(typeRef === contentType.YXmlElementRefID || typeRef === contentType.YXmlHookRefID ? decoder.readKey() : null)
-  ytype._legacyTypeRef = typeRef
-  return ytype
+export const $ytype = _dconf => s.$instanceOf(YType)
+export const $ytypeAny = s.$instanceOf(YType)
+
+/**
+ * @param {StructStore} store
+ * @param {IdSet} items
+ */
+export const computeModifiedFromItems = (store, items) => {
+  /**
+   * @type {Map<YType,Set<null|string>>}
+   */
+  const modified = new Map()
+  iterateStructsByIdSetWithoutSplits(store, items, /** @param {Item | GC | Skip | null} item */ item => {
+    while (item instanceof Item) {
+      const parent = /** @type {YType} */ (item.parent)
+      const conf = map.setIfUndefined(modified, parent, set.create)
+      if (conf.has(item.parentSub)) break // has already been marked as modified
+      conf.add(item.parentSub)
+      item = parent._item
+    }
+  })
+  return modified
 }
 
 /**
@@ -1456,7 +1681,7 @@ export const readYType = decoder => {
  * @param {any} b
  * @return {boolean}
  */
-export const equalAttrs = (a, b) => a === b || (typeof a === 'object' && typeof b === 'object' && a && b && object.equalFlat(a, b))
+export const equalFormats = (a, b) => a === b || (typeof a === 'object' && typeof b === 'object' && a && b && object.equalFlat(a, b))
 
 /**
  * @template {delta.DeltaConf} DConf
@@ -1561,7 +1786,7 @@ export const typeListInsertGenericsAfter = (transaction, parent, referenceItem,
   let jsonContent = []
   const packJsonContent = () => {
     if (jsonContent.length > 0) {
-      left = new Item(createID(ownClientId, getState(store, ownClientId)), left, left && left.lastId, right, right && right.id, parent, null, new ContentAny(jsonContent))
+      left = new Item(createID(ownClientId, store.getClock(ownClientId)), left, left && left.lastId, right, right && right.id, parent, null, new ContentAny(jsonContent))
       left.integrate(transaction, 0)
       jsonContent = []
     }
@@ -1586,16 +1811,15 @@ export const typeListInsertGenericsAfter = (transaction, parent, referenceItem,
           switch (c.constructor) {
             case Uint8Array:
             case ArrayBuffer:
-              left = new Item(createID(ownClientId, getState(store, ownClientId)), left, left && left.lastId, right, right && right.id, parent, null, new ContentBinary(new Uint8Array(/** @type {Uint8Array} */ (c))))
-              left.integrate(transaction, 0)
-              break
-            case Doc:
-              left = new Item(createID(ownClientId, getState(store, ownClientId)), left, left && left.lastId, right, right && right.id, parent, null, new ContentDoc(/** @type {Doc} */ (c)))
+              left = new Item(createID(ownClientId, store.getClock(ownClientId)), left, left && left.lastId, right, right && right.id, parent, null, new ContentBinary(new Uint8Array(/** @type {Uint8Array} */ (c))))
               left.integrate(transaction, 0)
               break
             default:
-              if (c instanceof YType) {
-                left = new Item(createID(ownClientId, getState(store, ownClientId)), left, left && left.lastId, right, right && right.id, parent, null, new ContentType(/** @type {any} */ (c)))
+              if ($ydoc.check(c)) {
+                left = new Item(createID(ownClientId, store.getClock(ownClientId)), left, left && left.lastId, right, right && right.id, parent, null, createContentDocFromDoc(/** @type {Doc} */ (c)))
+                left.integrate(transaction, 0)
+              } else if (c instanceof YType) {
+                left = new Item(createID(ownClientId, store.getClock(ownClientId)), left, left && left.lastId, right, right && right.id, parent, null, new ContentType(/** @type {any} */ (c)))
                 left.integrate(transaction, 0)
               } else {
                 throw new Error('Unexpected content type in insert operation')
@@ -1776,18 +2000,17 @@ export const typeMapSet = (transaction, parent, key, value) => {
       case Uint8Array:
         content = new ContentBinary(/** @type {Uint8Array} */ (value))
         break
-      case Doc:
-        content = new ContentDoc(/** @type {Doc} */ (value))
-        break
       default:
-        if (value instanceof YType) {
+        if ($ydoc.check(value)) {
+          content = createContentDocFromDoc(/** @type {Doc} */ (value))
+        } else if (value instanceof YType) {
           content = new ContentType(/** @type {any} */ (value))
         } else {
           throw new Error('Unexpected content type')
         }
     }
   }
-  new Item(createID(ownClientId, getState(doc.store, ownClientId)), left, left && left.lastId, null, null, parent, key, content).integrate(transaction, 0)
+  new Item(createID(ownClientId, doc.store.getClock(ownClientId)), left, left && left.lastId, null, null, parent, key, content).integrate(transaction, 0)
 }
 
 /**
@@ -1838,18 +2061,18 @@ export const typeMapGetAll = (parent) => {
  * @param {TypeDelta} d
  * @param {YType} parent
  * @param {Set<string|null>?} attrsToRender
- * @param {import('./internals.js').AbstractAttributionManager} am
+ * @param {AbstractRenderer} renderer
  * @param {boolean} deep
  * @param {Set<YType>|Map<YType,any>|null} [modified] - set of types that should be rendered as modified children
- * @param {import('./utils/IdSet.js').IdSet?} [deletedItems]
- * @param {import('./utils/IdSet.js').IdSet?} [itemsToRender]
+ * @param {IdSet?} [deletedItems]
+ * @param {IdSet?} [itemsToRender]
  * @param {any} [opts]
  * @param {any} [optsAll]
  *
  * @private
  * @function
  */
-export const typeMapGetDelta = (d, parent, attrsToRender, am, deep, modified, deletedItems, itemsToRender, opts, optsAll) => {
+export const typeMapGetDelta = (d, parent, attrsToRender, renderer, deep, modified, deletedItems, itemsToRender, opts, optsAll) => {
   // @todo support modified ops!
   /**
    * @param {Item} item
@@ -1857,30 +2080,43 @@ export const typeMapGetDelta = (d, parent, attrsToRender, am, deep, modified, de
    */
   const renderAttrs = (item, key) => {
     /**
-     * @type {Array<import('./internals.js').AttributedContent<any>>}
+     * @type {Array<AttributedContent>}
      */
     const cs = []
-    am.readContent(cs, item.id.client, item.id.clock, item.deleted, item.content, 1)
-    const { deleted, attrs, content, render } = cs[cs.length - 1]
-    if (!render) return
+    renderer.readContent(cs, item.id.client, item.id.clock, item.deleted, item.content, 1)
+    if (cs.length === 0) return // the renderer surfaces nothing for this attribute (e.g. a diff renderer hiding an unchanged delete)
+    const { deleted, attrs, content } = cs[cs.length - 1]
     const attribution = createAttributionFromAttributionItems(attrs, deleted)
     let c = array.last(content.getContent())
     if (deleted) {
-      if (itemsToRender == null || itemsToRender.hasId(item.lastId)) {
+      if (attribution != null) {
+        // Item surfaced under attribution (suggestion view / diff renderer, either in snapshot mode
+        // or in an event-driven render). The attribute is still observable in the rendered state, so
+        // emit a positive `SetAttrOp` carrying the attribution metadata - matching how content
+        // children are rendered for the same case (positive `InsertOp` with attribution, never
+        // `DeleteOp`).
+        if (itemsToRender == null || itemsToRender.hasId(item.lastId)) {
+          d.setAttr(key, c, attribution)
+        }
+      } else if (itemsToRender != null && itemsToRender.hasId(item.lastId)) {
+        // Hard-deleted attribute within a change render: emit the `deleteAttr` op so consumers (the
+        // `YEvent` delta, RDT bindings, the maintained `delta` cache) can apply the removal. In
+        // full-state mode (`itemsToRender == null`) the attribute is simply omitted (above renders
+        // run with `render === false` for such items, so nothing was emitted before either).
         d.deleteAttr(key, attribution, c)
       }
     } else if (deep && c instanceof YType && modified?.has(c)) {
-      d.modifyAttr(key, c.toDelta(am, opts))
+      d.modifyAttr(key, c.toDelta(opts))
     } else {
       // find prev content
       let prevContentItem = item
-      // this algorithm is problematic. should check all previous content using am.readcontent
+      // this algorithm is problematic. should check all previous content using renderer.readcontent
       for (; prevContentItem.left !== null && deletedItems?.hasId(prevContentItem.left.lastId); prevContentItem = prevContentItem.left) {
         // nop
       }
       const prevValue = (prevContentItem !== item && itemsToRender?.hasId(prevContentItem.lastId)) ? array.last(prevContentItem.content.getContent()) : undefined
       if (deep && c instanceof YType) {
-        c = /** @type {any} */(c).toDelta(am, optsAll)
+        c = /** @type {any} */(c).toDelta(optsAll)
       }
       d.setAttr(key, c, attribution, prevValue)
     }
@@ -1906,6 +2142,17 @@ export const typeMapHas = (parent, key) => {
   return val !== undefined && !val.deleted
 }
 
+/**
+ * @param {Item} item
+ * @param {Snapshot|undefined} snapshot
+ *
+ * @protected
+ * @function
+ */
+export const isVisible = (item, snapshot) => snapshot === undefined
+  ? !item.deleted
+  : snapshot.sv.has(item.id.client) && (snapshot.sv.get(item.id.client) || 0) > item.id.clock && !snapshot.ds.hasId(item.id)
+
 /**
  * @param {YType<any>} parent
  * @param {string} key
@@ -1962,3 +2209,127 @@ export const createMapIterator = type => {
   type.doc ?? warnPrematureAccess()
   return iterator.iteratorFilter(type._map.entries(), /** @param {any} entry */ entry => !entry[1].deleted)
 }
+
+/**
+ * @private
+ *
+ * @param {UpdateDecoderV1 | UpdateDecoderV2} decoder
+ * @return {ContentType}
+ */
+export const readContentType = decoder => new ContentType(readYType(decoder))
+
+/**
+ * @private
+ *
+ * @param {UpdateDecoderV1 | UpdateDecoderV2} decoder
+ * @return {ContentString}
+ */
+export const readContentString = decoder => new ContentString(decoder.readString())
+
+/**
+ * @private
+ *
+ * @param {UpdateDecoderV1 | UpdateDecoderV2} decoder
+ * @return {ContentJSON}
+ */
+export const readContentJSON = decoder => {
+  const len = decoder.readLen()
+  const cs = []
+  for (let i = 0; i < len; i++) {
+    const c = decoder.readString()
+    if (c === 'undefined') {
+      cs.push(undefined)
+    } else {
+      cs.push(JSON.parse(c))
+    }
+  }
+  return new ContentJSON(cs)
+}
+
+/**
+ * @param {UpdateDecoderV1 | UpdateDecoderV2} decoder
+ * @return {ContentFormat}
+ */
+export const readContentFormat = decoder => new ContentFormat(decoder.readKey(), decoder.readJSON())
+
+/**
+ * @private
+ *
+ * @param {UpdateDecoderV1 | UpdateDecoderV2} decoder
+ * @return {ContentEmbed}
+ */
+export const readContentEmbed = decoder => new ContentEmbed(decoder.readJSON())
+
+/**
+ * @private
+ *
+ * @param {UpdateDecoderV1 | UpdateDecoderV2} decoder
+ * @return {ContentDoc}
+ */
+export const readContentDoc = decoder => new ContentDoc(decoder.readString(), decoder.readAny())
+
+/**
+ * @param {UpdateDecoderV1 | UpdateDecoderV2} decoder
+ * @return {ContentAny}
+ */
+export const readContentAny = decoder => {
+  const len = decoder.readLen()
+  const cs = []
+  for (let i = 0; i < len; i++) {
+    cs.push(decoder.readAny())
+  }
+  return new ContentAny(cs)
+}
+
+/**
+ * @param {UpdateDecoderV1 | UpdateDecoderV2 } decoder
+ * @return {ContentBinary}
+ */
+export const readContentBinary = decoder => new ContentBinary(decoder.readBuf())
+
+/**
+ * @private
+ *
+ * @param {UpdateDecoderV1 | UpdateDecoderV2 } decoder
+ * @return {ContentDeleted}
+ */
+export const readContentDeleted = decoder => new ContentDeleted(decoder.readLen())
+
+/**
+ * A lookup map for reading Item content.
+ *
+ * @type {Array<function(UpdateDecoderV1 | UpdateDecoderV2):AbstractContent>}
+ */
+export const contentRefs = [
+  () => { error.unexpectedCase() }, // GC is not ItemContent
+  readContentDeleted, // 1
+  readContentJSON, // 2
+  readContentBinary, // 3
+  readContentString, // 4
+  readContentEmbed, // 5
+  readContentFormat, // 6
+  readContentType, // 7
+  readContentAny, // 8
+  readContentDoc, // 9
+  () => { error.unexpectedCase() } // 10 - Skip is not ItemContent
+]
+
+/**
+ * @param {UpdateDecoderV1 | UpdateDecoderV2} decoder
+ * @param {number} info
+ */
+export const readItemContent = (decoder, info) => contentRefs[info & binary.BITS5](decoder)
+
+/**
+ * @param {UpdateDecoderV1 | UpdateDecoderV2} decoder
+ * @return {YType}
+ *
+ * @private
+ * @function
+ */
+export const readYType = decoder => {
+  const typeRef = decoder.readTypeRef()
+  const ytype = new YType(typeRef === YXmlElementRefID || typeRef === YXmlHookRefID ? decoder.readKey() : null)
+  ytype._legacyTypeRef = typeRef
+  return ytype
+}