<script setup lang="ts">
import { createRenderer } from '@vtj/renderer'
import { type BlockSchema } from '@vtj/core'

const dsl: BlockSchema = {
  "name": "Tes",
  "locked": false,
  "inject": [],
  "state": {},
  "lifeCycles": {},
  "methods": {},
  "computed": {},
  "watch": [],
  "css": "",
  "props": [],
  "emits": [],
  "slots": [],
  "dataSources": {},
  "__VTJ_BLOCK__": true,
  "__VERSION__": "1739787968332",
  "id": "45t6ex2qh",
  "nodes": [
    {
      "id": "esmzkcp2p",
      "name": "ElButton",
      "from": "element-plus",
      "invisible": false,
      "locked": false,
      "children": "按钮",
      "props": {
        "type": "primary"
      },
      "directives": [],
      "events": {
        "click": {
          "name": "click",
          "handler": {
            "type": "JSFunction",
            "value": "() => {\r\n    console.log('1231111')\r\n}"
          },
          "modifiers": {}
        }
      }
    },
    {
      "id": "26lluhulco",
      "name": "ElImage",
      "from": "element-plus",
      "invisible": false,
      "locked": false,
      "children": [],
      "props": {
        "style": {
          "width": "100px",
          "height": "100px"
        },
        "src": "https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg",
        "previewSrcList": [
          "https://fuss10.elemecdn.com/a/3f/3302e58f9a181d2509f3dc0fa68b0jpeg.jpeg",
          "https://fuss10.elemecdn.com/1/34/19aa98b1fcb2781c4fba33d850549jpeg.jpeg",
          "https://fuss10.elemecdn.com/0/6f/e35ff375812e6b0020b6b4e8f9583jpeg.jpeg",
          "https://fuss10.elemecdn.com/9/bb/e27858e973f5d7d3904835f46abbdjpeg.jpeg",
          "https://fuss10.elemecdn.com/d/e6/c4d93a3805b3ce3f323f7974e6f78jpeg.jpeg",
          "https://fuss10.elemecdn.com/3/28/bbf893f792f03a54408b3b7a7ebf0jpeg.jpeg",
          "https://fuss10.elemecdn.com/2/11/6535bcfb26e4c79b48ddde44f4b6fjpeg.jpeg"
        ]
      },
      "directives": [],
      "events": {}
    },
    {
      "id": "45t6mmt7r",
      "name": "ElDialog",
      "from": "element-plus",
      "invisible": false,
      "locked": false,
      "children": "对话框弹窗内容",
      "props": {
        "title": "标题",
        "modelValue": true
      },
      "directives": [],
      "events": {}
    },
    {
      "id": "7pf44qdhl",
      "name": "ElContainer",
      "from": "element-plus",
      "invisible": false,
      "locked": false,
      "children": [],
      "props": {
        "style": {
          "width": "100%",
          "height": "100%"
        }
      },
      "directives": [],
      "events": {}
    }
  ]
};

const { renderer } = createRenderer({
  dsl,
});
</script>

<template>
  <component :is="renderer" />
</template>
