phares3757/vscode-kanbn
3
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Add katex math in task markdown

Browse Source
This commit is contained in:
Gordon
2021-06-05 00:01:49 +01:00
parent 534635daa2
commit 935737ea62
3 changed files with 199 additions and 6 deletions
Download Patch File Download Diff File Expand all files Collapse all files

17
src/TaskEditor.tsx
View File

@ -6,6 +6,9 @@ import { paramCase } from '@basementuniverse/kanbn/src/utility';
import gitUsername from 'git-user-name';
import ReactMarkdown from 'react-markdown';
import TextareaAutosize from 'react-textarea-autosize';
import remarkMath from 'remark-math';
import rehypeKatex from 'rehype-katex';
import 'katex/dist/katex.min.css';
interface KanbnTaskValidationOutput {
name: string,
@ -24,6 +27,12 @@ interface KanbnTaskValidationInput extends KanbnTaskValidationOutput {
id: string
}
const Markdown = props => (<ReactMarkdown {...{
...props,
remarkPlugins: [remarkMath],
rehypePlugins: [rehypeKatex]
}}/>);
const TaskEditor = ({ task, tasks, columnName, columnNames, dateFormat, panelUuid, vscode }: {
task: KanbnTask | null,
tasks: Record<string, KanbnTask>,
@ -260,9 +269,9 @@ const TaskEditor = ({ task, tasks, columnName, columnNames, dateFormat, panelUui
as={TextareaAutosize}
name="description"
/>
: <ReactMarkdown className="kanbn-task-editor-description-preview">
: <Markdown className="kanbn-task-editor-description-preview">
{values.description}
</ReactMarkdown>
</Markdown>
}
<ErrorMessage
className="kanbn-task-editor-field-errors"
@ -459,9 +468,9 @@ const TaskEditor = ({ task, tasks, columnName, columnNames, dateFormat, panelUui
name={`comments.${index}.text`}
/>
</React.Fragment>
: <ReactMarkdown className="kanbn-task-editor-comment-text">
: <Markdown className="kanbn-task-editor-comment-text">
{comment.text}
</ReactMarkdown>
</Markdown>
}
</div>
</div>