From 9a9e60fa27f6d42dc4cebac04b06e3da271faa2b Mon Sep 17 00:00:00 2001
From: Bret Comnes <bcomnes@gmail.com>
Date: Sat, 19 Aug 2017 09:29:01 -0700
Subject: [PATCH] Fix sibbling reordering

---
 index.js     | 27 ++++++++++++++++++++-------
 package.json |  6 +++---
 2 files changed, 23 insertions(+), 10 deletions(-)

diff --git a/index.js b/index.js
index 86a79f3..d8923bb 100644
--- a/index.js
+++ b/index.js
@@ -5,24 +5,33 @@ var url = require('url')
 var twitterWidgetsLoader = require('./loader')
 
 class TwitterComponent extends Nanocomponent {
+  constructor (opts) {
+    super()
+    opts = Object.assign({
+      placeholder: true
+    }, opts)
+    this.opts = opts
+  }
+
   createElement (tweetURL) {
     this.tweetURL = tweetURL
-    return html`<div>
-      <span class="tweet">loading <a href="${tweetURL}">${tweetURL}</a></span>
-    </div>`
+    if (this.opts.placeholder) return html`<div>loading tweet: ${tweetURL}</div>`
+    return html`<div></div>`
   }
 
   update (tweetURL) {
-    return this.tweetURL === tweetURL
+    return this.tweetURL !== tweetURL
   }
 
   loadTweet (el) {
     var tweetID = url.parse(this.tweetURL).pathname.split('/').pop()
     if (!el) return console.warn(`cant render ${tweetID} on unmounted component`)
     onIdle(function () {
-      twitterWidgetsLoader.load(function (twttr) {
-        el.innerText = ''
-        twttr.widgets.createTweet(tweetID, el)
+      window.requestAnimationFrame(function () {
+        twitterWidgetsLoader.load(function (twttr) {
+          while (el.hasChildNodes()) el.removeChild(el.lastChild)
+          twttr.widgets.createTweet(tweetID, el)
+        })
       })
     })
   }
@@ -34,6 +43,10 @@ class TwitterComponent extends Nanocomponent {
   afterupdate (el) {
     this.loadTweet(el)
   }
+
+  afterreorder (el) {
+    this.loadTweet(el)
+  }
 }
 
 module.exports = TwitterComponent
diff --git a/package.json b/package.json
index 2d63377..b549aad 100644
--- a/package.json
+++ b/package.json
@@ -1,7 +1,7 @@
 {
   "name": "twitter-component",
   "description": "A native DOM component wrapper for embedded tweets",
-  "version": "1.0.0",
+  "version": "1.0.1",
   "author": "Bret Comnes",
   "bugs": {
     "url": "https://github.com/bcomnes/twitter-component/issues"
@@ -9,7 +9,8 @@
   "dependencies": {
     "bel": "^5.0.3",
     "on-idle": "^3.1.2",
-    "url": "^0.11.0"
+    "url": "^0.11.0",
+    "nanocomponent": "^6.2.0"
   },
   "devDependencies": {
     "@tap-format/spec": "^0.2.0",
@@ -19,7 +20,6 @@
     "choo": "^6.0.0-4",
     "dependency-check": "^2.9.1",
     "global": "^4.3.2",
-    "nanocomponent": "^6.1.0",
     "npm-run-all": "^4.0.2",
     "standard": "^10.0.3",
     "tape": "^4.7.0",