<template>
  <component
    :is="widgetType"
    class="c-widget"
    :style="styles"
    :node="node"
  />
</template>

<script>
import widget from './widget'

export default {
  name: 'WidgetViewer',
  mixins: [widget],
  computed: {
    styles () {
      const { top, left } = this.node
      return {
        top: `${top}px`,
        left: `${left}px`
      }
    }
  }
}
</script>

<style scoped lang="scss">
.c-widget {
  position: absolute !important;
  user-select: none;
}
</style>
