@stencil/core 2.18.0 → 2.19.0

package/dependencies.json

@@ -2,7 +2,7 @@
   "dependencies": [
     {
       "name": "@stencil/core",
-      "version": "2.18.0",
+      "version": "2.19.0",
       "main": "compiler/stencil.js",
       "resources": [
         "package.json",

package/dev-server/client/index.d.ts

@@ -1,6 +1,6 @@
 export { appError, clearAppErrorModal } from './app-error';
 export { emitBuildLog, emitBuildResults, emitBuildStatus, onBuildLog, onBuildResults, onBuildStatus } from './events';
+export { hmrWindow } from './hmr-window';
+export { logBuild, logDiagnostic, logDisabled, logReload, logWarn } from './logger';
 export { initBuildProgress } from './progress';
 export { initBuildStatus } from './status';
-export { logBuild, logDiagnostic, logDisabled, logReload, logWarn } from './logger';
-export { hmrWindow } from './hmr-window';

package/dev-server/client/index.js

@@ -1,5 +1,5 @@
 /*!
- Stencil Dev Server Client v2.18.0 | MIT Licensed | https://stenciljs.com
+ Stencil Dev Server Client v2.19.0 | MIT Licensed | https://stenciljs.com
  */
 var appErrorCss = "#dev-server-modal * { box-sizing: border-box !important; } #dev-server-modal { direction: ltr !important; display: block !important; position: absolute !important; top: 0 !important; right: 0 !important; bottom: 0 !important; left: 0 !important; z-index: 100000; margin: 0 !important; padding: 0 !important; font-family: -apple-system, 'Roboto', BlinkMacSystemFont, 'Segoe UI', 'Helvetica Neue', sans-serif, 'Apple Color Emoji', 'Segoe UI Emoji', 'Segoe UI Symbol' !important; font-size: 14px !important; line-height: 1.5 !important; -webkit-font-smoothing: antialiased; text-rendering: optimizeLegibility; text-size-adjust: none; word-wrap: break-word; color: #333 !important; background-color: white !important; box-sizing: border-box !important; overflow: hidden; user-select: auto; } #dev-server-modal-inner { position: relative !important; padding: 0 0 30px 0 !important; width: 100% !important; height: 100%; overflow-x: hidden; overflow-y: scroll; -webkit-overflow-scrolling: touch; } .dev-server-diagnostic { margin: 20px !important; border: 1px solid #ddd !important; border-radius: 3px !important; } .dev-server-diagnostic-masthead { padding: 8px 12px 12px 12px !important; } .dev-server-diagnostic-title { margin: 0 !important; font-weight: bold !important; color: #222 !important; } .dev-server-diagnostic-message { margin-top: 4px !important; color: #555 !important; } .dev-server-diagnostic-file { position: relative !important; border-top: 1px solid #ddd !important; } .dev-server-diagnostic-file-header { display: block !important; padding: 5px 10px !important; color: #555 !important; border-bottom: 1px solid #ddd !important; border-top-left-radius: 2px !important; border-top-right-radius: 2px !important; background-color: #f9f9f9 !important; font-family: Consolas, 'Liberation Mono', Menlo, Courier, monospace !important; font-size: 12px !important; } a.dev-server-diagnostic-file-header { color: #0000ee !important; text-decoration: underline !important; } a.dev-server-diagnostic-file-header:hover { text-decoration: none !important; background-color: #f4f4f4 !important; } .dev-server-diagnostic-file-name { font-weight: bold !important; } .dev-server-diagnostic-blob { overflow-x: auto !important; overflow-y: hidden !important; border-bottom-right-radius: 3px !important; border-bottom-left-radius: 3px !important; } .dev-server-diagnostic-table { margin: 0 !important; padding: 0 !important; border-spacing: 0 !important; border-collapse: collapse !important; border-width: 0 !important; border-style: none !important; -moz-tab-size: 2; tab-size: 2; } .dev-server-diagnostic-table td, .dev-server-diagnostic-table th { padding: 0 !important; border-width: 0 !important; border-style: none !important; } td.dev-server-diagnostic-blob-num { padding-right: 10px !important; padding-left: 10px !important; width: 1% !important; min-width: 50px !important; font-family: Consolas, 'Liberation Mono', Menlo, Courier, monospace !important; font-size: 12px !important; line-height: 20px !important; color: rgba(0, 0, 0, 0.3) !important; text-align: right !important; white-space: nowrap !important; vertical-align: top !important; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; border: solid #eee !important; border-width: 0 1px 0 0 !important; } td.dev-server-diagnostic-blob-num::before { content: attr(data-line-number) !important; } .dev-server-diagnostic-error-line td.dev-server-diagnostic-blob-num { background-color: #ffdddd !important; border-color: #ffc9c9 !important; } .dev-server-diagnostic-error-line td.dev-server-diagnostic-blob-code { background: rgba(255, 221, 221, 0.25) !important; z-index: -1; } .dev-server-diagnostic-open-in-editor td.dev-server-diagnostic-blob-num:hover { cursor: pointer; background-color: #ffffe3 !important; font-weight: bold; } .dev-server-diagnostic-open-in-editor.dev-server-diagnostic-error-line td.dev-server-diagnostic-blob-num:hover { background-color: #ffdada !important; } td.dev-server-diagnostic-blob-code { position: relative !important; padding-right: 10px !important; padding-left: 10px !important; line-height: 20px !important; vertical-align: top !important; overflow: visible !important; font-family: Consolas, 'Liberation Mono', Menlo, Courier, monospace !important; font-size: 12px !important; color: #333 !important; word-wrap: normal !important; white-space: pre !important; } td.dev-server-diagnostic-blob-code::before { content: '' !important; } .dev-server-diagnostic-error-chr { position: relative !important; } .dev-server-diagnostic-error-chr::before { position: absolute !important; z-index: -1; top: -3px !important; left: 0px !important; width: 8px !important; height: 20px !important; background-color: #ffdddd !important; content: '' !important; } /** * GitHub Gist Theme * Author : Louis Barranqueiro - https://github.com/LouisBarranqueiro * https://highlightjs.org/ */ .hljs-comment, .hljs-meta { color: #969896; } .hljs-string, .hljs-variable, .hljs-template-variable, .hljs-strong, .hljs-emphasis, .hljs-quote { color: #df5000; } .hljs-keyword, .hljs-selector-tag, .hljs-type { color: #a71d5d; } .hljs-literal, .hljs-symbol, .hljs-bullet, .hljs-attribute { color: #0086b3; } .hljs-section, .hljs-name { color: #63a35c; } .hljs-tag { color: #333333; } .hljs-title, .hljs-attr, .hljs-selector-id, .hljs-selector-class, .hljs-selector-attr, .hljs-selector-pseudo { color: #795da3; } .hljs-addition { color: #55a532; background-color: #eaffea; } .hljs-deletion { color: #bd2c00; background-color: #ffecec; } .hljs-link { text-decoration: underline; }";
 
@@ -260,246 +260,6 @@ const BUILD_LOG = `devserver:buildlog`;
 const BUILD_RESULTS = `devserver:buildresults`;
 const BUILD_STATUS = `devserver:buildstatus`;
 
-const initBuildProgress = (data) => {
-    const win = data.window;
-    const doc = win.document;
-    const barColor = `#5851ff`;
-    const errorColor = `#b70c19`;
-    let addBarTimerId;
-    let removeBarTimerId;
-    let opacityTimerId;
-    let incIntervalId;
-    let progressIncrease;
-    let currentProgress = 0;
-    function update() {
-        clearTimeout(opacityTimerId);
-        clearTimeout(removeBarTimerId);
-        const progressBar = getProgressBar();
-        if (!progressBar) {
-            createProgressBar();
-            addBarTimerId = setTimeout(update, 16);
-            return;
-        }
-        progressBar.style.background = barColor;
-        progressBar.style.opacity = `1`;
-        progressBar.style.transform = `scaleX(${Math.min(1, displayProgress())})`;
-        if (incIntervalId == null) {
-            incIntervalId = setInterval(() => {
-                progressIncrease += Math.random() * 0.05 + 0.01;
-                if (displayProgress() < 0.9) {
-                    update();
-                }
-                else {
-                    clearInterval(incIntervalId);
-                }
-            }, 800);
-        }
-    }
-    function reset() {
-        clearInterval(incIntervalId);
-        progressIncrease = 0.05;
-        incIntervalId = null;
-        clearTimeout(opacityTimerId);
-        clearTimeout(addBarTimerId);
-        clearTimeout(removeBarTimerId);
-        const progressBar = getProgressBar();
-        if (progressBar) {
-            if (currentProgress >= 1) {
-                progressBar.style.transform = `scaleX(1)`;
-            }
-            opacityTimerId = setTimeout(() => {
-                try {
-                    const progressBar = getProgressBar();
-                    if (progressBar) {
-                        progressBar.style.opacity = `0`;
-                    }
-                }
-                catch (e) { }
-            }, 150);
-            removeBarTimerId = setTimeout(() => {
-                try {
-                    const progressBar = getProgressBar();
-                    if (progressBar) {
-                        progressBar.parentNode.removeChild(progressBar);
-                    }
-                }
-                catch (e) { }
-            }, 1000);
-        }
-    }
-    function displayProgress() {
-        const p = currentProgress + progressIncrease;
-        return Math.max(0, Math.min(1, p));
-    }
-    reset();
-    onBuildLog(win, (buildLog) => {
-        currentProgress = buildLog.progress;
-        if (currentProgress >= 0 && currentProgress < 1) {
-            update();
-        }
-        else {
-            reset();
-        }
-    });
-    onBuildResults(win, (buildResults) => {
-        if (buildResults.hasError) {
-            const progressBar = getProgressBar();
-            if (progressBar) {
-                progressBar.style.transform = `scaleX(1)`;
-                progressBar.style.background = errorColor;
-            }
-        }
-        reset();
-    });
-    onBuildStatus(win, (buildStatus) => {
-        if (buildStatus === 'disabled') {
-            reset();
-        }
-    });
-    if (doc.head.dataset.tmpl === 'tmpl-initial-load') {
-        update();
-    }
-    const PROGRESS_BAR_ID = `dev-server-progress-bar`;
-    function getProgressBar() {
-        return doc.getElementById(PROGRESS_BAR_ID);
-    }
-    function createProgressBar() {
-        const progressBar = doc.createElement('div');
-        progressBar.id = PROGRESS_BAR_ID;
-        progressBar.style.position = `absolute`;
-        progressBar.style.top = `0`;
-        progressBar.style.left = `0`;
-        progressBar.style.zIndex = `100001`;
-        progressBar.style.width = `100%`;
-        progressBar.style.height = `2px`;
-        progressBar.style.transform = `scaleX(0)`;
-        progressBar.style.opacity = `1`;
-        progressBar.style.background = barColor;
-        progressBar.style.transformOrigin = `left center`;
-        progressBar.style.transition = `transform .1s ease-in-out, opacity .5s ease-in`;
-        progressBar.style.contain = `strict`;
-        doc.body.appendChild(progressBar);
-    }
-};
-
-const initBuildStatus = (data) => {
-    const win = data.window;
-    const doc = win.document;
-    const iconElms = getFavIcons(doc);
-    iconElms.forEach((iconElm) => {
-        if (iconElm.href) {
-            iconElm.dataset.href = iconElm.href;
-            iconElm.dataset.type = iconElm.type;
-        }
-    });
-    onBuildStatus(win, (buildStatus) => {
-        updateBuildStatus(doc, buildStatus);
-    });
-};
-const updateBuildStatus = (doc, status) => {
-    const iconElms = getFavIcons(doc);
-    iconElms.forEach((iconElm) => {
-        updateFavIcon(iconElm, status);
-    });
-};
-const updateFavIcon = (linkElm, status) => {
-    if (status === 'pending') {
-        linkElm.href = ICON_PENDING;
-        linkElm.type = ICON_TYPE;
-        linkElm.setAttribute('data-status', status);
-    }
-    else if (status === 'error') {
-        linkElm.href = ICON_ERROR;
-        linkElm.type = ICON_TYPE;
-        linkElm.setAttribute('data-status', status);
-    }
-    else if (status === 'disabled') {
-        linkElm.href = ICON_DISABLED;
-        linkElm.type = ICON_TYPE;
-        linkElm.setAttribute('data-status', status);
-    }
-    else {
-        linkElm.removeAttribute('data-status');
-        if (linkElm.dataset.href) {
-            linkElm.href = linkElm.dataset.href;
-            linkElm.type = linkElm.dataset.type;
-        }
-        else {
-            linkElm.href = ICON_DEFAULT;
-            linkElm.type = ICON_TYPE;
-        }
-    }
-};
-const getFavIcons = (doc) => {
-    const iconElms = [];
-    const linkElms = doc.querySelectorAll('link');
-    for (let i = 0; i < linkElms.length; i++) {
-        if (linkElms[i].href &&
-            linkElms[i].rel &&
-            (linkElms[i].rel.indexOf('shortcut') > -1 || linkElms[i].rel.indexOf('icon') > -1)) {
-            iconElms.push(linkElms[i]);
-        }
-    }
-    if (iconElms.length === 0) {
-        const linkElm = doc.createElement('link');
-        linkElm.rel = 'shortcut icon';
-        doc.head.appendChild(linkElm);
-        iconElms.push(linkElm);
-    }
-    return iconElms;
-};
-const ICON_DEFAULT = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMAAAADACAMAAABlApw1AAAAnFBMVEUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAD4jUzeAAAAM3RSTlMAsGDs4wML8QEbBvr2FMhAM7+ILCUPnNzXrX04otO6j3RiT0ggzLSTcmtWUUWoZlknghZc2mZzAAACrklEQVR42u3dWXLiUAyFYWEwg40x8wxhSIAwJtH+99ZVeeinfriXVpWk5Hyr+C2VrgkAAAAAAAAAAAw5sZQ7aUhYypw07FjKC2ko2yxk2SQFgwYLOWSkYFhlIZ06KWhNWMhqRApGKxYyaZGCeoeFVIekIDuwkEaXFDSXLKRdkoYjS9mRhjlLSUjDO0s5kYYzS+mThn3OQsYqAbQQC7hZSgoGYgHUy0jBa42FvKkEUDERC6CCFIzeWEjtlRRkPbGAG5CCtCIWQAtS0ByzkHxPGvos5UEaNizlnTRsWconhbM4wTpSFHMTrFtKCroNFrLGBOsJLbGAWxWkoFiJBRAmWE/I1r4nWOmNheTeJ1gX0vDJUrYUweAEa04aHs5XePvc9wpPboJ1SCmOsRVkr04aromUEQEAgB9lxaZ++ATFpNDv6Y8qm1QdBk9QTAr9ni6mbFK7DJ6g2LQLXoHZlFCQdMY2nYJXYDb1g1dgNo2boSswm2Zp6ArMptCFyIVtCl2IlDmbNC0QcPEQcD8l4HLvAXdxHnBb5wG3QcDFQ8D9mIDrIeCiIeDiA25oNeA+EHDREHDxAbdmmxBwT0HARQbciW0KDbiEbQoNuB3bFBxwbTYJAfcUBFxkwFG/YlNJAADgxzCRcqUY9m7KGgNSUEx9H3XXO76Puv/OY5wedX/flHk+6j46v2maO79purPvm6Yz+75puua+b5q6Dd/PEsrNMyZfFM5gAMW+ymPtWciYV3ksBpBOwKUH3wHXXLKUM2l4cR5wG+cBlzgPuJ3zgJNb6FRwlP4Ln1X8wrOKeFbxP6Qz3wEn+KzilWLYe5UnMuDwY5BvD+cBt899B9zC+49Bqr4DrlXzHXDF1HfA1Tu+Ay5b+w649OY74OjoO+Bo7jzg7s4DDgAAAAAAAAAA/u0POrfnVIaqz/QAAAAASUVORK5CYII=';
-const ICON_PENDING = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMAAAADACAMAAABlApw1AAAAjVBMVEUAAAD8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjLn7xn3AAAALnRSTlMAsFBgAaDxfPpAdTMcD/fs47kDBhVXJQpvLNbInIiBRvSqIb+TZ2OOONxdzUxpgKSpAAAAA69JREFUeNrt3FtvskAQxvERFQXFioqnCkqth572+3+8947dN00TliF5ZpP53ZOAveg/OzCklFJKKaWUUkoppQTZm77cCGFo+jIhhG/TlwchJAvTk/GIAA6x6Um+JoDti+nJ644A5h+mJ8eMALKj6cnHnAB2r80NLJ4jf3Vz+cuWANZ5cwPTM/l7by6PZwQwGptGQf4q++dLCOHdNIbkb2IvjwjAvYEf8pe6j4/wYxopr/9SQih4BXa3l5eEcJ7a++c9/gkSQE8bcCWvXwcrAjjYADrxHv8KCbi3JasgD5fm8i9IAG1swMXzDv0X2wDaEED21dzA5UDeVoPm8uUbAayvvAI42YA7EIDzA5pv8lc6/UoAoxMv4CZuvyKUpnHn9VNBAG6B7XkBtCeEO6/AbvbyihAiXsB92svfCcA9wap4j19DAmgWs37AZCrnBKvu8vgX9AmWE3BZh/6L7QkWJIA2RxtwHQpml9sAQp9gXWbkbxz4CdYDfIK1qk1j3IV9fPgJFlNECJXhYfSfsBHkhBCKwEd452nYI7wncwQJP8GKTU+uO0I4D/uSkVJKqXAkA5nK9icoIi3nrU9QRHrZtj5BESmetT5BEantPCh7NTJFrUdgMg1bj8BkSv1HYJ8RmjMQKf1HYDdC+/R/IyQFzbD4AxH+CIyPPxCJoEdQ/IFIMgXNEPkDkd8jMLQs5wRcTXA1J+By/BGO+0ovYwQGU3kPRLJfIzCkCSfgpgmhpc5AxD/gIkLb8wKO0DTgoNyaGQQecNfQAy7TgGtHA04DLtyA24UecHngAVdrwIkJuAitU8DJ1Dbghkam9gEnU+uAWxiRjhsdoXagI1TPgKNyIBO+ZpRSSrW3HfblTAA9/juPDwTAfiMK9VG3PY/hwX7Ubc9j+AoCWNWGp+NSH4HflE2IgXUEGPI3TTfmN4ndv2kSsRUJvpUn4W1FShbYb5rc84ySAtzKs3W3IgW4lWfO24q0zsFbebIjaysSjbtt5RHzUf0DHHCrAW8gVYEDzl0LGYW4lefB24uYQgOOfwN7dMANeW/k3DkBJ2CrUNE54GRsFYIHnPNR+iPEgHPWKo5DDDhnrWKeBRhwzlrFeNtlq5CgtYqzAAPODaBzgAH331rFAAOOqsDXKjL3IqboN7ILJ4BCDDh3r3SIAfd0AijEgHP3So/8wQNuvjRBbxVij5A6Bpy8EZJnwIkbIfkFnLwRkm/ASRshXbwDTtYICRRwt7BHqEoppZRSSimllFLqD/8AOXJZHefotiIAAAAASUVORK5CYII=';
-const ICON_ERROR = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMAAAADACAMAAABlApw1AAAAkFBMVEUAAAD5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0HYvLBZAAAAL3RSTlMAsGDjA/rsC/ElHRUBBssz9pFCvoh0UEcsD9ec3K19OLiiaNLEYlmoVeiCbmE+GuMl4I8AAAKQSURBVHja7d1njupQDIZhAymEUIZQQu9taN7/7q50pfl/TmTJtvQ9q3hzLDsEAAAAAAAAAACGzFjKiTS0WcqONMxZypg0fH5YyLFPChZdFnIYkILil4VcclLw3bCQ85IULM8sZPMlBfmFhfwWpGBwYCHdESnoH1nIz4c0jFnKnDTsWEqbNJxYyow03FjKlDTUKQtZqwTQXizgtgkpWGQsZKIScL0OCxmqBFC5EQugkhQshyyk0yMFgwkLyRakIGmJBdCeFPTXLCStScOUpdwogsEXrBdpuLKUJ4XDC9afKmUh94QUjLy/YGViAZRTOIMBtypJQXn2HUC5WMBleMFqILmzkLSicBZfsB6k4clSrqTh5XyEd3MeQHXqe4Qn94LVSiicwRHkJScNdVvKkgAAwI+qZdM0/AXFpE4v+AXFpKwIfkExKfR7ulyxSWkV/IJi0zx4BGbTm4IkW7ZpFjwCs2kaPAKzad0PHYHZtE1CR2A2TQahIzCbhnnwCMykVYmAi4aAQ8BZ4T3grgi4BhBwCDgbEHCNIOAQcCYg4BpCwCHgLEDAaYgPuDfbhIBrBAGHgDMhNOBo2rKpIgAA8KNoS6kplq2dsu6CFJQr30vd+dD3Uvf/nTLHS93J3flZwrHznaad852mE/veaXqw752mKvW90zTq+j5LWGS+r/J8xQKoU1AUa2chm1zlsXQWUifgkoPvgOsffQccjZ0H3Mx5wL2dB9zcecB9sJTePOBM3cU+46wiziq6C7hk6zvg3J9VfDK7vir0ch5wN+cBV6e+A27v/ccgme+AkxshTXKKYW6EFH0X29gIKTLgzI2QYgPO2ggpLuDsvaDEBZy9EVJcwBkcIT0IAAAAAAAAAADs+AdjeyF69/r87QAAAABJRU5ErkJggg==';
-const ICON_DISABLED = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMAAAADACAMAAABlApw1AAAAeFBMVEUAAAC4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7/uGGySAAAAJ3RSTlMAsGAE7OMcAQvxJRX69kHWyL8zq5GIdEcsD5zcfVg4uKLNa1JPZoK/xdPIAAACiklEQVR42u3dW5KqUAyF4QgCCggqIt7t9pb5z/Ccvjz2w95UqpJ0r28Uf2WTQAAAAAAAAAAAYMiWpTxJQ8JSTqThwVI2pKFZsJC3ghTs5izkmpKCcspCljNSkB9ZSLsnBfuWhRxzUjBbspBpSQrSKwuZr0lB8cZCFg1p2LCUB2k4sZSENNxYypY0nFlKTxqGmoUcClJwEQu4SUoKdmIBtEpJQZ6xkHeVAKqOYgFUkYL9OwvJclKQrsQCbkcK0olYAF1IQXFgIfVAGnqWcqZwFidYN4phb4L1onCYYMlPsLqUFKwxwRozwTIYcG1FCqrWdwBhgqU7wUo7FlJ7n2DdScPL+RPezfkT3tl5AA217yc89xMssYBbzUjDkEjZEwAA+NFMbOrDJygmZXnwBMWkaRk8QTFpvg6eoJi0aIInKDY9gp/AbEqCJyg2bYOfwGzqKUzPNh2K0Ccwm0IfRBK2KfSLkDvbFPog0tRsUlsh4EZAwP2SgKu9B9wdATcOAg4BZwACbgQEHALOCATcCAg4BJwVCLhREHB/LOAebFNwwC3YJATcKAi4yICjfmJTQwAA4EeZSBkojrWdsvmO4hjbKYtd6ra2Uxa71G1tp0xnqbvo+IPfpe4Nf3K703Ridr3T9OQPfnea7szseaepqX3vNH3NM/xe5fmeZ7i9yiMXQFlJEeydhYy4ymMygCICzmQAxQactbOQMQFnMoBiAs7iVaHIgDN3VSgq4AxeFYoOOGNXhbCUPkaJs4o4q/iXzyp2vgPO/VnFl/OAu/F/jq8KnZ0H3FD7DriL9x+DTH0HXJ75Driq9R1ws6XvgEuvvgOu6HwHHG18BxydnAfc03nAAQAAAAAAAADAz/4BoL2Us9XM2zMAAAAASUVORK5CYII=';
-const ICON_TYPE = 'image/x-icon';
-
-const logBuild = (msg) => log(BLUE, 'Build', msg);
-const logReload = (msg) => logWarn('Reload', msg);
-const logWarn = (prefix, msg) => log(YELLOW, prefix, msg);
-const logDisabled = (prefix, msg) => log(GRAY, prefix, msg);
-const logDiagnostic = (diag) => {
-    const diagnostic = diag;
-    let color = RED;
-    let prefix = 'Error';
-    if (diagnostic.level === 'warn') {
-        color = YELLOW;
-        prefix = 'Warning';
-    }
-    if (diagnostic.header) {
-        prefix = diagnostic.header;
-    }
-    let msg = ``;
-    if (diagnostic.relFilePath) {
-        msg += diagnostic.relFilePath;
-        if (typeof diagnostic.lineNumber === 'number' && diagnostic.lineNumber > 0) {
-            msg += ', line ' + diagnostic.lineNumber;
-            if (typeof diagnostic.columnNumber === 'number' && diagnostic.columnNumber > 0) {
-                msg += ', column ' + diagnostic.columnNumber;
-            }
-        }
-        msg += `\n`;
-    }
-    msg += diagnostic.messageText;
-    log(color, prefix, msg);
-};
-const log = (color, prefix, msg) => {
-    if (typeof navigator !== 'undefined' && navigator.userAgent && navigator.userAgent.indexOf('Trident') > -1) {
-        console.log(prefix, msg);
-    }
-    else {
-        console.log.apply(console, [
-            '%c' + prefix,
-            `background: ${color}; color: white; padding: 2px 3px; border-radius: 2px; font-size: 0.8em;`,
-            msg,
-        ]);
-    }
-};
-const YELLOW = `#f39c12`;
-const RED = `#c0392b`;
-const BLUE = `#3498db`;
-const GRAY = `#717171`;
-
 const getHmrHref = (versionId, fileName, testUrl) => {
     if (typeof testUrl === 'string' && testUrl.trim() !== '') {
         if (getUrlFileName(fileName) === getUrlFileName(testUrl)) {
@@ -805,4 +565,244 @@ const hmrWindow = (data) => {
     return results;
 };
 
+const logBuild = (msg) => log(BLUE, 'Build', msg);
+const logReload = (msg) => logWarn('Reload', msg);
+const logWarn = (prefix, msg) => log(YELLOW, prefix, msg);
+const logDisabled = (prefix, msg) => log(GRAY, prefix, msg);
+const logDiagnostic = (diag) => {
+    const diagnostic = diag;
+    let color = RED;
+    let prefix = 'Error';
+    if (diagnostic.level === 'warn') {
+        color = YELLOW;
+        prefix = 'Warning';
+    }
+    if (diagnostic.header) {
+        prefix = diagnostic.header;
+    }
+    let msg = ``;
+    if (diagnostic.relFilePath) {
+        msg += diagnostic.relFilePath;
+        if (typeof diagnostic.lineNumber === 'number' && diagnostic.lineNumber > 0) {
+            msg += ', line ' + diagnostic.lineNumber;
+            if (typeof diagnostic.columnNumber === 'number' && diagnostic.columnNumber > 0) {
+                msg += ', column ' + diagnostic.columnNumber;
+            }
+        }
+        msg += `\n`;
+    }
+    msg += diagnostic.messageText;
+    log(color, prefix, msg);
+};
+const log = (color, prefix, msg) => {
+    if (typeof navigator !== 'undefined' && navigator.userAgent && navigator.userAgent.indexOf('Trident') > -1) {
+        console.log(prefix, msg);
+    }
+    else {
+        console.log.apply(console, [
+            '%c' + prefix,
+            `background: ${color}; color: white; padding: 2px 3px; border-radius: 2px; font-size: 0.8em;`,
+            msg,
+        ]);
+    }
+};
+const YELLOW = `#f39c12`;
+const RED = `#c0392b`;
+const BLUE = `#3498db`;
+const GRAY = `#717171`;
+
+const initBuildProgress = (data) => {
+    const win = data.window;
+    const doc = win.document;
+    const barColor = `#5851ff`;
+    const errorColor = `#b70c19`;
+    let addBarTimerId;
+    let removeBarTimerId;
+    let opacityTimerId;
+    let incIntervalId;
+    let progressIncrease;
+    let currentProgress = 0;
+    function update() {
+        clearTimeout(opacityTimerId);
+        clearTimeout(removeBarTimerId);
+        const progressBar = getProgressBar();
+        if (!progressBar) {
+            createProgressBar();
+            addBarTimerId = setTimeout(update, 16);
+            return;
+        }
+        progressBar.style.background = barColor;
+        progressBar.style.opacity = `1`;
+        progressBar.style.transform = `scaleX(${Math.min(1, displayProgress())})`;
+        if (incIntervalId == null) {
+            incIntervalId = setInterval(() => {
+                progressIncrease += Math.random() * 0.05 + 0.01;
+                if (displayProgress() < 0.9) {
+                    update();
+                }
+                else {
+                    clearInterval(incIntervalId);
+                }
+            }, 800);
+        }
+    }
+    function reset() {
+        clearInterval(incIntervalId);
+        progressIncrease = 0.05;
+        incIntervalId = null;
+        clearTimeout(opacityTimerId);
+        clearTimeout(addBarTimerId);
+        clearTimeout(removeBarTimerId);
+        const progressBar = getProgressBar();
+        if (progressBar) {
+            if (currentProgress >= 1) {
+                progressBar.style.transform = `scaleX(1)`;
+            }
+            opacityTimerId = setTimeout(() => {
+                try {
+                    const progressBar = getProgressBar();
+                    if (progressBar) {
+                        progressBar.style.opacity = `0`;
+                    }
+                }
+                catch (e) { }
+            }, 150);
+            removeBarTimerId = setTimeout(() => {
+                try {
+                    const progressBar = getProgressBar();
+                    if (progressBar) {
+                        progressBar.parentNode.removeChild(progressBar);
+                    }
+                }
+                catch (e) { }
+            }, 1000);
+        }
+    }
+    function displayProgress() {
+        const p = currentProgress + progressIncrease;
+        return Math.max(0, Math.min(1, p));
+    }
+    reset();
+    onBuildLog(win, (buildLog) => {
+        currentProgress = buildLog.progress;
+        if (currentProgress >= 0 && currentProgress < 1) {
+            update();
+        }
+        else {
+            reset();
+        }
+    });
+    onBuildResults(win, (buildResults) => {
+        if (buildResults.hasError) {
+            const progressBar = getProgressBar();
+            if (progressBar) {
+                progressBar.style.transform = `scaleX(1)`;
+                progressBar.style.background = errorColor;
+            }
+        }
+        reset();
+    });
+    onBuildStatus(win, (buildStatus) => {
+        if (buildStatus === 'disabled') {
+            reset();
+        }
+    });
+    if (doc.head.dataset.tmpl === 'tmpl-initial-load') {
+        update();
+    }
+    const PROGRESS_BAR_ID = `dev-server-progress-bar`;
+    function getProgressBar() {
+        return doc.getElementById(PROGRESS_BAR_ID);
+    }
+    function createProgressBar() {
+        const progressBar = doc.createElement('div');
+        progressBar.id = PROGRESS_BAR_ID;
+        progressBar.style.position = `absolute`;
+        progressBar.style.top = `0`;
+        progressBar.style.left = `0`;
+        progressBar.style.zIndex = `100001`;
+        progressBar.style.width = `100%`;
+        progressBar.style.height = `2px`;
+        progressBar.style.transform = `scaleX(0)`;
+        progressBar.style.opacity = `1`;
+        progressBar.style.background = barColor;
+        progressBar.style.transformOrigin = `left center`;
+        progressBar.style.transition = `transform .1s ease-in-out, opacity .5s ease-in`;
+        progressBar.style.contain = `strict`;
+        doc.body.appendChild(progressBar);
+    }
+};
+
+const initBuildStatus = (data) => {
+    const win = data.window;
+    const doc = win.document;
+    const iconElms = getFavIcons(doc);
+    iconElms.forEach((iconElm) => {
+        if (iconElm.href) {
+            iconElm.dataset.href = iconElm.href;
+            iconElm.dataset.type = iconElm.type;
+        }
+    });
+    onBuildStatus(win, (buildStatus) => {
+        updateBuildStatus(doc, buildStatus);
+    });
+};
+const updateBuildStatus = (doc, status) => {
+    const iconElms = getFavIcons(doc);
+    iconElms.forEach((iconElm) => {
+        updateFavIcon(iconElm, status);
+    });
+};
+const updateFavIcon = (linkElm, status) => {
+    if (status === 'pending') {
+        linkElm.href = ICON_PENDING;
+        linkElm.type = ICON_TYPE;
+        linkElm.setAttribute('data-status', status);
+    }
+    else if (status === 'error') {
+        linkElm.href = ICON_ERROR;
+        linkElm.type = ICON_TYPE;
+        linkElm.setAttribute('data-status', status);
+    }
+    else if (status === 'disabled') {
+        linkElm.href = ICON_DISABLED;
+        linkElm.type = ICON_TYPE;
+        linkElm.setAttribute('data-status', status);
+    }
+    else {
+        linkElm.removeAttribute('data-status');
+        if (linkElm.dataset.href) {
+            linkElm.href = linkElm.dataset.href;
+            linkElm.type = linkElm.dataset.type;
+        }
+        else {
+            linkElm.href = ICON_DEFAULT;
+            linkElm.type = ICON_TYPE;
+        }
+    }
+};
+const getFavIcons = (doc) => {
+    const iconElms = [];
+    const linkElms = doc.querySelectorAll('link');
+    for (let i = 0; i < linkElms.length; i++) {
+        if (linkElms[i].href &&
+            linkElms[i].rel &&
+            (linkElms[i].rel.indexOf('shortcut') > -1 || linkElms[i].rel.indexOf('icon') > -1)) {
+            iconElms.push(linkElms[i]);
+        }
+    }
+    if (iconElms.length === 0) {
+        const linkElm = doc.createElement('link');
+        linkElm.rel = 'shortcut icon';
+        doc.head.appendChild(linkElm);
+        iconElms.push(linkElm);
+    }
+    return iconElms;
+};
+const ICON_DEFAULT = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMAAAADACAMAAABlApw1AAAAnFBMVEUAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAD4jUzeAAAAM3RSTlMAsGDs4wML8QEbBvr2FMhAM7+ILCUPnNzXrX04otO6j3RiT0ggzLSTcmtWUUWoZlknghZc2mZzAAACrklEQVR42u3dWXLiUAyFYWEwg40x8wxhSIAwJtH+99ZVeeinfriXVpWk5Hyr+C2VrgkAAAAAAAAAAAw5sZQ7aUhYypw07FjKC2ko2yxk2SQFgwYLOWSkYFhlIZ06KWhNWMhqRApGKxYyaZGCeoeFVIekIDuwkEaXFDSXLKRdkoYjS9mRhjlLSUjDO0s5kYYzS+mThn3OQsYqAbQQC7hZSgoGYgHUy0jBa42FvKkEUDERC6CCFIzeWEjtlRRkPbGAG5CCtCIWQAtS0ByzkHxPGvos5UEaNizlnTRsWconhbM4wTpSFHMTrFtKCroNFrLGBOsJLbGAWxWkoFiJBRAmWE/I1r4nWOmNheTeJ1gX0vDJUrYUweAEa04aHs5XePvc9wpPboJ1SCmOsRVkr04aromUEQEAgB9lxaZ++ATFpNDv6Y8qm1QdBk9QTAr9ni6mbFK7DJ6g2LQLXoHZlFCQdMY2nYJXYDb1g1dgNo2boSswm2Zp6ArMptCFyIVtCl2IlDmbNC0QcPEQcD8l4HLvAXdxHnBb5wG3QcDFQ8D9mIDrIeCiIeDiA25oNeA+EHDREHDxAbdmmxBwT0HARQbciW0KDbiEbQoNuB3bFBxwbTYJAfcUBFxkwFG/YlNJAADgxzCRcqUY9m7KGgNSUEx9H3XXO76Puv/OY5wedX/flHk+6j46v2maO79purPvm6Yz+75puua+b5q6Dd/PEsrNMyZfFM5gAMW+ymPtWciYV3ksBpBOwKUH3wHXXLKUM2l4cR5wG+cBlzgPuJ3zgJNb6FRwlP4Ln1X8wrOKeFbxP6Qz3wEn+KzilWLYe5UnMuDwY5BvD+cBt899B9zC+49Bqr4DrlXzHXDF1HfA1Tu+Ay5b+w649OY74OjoO+Bo7jzg7s4DDgAAAAAAAAAA/u0POrfnVIaqz/QAAAAASUVORK5CYII=';
+const ICON_PENDING = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMAAAADACAMAAABlApw1AAAAjVBMVEUAAAD8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjL8kjLn7xn3AAAALnRSTlMAsFBgAaDxfPpAdTMcD/fs47kDBhVXJQpvLNbInIiBRvSqIb+TZ2OOONxdzUxpgKSpAAAAA69JREFUeNrt3FtvskAQxvERFQXFioqnCkqth572+3+8947dN00TliF5ZpP53ZOAveg/OzCklFJKKaWUUkoppQTZm77cCGFo+jIhhG/TlwchJAvTk/GIAA6x6Um+JoDti+nJ644A5h+mJ8eMALKj6cnHnAB2r80NLJ4jf3Vz+cuWANZ5cwPTM/l7by6PZwQwGptGQf4q++dLCOHdNIbkb2IvjwjAvYEf8pe6j4/wYxopr/9SQih4BXa3l5eEcJ7a++c9/gkSQE8bcCWvXwcrAjjYADrxHv8KCbi3JasgD5fm8i9IAG1swMXzDv0X2wDaEED21dzA5UDeVoPm8uUbAayvvAI42YA7EIDzA5pv8lc6/UoAoxMv4CZuvyKUpnHn9VNBAG6B7XkBtCeEO6/AbvbyihAiXsB92svfCcA9wap4j19DAmgWs37AZCrnBKvu8vgX9AmWE3BZh/6L7QkWJIA2RxtwHQpml9sAQp9gXWbkbxz4CdYDfIK1qk1j3IV9fPgJFlNECJXhYfSfsBHkhBCKwEd452nYI7wncwQJP8GKTU+uO0I4D/uSkVJKqXAkA5nK9icoIi3nrU9QRHrZtj5BESmetT5BEantPCh7NTJFrUdgMg1bj8BkSv1HYJ8RmjMQKf1HYDdC+/R/IyQFzbD4AxH+CIyPPxCJoEdQ/IFIMgXNEPkDkd8jMLQs5wRcTXA1J+By/BGO+0ovYwQGU3kPRLJfIzCkCSfgpgmhpc5AxD/gIkLb8wKO0DTgoNyaGQQecNfQAy7TgGtHA04DLtyA24UecHngAVdrwIkJuAitU8DJ1Dbghkam9gEnU+uAWxiRjhsdoXagI1TPgKNyIBO+ZpRSSrW3HfblTAA9/juPDwTAfiMK9VG3PY/hwX7Ubc9j+AoCWNWGp+NSH4HflE2IgXUEGPI3TTfmN4ndv2kSsRUJvpUn4W1FShbYb5rc84ySAtzKs3W3IgW4lWfO24q0zsFbebIjaysSjbtt5RHzUf0DHHCrAW8gVYEDzl0LGYW4lefB24uYQgOOfwN7dMANeW/k3DkBJ2CrUNE54GRsFYIHnPNR+iPEgHPWKo5DDDhnrWKeBRhwzlrFeNtlq5CgtYqzAAPODaBzgAH331rFAAOOqsDXKjL3IqboN7ILJ4BCDDh3r3SIAfd0AijEgHP3So/8wQNuvjRBbxVij5A6Bpy8EZJnwIkbIfkFnLwRkm/ASRshXbwDTtYICRRwt7BHqEoppZRSSimllFLqD/8AOXJZHefotiIAAAAASUVORK5CYII=';
+const ICON_ERROR = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMAAAADACAMAAABlApw1AAAAkFBMVEUAAAD5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0H5Q0HYvLBZAAAAL3RSTlMAsGDjA/rsC/ElHRUBBssz9pFCvoh0UEcsD9ec3K19OLiiaNLEYlmoVeiCbmE+GuMl4I8AAAKQSURBVHja7d1njupQDIZhAymEUIZQQu9taN7/7q50pfl/TmTJtvQ9q3hzLDsEAAAAAAAAAACGzFjKiTS0WcqONMxZypg0fH5YyLFPChZdFnIYkILil4VcclLw3bCQ85IULM8sZPMlBfmFhfwWpGBwYCHdESnoH1nIz4c0jFnKnDTsWEqbNJxYyow03FjKlDTUKQtZqwTQXizgtgkpWGQsZKIScL0OCxmqBFC5EQugkhQshyyk0yMFgwkLyRakIGmJBdCeFPTXLCStScOUpdwogsEXrBdpuLKUJ4XDC9afKmUh94QUjLy/YGViAZRTOIMBtypJQXn2HUC5WMBleMFqILmzkLSicBZfsB6k4clSrqTh5XyEd3MeQHXqe4Qn94LVSiicwRHkJScNdVvKkgAAwI+qZdM0/AXFpE4v+AXFpKwIfkExKfR7ulyxSWkV/IJi0zx4BGbTm4IkW7ZpFjwCs2kaPAKzad0PHYHZtE1CR2A2TQahIzCbhnnwCMykVYmAi4aAQ8BZ4T3grgi4BhBwCDgbEHCNIOAQcCYg4BpCwCHgLEDAaYgPuDfbhIBrBAGHgDMhNOBo2rKpIgAA8KNoS6kplq2dsu6CFJQr30vd+dD3Uvf/nTLHS93J3flZwrHznaad852mE/veaXqw752mKvW90zTq+j5LWGS+r/J8xQKoU1AUa2chm1zlsXQWUifgkoPvgOsffQccjZ0H3Mx5wL2dB9zcecB9sJTePOBM3cU+46wiziq6C7hk6zvg3J9VfDK7vir0ch5wN+cBV6e+A27v/ccgme+AkxshTXKKYW6EFH0X29gIKTLgzI2QYgPO2ggpLuDsvaDEBZy9EVJcwBkcIT0IAAAAAAAAAADs+AdjeyF69/r87QAAAABJRU5ErkJggg==';
+const ICON_DISABLED = 'data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAMAAAADACAMAAABlApw1AAAAeFBMVEUAAAC4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7+4t7/uGGySAAAAJ3RSTlMAsGAE7OMcAQvxJRX69kHWyL8zq5GIdEcsD5zcfVg4uKLNa1JPZoK/xdPIAAACiklEQVR42u3dW5KqUAyF4QgCCggqIt7t9pb5z/Ccvjz2w95UqpJ0r28Uf2WTQAAAAAAAAAAAYMiWpTxJQ8JSTqThwVI2pKFZsJC3ghTs5izkmpKCcspCljNSkB9ZSLsnBfuWhRxzUjBbspBpSQrSKwuZr0lB8cZCFg1p2LCUB2k4sZSENNxYypY0nFlKTxqGmoUcClJwEQu4SUoKdmIBtEpJQZ6xkHeVAKqOYgFUkYL9OwvJclKQrsQCbkcK0olYAF1IQXFgIfVAGnqWcqZwFidYN4phb4L1onCYYMlPsLqUFKwxwRozwTIYcG1FCqrWdwBhgqU7wUo7FlJ7n2DdScPL+RPezfkT3tl5AA217yc89xMssYBbzUjDkEjZEwAA+NFMbOrDJygmZXnwBMWkaRk8QTFpvg6eoJi0aIInKDY9gp/AbEqCJyg2bYOfwGzqKUzPNh2K0Ccwm0IfRBK2KfSLkDvbFPog0tRsUlsh4EZAwP2SgKu9B9wdATcOAg4BZwACbgQEHALOCATcCAg4BJwVCLhREHB/LOAebFNwwC3YJATcKAi4yICjfmJTQwAA4EeZSBkojrWdsvmO4hjbKYtd6ra2Uxa71G1tp0xnqbvo+IPfpe4Nf3K703Ridr3T9OQPfnea7szseaepqX3vNH3NM/xe5fmeZ7i9yiMXQFlJEeydhYy4ymMygCICzmQAxQactbOQMQFnMoBiAs7iVaHIgDN3VSgq4AxeFYoOOGNXhbCUPkaJs4o4q/iXzyp2vgPO/VnFl/OAu/F/jq8KnZ0H3FD7DriL9x+DTH0HXJ75Driq9R1ws6XvgEuvvgOu6HwHHG18BxydnAfc03nAAQAAAAAAAADAz/4BoL2Us9XM2zMAAAAASUVORK5CYII=';
+const ICON_TYPE = 'image/x-icon';
+
 export { appError, clearAppErrorModal, emitBuildLog, emitBuildResults, emitBuildStatus, hmrWindow, initBuildProgress, initBuildStatus, logBuild, logDiagnostic, logDisabled, logReload, logWarn, onBuildLog, onBuildResults, onBuildStatus };

package/dev-server/client/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@stencil/core/dev-server/client",
-  "version": "2.18.0",
+  "version": "2.19.0",
   "description": "Stencil Dev Server Client.",
   "main": "./index.js",
   "types": "./index.d.ts",