[enhancement]: Add monaco editor to the prompt and negative prompt fields

### Is there an existing issue for this?

- [X] I have searched the existing issues

### Contact Details

_No response_

### What should this feature add?

If you add monaco editor (the editor under vscode) to anywhere we do prompts, then we'll be able to do:

- automatic surrounds (highlight a word/phrase/sentence, press `(` and have it wrap the selection)
- syntax highlighting for the `(`, `[`, `(.*[\d\.\d])` etc
- invalid syntax highlighting for incorrectly supported syntax: ``
- auto complete available textual inversion keywords

I'm sure the possibilities are endless. but the above are some nice low hanging fruit.

### Alternatives

sell my computer and become a farmer?

### Aditional Content

- the editor: https://microsoft.github.io/monaco-editor/
- syntax highlighting: https://microsoft.github.io/monaco-editor/monarch.html
- https://codesandbox.io/s/monaco-editor-react-u0fyv
- https://betterprogramming.pub/embedding-a-monaco-editor-inside-react-app-37083cf829e9
- https://www.npmjs.com/package/@monaco-editor/react
-