@tiptap/extension-task-item 2.0.0-beta.21 → 2.0.0-beta.25

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.
@@ -4,4 +4,4 @@ export interface TaskItemOptions {
4
4
  HTMLAttributes: Record<string, any>;
5
5
  }
6
6
  export declare const inputRegex: RegExp;
7
- export declare const TaskItem: Node<TaskItemOptions>;
7
+ export declare const TaskItem: Node<TaskItemOptions, any>;
@@ -7,9 +7,11 @@ var core = require('@tiptap/core');
7
7
  const inputRegex = /^\s*(\[([ |x])\])\s$/;
8
8
  const TaskItem = core.Node.create({
9
9
  name: 'taskItem',
10
- defaultOptions: {
11
- nested: false,
12
- HTMLAttributes: {},
10
+ addOptions() {
11
+ return {
12
+ nested: false,
13
+ HTMLAttributes: {},
14
+ };
13
15
  },
14
16
  content() {
15
17
  return this.options.nested ? 'paragraph block*' : 'paragraph+';
@@ -35,8 +37,28 @@ const TaskItem = core.Node.create({
35
37
  },
36
38
  ];
37
39
  },
38
- renderHTML({ HTMLAttributes }) {
39
- return ['li', core.mergeAttributes(this.options.HTMLAttributes, HTMLAttributes, { 'data-type': 'taskItem' }), 0];
40
+ renderHTML({ node, HTMLAttributes }) {
41
+ return [
42
+ 'li',
43
+ core.mergeAttributes(this.options.HTMLAttributes, HTMLAttributes, { 'data-type': 'taskItem' }),
44
+ [
45
+ 'label',
46
+ [
47
+ 'input',
48
+ {
49
+ type: 'checkbox',
50
+ checked: node.attrs.checked
51
+ ? 'checked'
52
+ : null,
53
+ },
54
+ ],
55
+ ['span'],
56
+ ],
57
+ [
58
+ 'div',
59
+ 0,
60
+ ],
61
+ ];
40
62
  },
41
63
  addKeyboardShortcuts() {
42
64
  const shortcuts = {
@@ -81,6 +103,9 @@ const TaskItem = core.Node.create({
81
103
  .run();
82
104
  }
83
105
  });
106
+ Object.entries(this.options.HTMLAttributes).forEach(([key, value]) => {
107
+ listItem.setAttribute(key, value);
108
+ });
84
109
  listItem.dataset.checked = node.attrs.checked;
85
110
  if (node.attrs.checked) {
86
111
  checkbox.setAttribute('checked', 'checked');
@@ -1 +1 @@
1
- {"version":3,"file":"tiptap-extension-task-item.cjs.js","sources":["../src/task-item.ts"],"sourcesContent":["import { Node, mergeAttributes, wrappingInputRule } from '@tiptap/core'\n\nexport interface TaskItemOptions {\n nested: boolean,\n HTMLAttributes: Record<string, any>,\n}\n\nexport const inputRegex = /^\\s*(\\[([ |x])\\])\\s$/\n\nexport const TaskItem = Node.create<TaskItemOptions>({\n name: 'taskItem',\n\n defaultOptions: {\n nested: false,\n HTMLAttributes: {},\n },\n\n content() {\n return this.options.nested ? 'paragraph block*' : 'paragraph+'\n },\n\n defining: true,\n\n addAttributes() {\n return {\n checked: {\n default: false,\n keepOnSplit: false,\n parseHTML: element => element.getAttribute('data-checked') === 'true',\n renderHTML: attributes => ({\n 'data-checked': attributes.checked,\n }),\n },\n }\n },\n\n parseHTML() {\n return [\n {\n tag: 'li[data-type=\"taskItem\"]',\n priority: 51,\n },\n ]\n },\n\n renderHTML({ HTMLAttributes }) {\n return ['li', mergeAttributes(\n this.options.HTMLAttributes,\n HTMLAttributes,\n { 'data-type': 'taskItem' },\n ), 0]\n },\n\n addKeyboardShortcuts() {\n const shortcuts = {\n Enter: () => this.editor.commands.splitListItem('taskItem'),\n 'Shift-Tab': () => this.editor.commands.liftListItem('taskItem'),\n }\n\n if (!this.options.nested) {\n return shortcuts\n }\n\n return {\n ...shortcuts,\n Tab: () => this.editor.commands.sinkListItem('taskItem'),\n }\n },\n\n addNodeView() {\n return ({\n node,\n HTMLAttributes,\n getPos,\n editor,\n }) => {\n const listItem = document.createElement('li')\n const checkboxWrapper = document.createElement('label')\n const checkboxStyler = document.createElement('span')\n const checkbox = document.createElement('input')\n const content = document.createElement('div')\n\n checkboxWrapper.contentEditable = 'false'\n checkbox.type = 'checkbox'\n checkbox.addEventListener('change', event => {\n // if the editor isn’t editable\n // we have to undo the latest change\n if (!editor.isEditable) {\n checkbox.checked = !checkbox.checked\n\n return\n }\n\n const { checked } = event.target as any\n\n if (editor.isEditable && typeof getPos === 'function') {\n editor\n .chain()\n .focus()\n .command(({ tr }) => {\n tr.setNodeMarkup(getPos(), undefined, {\n checked,\n })\n\n return true\n })\n .run()\n }\n })\n\n listItem.dataset.checked = node.attrs.checked\n if (node.attrs.checked) {\n checkbox.setAttribute('checked', 'checked')\n }\n\n checkboxWrapper.append(checkbox, checkboxStyler)\n listItem.append(checkboxWrapper, content)\n\n Object\n .entries(HTMLAttributes)\n .forEach(([key, value]) => {\n listItem.setAttribute(key, value)\n })\n\n return {\n dom: listItem,\n contentDOM: content,\n update: updatedNode => {\n if (updatedNode.type !== this.type) {\n return false\n }\n\n listItem.dataset.checked = updatedNode.attrs.checked\n if (updatedNode.attrs.checked) {\n checkbox.setAttribute('checked', 'checked')\n } else {\n checkbox.removeAttribute('checked')\n }\n\n return true\n },\n }\n }\n },\n\n addInputRules() {\n return [\n wrappingInputRule({\n find: inputRegex,\n type: this.type,\n getAttributes: match => ({\n checked: match[match.length - 1] === 'x',\n }),\n }),\n ]\n },\n})\n"],"names":["Node","mergeAttributes","wrappingInputRule"],"mappings":"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"}
1
+ {"version":3,"file":"tiptap-extension-task-item.cjs.js","sources":["../src/task-item.ts"],"sourcesContent":["import { Node, mergeAttributes, wrappingInputRule } from '@tiptap/core'\n\nexport interface TaskItemOptions {\n nested: boolean,\n HTMLAttributes: Record<string, any>,\n}\n\nexport const inputRegex = /^\\s*(\\[([ |x])\\])\\s$/\n\nexport const TaskItem = Node.create<TaskItemOptions>({\n name: 'taskItem',\n\n addOptions() {\n return {\n nested: false,\n HTMLAttributes: {},\n }\n },\n\n content() {\n return this.options.nested ? 'paragraph block*' : 'paragraph+'\n },\n\n defining: true,\n\n addAttributes() {\n return {\n checked: {\n default: false,\n keepOnSplit: false,\n parseHTML: element => element.getAttribute('data-checked') === 'true',\n renderHTML: attributes => ({\n 'data-checked': attributes.checked,\n }),\n },\n }\n },\n\n parseHTML() {\n return [\n {\n tag: 'li[data-type=\"taskItem\"]',\n priority: 51,\n },\n ]\n },\n\n renderHTML({ node, HTMLAttributes }) {\n return [\n 'li',\n mergeAttributes(\n this.options.HTMLAttributes,\n HTMLAttributes,\n { 'data-type': 'taskItem' },\n ),\n [\n 'label',\n [\n 'input',\n {\n type: 'checkbox',\n checked: node.attrs.checked\n ? 'checked'\n : null,\n },\n ],\n ['span'],\n ],\n [\n 'div',\n 0,\n ],\n ]\n },\n\n addKeyboardShortcuts() {\n const shortcuts = {\n Enter: () => this.editor.commands.splitListItem('taskItem'),\n 'Shift-Tab': () => this.editor.commands.liftListItem('taskItem'),\n }\n\n if (!this.options.nested) {\n return shortcuts\n }\n\n return {\n ...shortcuts,\n Tab: () => this.editor.commands.sinkListItem('taskItem'),\n }\n },\n\n addNodeView() {\n return ({\n node,\n HTMLAttributes,\n getPos,\n editor,\n }) => {\n const listItem = document.createElement('li')\n const checkboxWrapper = document.createElement('label')\n const checkboxStyler = document.createElement('span')\n const checkbox = document.createElement('input')\n const content = document.createElement('div')\n\n checkboxWrapper.contentEditable = 'false'\n checkbox.type = 'checkbox'\n checkbox.addEventListener('change', event => {\n // if the editor isn’t editable\n // we have to undo the latest change\n if (!editor.isEditable) {\n checkbox.checked = !checkbox.checked\n\n return\n }\n\n const { checked } = event.target as any\n\n if (editor.isEditable && typeof getPos === 'function') {\n editor\n .chain()\n .focus()\n .command(({ tr }) => {\n tr.setNodeMarkup(getPos(), undefined, {\n checked,\n })\n\n return true\n })\n .run()\n }\n })\n\n Object.entries(this.options.HTMLAttributes).forEach(([key, value]) => {\n listItem.setAttribute(key, value)\n })\n\n listItem.dataset.checked = node.attrs.checked\n if (node.attrs.checked) {\n checkbox.setAttribute('checked', 'checked')\n }\n\n checkboxWrapper.append(checkbox, checkboxStyler)\n listItem.append(checkboxWrapper, content)\n\n Object\n .entries(HTMLAttributes)\n .forEach(([key, value]) => {\n listItem.setAttribute(key, value)\n })\n\n return {\n dom: listItem,\n contentDOM: content,\n update: updatedNode => {\n if (updatedNode.type !== this.type) {\n return false\n }\n\n listItem.dataset.checked = updatedNode.attrs.checked\n if (updatedNode.attrs.checked) {\n checkbox.setAttribute('checked', 'checked')\n } else {\n checkbox.removeAttribute('checked')\n }\n\n return true\n },\n }\n }\n },\n\n addInputRules() {\n return [\n wrappingInputRule({\n find: inputRegex,\n type: this.type,\n getAttributes: match => ({\n checked: match[match.length - 1] === 'x',\n }),\n }),\n ]\n },\n})\n"],"names":["Node","mergeAttributes","wrappingInputRule"],"mappings":";;;;;;MAOa,UAAU,GAAG,uBAAsB;MAEnC,QAAQ,GAAGA,SAAI,CAAC,MAAM,CAAkB;IACnD,IAAI,EAAE,UAAU;IAEhB,UAAU;QACR,OAAO;YACL,MAAM,EAAE,KAAK;YACb,cAAc,EAAE,EAAE;SACnB,CAAA;KACF;IAED,OAAO;QACL,OAAO,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,kBAAkB,GAAG,YAAY,CAAA;KAC/D;IAED,QAAQ,EAAE,IAAI;IAEd,aAAa;QACX,OAAO;YACL,OAAO,EAAE;gBACP,OAAO,EAAE,KAAK;gBACd,WAAW,EAAE,KAAK;gBAClB,SAAS,EAAE,OAAO,IAAI,OAAO,CAAC,YAAY,CAAC,cAAc,CAAC,KAAK,MAAM;gBACrE,UAAU,EAAE,UAAU,KAAK;oBACzB,cAAc,EAAE,UAAU,CAAC,OAAO;iBACnC,CAAC;aACH;SACF,CAAA;KACF;IAED,SAAS;QACP,OAAO;YACL;gBACE,GAAG,EAAE,0BAA0B;gBAC/B,QAAQ,EAAE,EAAE;aACb;SACF,CAAA;KACF;IAED,UAAU,CAAC,EAAE,IAAI,EAAE,cAAc,EAAE;QACjC,OAAO;YACL,IAAI;YACJC,oBAAe,CACb,IAAI,CAAC,OAAO,CAAC,cAAc,EAC3B,cAAc,EACd,EAAE,WAAW,EAAE,UAAU,EAAE,CAC5B;YACD;gBACE,OAAO;gBACP;oBACE,OAAO;oBACP;wBACE,IAAI,EAAE,UAAU;wBAChB,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO;8BACvB,SAAS;8BACT,IAAI;qBACT;iBACF;gBACD,CAAC,MAAM,CAAC;aACT;YACD;gBACE,KAAK;gBACL,CAAC;aACF;SACF,CAAA;KACF;IAED,oBAAoB;QAClB,MAAM,SAAS,GAAG;YAChB,KAAK,EAAE,MAAM,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC;YAC3D,WAAW,EAAE,MAAM,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,YAAY,CAAC,UAAU,CAAC;SACjE,CAAA;QAED,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE;YACxB,OAAO,SAAS,CAAA;SACjB;QAED,OAAO;YACL,GAAG,SAAS;YACZ,GAAG,EAAE,MAAM,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,YAAY,CAAC,UAAU,CAAC;SACzD,CAAA;KACF;IAED,WAAW;QACT,OAAO,CAAC,EACN,IAAI,EACJ,cAAc,EACd,MAAM,EACN,MAAM,GACP;YACC,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAA;YAC7C,MAAM,eAAe,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAA;YACvD,MAAM,cAAc,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAA;YACrD,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAA;YAChD,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAA;YAE7C,eAAe,CAAC,eAAe,GAAG,OAAO,CAAA;YACzC,QAAQ,CAAC,IAAI,GAAG,UAAU,CAAA;YAC1B,QAAQ,CAAC,gBAAgB,CAAC,QAAQ,EAAE,KAAK;;;gBAGvC,IAAI,CAAC,MAAM,CAAC,UAAU,EAAE;oBACtB,QAAQ,CAAC,OAAO,GAAG,CAAC,QAAQ,CAAC,OAAO,CAAA;oBAEpC,OAAM;iBACP;gBAED,MAAM,EAAE,OAAO,EAAE,GAAG,KAAK,CAAC,MAAa,CAAA;gBAEvC,IAAI,MAAM,CAAC,UAAU,IAAI,OAAO,MAAM,KAAK,UAAU,EAAE;oBACrD,MAAM;yBACH,KAAK,EAAE;yBACP,KAAK,EAAE;yBACP,OAAO,CAAC,CAAC,EAAE,EAAE,EAAE;wBACd,EAAE,CAAC,aAAa,CAAC,MAAM,EAAE,EAAE,SAAS,EAAE;4BACpC,OAAO;yBACR,CAAC,CAAA;wBAEF,OAAO,IAAI,CAAA;qBACZ,CAAC;yBACD,GAAG,EAAE,CAAA;iBACT;aACF,CAAC,CAAA;YAEF,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC;gBAC/D,QAAQ,CAAC,YAAY,CAAC,GAAG,EAAE,KAAK,CAAC,CAAA;aAClC,CAAC,CAAA;YAEF,QAAQ,CAAC,OAAO,CAAC,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAA;YAC7C,IAAI,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE;gBACtB,QAAQ,CAAC,YAAY,CAAC,SAAS,EAAE,SAAS,CAAC,CAAA;aAC5C;YAED,eAAe,CAAC,MAAM,CAAC,QAAQ,EAAE,cAAc,CAAC,CAAA;YAChD,QAAQ,CAAC,MAAM,CAAC,eAAe,EAAE,OAAO,CAAC,CAAA;YAEzC,MAAM;iBACH,OAAO,CAAC,cAAc,CAAC;iBACvB,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC;gBACpB,QAAQ,CAAC,YAAY,CAAC,GAAG,EAAE,KAAK,CAAC,CAAA;aAClC,CAAC,CAAA;YAEJ,OAAO;gBACL,GAAG,EAAE,QAAQ;gBACb,UAAU,EAAE,OAAO;gBACnB,MAAM,EAAE,WAAW;oBACjB,IAAI,WAAW,CAAC,IAAI,KAAK,IAAI,CAAC,IAAI,EAAE;wBAClC,OAAO,KAAK,CAAA;qBACb;oBAED,QAAQ,CAAC,OAAO,CAAC,OAAO,GAAG,WAAW,CAAC,KAAK,CAAC,OAAO,CAAA;oBACpD,IAAI,WAAW,CAAC,KAAK,CAAC,OAAO,EAAE;wBAC7B,QAAQ,CAAC,YAAY,CAAC,SAAS,EAAE,SAAS,CAAC,CAAA;qBAC5C;yBAAM;wBACL,QAAQ,CAAC,eAAe,CAAC,SAAS,CAAC,CAAA;qBACpC;oBAED,OAAO,IAAI,CAAA;iBACZ;aACF,CAAA;SACF,CAAA;KACF;IAED,aAAa;QACX,OAAO;YACLC,sBAAiB,CAAC;gBAChB,IAAI,EAAE,UAAU;gBAChB,IAAI,EAAE,IAAI,CAAC,IAAI;gBACf,aAAa,EAAE,KAAK,KAAK;oBACvB,OAAO,EAAE,KAAK,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,KAAK,GAAG;iBACzC,CAAC;aACH,CAAC;SACH,CAAA;KACF;CACF;;;;;;"}
@@ -3,9 +3,11 @@ import { Node, mergeAttributes, wrappingInputRule } from '@tiptap/core';
3
3
  const inputRegex = /^\s*(\[([ |x])\])\s$/;
4
4
  const TaskItem = Node.create({
5
5
  name: 'taskItem',
6
- defaultOptions: {
7
- nested: false,
8
- HTMLAttributes: {},
6
+ addOptions() {
7
+ return {
8
+ nested: false,
9
+ HTMLAttributes: {},
10
+ };
9
11
  },
10
12
  content() {
11
13
  return this.options.nested ? 'paragraph block*' : 'paragraph+';
@@ -31,8 +33,28 @@ const TaskItem = Node.create({
31
33
  },
32
34
  ];
33
35
  },
34
- renderHTML({ HTMLAttributes }) {
35
- return ['li', mergeAttributes(this.options.HTMLAttributes, HTMLAttributes, { 'data-type': 'taskItem' }), 0];
36
+ renderHTML({ node, HTMLAttributes }) {
37
+ return [
38
+ 'li',
39
+ mergeAttributes(this.options.HTMLAttributes, HTMLAttributes, { 'data-type': 'taskItem' }),
40
+ [
41
+ 'label',
42
+ [
43
+ 'input',
44
+ {
45
+ type: 'checkbox',
46
+ checked: node.attrs.checked
47
+ ? 'checked'
48
+ : null,
49
+ },
50
+ ],
51
+ ['span'],
52
+ ],
53
+ [
54
+ 'div',
55
+ 0,
56
+ ],
57
+ ];
36
58
  },
37
59
  addKeyboardShortcuts() {
38
60
  const shortcuts = {
@@ -77,6 +99,9 @@ const TaskItem = Node.create({
77
99
  .run();
78
100
  }
79
101
  });
102
+ Object.entries(this.options.HTMLAttributes).forEach(([key, value]) => {
103
+ listItem.setAttribute(key, value);
104
+ });
80
105
  listItem.dataset.checked = node.attrs.checked;
81
106
  if (node.attrs.checked) {
82
107
  checkbox.setAttribute('checked', 'checked');
@@ -1 +1 @@
1
- {"version":3,"file":"tiptap-extension-task-item.esm.js","sources":["../src/task-item.ts"],"sourcesContent":["import { Node, mergeAttributes, wrappingInputRule } from '@tiptap/core'\n\nexport interface TaskItemOptions {\n nested: boolean,\n HTMLAttributes: Record<string, any>,\n}\n\nexport const inputRegex = /^\\s*(\\[([ |x])\\])\\s$/\n\nexport const TaskItem = Node.create<TaskItemOptions>({\n name: 'taskItem',\n\n defaultOptions: {\n nested: false,\n HTMLAttributes: {},\n },\n\n content() {\n return this.options.nested ? 'paragraph block*' : 'paragraph+'\n },\n\n defining: true,\n\n addAttributes() {\n return {\n checked: {\n default: false,\n keepOnSplit: false,\n parseHTML: element => element.getAttribute('data-checked') === 'true',\n renderHTML: attributes => ({\n 'data-checked': attributes.checked,\n }),\n },\n }\n },\n\n parseHTML() {\n return [\n {\n tag: 'li[data-type=\"taskItem\"]',\n priority: 51,\n },\n ]\n },\n\n renderHTML({ HTMLAttributes }) {\n return ['li', mergeAttributes(\n this.options.HTMLAttributes,\n HTMLAttributes,\n { 'data-type': 'taskItem' },\n ), 0]\n },\n\n addKeyboardShortcuts() {\n const shortcuts = {\n Enter: () => this.editor.commands.splitListItem('taskItem'),\n 'Shift-Tab': () => this.editor.commands.liftListItem('taskItem'),\n }\n\n if (!this.options.nested) {\n return shortcuts\n }\n\n return {\n ...shortcuts,\n Tab: () => this.editor.commands.sinkListItem('taskItem'),\n }\n },\n\n addNodeView() {\n return ({\n node,\n HTMLAttributes,\n getPos,\n editor,\n }) => {\n const listItem = document.createElement('li')\n const checkboxWrapper = document.createElement('label')\n const checkboxStyler = document.createElement('span')\n const checkbox = document.createElement('input')\n const content = document.createElement('div')\n\n checkboxWrapper.contentEditable = 'false'\n checkbox.type = 'checkbox'\n checkbox.addEventListener('change', event => {\n // if the editor isn’t editable\n // we have to undo the latest change\n if (!editor.isEditable) {\n checkbox.checked = !checkbox.checked\n\n return\n }\n\n const { checked } = event.target as any\n\n if (editor.isEditable && typeof getPos === 'function') {\n editor\n .chain()\n .focus()\n .command(({ tr }) => {\n tr.setNodeMarkup(getPos(), undefined, {\n checked,\n })\n\n return true\n })\n .run()\n }\n })\n\n listItem.dataset.checked = node.attrs.checked\n if (node.attrs.checked) {\n checkbox.setAttribute('checked', 'checked')\n }\n\n checkboxWrapper.append(checkbox, checkboxStyler)\n listItem.append(checkboxWrapper, content)\n\n Object\n .entries(HTMLAttributes)\n .forEach(([key, value]) => {\n listItem.setAttribute(key, value)\n })\n\n return {\n dom: listItem,\n contentDOM: content,\n update: updatedNode => {\n if (updatedNode.type !== this.type) {\n return false\n }\n\n listItem.dataset.checked = updatedNode.attrs.checked\n if (updatedNode.attrs.checked) {\n checkbox.setAttribute('checked', 'checked')\n } else {\n checkbox.removeAttribute('checked')\n }\n\n return true\n },\n }\n }\n },\n\n addInputRules() {\n return [\n wrappingInputRule({\n find: inputRegex,\n type: this.type,\n getAttributes: match => ({\n checked: match[match.length - 1] === 'x',\n }),\n }),\n ]\n },\n})\n"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"tiptap-extension-task-item.esm.js","sources":["../src/task-item.ts"],"sourcesContent":["import { Node, mergeAttributes, wrappingInputRule } from '@tiptap/core'\n\nexport interface TaskItemOptions {\n nested: boolean,\n HTMLAttributes: Record<string, any>,\n}\n\nexport const inputRegex = /^\\s*(\\[([ |x])\\])\\s$/\n\nexport const TaskItem = Node.create<TaskItemOptions>({\n name: 'taskItem',\n\n addOptions() {\n return {\n nested: false,\n HTMLAttributes: {},\n }\n },\n\n content() {\n return this.options.nested ? 'paragraph block*' : 'paragraph+'\n },\n\n defining: true,\n\n addAttributes() {\n return {\n checked: {\n default: false,\n keepOnSplit: false,\n parseHTML: element => element.getAttribute('data-checked') === 'true',\n renderHTML: attributes => ({\n 'data-checked': attributes.checked,\n }),\n },\n }\n },\n\n parseHTML() {\n return [\n {\n tag: 'li[data-type=\"taskItem\"]',\n priority: 51,\n },\n ]\n },\n\n renderHTML({ node, HTMLAttributes }) {\n return [\n 'li',\n mergeAttributes(\n this.options.HTMLAttributes,\n HTMLAttributes,\n { 'data-type': 'taskItem' },\n ),\n [\n 'label',\n [\n 'input',\n {\n type: 'checkbox',\n checked: node.attrs.checked\n ? 'checked'\n : null,\n },\n ],\n ['span'],\n ],\n [\n 'div',\n 0,\n ],\n ]\n },\n\n addKeyboardShortcuts() {\n const shortcuts = {\n Enter: () => this.editor.commands.splitListItem('taskItem'),\n 'Shift-Tab': () => this.editor.commands.liftListItem('taskItem'),\n }\n\n if (!this.options.nested) {\n return shortcuts\n }\n\n return {\n ...shortcuts,\n Tab: () => this.editor.commands.sinkListItem('taskItem'),\n }\n },\n\n addNodeView() {\n return ({\n node,\n HTMLAttributes,\n getPos,\n editor,\n }) => {\n const listItem = document.createElement('li')\n const checkboxWrapper = document.createElement('label')\n const checkboxStyler = document.createElement('span')\n const checkbox = document.createElement('input')\n const content = document.createElement('div')\n\n checkboxWrapper.contentEditable = 'false'\n checkbox.type = 'checkbox'\n checkbox.addEventListener('change', event => {\n // if the editor isn’t editable\n // we have to undo the latest change\n if (!editor.isEditable) {\n checkbox.checked = !checkbox.checked\n\n return\n }\n\n const { checked } = event.target as any\n\n if (editor.isEditable && typeof getPos === 'function') {\n editor\n .chain()\n .focus()\n .command(({ tr }) => {\n tr.setNodeMarkup(getPos(), undefined, {\n checked,\n })\n\n return true\n })\n .run()\n }\n })\n\n Object.entries(this.options.HTMLAttributes).forEach(([key, value]) => {\n listItem.setAttribute(key, value)\n })\n\n listItem.dataset.checked = node.attrs.checked\n if (node.attrs.checked) {\n checkbox.setAttribute('checked', 'checked')\n }\n\n checkboxWrapper.append(checkbox, checkboxStyler)\n listItem.append(checkboxWrapper, content)\n\n Object\n .entries(HTMLAttributes)\n .forEach(([key, value]) => {\n listItem.setAttribute(key, value)\n })\n\n return {\n dom: listItem,\n contentDOM: content,\n update: updatedNode => {\n if (updatedNode.type !== this.type) {\n return false\n }\n\n listItem.dataset.checked = updatedNode.attrs.checked\n if (updatedNode.attrs.checked) {\n checkbox.setAttribute('checked', 'checked')\n } else {\n checkbox.removeAttribute('checked')\n }\n\n return true\n },\n }\n }\n },\n\n addInputRules() {\n return [\n wrappingInputRule({\n find: inputRegex,\n type: this.type,\n getAttributes: match => ({\n checked: match[match.length - 1] === 'x',\n }),\n }),\n ]\n },\n})\n"],"names":[],"mappings":";;MAOa,UAAU,GAAG,uBAAsB;MAEnC,QAAQ,GAAG,IAAI,CAAC,MAAM,CAAkB;IACnD,IAAI,EAAE,UAAU;IAEhB,UAAU;QACR,OAAO;YACL,MAAM,EAAE,KAAK;YACb,cAAc,EAAE,EAAE;SACnB,CAAA;KACF;IAED,OAAO;QACL,OAAO,IAAI,CAAC,OAAO,CAAC,MAAM,GAAG,kBAAkB,GAAG,YAAY,CAAA;KAC/D;IAED,QAAQ,EAAE,IAAI;IAEd,aAAa;QACX,OAAO;YACL,OAAO,EAAE;gBACP,OAAO,EAAE,KAAK;gBACd,WAAW,EAAE,KAAK;gBAClB,SAAS,EAAE,OAAO,IAAI,OAAO,CAAC,YAAY,CAAC,cAAc,CAAC,KAAK,MAAM;gBACrE,UAAU,EAAE,UAAU,KAAK;oBACzB,cAAc,EAAE,UAAU,CAAC,OAAO;iBACnC,CAAC;aACH;SACF,CAAA;KACF;IAED,SAAS;QACP,OAAO;YACL;gBACE,GAAG,EAAE,0BAA0B;gBAC/B,QAAQ,EAAE,EAAE;aACb;SACF,CAAA;KACF;IAED,UAAU,CAAC,EAAE,IAAI,EAAE,cAAc,EAAE;QACjC,OAAO;YACL,IAAI;YACJ,eAAe,CACb,IAAI,CAAC,OAAO,CAAC,cAAc,EAC3B,cAAc,EACd,EAAE,WAAW,EAAE,UAAU,EAAE,CAC5B;YACD;gBACE,OAAO;gBACP;oBACE,OAAO;oBACP;wBACE,IAAI,EAAE,UAAU;wBAChB,OAAO,EAAE,IAAI,CAAC,KAAK,CAAC,OAAO;8BACvB,SAAS;8BACT,IAAI;qBACT;iBACF;gBACD,CAAC,MAAM,CAAC;aACT;YACD;gBACE,KAAK;gBACL,CAAC;aACF;SACF,CAAA;KACF;IAED,oBAAoB;QAClB,MAAM,SAAS,GAAG;YAChB,KAAK,EAAE,MAAM,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,aAAa,CAAC,UAAU,CAAC;YAC3D,WAAW,EAAE,MAAM,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,YAAY,CAAC,UAAU,CAAC;SACjE,CAAA;QAED,IAAI,CAAC,IAAI,CAAC,OAAO,CAAC,MAAM,EAAE;YACxB,OAAO,SAAS,CAAA;SACjB;QAED,OAAO;YACL,GAAG,SAAS;YACZ,GAAG,EAAE,MAAM,IAAI,CAAC,MAAM,CAAC,QAAQ,CAAC,YAAY,CAAC,UAAU,CAAC;SACzD,CAAA;KACF;IAED,WAAW;QACT,OAAO,CAAC,EACN,IAAI,EACJ,cAAc,EACd,MAAM,EACN,MAAM,GACP;YACC,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,IAAI,CAAC,CAAA;YAC7C,MAAM,eAAe,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAA;YACvD,MAAM,cAAc,GAAG,QAAQ,CAAC,aAAa,CAAC,MAAM,CAAC,CAAA;YACrD,MAAM,QAAQ,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAA;YAChD,MAAM,OAAO,GAAG,QAAQ,CAAC,aAAa,CAAC,KAAK,CAAC,CAAA;YAE7C,eAAe,CAAC,eAAe,GAAG,OAAO,CAAA;YACzC,QAAQ,CAAC,IAAI,GAAG,UAAU,CAAA;YAC1B,QAAQ,CAAC,gBAAgB,CAAC,QAAQ,EAAE,KAAK;;;gBAGvC,IAAI,CAAC,MAAM,CAAC,UAAU,EAAE;oBACtB,QAAQ,CAAC,OAAO,GAAG,CAAC,QAAQ,CAAC,OAAO,CAAA;oBAEpC,OAAM;iBACP;gBAED,MAAM,EAAE,OAAO,EAAE,GAAG,KAAK,CAAC,MAAa,CAAA;gBAEvC,IAAI,MAAM,CAAC,UAAU,IAAI,OAAO,MAAM,KAAK,UAAU,EAAE;oBACrD,MAAM;yBACH,KAAK,EAAE;yBACP,KAAK,EAAE;yBACP,OAAO,CAAC,CAAC,EAAE,EAAE,EAAE;wBACd,EAAE,CAAC,aAAa,CAAC,MAAM,EAAE,EAAE,SAAS,EAAE;4BACpC,OAAO;yBACR,CAAC,CAAA;wBAEF,OAAO,IAAI,CAAA;qBACZ,CAAC;yBACD,GAAG,EAAE,CAAA;iBACT;aACF,CAAC,CAAA;YAEF,MAAM,CAAC,OAAO,CAAC,IAAI,CAAC,OAAO,CAAC,cAAc,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC;gBAC/D,QAAQ,CAAC,YAAY,CAAC,GAAG,EAAE,KAAK,CAAC,CAAA;aAClC,CAAC,CAAA;YAEF,QAAQ,CAAC,OAAO,CAAC,OAAO,GAAG,IAAI,CAAC,KAAK,CAAC,OAAO,CAAA;YAC7C,IAAI,IAAI,CAAC,KAAK,CAAC,OAAO,EAAE;gBACtB,QAAQ,CAAC,YAAY,CAAC,SAAS,EAAE,SAAS,CAAC,CAAA;aAC5C;YAED,eAAe,CAAC,MAAM,CAAC,QAAQ,EAAE,cAAc,CAAC,CAAA;YAChD,QAAQ,CAAC,MAAM,CAAC,eAAe,EAAE,OAAO,CAAC,CAAA;YAEzC,MAAM;iBACH,OAAO,CAAC,cAAc,CAAC;iBACvB,OAAO,CAAC,CAAC,CAAC,GAAG,EAAE,KAAK,CAAC;gBACpB,QAAQ,CAAC,YAAY,CAAC,GAAG,EAAE,KAAK,CAAC,CAAA;aAClC,CAAC,CAAA;YAEJ,OAAO;gBACL,GAAG,EAAE,QAAQ;gBACb,UAAU,EAAE,OAAO;gBACnB,MAAM,EAAE,WAAW;oBACjB,IAAI,WAAW,CAAC,IAAI,KAAK,IAAI,CAAC,IAAI,EAAE;wBAClC,OAAO,KAAK,CAAA;qBACb;oBAED,QAAQ,CAAC,OAAO,CAAC,OAAO,GAAG,WAAW,CAAC,KAAK,CAAC,OAAO,CAAA;oBACpD,IAAI,WAAW,CAAC,KAAK,CAAC,OAAO,EAAE;wBAC7B,QAAQ,CAAC,YAAY,CAAC,SAAS,EAAE,SAAS,CAAC,CAAA;qBAC5C;yBAAM;wBACL,QAAQ,CAAC,eAAe,CAAC,SAAS,CAAC,CAAA;qBACpC;oBAED,OAAO,IAAI,CAAA;iBACZ;aACF,CAAA;SACF,CAAA;KACF;IAED,aAAa;QACX,OAAO;YACL,iBAAiB,CAAC;gBAChB,IAAI,EAAE,UAAU;gBAChB,IAAI,EAAE,IAAI,CAAC,IAAI;gBACf,aAAa,EAAE,KAAK,KAAK;oBACvB,OAAO,EAAE,KAAK,CAAC,KAAK,CAAC,MAAM,GAAG,CAAC,CAAC,KAAK,GAAG;iBACzC,CAAC;aACH,CAAC;SACH,CAAA;KACF;CACF;;;;"}
@@ -7,9 +7,11 @@
7
7
  const inputRegex = /^\s*(\[([ |x])\])\s$/;
8
8
  const TaskItem = core.Node.create({
9
9
  name: 'taskItem',
10
- defaultOptions: {
11
- nested: false,
12
- HTMLAttributes: {},
10
+ addOptions() {
11
+ return {
12
+ nested: false,
13
+ HTMLAttributes: {},
14
+ };
13
15
  },
14
16
  content() {
15
17
  return this.options.nested ? 'paragraph block*' : 'paragraph+';
@@ -35,8 +37,28 @@
35
37
  },
36
38
  ];
37
39
  },
38
- renderHTML({ HTMLAttributes }) {
39
- return ['li', core.mergeAttributes(this.options.HTMLAttributes, HTMLAttributes, { 'data-type': 'taskItem' }), 0];
40
+ renderHTML({ node, HTMLAttributes }) {
41
+ return [
42
+ 'li',
43
+ core.mergeAttributes(this.options.HTMLAttributes, HTMLAttributes, { 'data-type': 'taskItem' }),
44
+ [
45
+ 'label',
46
+ [
47
+ 'input',
48
+ {
49
+ type: 'checkbox',
50
+ checked: node.attrs.checked
51
+ ? 'checked'
52
+ : null,
53
+ },
54
+ ],
55
+ ['span'],
56
+ ],
57
+ [
58
+ 'div',
59
+ 0,
60
+ ],
61
+ ];
40
62
  },
41
63
  addKeyboardShortcuts() {
42
64
  const shortcuts = {
@@ -81,6 +103,9 @@
81
103
  .run();
82
104
  }
83
105
  });
106
+ Object.entries(this.options.HTMLAttributes).forEach(([key, value]) => {
107
+ listItem.setAttribute(key, value);
108
+ });
84
109
  listItem.dataset.checked = node.attrs.checked;
85
110
  if (node.attrs.checked) {
86
111
  checkbox.setAttribute('checked', 'checked');
@@ -1 +1 @@
1
- {"version":3,"file":"tiptap-extension-task-item.umd.js","sources":["../src/task-item.ts"],"sourcesContent":["import { Node, mergeAttributes, wrappingInputRule } from '@tiptap/core'\n\nexport interface TaskItemOptions {\n nested: boolean,\n HTMLAttributes: Record<string, any>,\n}\n\nexport const inputRegex = /^\\s*(\\[([ |x])\\])\\s$/\n\nexport const TaskItem = Node.create<TaskItemOptions>({\n name: 'taskItem',\n\n defaultOptions: {\n nested: false,\n HTMLAttributes: {},\n },\n\n content() {\n return this.options.nested ? 'paragraph block*' : 'paragraph+'\n },\n\n defining: true,\n\n addAttributes() {\n return {\n checked: {\n default: false,\n keepOnSplit: false,\n parseHTML: element => element.getAttribute('data-checked') === 'true',\n renderHTML: attributes => ({\n 'data-checked': attributes.checked,\n }),\n },\n }\n },\n\n parseHTML() {\n return [\n {\n tag: 'li[data-type=\"taskItem\"]',\n priority: 51,\n },\n ]\n },\n\n renderHTML({ HTMLAttributes }) {\n return ['li', mergeAttributes(\n this.options.HTMLAttributes,\n HTMLAttributes,\n { 'data-type': 'taskItem' },\n ), 0]\n },\n\n addKeyboardShortcuts() {\n const shortcuts = {\n Enter: () => this.editor.commands.splitListItem('taskItem'),\n 'Shift-Tab': () => this.editor.commands.liftListItem('taskItem'),\n }\n\n if (!this.options.nested) {\n return shortcuts\n }\n\n return {\n ...shortcuts,\n Tab: () => this.editor.commands.sinkListItem('taskItem'),\n }\n },\n\n addNodeView() {\n return ({\n node,\n HTMLAttributes,\n getPos,\n editor,\n }) => {\n const listItem = document.createElement('li')\n const checkboxWrapper = document.createElement('label')\n const checkboxStyler = document.createElement('span')\n const checkbox = document.createElement('input')\n const content = document.createElement('div')\n\n checkboxWrapper.contentEditable = 'false'\n checkbox.type = 'checkbox'\n checkbox.addEventListener('change', event => {\n // if the editor isn’t editable\n // we have to undo the latest change\n if (!editor.isEditable) {\n checkbox.checked = !checkbox.checked\n\n return\n }\n\n const { checked } = event.target as any\n\n if (editor.isEditable && typeof getPos === 'function') {\n editor\n .chain()\n .focus()\n .command(({ tr }) => {\n tr.setNodeMarkup(getPos(), undefined, {\n checked,\n })\n\n return true\n })\n .run()\n }\n })\n\n listItem.dataset.checked = node.attrs.checked\n if (node.attrs.checked) {\n checkbox.setAttribute('checked', 'checked')\n }\n\n checkboxWrapper.append(checkbox, checkboxStyler)\n listItem.append(checkboxWrapper, content)\n\n Object\n .entries(HTMLAttributes)\n .forEach(([key, value]) => {\n listItem.setAttribute(key, value)\n })\n\n return {\n dom: listItem,\n contentDOM: content,\n update: updatedNode => {\n if (updatedNode.type !== this.type) {\n return false\n }\n\n listItem.dataset.checked = updatedNode.attrs.checked\n if (updatedNode.attrs.checked) {\n checkbox.setAttribute('checked', 'checked')\n } else {\n checkbox.removeAttribute('checked')\n }\n\n return true\n },\n }\n }\n },\n\n addInputRules() {\n return [\n wrappingInputRule({\n find: inputRegex,\n type: this.type,\n getAttributes: match => ({\n checked: match[match.length - 1] === 'x',\n }),\n }),\n ]\n },\n})\n"],"names":["Node","mergeAttributes","wrappingInputRule"],"mappings":"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"}
1
+ {"version":3,"file":"tiptap-extension-task-item.umd.js","sources":["../src/task-item.ts"],"sourcesContent":["import { Node, mergeAttributes, wrappingInputRule } from '@tiptap/core'\n\nexport interface TaskItemOptions {\n nested: boolean,\n HTMLAttributes: Record<string, any>,\n}\n\nexport const inputRegex = /^\\s*(\\[([ |x])\\])\\s$/\n\nexport const TaskItem = Node.create<TaskItemOptions>({\n name: 'taskItem',\n\n addOptions() {\n return {\n nested: false,\n HTMLAttributes: {},\n }\n },\n\n content() {\n return this.options.nested ? 'paragraph block*' : 'paragraph+'\n },\n\n defining: true,\n\n addAttributes() {\n return {\n checked: {\n default: false,\n keepOnSplit: false,\n parseHTML: element => element.getAttribute('data-checked') === 'true',\n renderHTML: attributes => ({\n 'data-checked': attributes.checked,\n }),\n },\n }\n },\n\n parseHTML() {\n return [\n {\n tag: 'li[data-type=\"taskItem\"]',\n priority: 51,\n },\n ]\n },\n\n renderHTML({ node, HTMLAttributes }) {\n return [\n 'li',\n mergeAttributes(\n this.options.HTMLAttributes,\n HTMLAttributes,\n { 'data-type': 'taskItem' },\n ),\n [\n 'label',\n [\n 'input',\n {\n type: 'checkbox',\n checked: node.attrs.checked\n ? 'checked'\n : null,\n },\n ],\n ['span'],\n ],\n [\n 'div',\n 0,\n ],\n ]\n },\n\n addKeyboardShortcuts() {\n const shortcuts = {\n Enter: () => this.editor.commands.splitListItem('taskItem'),\n 'Shift-Tab': () => this.editor.commands.liftListItem('taskItem'),\n }\n\n if (!this.options.nested) {\n return shortcuts\n }\n\n return {\n ...shortcuts,\n Tab: () => this.editor.commands.sinkListItem('taskItem'),\n }\n },\n\n addNodeView() {\n return ({\n node,\n HTMLAttributes,\n getPos,\n editor,\n }) => {\n const listItem = document.createElement('li')\n const checkboxWrapper = document.createElement('label')\n const checkboxStyler = document.createElement('span')\n const checkbox = document.createElement('input')\n const content = document.createElement('div')\n\n checkboxWrapper.contentEditable = 'false'\n checkbox.type = 'checkbox'\n checkbox.addEventListener('change', event => {\n // if the editor isn’t editable\n // we have to undo the latest change\n if (!editor.isEditable) {\n checkbox.checked = !checkbox.checked\n\n return\n }\n\n const { checked } = event.target as any\n\n if (editor.isEditable && typeof getPos === 'function') {\n editor\n .chain()\n .focus()\n .command(({ tr }) => {\n tr.setNodeMarkup(getPos(), undefined, {\n checked,\n })\n\n return true\n })\n .run()\n }\n })\n\n Object.entries(this.options.HTMLAttributes).forEach(([key, value]) => {\n listItem.setAttribute(key, value)\n })\n\n listItem.dataset.checked = node.attrs.checked\n if (node.attrs.checked) {\n checkbox.setAttribute('checked', 'checked')\n }\n\n checkboxWrapper.append(checkbox, checkboxStyler)\n listItem.append(checkboxWrapper, content)\n\n Object\n .entries(HTMLAttributes)\n .forEach(([key, value]) => {\n listItem.setAttribute(key, value)\n })\n\n return {\n dom: listItem,\n contentDOM: content,\n update: updatedNode => {\n if (updatedNode.type !== this.type) {\n return false\n }\n\n listItem.dataset.checked = updatedNode.attrs.checked\n if (updatedNode.attrs.checked) {\n checkbox.setAttribute('checked', 'checked')\n } else {\n checkbox.removeAttribute('checked')\n }\n\n return true\n },\n }\n }\n },\n\n addInputRules() {\n return [\n wrappingInputRule({\n find: inputRegex,\n type: this.type,\n getAttributes: match => ({\n checked: match[match.length - 1] === 'x',\n }),\n }),\n ]\n },\n})\n"],"names":["Node","mergeAttributes","wrappingInputRule"],"mappings":"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"}
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@tiptap/extension-task-item",
3
3
  "description": "task item extension for tiptap",
4
- "version": "2.0.0-beta.21",
4
+ "version": "2.0.0-beta.25",
5
5
  "homepage": "https://tiptap.dev",
6
6
  "keywords": [
7
7
  "tiptap",
@@ -28,5 +28,5 @@
28
28
  "url": "https://github.com/ueberdosis/tiptap",
29
29
  "directory": "packages/extension-task-item"
30
30
  },
31
- "gitHead": "9948e2499a3aa6ca72b677ef2ca96de1db1cb6b5"
31
+ "gitHead": "2a1c5d55e5a38550f7cf289a82d562e06d63d1ab"
32
32
  }
package/src/task-item.ts CHANGED
@@ -10,9 +10,11 @@ export const inputRegex = /^\s*(\[([ |x])\])\s$/
10
10
  export const TaskItem = Node.create<TaskItemOptions>({
11
11
  name: 'taskItem',
12
12
 
13
- defaultOptions: {
14
- nested: false,
15
- HTMLAttributes: {},
13
+ addOptions() {
14
+ return {
15
+ nested: false,
16
+ HTMLAttributes: {},
17
+ }
16
18
  },
17
19
 
18
20
  content() {
@@ -43,12 +45,32 @@ export const TaskItem = Node.create<TaskItemOptions>({
43
45
  ]
44
46
  },
45
47
 
46
- renderHTML({ HTMLAttributes }) {
47
- return ['li', mergeAttributes(
48
- this.options.HTMLAttributes,
49
- HTMLAttributes,
50
- { 'data-type': 'taskItem' },
51
- ), 0]
48
+ renderHTML({ node, HTMLAttributes }) {
49
+ return [
50
+ 'li',
51
+ mergeAttributes(
52
+ this.options.HTMLAttributes,
53
+ HTMLAttributes,
54
+ { 'data-type': 'taskItem' },
55
+ ),
56
+ [
57
+ 'label',
58
+ [
59
+ 'input',
60
+ {
61
+ type: 'checkbox',
62
+ checked: node.attrs.checked
63
+ ? 'checked'
64
+ : null,
65
+ },
66
+ ],
67
+ ['span'],
68
+ ],
69
+ [
70
+ 'div',
71
+ 0,
72
+ ],
73
+ ]
52
74
  },
53
75
 
54
76
  addKeyboardShortcuts() {
@@ -108,6 +130,10 @@ export const TaskItem = Node.create<TaskItemOptions>({
108
130
  }
109
131
  })
110
132
 
133
+ Object.entries(this.options.HTMLAttributes).forEach(([key, value]) => {
134
+ listItem.setAttribute(key, value)
135
+ })
136
+
111
137
  listItem.dataset.checked = node.attrs.checked
112
138
  if (node.attrs.checked) {
113
139
  checkbox.setAttribute('checked', 'checked')