@milkdown/preset-gfm 7.4.0 → 7.5.8

package/src/node/task-list-item.ts

@@ -5,89 +5,97 @@ import { $inputRule } from '@milkdown/utils'
 import { withMeta } from '../__internal__'
 
 /// This schema extends the [list item](/preset-commonmark#list-item) schema and add task list support for it.
-export const extendListItemSchemaForTask = listItemSchema.extendSchema((prev) => {
-  return (ctx) => {
-    const baseSchema = prev(ctx)
-    return {
-      ...baseSchema,
-      attrs: {
-        ...baseSchema.attrs,
-        checked: {
-          default: null,
-        },
-      },
-      parseDOM: [
-        {
-          tag: 'li[data-item-type="task"]',
-          getAttrs: (dom) => {
-            if (!(dom instanceof HTMLElement))
-              throw expectDomTypeError(dom)
-
-            return {
-              label: dom.dataset.label,
-              listType: dom.dataset.listType,
-              spread: dom.dataset.spread,
-              checked: dom.dataset.checked ? dom.dataset.checked === 'true' : null,
-            }
+export const extendListItemSchemaForTask = listItemSchema.extendSchema(
+  (prev) => {
+    return (ctx) => {
+      const baseSchema = prev(ctx)
+      return {
+        ...baseSchema,
+        attrs: {
+          ...baseSchema.attrs,
+          checked: {
+            default: null,
           },
         },
-        ...baseSchema?.parseDOM || [],
-      ],
-      toDOM: (node) => {
-        if (baseSchema.toDOM && node.attrs.checked == null)
-          return baseSchema.toDOM(node)
-
-        return [
-          'li',
+        parseDOM: [
           {
-            'data-item-type': 'task',
-            'data-label': node.attrs.label,
-            'data-list-type': node.attrs.listType,
-            'data-spread': node.attrs.spread,
-            'data-checked': node.attrs.checked,
+            tag: 'li[data-item-type="task"]',
+            getAttrs: (dom) => {
+              if (!(dom instanceof HTMLElement)) throw expectDomTypeError(dom)
+
+              return {
+                label: dom.dataset.label,
+                listType: dom.dataset.listType,
+                spread: dom.dataset.spread,
+                checked: dom.dataset.checked
+                  ? dom.dataset.checked === 'true'
+                  : null,
+              }
+            },
           },
-          0,
-        ]
-      },
-      parseMarkdown: {
-        match: ({ type }) => type === 'listItem',
-        runner: (state, node, type) => {
-          if (node.checked == null) {
-            baseSchema.parseMarkdown.runner(state, node, type)
-            return
-          }
+          ...(baseSchema?.parseDOM || []),
+        ],
+        toDOM: (node) => {
+          if (baseSchema.toDOM && node.attrs.checked == null)
+            return baseSchema.toDOM(node)
+
+          return [
+            'li',
+            {
+              'data-item-type': 'task',
+              'data-label': node.attrs.label,
+              'data-list-type': node.attrs.listType,
+              'data-spread': node.attrs.spread,
+              'data-checked': node.attrs.checked,
+            },
+            0,
+          ]
+        },
+        parseMarkdown: {
+          match: ({ type }) => type === 'listItem',
+          runner: (state, node, type) => {
+            if (node.checked == null) {
+              baseSchema.parseMarkdown.runner(state, node, type)
+              return
+            }
 
-          const label = node.label != null ? `${node.label}.` : '•'
-          const checked = node.checked != null ? Boolean(node.checked) : null
-          const listType = node.label != null ? 'ordered' : 'bullet'
-          const spread = node.spread != null ? `${node.spread}` : 'true'
+            const label = node.label != null ? `${node.label}.` : '•'
+            const checked = node.checked != null ? Boolean(node.checked) : null
+            const listType = node.label != null ? 'ordered' : 'bullet'
+            const spread = node.spread != null ? `${node.spread}` : 'true'
 
-          state.openNode(type, { label, listType, spread, checked })
-          state.next(node.children)
-          state.closeNode()
+            state.openNode(type, { label, listType, spread, checked })
+            state.next(node.children)
+            state.closeNode()
+          },
         },
-      },
-      toMarkdown: {
-        match: node => node.type.name === 'list_item',
-        runner: (state, node) => {
-          if (node.attrs.checked == null) {
-            baseSchema.toMarkdown.runner(state, node)
-            return
-          }
+        toMarkdown: {
+          match: (node) => node.type.name === 'list_item',
+          runner: (state, node) => {
+            if (node.attrs.checked == null) {
+              baseSchema.toMarkdown.runner(state, node)
+              return
+            }
 
-          const label = node.attrs.label
-          const listType = node.attrs.listType
-          const spread = node.attrs.spread === 'true'
-          const checked = node.attrs.checked
+            const label = node.attrs.label
+            const listType = node.attrs.listType
+            const spread = node.attrs.spread === 'true'
+            const checked = node.attrs.checked
 
-          state.openNode('listItem', undefined, { label, listType, spread, checked })
-          state.next(node.content)
-          state.closeNode()
+            state.openNode('listItem', undefined, {
+              label,
+              listType,
+              spread,
+              checked,
+            })
+            state.next(node.content)
+            state.closeNode()
+          },
         },
-      },
+      }
     }
   }
-})
+)
 
 withMeta(extendListItemSchemaForTask, {
   displayName: 'NodeSchema<listItem>',
@@ -97,28 +105,32 @@ withMeta(extendListItemSchemaForTask, {
 /// Input rule for wrapping a block in task list node.
 /// Users can type `[ ] ` or `[x] ` to wrap the block in task list node with checked status.
 export const wrapInTaskListInputRule = $inputRule(() => {
-  return new InputRule(/^\[(?<checked>\s|x)\]\s$/, (state, match, start, end) => {
-    const pos = state.doc.resolve(start)
-    let depth = 0
-    let node = pos.node(depth)
-    while (node && node.type.name !== 'list_item') {
-      depth--
-      node = pos.node(depth)
-    }
+  return new InputRule(
+    /^\[(?<checked>\s|x)\]\s$/,
+    (state, match, start, end) => {
+      const pos = state.doc.resolve(start)
+      let depth = 0
+      let node = pos.node(depth)
+      while (node && node.type.name !== 'list_item') {
+        depth--
+        node = pos.node(depth)
+      }
 
-    if (!node || node.attrs.checked != null)
-      return null
+      if (!node || node.attrs.checked != null) return null
 
-    const checked = Boolean(match.groups?.checked === 'x')
+      const checked = Boolean(match.groups?.checked === 'x')
 
-    const finPos = pos.before(depth)
-    const tr = state.tr
+      const finPos = pos.before(depth)
+      const tr = state.tr
 
-    tr.deleteRange(start, end)
-      .setNodeMarkup(finPos, undefined, { ...node.attrs, checked })
+      tr.deleteRange(start, end).setNodeMarkup(finPos, undefined, {
+        ...node.attrs,
+        checked,
+      })
 
-    return tr
-  })
+      return tr
+    }
+  )
 })
 
 withMeta(wrapInTaskListInputRule, {

package/src/plugin/auto-insert-span-plugin.ts

@@ -0,0 +1,12 @@
+import { $prose } from '@milkdown/utils'
+import { imeSpan } from 'prosemirror-safari-ime-span'
+import { withMeta } from '../__internal__'
+
+/// This plugin is used to fix the bug of IME composing in table in Safari browser.
+/// original discussion in https://discuss.prosemirror.net/t/ime-composing-problems-on-td-or-th-element-in-safari-browser/4501
+export const autoInsertSpanPlugin = $prose(() => imeSpan)
+
+withMeta(autoInsertSpanPlugin, {
+  displayName: 'Prose<autoInsertSpanPlugin>',
+  group: 'Prose',
+})

package/src/plugin/index.ts

@@ -1,4 +1,5 @@
-export * from './auto-insert-zero-space-plugin'
+export * from './auto-insert-span-plugin'
 export * from './column-resizing-plugin'
 export * from './table-editing-plugin'
 export * from './remark-gfm-plugin'
+export * from './keep-table-align-plugin'

package/src/plugin/keep-table-align-plugin.ts

@@ -0,0 +1,53 @@
+import type { Transaction } from '@milkdown/prose/state'
+import { Plugin, PluginKey } from '@milkdown/prose/state'
+import type { Node } from '@milkdown/prose/model'
+import { $prose } from '@milkdown/utils'
+import { withMeta } from '../__internal__'
+
+const pluginKey = new PluginKey('MILKDOWN_KEEP_TABLE_ALIGN_PLUGIN')
+
+function getChildIndex(node: Node, parent: Node) {
+  let index = 0
+  parent.forEach((child, _offset, i) => {
+    if (child === node) index = i
+  })
+  return index
+}
+
+export const keepTableAlignPlugin = $prose(() => {
+  return new Plugin({
+    key: pluginKey,
+    appendTransaction: (_tr, oldState, state) => {
+      let tr: Transaction | undefined
+      const check = (node: Node, pos: number) => {
+        if (!tr) tr = state.tr
+
+        if (node.type.name !== 'table_cell') return
+
+        const $pos = state.doc.resolve(pos)
+        const tableRow = $pos.node($pos.depth)
+        const table = $pos.node($pos.depth - 1)
+        const tableHeaderRow = table.firstChild
+        // TODO: maybe consider add a header row
+        if (!tableHeaderRow) return
+
+        const index = getChildIndex(node, tableRow)
+        const headerCell = tableHeaderRow.maybeChild(index)
+        if (!headerCell) return
+        const align = headerCell.attrs.alignment
+        const currentAlign = node.attrs.alignment
+        if (align === currentAlign) return
+
+        tr.setNodeMarkup(pos, undefined, { ...node.attrs, alignment: align })
+      }
+      if (oldState.doc !== state.doc) state.doc.descendants(check)
+
+      return tr
+    },
+  })
+})
+
+withMeta(keepTableAlignPlugin, {
+  displayName: 'Prose<keepTableAlignPlugin>',
+  group: 'Prose',
+})

package/src/plugin/remark-gfm-plugin.ts

@@ -5,7 +5,8 @@ import remarkGFM from 'remark-gfm'
 import { withMeta } from '../__internal__'
 
 /// This plugin is wrapping the [remark-gfm](https://github.com/remarkjs/remark-gfm).
-export const remarkGFMPlugin: $Remark<'remarkGFM', Options | null | undefined> = $remark('remarkGFM', () => remarkGFM)
+export const remarkGFMPlugin: $Remark<'remarkGFM', Options | null | undefined> =
+  $remark('remarkGFM', () => remarkGFM)
 
 withMeta(remarkGFMPlugin.plugin, {
   displayName: 'Remark<remarkGFMPlugin>',

package/src/plugin/table-editing-plugin.ts

@@ -3,7 +3,9 @@ import { $prose } from '@milkdown/utils'
 import { withMeta } from '../__internal__'
 
 /// This plugin is wrapping the `tableEditing` plugin from [prosemirror-tables](https://github.com/ProseMirror/prosemirror-tables).
-export const tableEditingPlugin = $prose(() => tableEditing())
+export const tableEditingPlugin = $prose(() =>
+  tableEditing({ allowTableNodeSelection: true })
+)
 
 withMeta(tableEditingPlugin, {
   displayName: 'Prose<tableEditingPlugin>',

package/lib/plugin/auto-insert-zero-space-plugin.d.ts

@@ -1,2 +0,0 @@
-export declare const autoInsertZeroSpaceInTablePlugin: import("@milkdown/utils").$Prose;
-//# sourceMappingURL=auto-insert-zero-space-plugin.d.ts.map

package/lib/plugin/auto-insert-zero-space-plugin.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"auto-insert-zero-space-plugin.d.ts","sourceRoot":"","sources":["../../src/plugin/auto-insert-zero-space-plugin.ts"],"names":[],"mappings":"AAUA,eAAO,MAAM,gCAAgC,kCAuC3C,CAAA"}

package/src/plugin/auto-insert-zero-space-plugin.ts

@@ -1,55 +0,0 @@
-import { browser } from '@milkdown/prose'
-import type { Node } from '@milkdown/prose/model'
-import { isInTable } from '@milkdown/prose/tables'
-import { Plugin, PluginKey } from '@milkdown/prose/state'
-import { paragraphSchema } from '@milkdown/preset-commonmark'
-import { $prose } from '@milkdown/utils'
-import { withMeta } from '../__internal__'
-
-/// This plugin is used to fix the bug of IME composing in table in Safari browser.
-/// original discussion in https://discuss.prosemirror.net/t/ime-composing-problems-on-td-or-th-element-in-safari-browser/4501
-export const autoInsertZeroSpaceInTablePlugin = $prose((ctx) => {
-  const pluginKey = new PluginKey('MILKDOWN_AUTO_INSERT_ZERO_SPACE')
-
-  const isParagraph = (node: Node) => node.type === paragraphSchema.type(ctx)
-
-  const isEmptyParagraph = (node: Node) => isParagraph(node) && node.nodeSize === 2
-
-  return new Plugin({
-    key: pluginKey,
-    props: {
-      handleDOMEvents: {
-        compositionstart(view) {
-          const { state, dispatch } = view
-          const { tr, selection } = state
-          const { $from } = selection
-          if (browser.safari && isInTable(state) && selection.empty && isEmptyParagraph($from.parent))
-            dispatch(tr.insertText('\u2060', $from.start()))
-
-          return false
-        },
-        compositionend(view) {
-          const { state, dispatch } = view
-          const { tr, selection } = state
-          const { $from } = selection
-
-          if (
-            browser.safari
-            && isInTable(state)
-            && selection.empty
-            && isParagraph($from.parent)
-            && $from.parent.textContent.startsWith('\u2060')
-          )
-            dispatch(tr.delete($from.start(), $from.start() + 1))
-
-          return false
-        },
-      },
-    },
-  })
-})
-
-withMeta(autoInsertZeroSpaceInTablePlugin, {
-  displayName: 'Prose<autoInsertZeroSpaceInTablePlugin>',
-  group: 'Prose',
-})