prosemirror-view - npm Package Compare versions

Comparing version 1.35.0 to 1.36.0

dist/index.d.ts

@@ -248,5 +248,2 @@ import { EditorState, Transaction, Selection, Plugin } from 'prosemirror-state';
 
-Mark views only support `dom` and `contentDOM`, and don't support
-any of the node view methods.
-
 Objects returned as node views must conform to this interface.
@@ -327,6 +324,31 @@ */
     Called when the node view is removed from the editor or the whole
-    editor is destroyed. (Not available for marks.)
+    editor is destroyed.
     */
     destroy?: () => void;
 }
+/**
+By default, document marks are rendered using the result of the
+[`toDOM`](https://prosemirror.net/docs/ref/#model.MarkSpec.toDOM) method of their spec, and managed entirely
+by the editor. For some use cases, you want more control over the behavior
+of a mark's in-editor representation, and need to
+[define](https://prosemirror.net/docs/ref/#view.EditorProps.markViews) a custom mark view.
+
+Objects returned as mark views must conform to this interface.
+*/
+interface MarkView {
+    /**
+    The outer DOM node that represents the document node.
+    */
+    dom: DOMNode;
+    /**
+    The DOM node that should hold the mark's content. When this is not
+    present, the `dom` property is used as the content DOM.
+    */
+    contentDOM?: HTMLElement | null;
+    /**
+    Called when the mark view is removed from the editor or the whole
+    editor is destroyed.
+    */
+    destroy?: () => void;
+}
 declare class ViewDesc {
@@ -655,6 +677,3 @@ parent: ViewDesc | undefined;
 */
-type MarkViewConstructor = (mark: Mark, view: EditorView, inline: boolean) => {
-    dom: HTMLElement;
-    contentDOM?: HTMLElement;
-};
+type MarkViewConstructor = (mark: Mark, view: EditorView, inline: boolean) => MarkView;
 /**
@@ -942,2 +961,2 @@ Helper type that maps event names to event object types, but
 
-export { type DOMEventMap, Decoration, type DecorationAttrs, DecorationSet, type DecorationSource, type DirectEditorProps, type EditorProps, EditorView, type MarkViewConstructor, type NodeView, type NodeViewConstructor };
+export { type DOMEventMap, Decoration, type DecorationAttrs, DecorationSet, type DecorationSource, type DirectEditorProps, type EditorProps, EditorView, type MarkView, type MarkViewConstructor, type NodeView, type NodeViewConstructor };

package.json

 {
   "name": "prosemirror-view",
-  "version": "1.35.0",
+  "version": "1.36.0",
   "description": "ProseMirror's view component",
@@ -5,0 +5,0 @@ "type": "module",

src/clipboard.ts

@@ -207,2 +207,4 @@ import {Slice, Fragment, DOMParser, DOMSerializer, ResolvedPos, NodeType, Node} from "prosemirror-model"
 
+let _policy: any = null
+
 function maybeWrapTrusted(html: string): string {
@@ -214,3 +216,4 @@ let trustedTypes = (window as any).trustedTypes
   // a way that makes the browser allow us to use its parser again.
-  return trustedTypes.createPolicy("detachedDocument", {createHTML: (s: string) => s}).createHTML(html)
+  if (!_policy) _policy = trustedTypes.createPolicy("ProseMirrorClipboard", {createHTML: (s: string) => s})
+  return _policy.createHTML(html)
 }
@@ -217,0 +220,0 @@

src/index.ts

@@ -6,3 +6,3 @@ import {NodeSelection, EditorState, Plugin, PluginView, Transaction, Selection} from "prosemirror-state"
         resetScrollPos, focusPreventScroll} from "./domcoords"
-import {docViewDesc, ViewDesc, NodeView, NodeViewDesc} from "./viewdesc"
+import {docViewDesc, ViewDesc, NodeView, NodeViewDesc, MarkView} from "./viewdesc"
 import {initInput, destroyInput, dispatchEvent, ensureListeners, clearComposition,
@@ -18,3 +18,3 @@ InputState, doPaste, Dragging, findCompositionNode} from "./input"
 export {Decoration, DecorationSet, DecorationAttrs, DecorationSource} from "./decoration"
-export {NodeView} from "./viewdesc"
+export {NodeView, MarkView} from "./viewdesc"
 
@@ -581,3 +581,3 @@ // Exported for testing
 /// mark views.
-export type MarkViewConstructor = (mark: Mark, view: EditorView, inline: boolean) => {dom: HTMLElement, contentDOM?: HTMLElement}
+export type MarkViewConstructor = (mark: Mark, view: EditorView, inline: boolean) => MarkView
 
@@ -584,0 +584,0 @@ type NodeViewSet = {[name: string]: NodeViewConstructor | MarkViewConstructor}

src/README.md

@@ -21,2 +21,4 @@ ProseMirror's view module displays a given [editor
 
+@MarkView
+
 @DOMEventMap
@@ -23,0 +25,0 @@

src/viewdesc.ts

@@ -20,5 +20,2 @@ import {DOMSerializer, Fragment, Mark, Node, TagParseRule} from "prosemirror-model"
 ///
-/// Mark views only support `dom` and `contentDOM`, and don't support
-/// any of the node view methods.
-///
 /// Objects returned as node views must conform to this interface.
@@ -88,6 +85,26 @@ export interface NodeView {
   /// Called when the node view is removed from the editor or the whole
-  /// editor is destroyed. (Not available for marks.)
+  /// editor is destroyed.
   destroy?: () => void
 }
 
+/// By default, document marks are rendered using the result of the
+/// [`toDOM`](#model.MarkSpec.toDOM) method of their spec, and managed entirely
+/// by the editor. For some use cases, you want more control over the behavior
+/// of a mark's in-editor representation, and need to
+/// [define](#view.EditorProps.markViews) a custom mark view.
+///
+/// Objects returned as mark views must conform to this interface.
+export interface MarkView {
+  /// The outer DOM node that represents the document node.
+  dom: DOMNode
+
+  /// The DOM node that should hold the mark's content. When this is not
+  /// present, the `dom` property is used as the content DOM.
+  contentDOM?: HTMLElement | null
+  
+  /// Called when the mark view is removed from the editor or the whole
+  /// editor is destroyed.
+  destroy?: () => void
+}
+
 // View descriptions are data structures that describe the DOM that is
@@ -577,3 +594,3 @@ // used to represent the editor's content. They are used for:
 class MarkViewDesc extends ViewDesc {
-  constructor(parent: ViewDesc, readonly mark: Mark, dom: DOMNode, contentDOM: HTMLElement) {
+  constructor(parent: ViewDesc, readonly mark: Mark, dom: DOMNode, contentDOM: HTMLElement, readonly spec: MarkView) {
     super(parent, [], dom, contentDOM)
@@ -587,3 +604,3 @@ }
       spec = (DOMSerializer.renderSpec as any)(document, mark.type.spec.toDOM!(mark, inline), null, mark.attrs) as any
-    return new MarkViewDesc(parent, mark, spec.dom, spec.contentDOM || spec.dom as HTMLElement)
+    return new MarkViewDesc(parent, mark, spec.dom, spec.contentDOM || spec.dom as HTMLElement, spec)
   }
@@ -618,2 +635,7 @@
   }
+
+  destroy() {
+    if (this.spec.destroy) this.spec.destroy()
+    super.destroy()
+  }
 }
@@ -620,0 +642,0 @@

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

872123

increased by0.35%

Lines of code

17551

increased by0.33%

No dependency changes