init with kirby, vue and pagedjs interactive

public/kirby/config/blocks/heading/heading.php

@@ -0,0 +1,2 @@
+<?php /** @var \Kirby\Cms\Block $block */ ?>
+<<?= $level = $block->level()->or('h2') ?>><?= $block->text() ?></<?= $level ?>>

public/kirby/config/blocks/heading/heading.yml

@@ -0,0 +1,35 @@
+name: field.blocks.heading.name
+icon: title
+wysiwyg: true
+preview: heading
+fields:
+  level:
+    label: field.blocks.heading.level
+    type: toggles
+    empty: false
+    default: "h2"
+    labels: false
+    options:
+      - value: h1
+        icon: h1
+        text: H1
+      - value: h2
+        icon: h2
+        text: H2
+      - value: h3
+        icon: h3
+        text: H3
+      - value: h4
+        icon: h4
+        text: H4
+      - value: h5
+        icon: h5
+        text: H5
+      - value: h6
+        icon: h6
+        text: H6
+  text:
+    label: field.blocks.heading.text
+    type: writer
+    inline: true
+    placeholder: field.blocks.heading.placeholder