Defining a block

Use defineBlock to define the entrypoint of a block and to configure its schemas.

Requirement

Make sure that defineBlock is only used inside block files adhering to the following pathing: ./src/blocks/BLOCKNAME/index.tsx where BLOCKNAME is the name of your block.

import { defineBlock } from "@instantcommerce/sdk";

export default defineBlock({
  component: BlockComponent,
  customizerSchema: {
    fields: {
      color: { type: "color", label: "Text color" },
    },
  },
  contentSchema: {
    fields: {
      title: { type: "text", label: "Title", preview: "Hero title" },
    },
  },
});