@milkdown/preset-gfm 5.3.1 → 5.3.2

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (52) hide show
  1. package/lib/auto-link.d.ts +1 -15
  2. package/lib/auto-link.d.ts.map +1 -1
  3. package/lib/index.d.ts +2 -2
  4. package/lib/index.d.ts.map +1 -1
  5. package/lib/index.es.js +768 -16
  6. package/lib/index.es.js.map +1 -1
  7. package/lib/supported-keys.d.ts.map +1 -1
  8. package/lib/table/command.d.ts +3 -0
  9. package/lib/table/command.d.ts.map +1 -0
  10. package/lib/table/index.d.ts +10 -0
  11. package/lib/table/index.d.ts.map +1 -0
  12. package/lib/table/nodes/index.d.ts +32 -0
  13. package/lib/table/nodes/index.d.ts.map +1 -0
  14. package/lib/table/nodes/schema.d.ts +2 -0
  15. package/lib/table/nodes/schema.d.ts.map +1 -0
  16. package/lib/table/nodes/style.d.ts +3 -0
  17. package/lib/table/nodes/style.d.ts.map +1 -0
  18. package/lib/table/operator-plugin/actions.d.ts +19 -0
  19. package/lib/table/operator-plugin/actions.d.ts.map +1 -0
  20. package/lib/table/operator-plugin/calc-pos.d.ts +3 -0
  21. package/lib/table/operator-plugin/calc-pos.d.ts.map +1 -0
  22. package/lib/table/operator-plugin/constant.d.ts +6 -0
  23. package/lib/table/operator-plugin/constant.d.ts.map +1 -0
  24. package/lib/table/operator-plugin/helper.d.ts +6 -0
  25. package/lib/table/operator-plugin/helper.d.ts.map +1 -0
  26. package/lib/table/operator-plugin/index.d.ts +6 -0
  27. package/lib/table/operator-plugin/index.d.ts.map +1 -0
  28. package/lib/table/operator-plugin/style.d.ts +3 -0
  29. package/lib/table/operator-plugin/style.d.ts.map +1 -0
  30. package/lib/table/operator-plugin/widget.d.ts +8 -0
  31. package/lib/table/operator-plugin/widget.d.ts.map +1 -0
  32. package/lib/table/utils.d.ts +20 -0
  33. package/lib/table/utils.d.ts.map +1 -0
  34. package/lib/task-list-item.d.ts.map +1 -1
  35. package/package.json +8 -15
  36. package/src/auto-link.ts +4 -9
  37. package/src/index.ts +13 -6
  38. package/src/supported-keys.ts +2 -1
  39. package/src/table/command.ts +16 -0
  40. package/src/table/index.ts +13 -0
  41. package/src/table/nodes/index.ts +169 -0
  42. package/src/table/nodes/schema.ts +16 -0
  43. package/src/table/nodes/style.ts +170 -0
  44. package/src/table/operator-plugin/actions.ts +115 -0
  45. package/src/table/operator-plugin/calc-pos.ts +25 -0
  46. package/src/table/operator-plugin/constant.ts +7 -0
  47. package/src/table/operator-plugin/helper.ts +38 -0
  48. package/src/table/operator-plugin/index.ts +98 -0
  49. package/src/table/operator-plugin/style.ts +51 -0
  50. package/src/table/operator-plugin/widget.ts +66 -0
  51. package/src/table/utils.ts +158 -0
  52. package/src/task-list-item.ts +2 -1
package/lib/index.es.js CHANGED
@@ -17,28 +17,772 @@ var __spreadValues = (a, b) => {
17
17
  return a;
18
18
  };
19
19
  var __spreadProps = (a, b) => __defProps(a, __getOwnPropDescs(b));
20
- import { SupportedKeys as SupportedKeys$2, tablePlugin } from "@milkdown/plugin-table";
21
- export { BreakTable, InsertTable, NextCell, PrevCell, createTable, table, tablePlugin } from "@milkdown/plugin-table";
22
- import { SupportedKeys as SupportedKeys$1, commonmark, commands as commands$1 } from "@milkdown/preset-commonmark";
20
+ import { SupportedKeys as SupportedKeys$2, commonmark, commands as commands$1 } from "@milkdown/preset-commonmark";
23
21
  export { InsertHardbreak, InsertHr, InsertImage, LiftListItem, ModifyImage, ModifyLink, SinkListItem, SplitListItem, ToggleBold, ToggleInlineCode, ToggleItalic, ToggleLink, TurnIntoCodeFence, TurnIntoHeading, TurnIntoText, WrapInBlockquote, WrapInBulletList, WrapInOrderedList, blockquote, bulletList, codeFence, codeInline, commonmark, commonmarkNodes, commonmarkPlugins, doc, em, hardbreak, heading, hr, image, link, listItem, orderedList, paragraph, strong, text } from "@milkdown/preset-commonmark";
24
- import { createPlugin, createMark, createShortcut, createNode, AtomList } from "@milkdown/utils";
25
- import { inputRules, InputRule, markRule, toggleMark, wrappingInputRule, splitListItem, sinkListItem, liftListItem, wrapIn } from "@milkdown/prose";
26
- import { css } from "@emotion/css";
27
- import { createCmdKey, createCmd, themeToolCtx } from "@milkdown/core";
28
- const urlRegex = /(https?:\/\/)?www\.[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z]{2,}\b(?:[-a-zA-Z0-9@:%._+~#=?!&/]*)(?:[-a-zA-Z0-9@:%._+~#=?!&/]*)$/;
22
+ import { $prose, createPlugin, createShortcut, createMark, createNode, AtomList, $remark } from "@milkdown/utils";
23
+ import remarkGFM from "remark-gfm";
24
+ import { inputRules, InputRule, isInTable, Selection, findParentNode, TableMap, tableNodeTypes, CellSelection, cloneTr, addColumnBefore, addColumnAfter, selectedRect, setCellAttr, deleteTable, deleteColumn, deleteRow, calculateNodePosition, Decoration, Plugin, PluginKey, DecorationSet, tableNodes, TextSelection, goToNextCell, columnResizing, tableEditing, markRule, toggleMark, wrappingInputRule, splitListItem, sinkListItem, liftListItem, wrapIn } from "@milkdown/prose";
25
+ import { css, injectGlobal } from "@emotion/css";
26
+ import { themeToolCtx, createCmdKey, schemaCtx, createCmd } from "@milkdown/core";
27
+ const urlRegex = /https?:\/\/(www\.)?[-a-zA-Z0-9@:%._+~#=]{1,256}\.[a-zA-Z0-9()]{1,6}\b([-a-zA-Z0-9()@:%_+.~#?&//=]*)/;
29
28
  const proseUrlPlugin = () => inputRules({
30
29
  rules: [
31
30
  new InputRule(urlRegex, (state, match, start, end) => {
32
- const { schema } = state;
31
+ const { schema: schema2 } = state;
33
32
  const [text2] = match;
34
33
  if (!text2)
35
34
  return null;
36
- return state.tr.replaceWith(start, end, schema.text(text2)).addMark(start, text2.length + start, schema.marks.link.create({ href: text2.startsWith("www") ? `https://${text2}` : text2 }));
35
+ return state.tr.replaceWith(start, end, schema2.text(text2)).addMark(start, text2.length + start, schema2.marks.link.create({ href: text2 }));
37
36
  })
38
37
  ]
39
38
  });
40
- const urlPlugin = createPlugin(() => ({ prosePlugins: () => [proseUrlPlugin()] }));
41
- const SupportedKeys = __spreadProps(__spreadValues(__spreadValues({}, SupportedKeys$1), SupportedKeys$2), {
39
+ const urlPlugin = $prose(() => proseUrlPlugin());
40
+ const exitTable = (node) => (state, dispatch) => {
41
+ if (!isInTable(state)) {
42
+ return false;
43
+ }
44
+ const { $head } = state.selection;
45
+ const pos = $head.after();
46
+ const tr = state.tr.replaceWith(pos, pos, node.createAndFill());
47
+ tr.setSelection(Selection.near(tr.doc.resolve(pos), 1));
48
+ dispatch == null ? void 0 : dispatch(tr.scrollIntoView());
49
+ return true;
50
+ };
51
+ const findTable = (selection) => findParentNode((node) => node.type.spec.tableRole === "table")(selection);
52
+ const getCellsInColumn = (columnIndex) => (selection) => {
53
+ const table2 = findTable(selection);
54
+ if (!table2)
55
+ return void 0;
56
+ const map = TableMap.get(table2.node);
57
+ if (columnIndex < 0 || columnIndex >= map.width) {
58
+ return void 0;
59
+ }
60
+ return map.cellsInRect({ left: columnIndex, right: columnIndex + 1, top: 0, bottom: map.height }).map((pos) => {
61
+ const node = table2.node.nodeAt(pos);
62
+ if (!node)
63
+ throw new Error();
64
+ const start = pos + table2.start;
65
+ return {
66
+ pos: start,
67
+ start: start + 1,
68
+ node
69
+ };
70
+ });
71
+ };
72
+ const getCellsInRow = (rowIndex) => (selection) => {
73
+ const table2 = findTable(selection);
74
+ if (!table2)
75
+ return void 0;
76
+ const map = TableMap.get(table2.node);
77
+ if (rowIndex < 0 || rowIndex >= map.height) {
78
+ return void 0;
79
+ }
80
+ return map.cellsInRect({ left: 0, right: map.width, top: rowIndex, bottom: rowIndex + 1 }).map((pos) => {
81
+ const node = table2.node.nodeAt(pos);
82
+ if (!node)
83
+ throw new Error();
84
+ const start = pos + table2.start;
85
+ return {
86
+ pos: start,
87
+ start: start + 1,
88
+ node
89
+ };
90
+ });
91
+ };
92
+ const createTable = (schema2, rowsCount = 3, colsCount = 3) => {
93
+ const { cell: tableCell, header_cell: tableHeader, row: tableRow, table: table2 } = tableNodeTypes(schema2);
94
+ const cells = Array(colsCount).fill(0).map(() => tableCell.createAndFill(null));
95
+ const headerCells = Array(colsCount).fill(0).map(() => tableHeader.createAndFill(null));
96
+ const rows = Array(rowsCount).fill(0).map((_, i) => tableRow.create(null, i === 0 ? headerCells : cells));
97
+ return table2.create(null, rows);
98
+ };
99
+ const selectLine = (type) => (index) => (tr) => {
100
+ const table2 = findTable(tr.selection);
101
+ const isRowSelection = type === "row";
102
+ if (table2) {
103
+ const map = TableMap.get(table2.node);
104
+ if (index >= 0 && index < (isRowSelection ? map.height : map.width)) {
105
+ const lastCell = map.positionAt(isRowSelection ? index : map.height - 1, isRowSelection ? map.width - 1 : index, table2.node);
106
+ const $lastCell = tr.doc.resolve(table2.start + lastCell);
107
+ const createCellSelection = isRowSelection ? CellSelection.rowSelection : CellSelection.colSelection;
108
+ const firstCell = map.positionAt(isRowSelection ? index : 0, isRowSelection ? 0 : index, table2.node);
109
+ const $firstCell = tr.doc.resolve(table2.start + firstCell);
110
+ return cloneTr(tr.setSelection(createCellSelection($lastCell, $firstCell)));
111
+ }
112
+ }
113
+ return tr;
114
+ };
115
+ const getCellsInTable = (selection) => {
116
+ const table2 = findTable(selection);
117
+ if (!table2) {
118
+ return;
119
+ }
120
+ const map = TableMap.get(table2.node);
121
+ const cells = map.cellsInRect({
122
+ left: 0,
123
+ right: map.width,
124
+ top: 0,
125
+ bottom: map.height
126
+ });
127
+ return cells.map((nodePos) => {
128
+ const node = table2.node.nodeAt(nodePos);
129
+ const pos = nodePos + table2.start;
130
+ return { pos, start: pos + 1, node };
131
+ });
132
+ };
133
+ const selectTable = (tr) => {
134
+ const cells = getCellsInTable(tr.selection);
135
+ if (cells) {
136
+ const $firstCell = tr.doc.resolve(cells[0].pos);
137
+ const $lastCell = tr.doc.resolve(cells[cells.length - 1].pos);
138
+ return cloneTr(tr.setSelection(new CellSelection($lastCell, $firstCell)));
139
+ }
140
+ return tr;
141
+ };
142
+ function addRowWithAlignment(tr, { map, tableStart, table: table2 }, row) {
143
+ const rowPos = Array(row).fill(0).reduce((acc, _, i) => {
144
+ return acc + table2.child(i).nodeSize;
145
+ }, tableStart);
146
+ const { cell: cellType, row: rowType } = tableNodeTypes(table2.type.schema);
147
+ const cells = Array(map.width).fill(0).map((_, col) => {
148
+ const headerCol = table2.nodeAt(map.map[col]);
149
+ return cellType.createAndFill({ alignment: headerCol == null ? void 0 : headerCol.attrs.alignment });
150
+ });
151
+ tr.insert(rowPos, rowType.create(null, cells));
152
+ return tr;
153
+ }
154
+ const getCellSelection = (view) => view.state.selection;
155
+ const isFirstRowSelected = (selection) => {
156
+ const map = TableMap.get(selection.$anchorCell.node(-1));
157
+ const start = selection.$anchorCell.start(-1);
158
+ const cells = map.cellsInRect({
159
+ left: 0,
160
+ right: map.width,
161
+ top: 0,
162
+ bottom: 1
163
+ });
164
+ const selectedCells = map.cellsInRect(map.rectBetween(selection.$anchorCell.pos - start, selection.$headCell.pos - start));
165
+ for (let i = 0, count = cells.length; i < count; i++) {
166
+ if (selectedCells.indexOf(cells[i]) === -1) {
167
+ return false;
168
+ }
169
+ }
170
+ return true;
171
+ };
172
+ const calculateItem = (actions, view) => {
173
+ Object.values(actions).forEach((item) => {
174
+ var _a;
175
+ const disable = (_a = item.disable) == null ? void 0 : _a.call(item, view);
176
+ if (disable) {
177
+ item.$.classList.add("hide");
178
+ return;
179
+ }
180
+ item.$.classList.remove("hide");
181
+ });
182
+ };
183
+ var Action;
184
+ (function(Action2) {
185
+ Action2[Action2["AddColLeft"] = 0] = "AddColLeft";
186
+ Action2[Action2["AddColRight"] = 1] = "AddColRight";
187
+ Action2[Action2["AddRowTop"] = 2] = "AddRowTop";
188
+ Action2[Action2["AddRowBottom"] = 3] = "AddRowBottom";
189
+ Action2[Action2["AlignLeft"] = 4] = "AlignLeft";
190
+ Action2[Action2["AlignCenter"] = 5] = "AlignCenter";
191
+ Action2[Action2["AlignRight"] = 6] = "AlignRight";
192
+ Action2[Action2["Delete"] = 7] = "Delete";
193
+ })(Action || (Action = {}));
194
+ const createActions = (ctx) => ({
195
+ [0]: {
196
+ $: ctx.get(themeToolCtx).slots.icon("leftArrow"),
197
+ command: () => addColumnBefore,
198
+ disable: (view) => !getCellSelection(view).isColSelection()
199
+ },
200
+ [1]: {
201
+ $: ctx.get(themeToolCtx).slots.icon("rightArrow"),
202
+ command: () => addColumnAfter,
203
+ disable: (view) => !getCellSelection(view).isColSelection()
204
+ },
205
+ [2]: {
206
+ $: ctx.get(themeToolCtx).slots.icon("upArrow"),
207
+ command: () => (state, dispatch) => {
208
+ if (!isInTable(state))
209
+ return false;
210
+ if (dispatch) {
211
+ const rect = selectedRect(state);
212
+ dispatch(addRowWithAlignment(state.tr, rect, rect.top));
213
+ }
214
+ return true;
215
+ },
216
+ disable: (view) => !getCellSelection(view).isRowSelection() || getCellSelection(view).$head.parent.type.name === "table_header"
217
+ },
218
+ [3]: {
219
+ $: ctx.get(themeToolCtx).slots.icon("downArrow"),
220
+ command: () => (state, dispatch) => {
221
+ if (!isInTable(state))
222
+ return false;
223
+ if (dispatch) {
224
+ const rect = selectedRect(state);
225
+ dispatch(addRowWithAlignment(state.tr, rect, rect.bottom));
226
+ }
227
+ return true;
228
+ },
229
+ disable: (view) => !getCellSelection(view).isRowSelection()
230
+ },
231
+ [4]: {
232
+ $: ctx.get(themeToolCtx).slots.icon("alignLeft"),
233
+ command: () => setCellAttr("alignment", "left"),
234
+ disable: (view) => !getCellSelection(view).isColSelection()
235
+ },
236
+ [5]: {
237
+ $: ctx.get(themeToolCtx).slots.icon("alignCenter"),
238
+ command: () => setCellAttr("alignment", "center"),
239
+ disable: (view) => !getCellSelection(view).isColSelection()
240
+ },
241
+ [6]: {
242
+ $: ctx.get(themeToolCtx).slots.icon("alignRight"),
243
+ command: () => setCellAttr("alignment", "right"),
244
+ disable: (view) => !getCellSelection(view).isColSelection()
245
+ },
246
+ [7]: {
247
+ $: ctx.get(themeToolCtx).slots.icon("delete"),
248
+ command: (_, view) => {
249
+ const selection = getCellSelection(view);
250
+ const isCol = selection.isColSelection();
251
+ const isRow = selection.isRowSelection();
252
+ if (isCol && isRow) {
253
+ return deleteTable;
254
+ }
255
+ if (isCol) {
256
+ return deleteColumn;
257
+ }
258
+ return deleteRow;
259
+ },
260
+ disable: (view) => {
261
+ const selection = getCellSelection(view);
262
+ if (selection.isRowSelection()) {
263
+ if (selection.isColSelection()) {
264
+ return false;
265
+ }
266
+ return isFirstRowSelected(selection);
267
+ }
268
+ return false;
269
+ }
270
+ }
271
+ });
272
+ const calculatePosition = (view, dom) => {
273
+ const { selection } = view.state;
274
+ const isCol = selection.isColSelection();
275
+ const isRow = selection.isRowSelection();
276
+ calculateNodePosition(view, dom, (selected, target, parent) => {
277
+ const $editor = dom.parentElement;
278
+ if (!$editor) {
279
+ throw new Error();
280
+ }
281
+ let left = !isRow ? selected.left - parent.left + (selected.width - target.width) / 2 : selected.left - parent.left - target.width / 2 - 8;
282
+ const top = selected.top - parent.top - target.height - (isCol ? 14 : 0) - 14 + $editor.scrollTop;
283
+ if (left < 0) {
284
+ left = 0;
285
+ }
286
+ return [top, left];
287
+ });
288
+ };
289
+ var ToolTipPos;
290
+ (function(ToolTipPos2) {
291
+ ToolTipPos2["Left"] = "Left";
292
+ ToolTipPos2["Top"] = "Top";
293
+ ToolTipPos2["Point"] = "Point";
294
+ })(ToolTipPos || (ToolTipPos = {}));
295
+ const injectStyle$1 = ({ size, mixin, palette }) => {
296
+ var _a, _b;
297
+ return css`
298
+ display: inline-flex;
299
+ cursor: pointer;
300
+ z-index: 2;
301
+
302
+ justify-content: space-evenly;
303
+
304
+ position: absolute;
305
+
306
+ border-radius: ${size.radius};
307
+
308
+ ${(_a = mixin.border) == null ? void 0 : _a.call(mixin)};
309
+
310
+ ${(_b = mixin.shadow) == null ? void 0 : _b.call(mixin)};
311
+
312
+ overflow: hidden;
313
+ background: ${palette("surface")};
314
+
315
+ .icon {
316
+ position: relative;
317
+ color: ${palette("solid", 0.87)};
318
+
319
+ width: 3rem;
320
+ line-height: 3rem;
321
+ text-align: center;
322
+ transition: all 0.4s ease-in-out;
323
+ &:hover {
324
+ background-color: ${palette("secondary", 0.12)};
325
+ }
326
+ &.active {
327
+ color: ${palette("primary")};
328
+ }
329
+ &:not(:last-child)::after {
330
+ content: '';
331
+ position: absolute;
332
+ right: 0px;
333
+ top: 0;
334
+ width: ${size.lineWidth};
335
+ bottom: 0;
336
+ background: ${palette("line")};
337
+ }
338
+ }
339
+ &.hide,
340
+ .hide {
341
+ display: none;
342
+ }
343
+ `;
344
+ };
345
+ const calculateClassName = (pos) => {
346
+ switch (pos) {
347
+ case ToolTipPos.Left: {
348
+ return "milkdown-cell-left";
349
+ }
350
+ case ToolTipPos.Top: {
351
+ return "milkdown-cell-top";
352
+ }
353
+ case ToolTipPos.Point:
354
+ default: {
355
+ return "milkdown-cell-point";
356
+ }
357
+ }
358
+ };
359
+ function createWidget(ctx, cell, pos, index = 0) {
360
+ const widget = Decoration.widget(cell.pos + 1, (view) => {
361
+ const div = document.createElement("div");
362
+ div.classList.add(calculateClassName(pos));
363
+ if (pos === ToolTipPos.Point) {
364
+ div.appendChild(ctx.get(themeToolCtx).slots.icon("select"));
365
+ }
366
+ div.addEventListener("mousedown", (e) => {
367
+ if (!view)
368
+ return;
369
+ e.preventDefault();
370
+ switch (pos) {
371
+ case ToolTipPos.Point: {
372
+ view.dispatch(selectTable(view.state.tr));
373
+ return;
374
+ }
375
+ case ToolTipPos.Left: {
376
+ view.dispatch(selectLine("row")(index)(view.state.tr));
377
+ return;
378
+ }
379
+ case ToolTipPos.Top: {
380
+ view.dispatch(selectLine("col")(index)(view.state.tr));
381
+ return;
382
+ }
383
+ }
384
+ });
385
+ return div;
386
+ });
387
+ return widget;
388
+ }
389
+ const operatorPlugin = (ctx, utils) => {
390
+ const items = createActions(ctx);
391
+ const tooltip = document.createElement("div");
392
+ const style = utils.getStyle(injectStyle$1);
393
+ if (style) {
394
+ tooltip.classList.add(style);
395
+ }
396
+ tooltip.classList.add("table-tooltip", "hide");
397
+ return new Plugin({
398
+ key: new PluginKey("MILKDOWN_TABLE_OP"),
399
+ props: {
400
+ decorations: (state) => {
401
+ const decorations = [];
402
+ const leftCells = getCellsInColumn(0)(state.selection);
403
+ if (!leftCells)
404
+ return null;
405
+ const topCells = getCellsInRow(0)(state.selection);
406
+ if (!topCells)
407
+ return null;
408
+ const [topLeft] = leftCells;
409
+ decorations.push(createWidget(ctx, topLeft, ToolTipPos.Point));
410
+ leftCells.forEach((cell, i) => {
411
+ decorations.push(createWidget(ctx, cell, ToolTipPos.Left, i));
412
+ });
413
+ topCells.forEach((cell, i) => {
414
+ decorations.push(createWidget(ctx, cell, ToolTipPos.Top, i));
415
+ });
416
+ return DecorationSet.create(state.doc, decorations);
417
+ }
418
+ },
419
+ view: (editorView) => {
420
+ var _a;
421
+ Object.values(items).forEach(({ $ }) => tooltip.appendChild($));
422
+ (_a = editorView.dom.parentNode) == null ? void 0 : _a.appendChild(tooltip);
423
+ const listener = (e) => {
424
+ if (!editorView)
425
+ return;
426
+ e.stopPropagation();
427
+ e.preventDefault();
428
+ Object.values(items).forEach(({ $, command }) => {
429
+ if ($.contains(e.target)) {
430
+ command(e, editorView)(editorView.state, editorView.dispatch, editorView);
431
+ }
432
+ });
433
+ };
434
+ const hide = () => {
435
+ tooltip.classList.add("hide");
436
+ };
437
+ tooltip.addEventListener("mousedown", listener);
438
+ return {
439
+ update: (view, prevState) => {
440
+ const state = view.state;
441
+ if ((prevState == null ? void 0 : prevState.doc.eq(state.doc)) && prevState.selection.eq(state.selection))
442
+ return;
443
+ const isCellSelection = state.selection instanceof CellSelection;
444
+ if (!isCellSelection || !view.editable) {
445
+ hide();
446
+ return;
447
+ }
448
+ calculateItem(items, view);
449
+ if (Object.values(items).every(({ $ }) => $.classList.contains("hide"))) {
450
+ hide();
451
+ return;
452
+ }
453
+ tooltip.classList.remove("hide");
454
+ calculatePosition(view, tooltip);
455
+ },
456
+ destroy: () => {
457
+ tooltip.removeEventListener("mousedown", listener);
458
+ tooltip.remove();
459
+ }
460
+ };
461
+ }
462
+ });
463
+ };
464
+ const schema = tableNodes({
465
+ tableGroup: "block",
466
+ cellContent: "paragraph",
467
+ cellAttributes: {
468
+ alignment: {
469
+ default: "left",
470
+ getFromDOM: (dom) => dom.style.textAlign || "left",
471
+ setDOMAttr: (value, attrs) => {
472
+ attrs.style = `text-align: ${value || "left"}`;
473
+ }
474
+ }
475
+ }
476
+ });
477
+ const proseTableStyle = css`
478
+ /* copy from https://github.com/ProseMirror/prosemirror-tables/blob/master/style/tables.css */
479
+ .ProseMirror .tableWrapper {
480
+ overflow-x: auto;
481
+ }
482
+ .ProseMirror table {
483
+ border-collapse: collapse;
484
+ table-layout: fixed;
485
+ width: 100%;
486
+ overflow: hidden;
487
+ }
488
+ .ProseMirror td,
489
+ .ProseMirror th {
490
+ vertical-align: top;
491
+ box-sizing: border-box;
492
+ position: relative;
493
+ }
494
+ .ProseMirror .column-resize-handle {
495
+ position: absolute;
496
+ right: -2px;
497
+ top: 0;
498
+ bottom: 0;
499
+ width: 4px;
500
+ z-index: 20;
501
+ background-color: #adf;
502
+ pointer-events: none;
503
+ }
504
+ .ProseMirror.resize-cursor {
505
+ cursor: ew-resize;
506
+ cursor: col-resize;
507
+ }
508
+ /* Give selected cells a blue overlay */
509
+ .ProseMirror .selectedCell:after {
510
+ z-index: 2;
511
+ position: absolute;
512
+ content: '';
513
+ left: 0;
514
+ right: 0;
515
+ top: 0;
516
+ bottom: 0;
517
+ background: rgba(200, 200, 255, 0.4);
518
+ pointer-events: none;
519
+ }
520
+ `;
521
+ const injectStyle = (utils) => {
522
+ const css2 = injectGlobal;
523
+ return utils.getStyle(({ size, palette, mixin }) => {
524
+ var _a, _b, _c;
525
+ css2`
526
+ ${proseTableStyle}
527
+
528
+ .tableWrapper {
529
+ margin: 0 !important;
530
+
531
+ ${(_a = mixin.scrollbar) == null ? void 0 : _a.call(mixin, "x")};
532
+
533
+ width: 100%;
534
+
535
+ table {
536
+ width: calc(100% - 2rem) !important;
537
+ border-radius: ${size.radius};
538
+ box-sizing: border-box;
539
+ margin: 1rem 0 1rem 1rem !important;
540
+ overflow: auto !important;
541
+ * {
542
+ margin: 0 !important;
543
+ box-sizing: border-box;
544
+ font-size: 1rem;
545
+ }
546
+ tr {
547
+ ${(_b = mixin.border) == null ? void 0 : _b.call(mixin, "bottom")};
548
+ }
549
+
550
+ th {
551
+ background: ${palette("background", 0.5)};
552
+ font-weight: 400;
553
+ }
554
+
555
+ th,
556
+ td {
557
+ min-width: 100px;
558
+ ${(_c = mixin.border) == null ? void 0 : _c.call(mixin)};
559
+ text-align: left;
560
+ position: relative;
561
+ line-height: 3rem;
562
+ box-sizing: border-box;
563
+ height: 3rem;
564
+ }
565
+
566
+ .selectedCell {
567
+ &::after {
568
+ background: ${palette("secondary", 0.38)};
569
+ }
570
+ & ::selection {
571
+ background: transparent;
572
+ }
573
+ }
574
+
575
+ .column-resize-handle {
576
+ background: ${palette("primary")};
577
+ width: ${size.lineWidth};
578
+ }
579
+
580
+ th,
581
+ td {
582
+ padding: 0 1rem;
583
+ p {
584
+ line-height: unset !important;
585
+ }
586
+ }
587
+
588
+ .milkdown-cell-left,
589
+ .milkdown-cell-point,
590
+ .milkdown-cell-top {
591
+ position: absolute;
592
+
593
+ &::after {
594
+ cursor: pointer;
595
+ position: absolute;
596
+ top: 0;
597
+ left: 0;
598
+ height: 100%;
599
+ width: 100%;
600
+ display: block;
601
+ transition: all 0.2s ease-in-out;
602
+ background: ${palette("secondary", 0.12)};
603
+ content: '';
604
+ }
605
+ &:hover::after {
606
+ background: ${palette("secondary", 0.38)};
607
+ }
608
+ }
609
+
610
+ .milkdown-cell-left {
611
+ left: calc(-6px - 0.5rem);
612
+ top: 0;
613
+ bottom: 0;
614
+ width: 0.5rem;
615
+ }
616
+
617
+ .milkdown-cell-top {
618
+ left: 0;
619
+ right: 0;
620
+ top: calc(-6px - 0.5rem);
621
+ height: 0.5rem;
622
+ }
623
+
624
+ .milkdown-cell-point {
625
+ left: calc(-2px - 1rem);
626
+ top: calc(-2px - 1rem);
627
+ width: 1rem;
628
+ height: 1rem;
629
+
630
+ .icon {
631
+ position: absolute;
632
+ top: 0;
633
+ bottom: 0;
634
+ left: 0;
635
+ right: 0;
636
+ }
637
+ }
638
+ }
639
+ }
640
+ `;
641
+ });
642
+ };
643
+ const SupportedKeys$1 = {
644
+ NextCell: "NextCell",
645
+ PrevCell: "PrevCell",
646
+ ExitTable: "ExitTable"
647
+ };
648
+ const PrevCell = createCmdKey();
649
+ const NextCell = createCmdKey();
650
+ const BreakTable = createCmdKey();
651
+ const InsertTable = createCmdKey();
652
+ const table = createPlugin((utils) => {
653
+ injectStyle(utils);
654
+ return {
655
+ schema: () => ({
656
+ node: {
657
+ table: __spreadProps(__spreadValues({}, schema.table), {
658
+ parseMarkdown: {
659
+ match: (node) => node.type === "table",
660
+ runner: (state, node, type) => {
661
+ const align = node.align;
662
+ const children = node.children.map((x, i) => __spreadProps(__spreadValues({}, x), {
663
+ align,
664
+ isHeader: i === 0
665
+ }));
666
+ state.openNode(type);
667
+ state.next(children);
668
+ state.closeNode();
669
+ }
670
+ },
671
+ toMarkdown: {
672
+ match: (node) => node.type.name === "table",
673
+ runner: (state, node) => {
674
+ var _a;
675
+ const firstLine = (_a = node.content.firstChild) == null ? void 0 : _a.content;
676
+ if (!firstLine)
677
+ return;
678
+ const align = [];
679
+ firstLine.forEach((cell) => {
680
+ align.push(cell.attrs.alignment);
681
+ });
682
+ state.openNode("table", void 0, { align });
683
+ state.next(node.content);
684
+ state.closeNode();
685
+ }
686
+ }
687
+ }),
688
+ table_row: __spreadProps(__spreadValues({}, schema.table_row), {
689
+ parseMarkdown: {
690
+ match: (node) => node.type === "tableRow",
691
+ runner: (state, node, type) => {
692
+ const align = node.align;
693
+ const children = node.children.map((x, i) => __spreadProps(__spreadValues({}, x), {
694
+ align: align[i],
695
+ isHeader: node.isHeader
696
+ }));
697
+ state.openNode(type);
698
+ state.next(children);
699
+ state.closeNode();
700
+ }
701
+ },
702
+ toMarkdown: {
703
+ match: (node) => node.type.name === "table_row",
704
+ runner: (state, node) => {
705
+ state.openNode("tableRow");
706
+ state.next(node.content);
707
+ state.closeNode();
708
+ }
709
+ }
710
+ }),
711
+ table_cell: __spreadProps(__spreadValues({}, schema.table_cell), {
712
+ parseMarkdown: {
713
+ match: (node) => node.type === "tableCell" && !node.isHeader,
714
+ runner: (state, node, type) => {
715
+ const align = node.align;
716
+ state.openNode(type, { alignment: align }).openNode(state.schema.nodes.paragraph).next(node.children).closeNode().closeNode();
717
+ }
718
+ },
719
+ toMarkdown: {
720
+ match: (node) => node.type.name === "table_cell",
721
+ runner: (state, node) => {
722
+ state.openNode("tableCell").next(node.content).closeNode();
723
+ }
724
+ }
725
+ }),
726
+ table_header: __spreadProps(__spreadValues({}, schema.table_header), {
727
+ parseMarkdown: {
728
+ match: (node) => node.type === "tableCell" && !!node.isHeader,
729
+ runner: (state, node, type) => {
730
+ const align = node.align;
731
+ state.openNode(type, { alignment: align });
732
+ state.openNode(state.schema.nodes.paragraph);
733
+ state.next(node.children);
734
+ state.closeNode();
735
+ state.closeNode();
736
+ }
737
+ },
738
+ toMarkdown: {
739
+ match: (node) => node.type.name === "table_header",
740
+ runner: (state, node) => {
741
+ state.openNode("tableCell");
742
+ state.next(node.content);
743
+ state.closeNode();
744
+ }
745
+ }
746
+ })
747
+ }
748
+ }),
749
+ inputRules: (nodeType, ctx) => [
750
+ new InputRule(/^\|\|\s$/, (state, _match, start, end) => {
751
+ const $start = state.doc.resolve(start);
752
+ if (!$start.node(-1).canReplaceWith($start.index(-1), $start.indexAfter(-1), nodeType.table))
753
+ return null;
754
+ const tableNode = createTable(ctx.get(schemaCtx));
755
+ const tr = state.tr.replaceRangeWith(start, end, tableNode).scrollIntoView();
756
+ return tr.setSelection(TextSelection.create(tr.doc, start + 3));
757
+ })
758
+ ],
759
+ commands: (_, ctx) => [
760
+ createCmd(PrevCell, () => goToNextCell(-1)),
761
+ createCmd(NextCell, () => goToNextCell(1)),
762
+ createCmd(BreakTable, () => exitTable(ctx.get(schemaCtx).nodes.paragraph)),
763
+ createCmd(InsertTable, () => (state, dispatch) => {
764
+ const { selection, tr } = state;
765
+ const { from } = selection;
766
+ const table2 = createTable(ctx.get(schemaCtx));
767
+ const _tr = tr.replaceSelectionWith(table2);
768
+ const sel = Selection.findFrom(_tr.doc.resolve(from), 1, true);
769
+ if (sel) {
770
+ dispatch == null ? void 0 : dispatch(_tr.setSelection(sel));
771
+ }
772
+ return true;
773
+ })
774
+ ],
775
+ shortcuts: {
776
+ [SupportedKeys$1.NextCell]: createShortcut(NextCell, "Mod-]"),
777
+ [SupportedKeys$1.PrevCell]: createShortcut(PrevCell, "Mod-["),
778
+ [SupportedKeys$1.ExitTable]: createShortcut(BreakTable, "Mod-Enter")
779
+ },
780
+ prosePlugins: (_, ctx) => {
781
+ return [operatorPlugin(ctx, utils), columnResizing({}), tableEditing()];
782
+ }
783
+ };
784
+ });
785
+ const SupportedKeys = __spreadProps(__spreadValues(__spreadValues({}, SupportedKeys$2), SupportedKeys$1), {
42
786
  StrikeThrough: "StrikeThrough",
43
787
  TaskList: "TaskList"
44
788
  });
@@ -146,13 +890,14 @@ const taskListItem = createNode((utils) => {
146
890
  },
147
891
  parseDOM: [
148
892
  {
149
- tag: 'li[data-type="task-list-item"]',
893
+ tag: 'li[data-type="task-item"]',
150
894
  getAttrs: (dom) => {
151
895
  if (!(dom instanceof HTMLElement)) {
152
896
  throw new Error();
153
897
  }
154
898
  return { checked: dom.dataset.checked === "true" };
155
- }
899
+ },
900
+ priority: 60
156
901
  }
157
902
  ],
158
903
  toDOM: (node) => [
@@ -267,7 +1012,14 @@ const taskListItem = createNode((utils) => {
267
1012
  }
268
1013
  };
269
1014
  });
270
- const gfm = AtomList.create([...commonmark, tablePlugin(), urlPlugin(), strikeThrough(), taskListItem()]);
1015
+ const gfm = AtomList.create([
1016
+ ...commonmark,
1017
+ $remark(() => remarkGFM),
1018
+ table(),
1019
+ urlPlugin,
1020
+ strikeThrough(),
1021
+ taskListItem()
1022
+ ]);
271
1023
  const commands = __spreadProps(__spreadValues({}, commands$1), {
272
1024
  ToggleStrikeThrough,
273
1025
  TurnIntoTaskList,
@@ -275,5 +1027,5 @@ const commands = __spreadProps(__spreadValues({}, commands$1), {
275
1027
  LiftTaskListItem,
276
1028
  SplitTaskListItem
277
1029
  });
278
- export { LiftTaskListItem, SinkTaskListItem, SplitTaskListItem, SupportedKeys, ToggleStrikeThrough, TurnIntoTaskList, commands, gfm, strikeThrough, taskListItem };
1030
+ export { BreakTable, InsertTable, LiftTaskListItem, NextCell, PrevCell, SinkTaskListItem, SplitTaskListItem, SupportedKeys, ToggleStrikeThrough, TurnIntoTaskList, commands, createTable, gfm, strikeThrough, table, taskListItem };
279
1031
  //# sourceMappingURL=index.es.js.map