import { V as r, n as o } from "../ProxyEmit-CLpxDp9Y.js";
import { C as l, S as n } from "../EntityList-DMwD1D5z.js";
import d from "./sql-text-editor.js";
import c from "./table.js";
const u = r.extend({
  components: { EntityList: l, SqlTextEditor: d, TableComponent: c },
  props: {
    entities: {
      type: Array,
      default: () => [{ columns: [], data: [] }]
    },
    entityListProps: {
      type: Object,
      default: () => ({})
    },
    sqlTextEditorProps: {
      type: Object,
      default: () => ({})
    },
    tableProps: {
      type: Object,
      default: () => ({})
    }
  },
  data() {
    return {
      sql: "",
      data: [],
      columns: [],
      mainSplit: null,
      showInitialPlaceholder: !0
    };
  },
  watch: {},
  computed: {
    keybindings() {
      return {
        "Ctrl-Enter": this.submitQuery,
        "Cmd-Enter": this.submitQuery
      };
    }
  },
  methods: {
    setTable(i) {
      this.showInitialPlaceholder = !1, this.data = i.data, this.columns = i.columns;
    },
    submitQuery() {
      this.$emit("bks-query-submit", { query: this.sql });
    },
    handleValueChange(i) {
      this.sql = i.value;
    },
    handleEntityDblclick(i) {
      this.setTable(i.entity);
    },
    handleForeignKeyGoTo({ field: i }) {
      const t = this.entities.find(
        (e) => {
          var s;
          return e === ((s = this.columns.find((a) => a.field === i)) == null ? void 0 : s.toTable);
        }
      );
      t && this.setTable(t);
    }
  },
  mounted() {
    const i = this.$refs.main, t = this.$refs.right;
    this.mainSplit = n(i.children, {
      direction: "horizontal",
      gutterStyle: () => "",
      elementStyle: (e, s) => ({
        "flex-basis": `calc(${s}%)`
      }),
      gutter: (e, s) => {
        const a = document.createElement("div");
        return a.className = `BksDataEditor-gutter gutter gutter-${s}`, a;
      },
      expandToMin: !0
    }), this.rightSplit = n(t.children, {
      direction: "vertical",
      gutterStyle: () => "",
      elementStyle: (e, s) => ({
        "flex-basis": `calc(${s}%)`
      }),
      gutter: (e, s) => {
        const a = document.createElement("div");
        return a.className = `BksDataEditor-gutter gutter gutter-${s}`, a;
      },
      expandToMin: !0
    });
  }
});
var m = function() {
  var t = this, e = t._self._c;
  return t._self._setupProxy, e("div", { ref: "main", staticClass: "BksUiKit BksDataEditor" }, [e("entity-list", t._b({ attrs: { entities: t.entities, proxyEmit: "" }, on: { "bks-entity-dblclick": t.handleEntityDblclick } }, "entity-list", t.entityListProps, !1)), e("div", { ref: "right", staticClass: "BksDataEditor-right-container" }, [e("div", { staticClass: "BksDataEditor-sql-editor" }, [e("sql-text-editor", t._b({ attrs: { focus: "", entities: t.entities, keybindings: t.keybindings, proxyEmit: "" }, on: { "bks-value-change": t.handleValueChange } }, "sql-text-editor", t.sqlTextEditorProps, !1)), e("div", { staticClass: "BksDataEditor-run" }, [e("button", { attrs: { title: "Ctrl-Enter" }, on: { click: t.submitQuery } }, [t._v("Run")])])], 1), e("div", { staticClass: "BksDataEditor-table" }, [e("div", { directives: [{ name: "show", rawName: "v-show", value: t.showInitialPlaceholder, expression: "showInitialPlaceholder" }], staticClass: "BksDataEditor-initial-placeholder" }, [t._v(" Select a table to view data or run a query. ")]), e("table-component", t._b({ directives: [{ name: "show", rawName: "v-show", value: !t.showInitialPlaceholder, expression: "!showInitialPlaceholder" }], attrs: { columns: t.columns, data: t.data, proxyEmit: "" }, on: { "bks-foreign-key-go-to": t.handleForeignKeyGoTo } }, "table-component", t.tableProps, !1))], 1)])], 1);
}, h = [], p = /* @__PURE__ */ o(
  u,
  m,
  h
);
const v = p.exports;
export {
  v as default
};
//# sourceMappingURL=data-editor.js.map
