<template>
  <div class="app-container">
    <h1>mxGraph 图形编辑器</h1>
    <MxToolbar />
    <div class="editor-layout">
      <MxPalette />
      <MxGraphContainer />
      <MxPropertiesPanel />
    </div>
  </div>
</template>
<script setup lang="ts"></script>
<style lang="scss" scoped>
.app-container {
  width: 100vw;
  height: 100vh;
  display: flex;
  flex-direction: column;
  font-family: Arial, sans-serif;
  overflow: hidden;
}

h1 {
  padding: 12px 20px;
  font-size: 18px;
  color: #333;
  border-bottom: 1px solid #e0e0e0;
  background: #f5f5f5;
}

.editor-layout {
  flex: 1;
  display: flex;
  overflow: hidden;
}
</style>
