Seeking Guidance on Adding a Formatting Toolbar to a Note-Taking Text Area

Hello TiddlyWiki Community,

I hope this message finds you well. I’m currently working on an educational dashboard within TiddlyWiki, specifically focusing on enhancing the note-taking functionality. My goal is to make the text area where users compose their notes more user-friendly by integrating a formatting toolbar. This toolbar would ideally include options for basic text formatting such as bold, italic, lists, and possibly more.

I have set up a button that creates a new tiddler for each note, using the following code:

 <$button style="background-color: #4A90E2; color: white; padding: 0.5em 1em; border: none; border-radius: 4px; margin-top: 1em; cursor: pointer;">
  <$action-createtiddler 
    $basetitle={{{ [{$:/status/UserName}addsuffix[_]addsuffix<now>] }}} 
    text={{$:/temp/notes}} 
    person={{$:/temp/notes!!person}} 
    note-type={{$:/temp/note-type}} 
    tags={{{ [{$:/temp/notes!!tags}] }}}
  />
  Créer la note
</$button>

While this setup works well for creating and tagging notes, I’m at a bit of a loss on how to proceed with adding a formatting toolbar to the text area where the notes are composed. I’m looking for advice or examples on how to implement such a feature within TiddlyWiki.

Best regards,
Auguste