Respond to review feedback

This commit is contained in:
Kasper Nilsson 2022-05-12 23:09:29 -07:00 committed by Dominik
parent 71e941f3da
commit 515300bb26
2 changed files with 13 additions and 10 deletions

View File

@ -50,6 +50,8 @@ A handler for when the task item is checked or unchecked while the editor is set
If this is not supplied, the task items are immutable while the editor is `readOnly`.
If this function returns false, the check state will be preserved (`readOnly`).
```js
TaskItem.configure({
onReadOnlyChecked: (node, checked) => {

View File

@ -2,7 +2,7 @@ import { Node, mergeAttributes, wrappingInputRule } from '@tiptap/core'
import { Node as ProseMirrorNode } from 'prosemirror-model'
export interface TaskItemOptions {
onReadOnlyChecked?: (node: ProseMirrorNode, checked: boolean) => void
onReadOnlyChecked?: (node: ProseMirrorNode, checked: boolean) => boolean
nested: boolean
HTMLAttributes: Record<string, any>
}
@ -30,8 +30,8 @@ export const TaskItem = Node.create<TaskItemOptions>({
checked: {
default: false,
keepOnSplit: false,
parseHTML: element => element.getAttribute('data-checked') === 'true',
renderHTML: attributes => ({
parseHTML: (element) => element.getAttribute('data-checked') === 'true',
renderHTML: (attributes) => ({
'data-checked': attributes.checked,
}),
},
@ -85,9 +85,7 @@ export const TaskItem = Node.create<TaskItemOptions>({
},
addNodeView() {
return ({
node, HTMLAttributes, getPos, editor,
}) => {
return ({ node, HTMLAttributes, getPos, editor }) => {
const listItem = document.createElement('li')
const checkboxWrapper = document.createElement('label')
const checkboxStyler = document.createElement('span')
@ -96,7 +94,7 @@ export const TaskItem = Node.create<TaskItemOptions>({
checkboxWrapper.contentEditable = 'false'
checkbox.type = 'checkbox'
checkbox.addEventListener('change', event => {
checkbox.addEventListener('change', (event) => {
// if the editor isnt editable and we don't have a handler for
// readonly checks we have to undo the latest change
if (!editor.isEditable && !this.options.onReadOnlyChecked) {
@ -125,7 +123,10 @@ export const TaskItem = Node.create<TaskItemOptions>({
.run()
}
if (!editor.isEditable && this.options.onReadOnlyChecked) {
this.options.onReadOnlyChecked(node, checked)
// Reset state if onReadOnlyChecked returns false
if (!this.options.onReadOnlyChecked(node, checked)) {
checkbox.checked = !checkbox.checked
}
}
})
@ -148,7 +149,7 @@ export const TaskItem = Node.create<TaskItemOptions>({
return {
dom: listItem,
contentDOM: content,
update: updatedNode => {
update: (updatedNode) => {
if (updatedNode.type !== this.type) {
return false
}
@ -171,7 +172,7 @@ export const TaskItem = Node.create<TaskItemOptions>({
wrappingInputRule({
find: inputRegex,
type: this.type,
getAttributes: match => ({
getAttributes: (match) => ({
checked: match[match.length - 1] === 'x',
}),
}),