Custom Blocks : Displaying as the text block

Kirby 4 Question❓
1

Hello,
I’m building a template with a block view.
So far I have edited the default blueprint for the text block to look like that:

name: field.blocks.text.name
icon: text
wysiwyg: true
preview: text
fields:
  text:
    type: markdown
    font: sans-serif
    and so on...

And the text block is show as expected in the panel view:

image
image2606×362 12 KB

I’m also trying to build a custom block that does pretty much the same as the text block but with a front-end twist.
So I made a custom block plugin in order to manage the .yml & .php files; but I’m facing an issue on how to display my template in the panel view. So far, the .yml file is looking the same as the text file. But the index.js is looking like the default plugin course :

panel.plugin("fraaps/custom-block", {
  blocks: {
    columns: `
      <textarea
        type="text"
        placeholder="Input the text»
        :value="content.text"
        @input="update({ text: $event.target.value })"

      />
    `,
  },
});

image
image2526×380 15.5 KB

I admit that I’m lacking the comprehension of that index.js file that is generating the inside of the block in the panel; but specifically how to make them look alike…

Thank you for your help.

2

So your custom block.yml is exactly the same as above? What’s its name? And the preview is also text?

What is

Please see doc example how to create a custom block: Custom block examples | Kirby CMS

3

right…

wysiwyg: true

was missing… !
Thanks a lot texnixe.