No blocks available in k-blocks-field

Hi there,

I’m trying to build a dynamic table field. Inside of each cell should be a blocks field.
When I try to add a block inside of a cell, I get a “This drawer has no fields” message when I try to edit the added block.

Here is my code so far:

index.php:

<?php
Kirby::plugin('zrm/table', [
    'fields' => [
        'table' => [
            'props' => [
                'value' => function ($value = null) {
                    $values = Yaml::decode($value) ?? [];
                    return [
                    ];
                },
                'model' => function () {
                    return $this->model();
                },
                'fieldsets' => function () {
                    return option('zrm.table.fieldsets', []);
                },
            ],
            'blueprints' => [
                'table/block_copy' => __DIR__ . '/blueprints/blocks/block_copy.yml'
            ],
            'api' => function () {
                return [
                    [
                        'pattern' => 'fieldsets/(:any)',
                        'method' => 'GET',
                        'action' => function ($type) {
                            return option('zrm.table.fieldsets.' . $type, []);
                        }
                    ]
                ];
            }
        ],
    ],
    'options' => [
        'fieldsets' => [
            'block_copy' => [
                'label' => 'Block Copy',
                'title' => 'Block Copy',
                'icon' => 'text',
                'type' => 'block_copy',
                'fields' => [
                    'test' => [
                        'label' => 'Test',
                        'type' => 'text'
                    ]
                ],
                'content' => [
                    'test' => 'Test'
                ]
            ],
        ]
    ]
]);
?>

TableField.vue (in src/components/fields):

<template>
  <div class="cf-table">
    <k-draggable class="cf-table__table" element="k-grid" :style="gridStyle">
      <k-box
          v-for="(cell, index) in cellsArray"
          :key="index"
          :text="cell"
          theme="white"
      >
        <k-blocks-field label="Blocks" :value="blocks[index] || []" @input="updateBlock($event, index)" :endpoints="endpoints" :fieldsets="fieldsets"/>
      </k-box>
    </k-draggable>

    {{ fieldsets }}
    <br>
    {{ endpoints }}
    <br>
    {{ blocks }}
    <br>
    {{ numRows }}
    <br>
    {{ numColumns }}

    <div class="cf-table__button-group cf-table__button-group--column">
      <k-button variant="filled" icon="add" @click="addColumn">Add Column</k-button>
      <k-button variant="filled" icon="remove" @click="removeColumn" :disabled="numColumns <= 1">Remove Column
      </k-button>
    </div>
    <div class="cf-table__button-group cf-table__button-group--row">
      <div style="margin-top: 10px;">
        <k-button variant="filled" icon="add" @click="addRow">Add Row</k-button>
        <k-button variant="filled" icon="remove" @click="removeRow" :disabled="numRows <= 1">Remove Row</k-button>
      </div>
    </div>
  </div>
</template>

<script>

export default {
  props: {
    rows: {
      type: Number,
      default: 1
    },
    columns: {
      type: Number,
      default: 1
    },
    fieldsets: {
      type: Array,
      default: () => []
    },
    endpoints: {
      type: Array,
      default: () => []
    },
    value: {
      type: Array,
      default: () => []
    }
  },
  data() {
    return {
      numRows: this.rows,
      numColumns: this.columns,
      blocks: this.value,
      fieldsets: this.fieldsets,
    }
  },
  computed: {
    cellsArray() {
      return Array.from({length: this.numRows * this.numColumns}, (_, i) => i + 1);
    },
    gridStyle() {
      return `--columns: ${this.numColumns}; gap: 2px`;
    }
  }
  ,
  watch: {
    rows(newVal) {
      this.numRows = newVal;
    },
    columns(newVal) {
      this.numColumns = newVal;
    },
    numRows(newVal) {
      this.$emit('update:rows', newVal);
    },
    numColumns(newVal) {
      this.$emit('update:columns', newVal);
    }
  },
  methods: {
    addRow() {
      this.numRows += 1;
    },
    removeRow() {
      if (this.numRows > 1) {
        this.numRows -= 1;
      }
    },
    addColumn() {
      this.numColumns += 1;
    },
    removeColumn() {
      if (this.numColumns > 1) {
        this.numColumns -= 1;
      }
    },
    updateBlock(value, index) {
      this.$set(this.blocks, index, value);
      this.$emit('input', this.blocks);
    },
  }
}
</script>

Except that I can’t edit any blocks, everything works fine.
Has anyone any idea why this is happening? Or how I have to add fieldsets correctly in my Plugin?

Thanks in advance for your help!