import { defineComponent as E, ref as s, createVNode as o, resolveComponent as t } from "vue";
import { ElButton as C, ElNotification as _ } from "element-plus";
import { j as g, l as r, A as d, T as m, m as u } from "./main-DXvReGBc.js";
import { E as O } from "./index-BjLglEQs.js";
const v = {
  "metadata-container": "_metadata-container_1buqv_1"
}, b = /* @__PURE__ */ E({
  name: "KlCompMetadata",
  components: {
    CompLoading: g,
    EditorMonacoEditor: O,
    ElButton: C
  },
  emits: ["close"],
  props: {
    compNode: {
      type: Object,
      default: () => ({})
    }
  },
  setup(p, {
    emit: n
  }) {
    const a = s(JSON.stringify(p.compNode)), l = s(!0), i = s(), c = () => {
      _({
        type: "error",
        title: m.CODE_ERROR_NOTICE_TITLE,
        message: m.CODE_ERROR_NOTICE_MESSAGE,
        position: "bottom-left"
      });
    }, f = () => {
      const e = i.value.getValue();
      if (!r(e)) {
        c();
        return;
      }
      a.value == JSON.stringify(u(e)) ? n("close", "") : n("close", u(e));
    };
    return () => o("div", {
      class: "dialog-component"
    }, [o("section", {
      class: "dialog-component__body"
    }, [o("section", {
      class: v["metadata-container"]
    }, [l.value ? o(t("comp-loading"), null, null) : "", o(t("editor-monaco-editor"), {
      ref: i,
      modelValue: a.value,
      "onUpdate:modelValue": (e) => a.value = e,
      onChange: (e) => {
        l.value = !1, r(e) || c();
      }
    }, null)])]), o("section", {
      class: "dialog-component__footer"
    }, [o(t("el-button"), {
      onClick: () => n("close")
    }, {
      default: () => [d.CANCEL]
    }), o(t("el-button"), {
      type: "primary",
      onClick: f
    }, {
      default: () => [d.COMFIRM]
    })])]);
  }
});
export {
  b as default
};
