Move ComponentSvg to TS

src/dom_components/model/Component.ts

@@ -112,7 +112,7 @@ export const keyUpdateInside = `${keyUpdate}-inside`;
  */
 export default class Component extends StyleableModel<ComponentProperties> {
   // @ts-ignore
-  get defaults() {
+  get defaults(): ComponentDefinitionDefined {
     return {
       tagName: 'div',
       type: '',

src/dom_components/model/ComponentSvg.js → src/dom_components/model/ComponentSvg.ts

@@ -1,25 +1,28 @@
 import Component from './Component';
-import { toLowerCase } from 'utils/mixins';
+import { toLowerCase } from '../../utils/mixins';
 
 const type = 'svg';
 
 export default class ComponentSvg extends Component {
   get defaults() {
     return {
+      // @ts-ignore
       ...super.defaults,
       type,
       tagName: type,
-      highlightable: 0,
-      resizable: { ratioDefault: 1 },
+      highlightable: false,
+      resizable: { ratioDefault: true },
     };
   }
 
   getName() {
-    let name = this.get('tagName');
-    let customName = this.get('custom-name');
+    let name = this.get('tagName')!;
+    const customName = this.get('custom-name');
     name = name.charAt(0).toUpperCase() + name.slice(1);
     return customName || name;
   }
-}
 
-ComponentSvg.isComponent = el => toLowerCase(el.tagName) === type;
+  static isComponent(el: HTMLElement) {
+    return toLowerCase(el.tagName) === type;
+  }
+}

src/dom_components/model/types.ts

@@ -190,7 +190,7 @@ export interface ComponentDefinitionDefined extends Omit<ComponentProperties, 'c
    * Children components.
    */
   components?: ComponentDefinitionDefined[] | ComponentDefinitionDefined;
-  traits?: Partial<TraitProperties>[];
+  traits?: (Partial<TraitProperties> | string)[];
   [key: string]: any;
 }