rename attributes to HTMLAttributes

packages/core/src/ExtensionManager.ts

@@ -122,14 +122,14 @@ export default class ExtensionManager {
           getPos: (() => number) | boolean,
           decorations: Decoration[],
         ) => {
-          const attributes = getRenderedAttributes(node, extensionAttributes)
+          const HTMLAttributes = getRenderedAttributes(node, extensionAttributes)
 
           return renderer({
             editor,
             node,
             getPos,
             decorations,
-            attributes,
+            HTMLAttributes,
           })
         }
 

packages/core/src/MarkExtension.ts

@@ -45,7 +45,7 @@ export interface MarkExtensionSpec<Options = {}, Commands = {}> extends Overwrit
     },
     props: {
       mark: Mark,
-      attributes: { [key: string]: any },
+      HTMLAttributes: { [key: string]: any },
     }
   ) => DOMOutputSpec) | null,
 

packages/core/src/NodeExtension.ts

@@ -80,7 +80,7 @@ export interface NodeExtensionSpec<Options = {}, Commands = {}> extends Overwrit
     },
     props: {
       node: Node,
-      attributes: { [key: string]: any },
+      HTMLAttributes: { [key: string]: any },
     }
   ) => DOMOutputSpec) | null,
 

packages/core/src/types.ts

@@ -49,7 +49,7 @@ export type NodeViewRendererProps = {
   node: Node,
   getPos: (() => number) | boolean,
   decorations: Decoration[],
-  attributes: AnyObject,
+  HTMLAttributes: { [key: string]: any },
 }
 
 export type NodeViewRenderer = (props: NodeViewRendererProps) => NodeView

packages/core/src/utils/getSchema.ts

@@ -50,7 +50,7 @@ export default function getSchema(extensions: Extensions): Schema {
     if (extension.renderHTML) {
       schema.toDOM = node => (extension.renderHTML as Function)?.bind(context)({
         node,
-        attributes: getRenderedAttributes(node, extensionAttributes),
+        HTMLAttributes: getRenderedAttributes(node, extensionAttributes),
       })
     }
 
@@ -79,7 +79,7 @@ export default function getSchema(extensions: Extensions): Schema {
     if (extension.renderHTML) {
       schema.toDOM = mark => (extension.renderHTML as Function)?.bind(context)({
         mark,
-        attributes: getRenderedAttributes(mark, extensionAttributes),
+        HTMLAttributes: getRenderedAttributes(mark, extensionAttributes),
       })
     }
 

packages/extension-blockquote/src/index.ts

@@ -18,8 +18,8 @@ const Blockquote = createNode({
     ]
   },
 
-  renderHTML({ attributes }) {
+  renderHTML({ HTMLAttributes }) {
-    return ['blockquote', attributes, 0]
+    return ['blockquote', HTMLAttributes, 0]
   },
 
   addCommands() {

packages/extension-bold/src/index.ts

@@ -26,8 +26,8 @@ const Bold = createMark({
     ]
   },
 
-  renderHTML({ attributes }) {
+  renderHTML({ HTMLAttributes }) {
-    return ['strong', attributes, 0]
+    return ['strong', HTMLAttributes, 0]
   },
 
   addCommands() {

packages/extension-bullet-list/src/index.ts

@@ -16,8 +16,8 @@ const BulletList = createNode({
     ]
   },
 
-  renderHTML({ attributes }) {
+  renderHTML({ HTMLAttributes }) {
-    return ['ul', attributes, 0]
+    return ['ul', HTMLAttributes, 0]
   },
 
   addCommands() {

packages/extension-code-block/src/index.ts

@@ -64,8 +64,8 @@ const CodeBlock = createNode({
     ]
   },
 
-  renderHTML({ attributes }) {
+  renderHTML({ HTMLAttributes }) {
-    return ['pre', ['code', attributes, 0]]
+    return ['pre', ['code', HTMLAttributes, 0]]
   },
 
   addCommands() {

packages/extension-code/src/index.ts

@@ -16,8 +16,8 @@ const Code = createMark({
     ]
   },
 
-  renderHTML({ attributes }) {
+  renderHTML({ HTMLAttributes }) {
-    return ['code', attributes, 0]
+    return ['code', HTMLAttributes, 0]
   },
 
   addCommands() {

packages/extension-hard-break/src/index.ts

@@ -16,8 +16,8 @@ const HardBreak = createNode({
     ]
   },
 
-  renderHTML({ attributes }) {
+  renderHTML({ HTMLAttributes }) {
-    return ['br', attributes]
+    return ['br', HTMLAttributes]
   },
 
   addCommands() {

packages/extension-heading/src/index.ts

@@ -5,6 +5,9 @@ type Level = 1 | 2 | 3 | 4 | 5 | 6
 
 export interface HeadingOptions {
   levels: Level[],
+  HTMLAttributes: {
+    [key: string]: any
+  },
 }
 
 const Heading = createNode({
@@ -12,6 +15,7 @@ const Heading = createNode({
 
   defaultOptions: <HeadingOptions>{
     levels: [1, 2, 3, 4, 5, 6],
+    HTMLAttributes: {},
   },
 
   content: 'inline*',
@@ -37,13 +41,13 @@ const Heading = createNode({
       }))
   },
 
-  renderHTML({ node, attributes }) {
+  renderHTML({ node, HTMLAttributes }) {
     const hasLevel = this.options.levels.includes(node.attrs.level)
     const level = hasLevel
       ? node.attrs.level
       : this.options.levels[0]
 
-    return [`h${level}`, attributes, 0]
+    return [`h${level}`, HTMLAttributes, 0]
   },
 
   addCommands() {

packages/extension-highlight/src/index.ts

@@ -42,8 +42,8 @@ const Highlight = createMark({
     ]
   },
 
-  renderHTML({ attributes }) {
+  renderHTML({ HTMLAttributes }) {
-    return ['mark', attributes, 0]
+    return ['mark', HTMLAttributes, 0]
   },
 
   addCommands() {

packages/extension-horizontal-rule/src/index.ts

@@ -11,8 +11,8 @@ const HorizontalRule = createNode({
     ]
   },
 
-  renderHTML({ attributes }) {
+  renderHTML({ HTMLAttributes }) {
-    return ['hr', attributes]
+    return ['hr', HTMLAttributes]
   },
 
   addCommands() {

packages/extension-image/src/index.ts

@@ -45,8 +45,8 @@ const Image = createNode({
     ]
   },
 
-  renderHTML({ attributes }) {
+  renderHTML({ HTMLAttributes }) {
-    return ['img', attributes]
+    return ['img', HTMLAttributes]
   },
 
   addCommands() {

packages/extension-italic/src/index.ts

@@ -25,8 +25,8 @@ const Italic = createMark({
     ]
   },
 
-  renderHTML({ attributes }) {
+  renderHTML({ HTMLAttributes }) {
-    return ['em', attributes, 0]
+    return ['em', HTMLAttributes, 0]
   },
 
   addCommands() {

packages/extension-link/src/index.ts

@@ -39,8 +39,8 @@ const Link = createMark({
     ]
   },
 
-  renderHTML({ attributes }) {
+  renderHTML({ HTMLAttributes }) {
-    return ['a', mergeAttributes(attributes, { rel: this.options.rel }), 0]
+    return ['a', mergeAttributes(HTMLAttributes, { rel: this.options.rel }), 0]
   },
 
   addCommands() {

packages/extension-list-item/src/index.ts

@@ -15,8 +15,8 @@ const ListItem = createNode({
     ]
   },
 
-  renderHTML({ attributes }) {
+  renderHTML({ HTMLAttributes }) {
-    return ['li', attributes, 0]
+    return ['li', HTMLAttributes, 0]
   },
 
   addKeyboardShortcuts() {

packages/extension-ordered-list/src/index.ts

@@ -31,12 +31,12 @@ const OrderedList = createNode({
     ]
   },
 
-  renderHTML({ attributes }) {
+  renderHTML({ HTMLAttributes }) {
-    const { start, ...attributesWithoutStart } = attributes
+    const { start, ...attributesWithoutStart } = HTMLAttributes
 
     return start === 1
       ? ['ol', attributesWithoutStart, 0]
-      : ['ol', attributes, 0]
+      : ['ol', HTMLAttributes, 0]
   },
 
   addCommands() {

packages/extension-paragraph/src/index.ts

@@ -14,8 +14,8 @@ const Paragraph = createNode({
     ]
   },
 
-  renderHTML({ attributes }) {
+  renderHTML({ HTMLAttributes }) {
-    return ['p', attributes, 0]
+    return ['p', HTMLAttributes, 0]
   },
 
   addCommands() {

packages/extension-strike/src/index.ts

@@ -25,8 +25,8 @@ const Strike = createMark({
     ]
   },
 
-  renderHTML({ attributes }) {
+  renderHTML({ HTMLAttributes }) {
-    return ['s', attributes, 0]
+    return ['s', HTMLAttributes, 0]
   },
 
   addCommands() {

packages/extension-task-item/src/index.ts

@@ -43,8 +43,8 @@ const TaskItem = createNode({
     ]
   },
 
-  renderHTML({ attributes }) {
+  renderHTML({ HTMLAttributes }) {
-    return ['li', mergeAttributes(attributes, { 'data-type': 'taskItem' }), 0]
+    return ['li', mergeAttributes(HTMLAttributes, { 'data-type': 'taskItem' }), 0]
   },
 
   addKeyboardShortcuts() {
@@ -64,7 +64,7 @@ const TaskItem = createNode({
   },
 
   addNodeView() {
-    return ({ attributes, getPos, editor }) => {
+    return ({ HTMLAttributes, getPos, editor }) => {
       const { view } = editor
       const listItem = document.createElement('li')
       const checkbox = document.createElement('input')
@@ -82,13 +82,13 @@ const TaskItem = createNode({
         }
       })
 
-      if (attributes['data-checked'] === true) {
+      if (HTMLAttributes['data-checked'] === true) {
         checkbox.setAttribute('checked', 'checked')
       }
 
       listItem.append(checkbox, content)
 
-      Object.entries(attributes).forEach(([key, value]) => {
+      Object.entries(HTMLAttributes).forEach(([key, value]) => {
         listItem.setAttribute(key, value)
       })
 

packages/extension-task-list/src/index.ts

@@ -16,8 +16,8 @@ const TaskList = createNode({
     ]
   },
 
-  renderHTML({ attributes }) {
+  renderHTML({ HTMLAttributes }) {
-    return ['ul', mergeAttributes(attributes, { 'data-type': 'taskList' }), 0]
+    return ['ul', mergeAttributes(HTMLAttributes, { 'data-type': 'taskList' }), 0]
   },
 
   addCommands() {

packages/extension-text-style/src/index.ts

@@ -20,8 +20,8 @@ const TextStyle = createMark({
     ]
   },
 
-  renderHTML({ attributes }) {
+  renderHTML({ HTMLAttributes }) {
-    return ['span', attributes, 0]
+    return ['span', HTMLAttributes, 0]
   },
 
   addCommands() {

packages/extension-underline/src/index.ts

@@ -14,8 +14,8 @@ const Underline = createMark({
     ]
   },
 
-  renderHTML({ attributes }) {
+  renderHTML({ HTMLAttributes }) {
-    return ['u', attributes, 0]
+    return ['u', HTMLAttributes, 0]
   },
 
   addCommands() {