import { shallowReactive, watch } from 'vue';
import { createComponent } from './createComponent.js';
import './Table.vue.js';
import script from './Table.vue2.js';

function useTable() {
  var props = shallowReactive({
    value: null,
    chart: null,
    visible: false,
    container: null
  });
  var _createComponent = createComponent(script, props),
    close = _createComponent.close,
    open = _createComponent.open;
  var toggleTable = function toggleTable(visible) {
    if (visible !== undefined) {
      props.visible = visible;
    } else {
      props.visible = !props.visible;
    }
  };
  watch(function () {
    return props.visible;
  }, function (value, oldValue, onCleanup) {
    value ? open() : close();
  }, {
    immediate: true
  });
  return {
    close: close,
    open: open,
    props: props,
    toggleTable: toggleTable
  };
}

export { useTable };
