Add MouseAction rendering

src/components/svg/keys/svg-mouse-click-key/index.ts

@@ -0,0 +1 @@
+export * from './svg-mouse-click-key';

src/components/svg/keys/svg-mouse-click-key/svg-mouse-click-key.html

@@ -0,0 +1,16 @@
+<svg:use [attr.xlink:href]="icon" width="20" height="20" x="10" y="25">
+</svg:use>
+<svg:text
+    [attr.x]="60"
+    [attr.y]="0"
+    [attr.text-anchor]="'middle'"
+    [attr.font-size]="25">
+        <tspan dy="34"> Click </tspan>
+</svg:text>
+<svg:text
+    [attr.x]="50"
+    [attr.y]="0"
+    [attr.text-anchor]="'middle'"
+    [attr.font-size]="25">
+        <tspan dy="70"> {{ button }} </tspan>
+</svg:text>

src/components/svg/keys/svg-mouse-click-key/svg-mouse-click-key.ts

@@ -0,0 +1,19 @@
+import { Component, Input, OnInit } from '@angular/core';
+
+import { MapperService } from '../../../../services/mapper.service';
+
+@Component({
+    selector: 'g[svg-mouse-click-key]',
+    template: require('./svg-mouse-click-key.html')
+})
+export class SvgMouseClickKeyComponent implements OnInit {
+    @Input() button: string;
+
+    private icon: string;
+
+    constructor(private mapper: MapperService) {
+        this.icon = this.mapper.getIcon('mouse');
+    }
+
+    ngOnInit() { }
+}