24 lines
919 B
TypeScript
24 lines
919 B
TypeScript
import { FieldProps } from "formik";
|
|
|
|
// @ts-ignore
|
|
import { CKEditor } from '@ckeditor/ckeditor5-react';
|
|
// @ts-ignore
|
|
import ClassicEditor from '@ckeditor/ckeditor5-build-classic';
|
|
import { FormControl, FormControlLabel, FormControlProps, FormLabel, TextFieldProps } from "@material-ui/core";
|
|
import React from "react";
|
|
|
|
export type CKEditorFieldProps = FieldProps & FormControlProps & { label?: string };
|
|
|
|
export function CKEditorField({ field, form, error, label, ...props }: CKEditorFieldProps) {
|
|
const handleChange = (_: unknown, editor: any) => {
|
|
const data = editor.getData();
|
|
form.setFieldValue(field.name, data);
|
|
form.setFieldTouched(field.name);
|
|
}
|
|
|
|
return <FormControl { ...props }>
|
|
<FormLabel style={{ marginBottom: "0.5rem" }}>{ label }</FormLabel>
|
|
<CKEditor data={ field.value } editor={ ClassicEditor } onChange={ handleChange }/>
|
|
</FormControl>
|
|
}
|