Dialog in Textarea Buttons Plugin

1

Hi,

i try to create a textarea button for a bloquote.
But i also want to choose a color for the border.
There is a dialog command but i dont know how to
build the dialog.

In my plugin:

 textareaButtons: {
    bloquote: {
      label: "bloquote",
      icon: "quote",
      click: function () {
        this.command("toggle", "<blockquote>", "</blockquote>")
      },
    },

This just wrap a around the content.
What is to do to open an dialog and choose color?

Thx!

2

If you would use this.command("dialog", "blockquote"), you will need to add a new Vue component with the name k-toolbar-blockquote-dialog that implements the dialog, similar to kirby/panel/src/components/Forms/Toolbar/EmailDialog.vue at main · getkirby/kirby · GitHub (however this extends our main email dialog, so it might be a bit advanced to follow the example).

In the dialog submit method you need to emit a submit event with the text that should be inserted: kirby/panel/src/components/Forms/Toolbar/EmailDialog.vue at main · getkirby/kirby · GitHub

Hope these pointers help to get you started.

1 Like
3

:pray: Thank you! That’s a good starting point!!!