zenoamaro/react-quill

Question: How to automatically apply markdown like style changes?

Opened this issue · 0 comments

I was exploring using ReactQuill to implement a Fountain (a variant of Markdown for writing screenplays) editor. In Fountain, there are rules like "lines like INT. KITCHEN - MORNING is a heading - add bold font" (INT = interior location). There are other examples like

INT. KITCHEN - MORNING

Joe wearily walks into the kitchen.

JOE
(sleepily)
Where is my coffee! I need coffee!

But instead he falls asleep at the table.

In screenplays, this should be formatted similar to

**INT. KITCHEN - MORNING**

Joe wearily walks into the kitchen.

                       JOE
                (sleepily)
          Where is my coffee! I need coffee!

But instead he falls asleep at the table.

Some of these lines should have different margins set (according to screenplay conventions), the INT. line should be in bold, everything in courier font.

I was looking at the onChange event function, but it does not seem to provide a way to modify the document styles. I want to do things like realize a line starts with "(" so its probably the parenthetical text like "sleepy" above, so use paragraph style XXX. As the user types, I want to realize "oh, this is an INT. line so bold the whole line, or "no its not an INT. line and there is a blank line afterwards, so its default content (no formatting required).

Is this possible? Any suggestions how to proceed?