add global attributes

packages/core/src/Extension.ts

@@ -113,9 +113,16 @@
 //   }
 // }
 
+import { GlobalAttributes } from './types'
+
 export interface ExtensionSpec<Options = {}, Commands = {}> {
   name: string,
   defaultOptions?: Options,
+  createGlobalAttributes?: (
+    this: {
+      options: Options,
+    },
+  ) => GlobalAttributes,
   createCommands?(this: {
     options: Options,
     // editor: Editor,
@@ -133,6 +140,7 @@ const defaultExtension: Extension = {
   type: 'extension',
   name: 'extension',
   options: {},
+  createGlobalAttributes: () => [],
   createCommands: () => ({}),
 }
 

packages/core/src/Mark.ts

@@ -49,6 +49,7 @@
 
 import { DOMOutputSpec, MarkSpec, Mark } from 'prosemirror-model'
 import { ExtensionSpec } from './Extension'
+import { Attributes } from './types'
 
 export interface MarkExtensionSpec<Options = {}, Commands = {}> extends ExtensionSpec<Options, Commands> {
   inclusive?: MarkSpec['inclusive'],
@@ -71,6 +72,11 @@ export interface MarkExtensionSpec<Options = {}, Commands = {}> extends Extensio
       },
     }
   ) => DOMOutputSpec,
+  createAttributes?: (
+    this: {
+      options: Options,
+    },
+  ) => Attributes,
 }
 
 export type MarkExtension = Required<Omit<MarkExtensionSpec, 'defaultOptions'> & {
@@ -88,6 +94,7 @@ const defaultMark: MarkExtension = {
   excludes: null,
   group: null,
   spanning: null,
+  createGlobalAttributes: () => [],
   createCommands: () => ({}),
   parseHTML: () => null,
   renderHTML: () => null,

packages/core/src/Node.ts

@@ -130,6 +130,7 @@ const defaultNode: NodeExtension = {
   code: null,
   defining: null,
   isolating: null,
+  createGlobalAttributes: () => [],
   createCommands: () => ({}),
   parseHTML: () => null,
   renderHTML: () => null,

packages/core/src/types.ts

@@ -14,11 +14,16 @@ export type Attribute = {
 }
 
 export type Attributes = {
-  [key: string]: Attribute
+  [key: string]: Attribute,
 }
 
 export type ExtensionAttribute = {
   type: string,
   name: string,
-  attribute: Attribute
+  attribute: Attribute,
 }
+
+export type GlobalAttributes = {
+  types: string[],
+  attributes: Attributes,
+}[]

packages/core/src/utils/getAttributesFromExtensions.ts

@@ -1,13 +1,16 @@
-import {
-  Extensions, Attributes, Attribute, ExtensionAttribute,
-} from '../types'
 import splitExtensions from './splitExtensions'
+import {
+  Extensions,
+  GlobalAttributes,
+  Attributes,
+  Attribute,
+  ExtensionAttribute,
+} from '../types'
 
 export default function getAttributesFromExtensions(extensions: Extensions) {
   const allAttributes: ExtensionAttribute[] = []
-
-  const { nodeExtensions } = splitExtensions(extensions)
-
+  const { nodeExtensions, markExtensions } = splitExtensions(extensions)
+  const nodeAndMarkExtensions = [...nodeExtensions, ...markExtensions]
   const defaultAttribute: Required<Attribute> = {
     default: null,
     rendered: true,
@@ -15,7 +18,30 @@ export default function getAttributesFromExtensions(extensions: Extensions) {
     parseHTML: () => null,
   }
 
-  nodeExtensions.forEach(extension => {
+  extensions.forEach(extension => {
+    const context = {
+      options: extension.options,
+    }
+
+    const globalAttributes = extension.createGlobalAttributes.bind(context)() as GlobalAttributes
+
+    globalAttributes.forEach(globalAttribute => {
+      globalAttribute.types.forEach(type => {
+        Object.entries(globalAttribute.attributes).forEach(([name, attribute]) => {
+          allAttributes.push({
+            type,
+            name,
+            attribute: {
+              ...defaultAttribute,
+              ...attribute,
+            },
+          })
+        })
+      })
+    })
+  })
+
+  nodeAndMarkExtensions.forEach(extension => {
     const context = {
       options: extension.options,
     }

packages/core/src/utils/getRenderedAttributes.ts

@@ -9,7 +9,7 @@ export default function getRenderedAttributes(node: Node, attributes: ExtensionA
       return item.attribute.renderHTML(node.attrs)
     })
     .reduce((accumulator, value) => {
-      // TODO: add support for "class" merge
+      // TODO: add support for "class" and "style" merge
       return {
         ...accumulator,
         ...value,

packages/extension-paragraph/index.ts

@@ -65,12 +65,31 @@ export default createNode({
 
   content: 'inline*',
 
+  createGlobalAttributes() {
+    return [
+      {
+        types: ['paragraph'],
+        attributes: {
+          align: {
+            default: 'right',
+            renderHTML: attributes => ({
+              style: `text-align: ${attributes.align}`,
+            }),
+          },
+        },
+      },
+    ]
+  },
+
   createAttributes() {
     return {
       id: {
         default: '123',
         rendered: true,
-        renderHTML: attributes => ({ class: `foo-${attributes.id}`, id: 'foo' }),
+        renderHTML: attributes => ({
+          class: `foo-${attributes.id}`,
+          id: 'foo',
+        }),
       },
     }
   },