HiMark This package is a wrapper around CodeMirror to add functionality like Discord's or GitHub's comment editing box. Focused around comments, this forgoes a lot of fancy preview functionality for actually useful things such as built in @mention support using Tribute.JS

Usage

Usage is not yet documented, but here is a very basic browser usage to get you started: This example users the /search endpoint which returns a SELECT2 response.

<div id='md-editor'></div>
<script>
    const editor = new HiMark.Editor(document.getElementById('md-editor'),  {
        placeholder: 'Write comment...',
        plugins: [
            new HiMark.Plugins.CheckboxPlugin(),
            new HiMark.Plugins.MentionPlugin({
                collections: [
                    {
                        trigger: '@',
                        lookup: 'text',
                        fillAttr: 'text',
                        allowSpaces: true,
                        selectTemplate: ({ original }) => `[@\${original.text}](#/identity/\${original.id})`,
                        values: async (text, cb) => {
                            $.ajax({
                                url: '/search?q=' + encodeURIComponent(text),
                                success: (data, status, response) => cb(data.results),
                            })
                        }
                    }
                ]
            }),
        ]
    });
</script>

yes, it uses jquery... it's just an example and could easily be replaced with fetch.