<script setup lang="ts">
import { UABaseNode } from '@/ua/UABaseNode';
import TreeItem from './TreeItem.vue'
import {useStore} from '@/store'
import TheContextMenu from './TheContextMenu.vue';
const store = useStore()
function selectNode(node: UABaseNode) {
  store.selectedNode=node;
}
</script>

<template>
  <div class="card">
    <div class="card-body" v-if="store.addressSpace">
      <h5 class="card-title">Addressspace</h5>
      <p class="card-text">
      <ul>
        <TheContextMenu>
          <TreeItem class="item" v-if="store.rootNode != null" :model="store.rootNode" :selectedNode="store.selectedNode" :markSelected="true"
            @select-node="(node: UABaseNode) => selectNode(node)" >
          </TreeItem>
        </TheContextMenu>
      </ul>
      </p>
    </div>
  </div>
</template>

<style scoped>
  #ul {
    margin-left: 10px;
  }
</style>