Here is my TinyMCE configuration for react I used @tinymce/tinymce-react.
I checked on how to add customized theme width Prism.js but it's not working. I wanted to use okaidia theme
Anyone who knows how to use custom stylings for codesample with tinymce && prism.js other than default stylings can help.
The default format for codesample looks like this below but I want to use okaidia theme and add other custom prism styles.
import { Editor } from "@tinymce/tinymce-react";
const TextEditor = () => {
const onChange = (e) => {
console.log(e.target.getContent());
};
return (
<div>
<input
id="my-file"
type="file"
name="my-file"
style={{ display: "none" }}
onChange=""
/>
<Editor
initialValue="<p>This is the initial content of the editor</p>"
init={{
selector: "textarea",
plugins: "codesample image",
toolbar: "codesample",
codesample_global_prismjs: true,
codesample_languages: [{ text: "Javascript", value: "javascript" }],
}}
onChange={onChange}
/>
</div>
);
};
export default TextEditor;