@jvs-milkdown/prose 1.0.0

package/lib/view.js

@@ -0,0 +1,2 @@
+export * from 'prosemirror-view';
+//# sourceMappingURL=view.js.map

package/lib/view.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"view.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}

package/package.json

@@ -0,0 +1,141 @@
+{
+  "name": "@jvs-milkdown/prose",
+  "version": "1.0.0",
+  "license": "MIT",
+  "repository": {
+    "type": "git",
+    "url": "git+https://github.com/Milkdown/milkdown.git",
+    "directory": "packages/prose"
+  },
+  "files": [
+    "lib",
+    "src"
+  ],
+  "type": "module",
+  "sideEffects": false,
+  "main": "./lib/index.js",
+  "exports": {
+    ".": {
+      "types": "./lib/index.d.ts",
+      "import": "./lib/index.js"
+    },
+    "./changeset": {
+      "types": "./lib/changeset.d.ts",
+      "import": "./lib/changeset.js"
+    },
+    "./commands": {
+      "types": "./lib/commands.d.ts",
+      "import": "./lib/commands.js"
+    },
+    "./dropcursor": {
+      "types": "./lib/dropcursor.d.ts",
+      "import": "./lib/dropcursor.js"
+    },
+    "./gapcursor": {
+      "types": "./lib/gapcursor.d.ts",
+      "import": "./lib/gapcursor.js"
+    },
+    "./history": {
+      "types": "./lib/history.d.ts",
+      "import": "./lib/history.js"
+    },
+    "./inputrules": {
+      "types": "./lib/inputrules.d.ts",
+      "import": "./lib/inputrules.js"
+    },
+    "./keymap": {
+      "types": "./lib/keymap.d.ts",
+      "import": "./lib/keymap.js"
+    },
+    "./model": {
+      "types": "./lib/model.d.ts",
+      "import": "./lib/model.js"
+    },
+    "./schema-list": {
+      "types": "./lib/schema-list.d.ts",
+      "import": "./lib/schema-list.js"
+    },
+    "./state": {
+      "types": "./lib/state.d.ts",
+      "import": "./lib/state.js"
+    },
+    "./transform": {
+      "types": "./lib/transform.d.ts",
+      "import": "./lib/transform.js"
+    },
+    "./view": {
+      "types": "./lib/view.d.ts",
+      "import": "./lib/view.js"
+    },
+    "./tables": {
+      "types": "./lib/tables.d.ts",
+      "import": "./lib/tables.js"
+    },
+    "./view/style/prosemirror.css": "./lib/style/prosemirror.css",
+    "./tables/style/tables.css": "./lib/style/tables.css",
+    "./gapcursor/style/gapcursor.css": "./lib/style/gapcursor.css"
+  },
+  "dependencies": {
+    "prosemirror-changeset": "^2.3.1",
+    "prosemirror-commands": "^1.7.1",
+    "prosemirror-dropcursor": "^1.8.2",
+    "prosemirror-gapcursor": "^1.4.0",
+    "prosemirror-history": "^1.5.0",
+    "prosemirror-inputrules": "^1.5.1",
+    "prosemirror-keymap": "^1.2.3",
+    "prosemirror-model": "^1.25.4",
+    "prosemirror-schema-list": "^1.5.1",
+    "prosemirror-state": "^1.4.4",
+    "prosemirror-tables": "^1.8.1",
+    "prosemirror-transform": "^1.10.5",
+    "prosemirror-view": "^1.41.3",
+    "@jvs-milkdown/exception": "1.0.0"
+  },
+  "scripts": {
+    "build": "rollup -c"
+  },
+  "types": "./lib/index.d.ts",
+  "typesVersions": {
+    "*": {
+      "changeset": [
+        "lib/changeset.d.ts"
+      ],
+      "commands": [
+        "lib/commands.d.ts"
+      ],
+      "dropcursor": [
+        "lib/dropcursor.d.ts"
+      ],
+      "gapcursor": [
+        "lib/gapcursor.d.ts"
+      ],
+      "history": [
+        "lib/history.d.ts"
+      ],
+      "inputrules": [
+        "lib/inputrules.d.ts"
+      ],
+      "keymap": [
+        "lib/keymap.d.ts"
+      ],
+      "model": [
+        "lib/model.d.ts"
+      ],
+      "schema-list": [
+        "lib/schema-list.d.ts"
+      ],
+      "state": [
+        "lib/state.d.ts"
+      ],
+      "transform": [
+        "lib/transform.d.ts"
+      ],
+      "view": [
+        "lib/view.d.ts"
+      ],
+      "tables": [
+        "lib/tables.d.ts"
+      ]
+    }
+  }
+}

package/src/changeset.ts

@@ -0,0 +1 @@
+export * from 'prosemirror-changeset'

package/src/commands.ts

@@ -0,0 +1 @@
+export * from 'prosemirror-commands'

package/src/dropcursor.ts

@@ -0,0 +1 @@
+export * from 'prosemirror-dropcursor'

package/src/gapcursor.ts

@@ -0,0 +1 @@
+export * from 'prosemirror-gapcursor'

package/src/history.ts

@@ -0,0 +1 @@
+export * from 'prosemirror-history'

package/src/index.ts

@@ -0,0 +1 @@
+export * from './toolkit'

package/src/inputrules.ts

@@ -0,0 +1 @@
+export * from 'prosemirror-inputrules'

package/src/keymap.ts

@@ -0,0 +1 @@
+export * from 'prosemirror-keymap'

package/src/model.ts

@@ -0,0 +1 @@
+export * from 'prosemirror-model'

package/src/schema-list.ts

@@ -0,0 +1 @@
+export * from 'prosemirror-schema-list'

package/src/state.ts

@@ -0,0 +1 @@
+export * from 'prosemirror-state'

package/src/tables.ts

@@ -0,0 +1 @@
+export * from 'prosemirror-tables'

package/src/toolkit/browser.ts

@@ -0,0 +1,39 @@
+/**
+ * Copy paste from:
+ * https://github.com/ProseMirror/prosemirror-view/blob/master/src/browser.ts
+ */
+
+const nav = typeof navigator != 'undefined' ? navigator : null
+const doc = typeof document != 'undefined' ? document : null
+const agent = (nav && nav.userAgent) || ''
+
+const ie_edge = /Edge\/(\d+)/.exec(agent)
+const ie_upto10 = /MSIE \d/.exec(agent)
+const ie_11up = /Trident\/(?:[7-9]|\d{2,})\..*rv:(\d+)/.exec(agent)
+
+export const ie = !!(ie_upto10 || ie_11up || ie_edge)
+export const ie_version = ie_upto10
+  ? (document as typeof document & { documentMode: unknown }).documentMode
+  : ie_11up
+    ? +ie_11up[1]!
+    : ie_edge
+      ? +ie_edge[1]!
+      : 0
+export const gecko = !ie && /gecko\/(\d+)/i.test(agent)
+export const gecko_version =
+  gecko && +(/Firefox\/(\d+)/.exec(agent) || [0, 0])[1]
+
+const _chrome = !ie && /Chrome\/(\d+)/.exec(agent)
+export const chrome = !!_chrome
+export const chrome_version = _chrome ? +_chrome[1]! : 0
+export const safari = !ie && !!nav && /Apple Computer/.test(nav.vendor)
+// Is true for both iOS and iPadOS for convenience
+export const ios =
+  safari && (/Mobile\/\w+/.test(agent) || (!!nav && nav.maxTouchPoints > 2))
+export const mac = ios || (nav ? /Mac/.test(nav.platform) : false)
+export const android = /Android \d/.test(agent)
+export const webkit =
+  !!doc && 'webkitFontSmoothing' in doc.documentElement.style
+export const webkit_version = webkit
+  ? +(/\bAppleWebKit\/(\d+)/.exec(navigator.userAgent) || [0, 0])[1]
+  : 0

package/src/toolkit/index.ts

@@ -0,0 +1,4 @@
+export * as browser from './browser'
+export * from './input-rules'
+export * from './position'
+export * from './prose'

package/src/toolkit/input-rules/common.ts

@@ -0,0 +1,25 @@
+import type { Attrs } from '../../model'
+import type { Transaction } from '../../state'
+
+/// @internal
+export interface Captured {
+  group: string | undefined
+  fullMatch: string
+  start: number
+  end: number
+}
+
+/// @internal
+export interface BeforeDispatch {
+  match: string[]
+  start: number
+  end: number
+  tr: Transaction
+}
+
+/// @internal
+export interface Options {
+  getAttr?: (match: RegExpMatchArray) => Attrs
+  updateCaptured?: (captured: Captured) => Partial<Captured>
+  beforeDispatch?: (options: BeforeDispatch) => void
+}

package/src/toolkit/input-rules/custom-input-rules.ts

@@ -0,0 +1,113 @@
+import type { InputRule } from '../../inputrules'
+import type { EditorState, TextSelection, Transaction } from '../../state'
+import type { EditorView } from '../../view'
+
+import { Plugin, PluginKey } from '../../state'
+import { android, chrome } from '../browser'
+
+function run(
+  view: EditorView,
+  from: number,
+  to: number,
+  text: string,
+  rules: InputRule[],
+  plugin: Plugin
+) {
+  if (view.composing) return false
+  const state = view.state
+  const $from = state.doc.resolve(from)
+  if ($from.parent.type.spec.code) return false
+  const textBefore =
+    $from.parent.textBetween(
+      Math.max(0, $from.parentOffset - 500),
+      $from.parentOffset,
+      undefined,
+      '\uFFFC'
+    ) + text
+  for (let _matcher of rules) {
+    const matcher = _matcher as unknown as {
+      match: RegExp
+      handler: (
+        state: EditorState,
+        match: string[],
+        from: number,
+        to: number
+      ) => Transaction
+      undoable?: boolean
+    }
+    const match = matcher.match.exec(textBefore)
+    const tr =
+      match &&
+      match[0] &&
+      matcher.handler(state, match, from - (match[0].length - text.length), to)
+    if (!tr) continue
+    if (matcher.undoable !== false)
+      tr.setMeta(plugin, { transform: tr, from, to, text })
+    view.dispatch(tr)
+    return true
+  }
+  return false
+}
+
+export const customInputRulesKey = new PluginKey('MILKDOWN_CUSTOM_INPUTRULES')
+export function customInputRules({ rules }: { rules: InputRule[] }): Plugin {
+  const plugin: Plugin = new Plugin({
+    key: customInputRulesKey,
+    isInputRules: true,
+
+    state: {
+      init() {
+        return null
+      },
+      apply(this: typeof plugin, tr, prev) {
+        const stored = tr.getMeta(this)
+        if (stored) return stored
+        return tr.selectionSet || tr.docChanged ? null : prev
+      },
+    },
+    props: {
+      handleTextInput(view, from, to, text) {
+        return run(view, from, to, text, rules, plugin)
+      },
+      handleDOMEvents: {
+        compositionend: (view) => {
+          setTimeout(() => {
+            const { $cursor } = view.state.selection as TextSelection
+            if ($cursor) run(view, $cursor.pos, $cursor.pos, '', rules, plugin)
+          })
+          return false
+        },
+        keydown: (view, event) => {
+          // On Chrome Android, prosemirror-view suppresses Enter keydown events
+          // to avoid input corruption during composition. It then relies on DOM
+          // mutation detection to retroactively handle Enter. However, this
+          // fallback fails with custom node views (e.g. list-item-block) whose
+          // wrapper DOM structure prevents the Enter detection heuristics from
+          // recognizing the mutation. We intercept Enter here — before
+          // prosemirror-view's suppression — and manually route it through
+          // handleKeyDown so that keymaps (splitListItem, etc.) work correctly.
+          if (!(android && chrome && (event as KeyboardEvent).key === 'Enter'))
+            return false
+          if (view.composing) return false
+          if (
+            view.someProp('handleKeyDown', (f) =>
+              f(view, event as KeyboardEvent)
+            )
+          ) {
+            event.preventDefault()
+            return true
+          }
+          return false
+        },
+      },
+      handleKeyDown(view, event) {
+        if (event.key !== 'Enter') return false
+        const { $cursor } = view.state.selection as TextSelection
+        if ($cursor)
+          return run(view, $cursor.pos, $cursor.pos, '\n', rules, plugin)
+        return false
+      },
+    },
+  })
+  return plugin
+}

package/src/toolkit/input-rules/index.ts

@@ -0,0 +1,4 @@
+export * from './custom-input-rules'
+export * from './mark-rule'
+export * from './node-rule'
+export * from './common'

package/src/toolkit/input-rules/mark-rule.ts

@@ -0,0 +1,60 @@
+import type { Mark, MarkType } from '../../model'
+import type { Captured, Options } from './common'
+
+import { InputRule } from '../../inputrules'
+
+/// Create an input rule for a mark.
+export function markRule(
+  regexp: RegExp,
+  markType: MarkType,
+  options: Options = {}
+): InputRule {
+  return new InputRule(regexp, (state, match, start, end) => {
+    const { tr } = state
+    const matchLength = match.length
+
+    let group = match[matchLength - 1]
+    let fullMatch = match[0]
+    let initialStoredMarks: readonly Mark[] = []
+
+    let markEnd: number
+
+    const captured: Captured = {
+      group,
+      fullMatch,
+      start,
+      end,
+    }
+
+    const result = options.updateCaptured?.(captured)
+    Object.assign(captured, result)
+    ;({ group, fullMatch, start, end } = captured)
+
+    if (fullMatch === null) return null
+
+    if (group?.trim() === '') return null
+
+    if (group) {
+      const startSpaces = fullMatch.search(/\S/)
+      const textStart = start + fullMatch.indexOf(group)
+      const textEnd = textStart + group.length
+
+      initialStoredMarks = tr.storedMarks ?? []
+
+      if (textEnd < end) tr.delete(textEnd, end)
+
+      if (textStart > start) tr.delete(start + startSpaces, textStart)
+
+      markEnd = start + startSpaces + group.length
+
+      const attrs = options.getAttr?.(match)
+
+      tr.addMark(start, markEnd, markType.create(attrs))
+      tr.setStoredMarks(initialStoredMarks)
+
+      options.beforeDispatch?.({ match, start, end, tr })
+    }
+
+    return tr
+  })
+}

package/src/toolkit/input-rules/node-rule.ts

@@ -0,0 +1,51 @@
+import type { NodeType } from '../../model'
+import type { Captured, Options } from './common'
+
+import { InputRule } from '../../inputrules'
+
+/// Create an input rule for a node.
+export function nodeRule(
+  regexp: RegExp,
+  nodeType: NodeType,
+  options: Options = {}
+): InputRule {
+  return new InputRule(regexp, (state, match, start, end) => {
+    const { tr } = state
+    let group: string | undefined = match[1]
+    let fullMatch = match[0]
+
+    const captured: Captured = {
+      group,
+      fullMatch,
+      start,
+      end,
+    }
+
+    const result = options.updateCaptured?.(captured)
+    Object.assign(captured, result)
+    ;({ group, fullMatch, start, end } = captured)
+
+    if (fullMatch === null) return null
+
+    if (!group || group.trim() === '') return null
+
+    const attrs = options.getAttr?.(match)
+    const node = nodeType.createAndFill(attrs)
+
+    if (node) {
+      tr.replaceRangeWith(
+        nodeType.isBlock ? tr.doc.resolve(start).before() : start,
+        end,
+        node
+      )
+      options.beforeDispatch?.({
+        match: [fullMatch, group],
+        start,
+        end,
+        tr,
+      })
+    }
+
+    return tr
+  })
+}

package/src/toolkit/position/index.ts

@@ -0,0 +1,108 @@
+import { expectDomTypeError, missingRootElement } from '@jvs-milkdown/exception'
+
+import type { EditorView } from '../../view'
+
+type Point = [top: number, left: number]
+
+export function calculateNodePosition(
+  view: EditorView,
+  target: HTMLElement,
+  handler: (
+    selectedRect: DOMRect,
+    targetRect: DOMRect,
+    parentRect: DOMRect
+  ) => Point
+) {
+  const state = view.state
+  const { from } = state.selection
+
+  const { node } = view.domAtPos(from)
+  const element = node instanceof Text ? node.parentElement : node
+  if (!(element instanceof HTMLElement)) throw expectDomTypeError(element)
+
+  const selectedNodeRect = element.getBoundingClientRect()
+  const targetNodeRect = target.getBoundingClientRect()
+  const parent = target.parentElement
+  if (!parent) throw expectDomTypeError(parent)
+
+  const parentNodeRect = parent.getBoundingClientRect()
+
+  const [top, left] = handler(selectedNodeRect, targetNodeRect, parentNodeRect)
+
+  target.style.top = `${top}px`
+  target.style.left = `${left}px`
+}
+
+interface Rect {
+  left: number
+  right: number
+  top: number
+  bottom: number
+}
+
+export function calculateTextPosition(
+  view: EditorView,
+  target: HTMLElement,
+  handler: (
+    start: Rect,
+    end: Rect,
+    targetRect: DOMRect,
+    parentRect: DOMRect
+  ) => Point
+) {
+  const state = view.state
+  const { from, to } = state.selection
+  const start = view.coordsAtPos(from)
+  const end = view.coordsAtPos(to)
+
+  const targetNodeRect = target.getBoundingClientRect()
+  const parent = target.parentElement
+  if (!parent) throw missingRootElement()
+
+  const parentNodeRect = parent.getBoundingClientRect()
+
+  const [top, left] = handler(start, end, targetNodeRect, parentNodeRect)
+
+  target.style.top = `${top}px`
+  target.style.left = `${left}px`
+}
+
+function minMax(value = 0, min = 0, max = 0): number {
+  return Math.min(Math.max(value, min), max)
+}
+
+export function posToDOMRect(
+  view: EditorView,
+  from: number,
+  to: number
+): DOMRect {
+  const minPos = 0
+  const maxPos = view.state.doc.content.size
+  const resolvedFrom = minMax(from, minPos, maxPos)
+  const resolvedEnd = minMax(to, minPos, maxPos)
+  const start = view.coordsAtPos(resolvedFrom)
+  const end = view.coordsAtPos(resolvedEnd, -1)
+  const top = Math.min(start.top, end.top)
+  const bottom = Math.max(start.bottom, end.bottom)
+  const left = Math.min(start.left, end.left)
+  const right = Math.max(start.right, end.right)
+  const width = right - left
+  const height = bottom - top
+  const x = left
+  const y = top
+  const data = {
+    top,
+    bottom,
+    left,
+    right,
+    width,
+    height,
+    x,
+    y,
+  }
+
+  return {
+    ...data,
+    toJSON: () => data,
+  }
+}

package/src/toolkit/prose/helper.ts

@@ -0,0 +1,30 @@
+import type { Slice, NodeType, Node as ProseNode } from '../../model'
+import type { Transaction } from '../../state'
+
+export function cloneTr(tr: Transaction): Transaction {
+  return Object.assign(Object.create(tr), tr).setTime(Date.now())
+}
+
+export function equalNodeType(
+  nodeType: NodeType | NodeType[],
+  node: ProseNode
+) {
+  return (
+    (Array.isArray(nodeType) && nodeType.includes(node.type)) ||
+    node.type === nodeType
+  )
+}
+
+export function isTextOnlySlice(slice: Slice): ProseNode | false {
+  if (slice.content.childCount === 1) {
+    const node = slice.content.firstChild
+    if (node?.type.name === 'text' && node.marks.length === 0) return node
+
+    if (node?.type.name === 'paragraph' && node.childCount === 1) {
+      const _node = node.firstChild
+      if (_node?.type.name === 'text' && _node.marks.length === 0) return _node
+    }
+  }
+
+  return false
+}

package/src/toolkit/prose/index.ts

@@ -0,0 +1,4 @@
+export * from './helper'
+export * from './node'
+export * from './schema'
+export * from './selection'