Line data Source code
1 : // @ts-check 2 : 3 : import Vue from "vue"; 4 : import { mapState } from "vuex"; 5 : import { get, upperFirst } from "lodash"; 6 : 7 : import RelationEdit from "./SSVGPropEdit/RelationEdit.vue"; 8 : import TransformEdit from "./SSVGPropEdit/TransformEdit.vue"; 9 : import PropertyEdit from "./SSVGPropEdit/PropertyEdit.vue"; 10 : import TransitionEdit from "./SSVGPropEdit/TransitionEdit.vue"; 11 : import StateEdit from "./Control/StateEdit.vue"; 12 : 13 : export default /** @type {V.Constructor<any, any>} */ (Vue).extend({ 14 : name: "SSVGPropEdit", 15 : components: { RelationEdit, TransformEdit, StateEdit, PropertyEdit, 16 : TransitionEdit }, 17 : filters: { 18 : /** 19 : * @param {string} e 20 : * @return {string} 21 : */ 22 : upperFirst(e) { 23 0 : return upperFirst(e); 24 : } 25 : }, 26 : /** 27 : * @type {{ 28 : * property(): AppStore.Selection["property"], 29 : * relation(): AppStore.Selection["relation"], 30 : * path(): AppStore.Selection["path"], 31 : * transition(): AppStore.Selection["transition"], 32 : * tagName(): string, 33 : * propertyKey(): string, 34 : * stateKey(): string 35 : * }} 36 : */ 37 : computed: { 38 : ...mapState("selection", [ "property", "relation", "path", "transition" ]), 39 : .../** @type {{ state(): any }} */mapState("engine", [ "state" ]), 40 : tagName() { 41 0 : return get(this.relation || this.property, [ "tagName" ], ""); 42 : }, 43 : propertyKey() { 44 2 : const p = this.path ?? []; 45 2 : return `${p[0]}-${p[1]}-${p[2]?.index}-${p[2]?.tagName}-${p[2]?.index}-${p[3]}`; 46 : }, 47 : stateKey() { 48 5 : return `${this.path?.[0]}`; 49 : } 50 : } 51 : });