Line data    Source code

       1             : // @ts-check
       2             : 
       3             : import Vue from "vue";
       4             : import { mapState } from "vuex";
       5             : 
       6             : import { openLintPanel } from "@codemirror/lint";
       7             : 
       8             : import { ssvgElements, ssvgPrettyPrint } from "../../utils/SSVGLint";
       9             : import { noop } from "lodash";
      10             : import RelationCodeEditor from "./RelationCodeEditor.vue";
      11             : 
      12             : /**
      13             :  * @typedef {{ schema: typeof schema }} Opts
      14             :  * @typedef {{ cm: HTMLElement }} Refs
      15             :  */
      16             : 
      17           1 : const schema = [
      18             :   { ...ssvgElements.transition, top: true }
      19             : ];
      20             : 
      21           1 : const component = /** @type {V.Constructor<Opts, Refs>} */(Vue).extend({
      22             :   name: "TransitionCodeEditor",
      23             :   extends: RelationCodeEditor,
      24             :   computed: {
      25             :     .../** @type {{ transition(): Element|null }} */(mapState("selection", [ "transition" ])),
      26             :     /** @return {string} */
      27             :     currentContent() {
      28           0 :       return (this.transition) ? ssvgPrettyPrint(this.transition.outerHTML) : "";
      29             :     }
      30             :   },
      31             :   mounted() {
      32           0 :     this.$options.schema = schema;
      33           0 :     this.updateLanguage();
      34             :   },
      35             :   methods: {
      36             :     async doApply() {
      37           0 :       if (!this.transition) { /* noop */ }
      38           0 :       else if (this.$refs.cm?.getElementsByClassName("cm-lint-marker-error").length > 0) {
      39           0 :         openLintPanel(this.getEditor());
      40           0 :         return false;
      41             :       }
      42             :       else {
      43           0 :         await this.$store.dispatch("replace", this.editValue).catch(noop);
      44           0 :         return true;
      45             :       }
      46             :     }
      47             :   }
      48             : });
      49             : export default component;