title: How can I add custom Prism.js styles in ReactTinyMCE for codesample formatting and highlighting?
body: <p>Here is my TinyMCE configuration for react I
  used <strong><a href="https://www.npmjs.com/package/@tinymce/tinymce-react" rel="nofollow noreferrer">@tinymce/tinymce-react</a></strong>.</p>
  <p>I checked on how to add customized theme width Prism.js but
  it's not working.
  I wanted to use <strong>okaidia</strong> theme</p>
  <p><a href="https://i.stack.imgur.com/ngwjW.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/ngwjW.png" alt="enter image description here" /></a></p>
  <p>Anyone who knows how to use custom stylings for <strong>codesample</strong>
  with tinymce &amp;&amp; prism.js other than default stylings can help.</p>
  <p>The default format for codesample looks like this below but I want to use <strong>okaidia</strong> theme and add other custom prism styles.</p>
  <p><a href="https://i.stack.imgur.com/HqGfV.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/HqGfV.png" alt="enter image description here" /></a></p>
  <p><div class="snippet" data-lang="js" data-hide="false" data-console="true" data-babel="false">
  <div class="snippet-code">
  <pre class="snippet-code-js lang-js prettyprint-override"><code>import { Editor } from "@tinymce/tinymce-react";
  
  const TextEditor = () =&gt; {
    const onChange = (e) =&gt; {
      console.log(e.target.getContent());
    };
  
    return (
      &lt;div&gt;
        &lt;input
          id="my-file"
          type="file"
          name="my-file"
          style={{ display: "none" }}
          onChange=""
        /&gt;
        &lt;Editor
          initialValue="&lt;p&gt;This is the initial content of the editor&lt;/p&gt;"
          init={{
            selector: "textarea",
            plugins: "codesample image",
            toolbar: "codesample",
            codesample_global_prismjs: true,
            codesample_languages: [{ text: "Javascript", value: "javascript" }],
          }}
          onChange={onChange}
        /&gt;
      &lt;/div&gt;
    );
  };
  
  export default TextEditor;</code></pre>
  </div>
  </div>
  </p>