Update angular and vue sdks (#192)

+ Revert Angular dev dependencies to v8
+ Unmount previous card with ReactDOM on prop changes

packages/angular/package.json

@@ -24,35 +24,35 @@
     "@microlink/vanilla": "^5.0.12"
   },
   "devDependencies": {
-    "@angular-devkit/build-angular": "latest",
-    "@angular-devkit/build-ng-packagr": "latest",
-    "@angular/cli": "latest",
-    "@angular/common": "latest",
-    "@angular/compiler": "latest",
-    "@angular/compiler-cli": "latest",
-    "@angular/core": "latest",
-    "@angular/forms": "latest",
-    "@angular/language-service": "latest",
-    "@angular/platform-browser": "latest",
-    "@angular/platform-browser-dynamic": "latest",
-    "@babel/core": "latest",
+    "@angular-devkit/build-angular": "~0.803.23",
+    "@angular-devkit/build-ng-packagr": "~0.803.23",
+    "@angular/cli": "~8.3.23",
+    "@angular/common": "~8.2.14",
+    "@angular/compiler": "~8.2.14",
+    "@angular/compiler-cli": "~8.2.14",
+    "@angular/core": "~8.2.14",
+    "@angular/forms": "^8.2.14",
+    "@angular/language-service": "~8.2.14",
+    "@angular/platform-browser": "^8.2.14",
+    "@angular/platform-browser-dynamic": "^8.2.14",
+    "@babel/core": "^7.8.4",
     "@microlink/demo-links": "latest",
     "@storybook/angular": "latest",
     "@types/node": "latest",
-    "babel-loader": "latest",
-    "codelyzer": "latest",
-    "ng-packagr": "latest",
+    "babel-loader": "^8.0.6",
+    "codelyzer": "^5.0.0",
+    "ng-packagr": "^5.4.0",
     "prettier-standard": "latest",
-    "protractor": "latest",
+    "protractor": "~5.4.0",
     "react": "latest",
     "react-dom": "latest",
-    "rxjs": "latest",
+    "rxjs": "^6.4.0",
     "styled-components": "latest",
-    "ts-node": "latest",
-    "tsickle": "latest",
-    "tslint": "latest",
-    "typescript": "3.7.5",
-    "zone.js": "latest"
+    "ts-node": "~7.0.0",
+    "tsickle": "^0.37.0",
+    "tslint": "~5.15.0",
+    "typescript": "~3.5.3",
+    "zone.js": "^0.9.1"
   },
   "peerDependencies": {
     "@angular/core": "^8",

packages/angular/src/microlink/microlink.component.ts

@@ -1,28 +1,37 @@
 import {
+  AfterViewInit,
   Component,
   ElementRef,
   Input,
+  OnChanges,
   SimpleChanges,
   ViewChild
 } from '@angular/core'
+import ReactDOM from 'react-dom'
 import microlink from '@microlink/vanilla'
 
 @Component({
   selector: 'microlink',
   template: '<div #cardSpace class="microlink_angular_dom"></div>'
 })
-export class MicrolinkComponent {
+export class MicrolinkComponent implements AfterViewInit, OnChanges {
   @Input() url: string
   @Input() options: object
 
   @ViewChild('cardSpace', { static: false }) cardSpace: ElementRef
 
   renderCard () {
+    const { nativeElement } = this.cardSpace
+
+    if (nativeElement && nativeElement.childNodes.length > 0) {
+      ReactDOM.unmountComponentAtNode(nativeElement)
+    }
+
     const anchor = document.createElement('a')
     anchor.href = this.url
     anchor.innerHTML = this.url
 
-    microlink(anchor, this.options, this.cardSpace.nativeElement)
+    microlink(anchor, this.options, nativeElement)
   }
 
   ngAfterViewInit () {

packages/vue/src/index.js

@@ -1,4 +1,5 @@
 import Vue from 'vue'
+import ReactDOM from 'react-dom'
 import microlink from '@microlink/vanilla'
 
 const camelCase = string => string.replace(/-([a-z])/g, g => g[1].toUpperCase())
@@ -18,6 +19,11 @@ export const Microlink = Vue.component('Microlink', {
   methods: {
     renderCard () {
       const { cardSpace } = this.$refs
+
+      if (cardSpace && cardSpace.childNodes.length > 0) {
+        ReactDOM.unmountComponentAtNode(cardSpace)
+      }
+
       const anchor = document.createElement('a')
       anchor.href = this.url
       anchor.innerHTML = this.url