diff --git a/src/editor/model/Selected.js b/src/editor/model/Selected.ts
similarity index 66%
rename from src/editor/model/Selected.js
rename to src/editor/model/Selected.ts
index b229df14b..e05e4ef77 100644
--- a/src/editor/model/Selected.js
+++ b/src/editor/model/Selected.ts
@@ -1,25 +1,26 @@
 import { isArray } from 'underscore';
 import { Collection, Model } from '../../common';
+import { Component } from '../../dom_components/model/Component';
 
 export class Selectable extends Model {}
 
-export default class Selected extends Collection {
-  getByComponent(component) {
+export default class Selected extends Collection<Selectable> {
+  getByComponent(component: Component) {
     return this.filter(s => this.getComponent(s) === component)[0];
   }
 
-  addComponent(component, opts) {
+  addComponent(component: Component, opts: any) {
     const toAdd = (isArray(component) ? component : [component])
       .filter(c => !this.hasComponent(c))
-      .map(component => ({ component }));
+      .map(component => new Selectable({ component }))[0];
     return this.push(toAdd, opts);
   }
 
-  getComponent(model) {
+  getComponent(model: Selectable) {
     return model.get('component');
   }
 
-  hasComponent(component) {
+  hasComponent(component: Component) {
     const model = this.getByComponent(component);
     return model && this.contains(model);
   }
@@ -33,10 +34,8 @@ export default class Selected extends Collection {
     return this.map(s => this.getComponent(s)).filter(i => i);
   }
 
-  removeComponent(component, opts) {
+  removeComponent(component: Component, opts: any) {
     const toRemove = (isArray(component) ? component : [component]).map(c => this.getByComponent(c));
     return this.remove(toRemove, opts);
   }
 }
-
-Selected.prototype.model = Selectable;