mirrors/hedgedoc
1
0
Fork 0
mirror of https://github.com/hedgedoc/hedgedoc.git synced 2025-05-14 07:04:45 -04:00
Code Issues Projects Releases Packages Wiki Activity Actions

Disable check box if no onTaskCheckedChange is provided

Browse source 
Signed-off-by: Tilman Vatteroth <tilman.vatteroth@tu-dortmund.de>
This commit is contained in:
Tilman Vatteroth 2020-10-18 20:30:41 +02:00 • committed by mrdrogdrog
parent 0eabfc3bb3
commit 5197d0512b
3 changed files with 23 additions and 19 deletions
Download patch file Download diff file Expand all files Collapse all files

38
src/components/markdown-renderer/replace-components/task-list/task-list-replacer.tsx
View file

@ -1,31 +1,35 @@
import React, { ReactElement } from 'react'
import { DomElement } from 'domhandler'
import React, { ReactElement } from 'react'
import { ComponentReplacer } from '../ComponentReplacer'
export class TaskListReplacer extends ComponentReplacer {
onTaskCheckedChange: (lineInMarkdown: number, checked: boolean) => void
onTaskCheckedChange?: (lineInMarkdown: number, checked: boolean) => void
constructor (onTaskCheckedChange: (lineInMarkdown: number, checked: boolean) => void) {
constructor (onTaskCheckedChange?: (lineInMarkdown: number, checked: boolean) => void) {
super()
this.onTaskCheckedChange = onTaskCheckedChange
}
handleCheckboxChange = (event: React.ChangeEvent<HTMLInputElement>): void => {
const lineNum = Number(event.currentTarget.dataset.line)
this.onTaskCheckedChange(lineNum, event.currentTarget.checked)
}
public getReplacement (node: DomElement): (ReactElement|undefined) {
if (node.attribs?.class === 'task-list-item-checkbox') {
return (
<input
className="task-list-item-checkbox"
type="checkbox"
checked={node.attribs.checked !== undefined}
onChange={this.handleCheckboxChange}
data-line={node.attribs['data-line']}
/>
)
if (this.onTaskCheckedChange) {
this.onTaskCheckedChange(lineNum, event.currentTarget.checked)
}
}
public getReplacement (node: DomElement): (ReactElement | undefined) {
if (node.attribs?.class !== 'task-list-item-checkbox') {
return
}
return (
<input
disabled={this.onTaskCheckedChange === undefined}
className="task-list-item-checkbox"
type="checkbox"
checked={node.attribs.checked !== undefined}
onChange={this.handleCheckboxChange}
data-line={node.attribs['data-line']}
/>
)
}
}