@roots/bud-client 6.3.5 → 6.4.1

package/LICENSE.md

@@ -12,7 +12,7 @@ copies or substantial portions of the Software.
 
 THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
 IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
-FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+FITNESS FOR A PARTICULAR PURPOSE AND NON-INFRINGEMENT. IN NO EVENT SHALL THE
 AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
 LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
 OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE

package/README.md

@@ -63,9 +63,6 @@ Help support our open-source development efforts by [becoming a patron](https://
 <a href="https://carrot.com/">
 <img src="https://cdn.roots.io/app/uploads/carrot.svg" alt="Carrot" width="200" height="150"/>
 </a>
-<a href="https://www.c21redwood.com/">
-<img src="https://cdn.roots.io/app/uploads/c21redwood.svg" alt="C21 Redwood Realty" width="200" height="150"/>
-</a>
 <a href="https://wordpress.com/">
 <img src="https://cdn.roots.io/app/uploads/wordpress.svg" alt="WordPress.com" width="200" height="150"/>
 </a>

package/lib/components/index.d.ts

@@ -0,0 +1,4 @@
+declare let controllers: Array<Controller>;
+declare const make: (options: Options) => Promise<Array<Controller>>;
+export { controllers, make };
+//# sourceMappingURL=index.d.ts.map

package/lib/components/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/components/index.ts"],"names":[],"mappings":"AAAA,QAAA,IAAI,WAAW,EAAE,KAAK,CAAC,UAAU,CAAM,CAAA;AAEvC,QAAA,MAAM,IAAI,EAAE,CACV,OAAO,EAAE,OAAO,KACb,OAAO,CAAC,KAAK,CAAC,UAAU,CAAC,CAc7B,CAAA;AAED,OAAO,EAAC,WAAW,EAAE,IAAI,EAAC,CAAA"}

package/lib/components/index.js

@@ -0,0 +1,49 @@
+"use strict";
+var __createBinding = (this && this.__createBinding) || (Object.create ? (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    var desc = Object.getOwnPropertyDescriptor(m, k);
+    if (!desc || ("get" in desc ? !m.__esModule : desc.writable || desc.configurable)) {
+      desc = { enumerable: true, get: function() { return m[k]; } };
+    }
+    Object.defineProperty(o, k2, desc);
+}) : (function(o, m, k, k2) {
+    if (k2 === undefined) k2 = k;
+    o[k2] = m[k];
+}));
+var __setModuleDefault = (this && this.__setModuleDefault) || (Object.create ? (function(o, v) {
+    Object.defineProperty(o, "default", { enumerable: true, value: v });
+}) : function(o, v) {
+    o["default"] = v;
+});
+var __importStar = (this && this.__importStar) || function (mod) {
+    if (mod && mod.__esModule) return mod;
+    var result = {};
+    if (mod != null) for (var k in mod) if (k !== "default" && Object.prototype.hasOwnProperty.call(mod, k)) __createBinding(result, mod, k);
+    __setModuleDefault(result, mod);
+    return result;
+};
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.make = exports.controllers = void 0;
+let controllers = [];
+exports.controllers = controllers;
+const make = (options) => __awaiter(void 0, void 0, void 0, function* () {
+    if (options.indicator && !customElements.get(`bud-activity-indicator`)) {
+        yield Promise.resolve().then(() => __importStar(require(`./indicator/index.js`))).then((controller) => __awaiter(void 0, void 0, void 0, function* () { return yield controller.make(); }))
+            .then(controller => controllers.push(controller));
+    }
+    if (options.overlay && !customElements.get(`bud-error`)) {
+        yield Promise.resolve().then(() => __importStar(require(`./overlay/index.js`))).then((controller) => __awaiter(void 0, void 0, void 0, function* () { return yield controller.make(); }))
+            .then(controller => controllers.push(controller));
+    }
+    return controllers;
+});
+exports.make = make;

package/lib/components/{overlay/index.d.cts → indicator/index.d.ts}

@@ -1,4 +1,4 @@
 export declare const make: () => Promise<{
     update: (data: any) => void;
 }>;
-//# sourceMappingURL=index.d.cts.map
+//# sourceMappingURL=index.d.ts.map

package/lib/components/indicator/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/indicator/index.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,IAAI;2BAAwC,IAAI;EAM5D,CAAA"}

package/lib/components/indicator/index.js

@@ -0,0 +1,21 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.make = void 0;
+const indicator_component_js_1 = require("./indicator.component.js");
+const indicator_controller_js_1 = require("./indicator.controller.js");
+const make = () => __awaiter(void 0, void 0, void 0, function* () {
+    if (customElements.get(`bud-activity-indicator`))
+        return;
+    customElements.define(`bud-activity-indicator`, indicator_component_js_1.Component);
+    return new indicator_controller_js_1.Controller();
+});
+exports.make = make;

package/lib/components/indicator/{indicator.component.d.cts → indicator.component.d.ts}

@@ -24,11 +24,6 @@ export declare class Component extends HTMLElement {
      * @public
      */
     hideTimeout: NodeJS.Timer;
-    /**
-     * hmr status payload
-     * @public
-     */
-    payload: any;
     /**
      * Get accessor: has errors
      * @public
@@ -44,6 +39,11 @@ export declare class Component extends HTMLElement {
      * @public
      */
     colors: Record<string, [number, number, number, number]>;
+    /**
+     * Class constructor
+     * @public
+     */
+    constructor();
     /**
      * Render status indicator
      * @public
@@ -80,6 +80,5 @@ export declare class Component extends HTMLElement {
     onWarning(): void;
     static get observedAttributes(): string[];
     attributeChangedCallback(): void;
-    connectedCallback(): void;
 }
-//# sourceMappingURL=indicator.component.d.cts.map
+//# sourceMappingURL=indicator.component.d.ts.map

package/lib/components/indicator/indicator.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"indicator.component.d.ts","sourceRoot":"","sources":["../../../src/components/indicator/indicator.component.ts"],"names":[],"mappings":";AAEA;;;GAGG;AACH,qBAAa,SAAU,SAAQ,WAAW;IACxC;;;OAGG;IACI,QAAQ,EAAE,OAAO,CAAA;IAExB;;;OAGG;IACI,IAAI,EAAE,MAAM,CAA2B;IAE9C;;;OAGG;IACH,IAAW,QAAQ,WAElB;IAED;;;OAGG;IACI,WAAW,EAAE,MAAM,CAAC,KAAK,CAAA;IAEhC;;;OAGG;IACH,IAAW,SAAS,IAAI,OAAO,CAE9B;IAED;;;OAGG;IACH,IAAW,WAAW,IAAI,OAAO,CAEhC;IAED;;;OAGG;IACI,MAAM,EAAE,MAAM,CAAC,MAAM,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,CAAC,CAK9D;IAED;;;OAGG;;IAMH;;;OAGG;IACI,YAAY;IA4CnB;;;OAGG;IACI,IAAI;IAKX;;OAEG;IACI,IAAI;IAMX;;;OAGG;IACI,SAAS;IAYhB;;;OAGG;IACI,SAAS;IAYhB;;;OAGG;IACI,OAAO;IASd;;;OAGG;IACI,SAAS;IAUhB,WAAkB,kBAAkB,aAEnC;IAEM,wBAAwB;CAiBhC"}

package/lib/components/indicator/{indicator.component.cjs → indicator.component.js}

@@ -1,14 +1,18 @@
 "use strict";
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Component = void 0;
-const indicator_pulse_cjs_1 = require("./indicator.pulse.cjs");
+const indicator_pulse_js_1 = require("./indicator.pulse.js");
 /**
  * Indicator web component
  * @public
  */
 class Component extends HTMLElement {
+    /**
+     * Class constructor
+     * @public
+     */
     constructor() {
-        super(...arguments);
+        super();
         /**
          * Component name
          * @public
@@ -24,6 +28,7 @@ class Component extends HTMLElement {
             warn: [252, 211, 77, 1],
             pending: [59, 130, 246, 1],
         };
+        this.renderShadow();
     }
     /**
      * Root div querySelector selector
@@ -37,21 +42,21 @@ class Component extends HTMLElement {
      * @public
      */
     get hasErrors() {
-        return this.getAttribute('has-errors') == 'true';
+        return this.getAttribute(`has-errors`) == `true`;
     }
     /**
      * Get accessor: has warnings
      * @public
      */
     get hasWarnings() {
-        return this.getAttribute('has-warnings') == 'true';
+        return this.getAttribute(`has-warnings`) == `true`;
     }
     /**
      * Render status indicator
      * @public
      */
     renderShadow() {
-        const container = document.createElement('div');
+        const container = document.createElement(`div`);
         container.classList.add(this.name);
         container.innerHTML = `
     <style>
@@ -83,14 +88,14 @@ class Component extends HTMLElement {
         all .6s ease-in-out;
     }
 
-    ${(0, indicator_pulse_cjs_1.pulse)(`success`, this.colors.success)}
-    ${(0, indicator_pulse_cjs_1.pulse)(`error`, this.colors.error)}
-    ${(0, indicator_pulse_cjs_1.pulse)(`warning`, this.colors.warn)}
-    ${(0, indicator_pulse_cjs_1.pulse)(`pending`, this.colors.pending)}
+    ${(0, indicator_pulse_js_1.pulse)(`success`, this.colors.success)}
+    ${(0, indicator_pulse_js_1.pulse)(`error`, this.colors.error)}
+    ${(0, indicator_pulse_js_1.pulse)(`warning`, this.colors.warn)}
+    ${(0, indicator_pulse_js_1.pulse)(`pending`, this.colors.pending)}
 
     </style>
     `;
-        this.attachShadow({ mode: 'open' }).appendChild(container);
+        this.attachShadow({ mode: `open` }).appendChild(container);
     }
     /**
      * Show status indicator
@@ -98,14 +103,14 @@ class Component extends HTMLElement {
      */
     show() {
         this.hideTimeout && clearTimeout(this.hideTimeout);
-        this.shadowRoot.querySelector(this.selector).classList.add('show');
+        this.shadowRoot.querySelector(this.selector).classList.add(`show`);
     }
     /**
      * Hide status indicator
      */
     hide() {
         this.hideTimeout = setTimeout(() => {
-            this.shadowRoot.querySelector(this.selector).classList.remove('show');
+            this.shadowRoot.querySelector(this.selector).classList.remove(`show`);
         }, 2000);
     }
     /**
@@ -117,7 +122,7 @@ class Component extends HTMLElement {
         this.shadowRoot
             .querySelector(this.selector)
             .classList.remove(`error`, `warning`, `success`);
-        this.shadowRoot.querySelector(this.selector).classList.add('pending');
+        this.shadowRoot.querySelector(this.selector).classList.add(`pending`);
         this.hide();
     }
     /**
@@ -155,28 +160,20 @@ class Component extends HTMLElement {
         this.shadowRoot.querySelector(this.selector).classList.add(`warning`);
     }
     static get observedAttributes() {
-        return ['has-errors', 'has-warnings', 'action'];
+        return [`has-errors`, `has-warnings`, `action`];
     }
     attributeChangedCallback() {
-        var _a, _b, _c, _d, _e, _f, _g, _h, _j, _k;
-        if ((_b = (_a = this.payload) === null || _a === void 0 ? void 0 : _a.errors) === null || _b === void 0 ? void 0 : _b.length)
+        if (this.hasAttribute(`has-errors`))
             return this.onError();
-        if ((_d = (_c = this.payload) === null || _c === void 0 ? void 0 : _c.warnings) === null || _d === void 0 ? void 0 : _d.length)
+        if (this.hasAttribute(`has-warnings`))
             return this.onWarning();
-        if (!((_f = (_e = this.payload) === null || _e === void 0 ? void 0 : _e.errors) === null || _f === void 0 ? void 0 : _f.length) &&
-            !((_h = (_g = this.payload) === null || _g === void 0 ? void 0 : _g.warnings) === null || _h === void 0 ? void 0 : _h.length) &&
-            this.payload.action == 'built')
+        if (!this.hasAttribute(`has-errors`) &&
+            !this.hasAttribute(`has-warnings`) &&
+            this.getAttribute(`action`) === `built`)
             return this.onSuccess();
-        if (((_j = this.payload) === null || _j === void 0 ? void 0 : _j.action) == 'building' ||
-            ((_k = this.payload) === null || _k === void 0 ? void 0 : _k.action) == 'sync')
+        if (this.getAttribute(`action`) == `building` ||
+            this.getAttribute(`action`) == `sync`)
             return this.onPending();
     }
-    connectedCallback() {
-        if (!this.rendered) {
-            this.renderShadow();
-            this.rendered = true;
-        }
-    }
 }
 exports.Component = Component;
-//# sourceMappingURL=indicator.component.cjs.map

package/lib/components/indicator/indicator.controller.d.ts

@@ -0,0 +1,45 @@
+/// <reference types="node" />
+/**
+ * Activity indicator controller
+ * @public
+ */
+export declare class Controller {
+    /**
+     * DOM node
+     * @public
+     */
+    node: HTMLElement;
+    /**
+     * Active WHM payload
+     * @public
+     */
+    payload: any;
+    /**
+     * Timer handler
+     * @public
+     */
+    timer: NodeJS.Timeout;
+    /**
+     * Initialization
+     * @public
+     */
+    constructor();
+    /**
+     * Append `bud-error` element to the DOM
+     *
+     * @public
+     */
+    addNode(): void;
+    /**
+     * Remove `bud-error` element from the DOM (if present)
+     *
+     * @public
+     */
+    removeNode(): void;
+    /**
+     * Update activity indicator
+     * @public
+     */
+    update(payload: Payload): void;
+}
+//# sourceMappingURL=indicator.controller.d.ts.map

package/lib/components/indicator/indicator.controller.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"indicator.controller.d.ts","sourceRoot":"","sources":["../../../src/components/indicator/indicator.controller.ts"],"names":[],"mappings":";AAAA;;;GAGG;AACH,qBAAa,UAAU;IACrB;;;OAGG;IACI,IAAI,EAAE,WAAW,CAAA;IAExB;;;OAGG;IACI,OAAO,MAAO;IAErB;;;OAGG;IACI,KAAK,EAAE,MAAM,CAAC,OAAO,CAAA;IAE5B;;;OAGG;;IAMH;;;;OAIG;IACI,OAAO;IAUd;;;;OAIG;IACI,UAAU;IAIjB;;;OAGG;IACI,MAAM,CAAC,OAAO,EAAE,OAAO;CAe/B"}

package/lib/components/indicator/indicator.controller.js

@@ -0,0 +1,58 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.Controller = void 0;
+/**
+ * Activity indicator controller
+ * @public
+ */
+class Controller {
+    /**
+     * Initialization
+     * @public
+     */
+    constructor() {
+        /**
+         * Active WHM payload
+         * @public
+         */
+        this.payload = null;
+        this.node = document.createElement(`bud-activity-indicator`);
+        this.update = this.update.bind(this);
+    }
+    /**
+     * Append `bud-error` element to the DOM
+     *
+     * @public
+     */
+    addNode() {
+        var _a;
+        if (document.body.querySelector(`bud-activity-indicator`)) {
+            if (typeof this.timer.unref === `function`)
+                this.timer.unref();
+            this.removeNode();
+        }
+        (_a = document.body) === null || _a === void 0 ? void 0 : _a.appendChild(this.node);
+        this.timer = setTimeout(this.removeNode, 3000);
+    }
+    /**
+     * Remove `bud-error` element from the DOM (if present)
+     *
+     * @public
+     */
+    removeNode() {
+        var _a;
+        (_a = document.body.querySelector(`bud-activity-indicator`)) === null || _a === void 0 ? void 0 : _a.remove();
+    }
+    /**
+     * Update activity indicator
+     * @public
+     */
+    update(payload) {
+        var _a, _b;
+        this.node.toggleAttribute(`has-errors`, ((_a = payload.errors) === null || _a === void 0 ? void 0 : _a.length) ? true : false);
+        this.node.toggleAttribute(`has-warnings`, ((_b = payload.warnings) === null || _b === void 0 ? void 0 : _b.length) ? true : false);
+        this.node.setAttribute(`action`, payload.action);
+        this.addNode();
+    }
+}
+exports.Controller = Controller;

package/lib/components/indicator/{indicator.pulse.d.cts → indicator.pulse.d.ts}

@@ -6,4 +6,4 @@ export interface pulse {
  * @public
  */
 export declare const pulse: (name: string, color: [number, number, number, number]) => string;
-//# sourceMappingURL=indicator.pulse.d.cts.map
+//# sourceMappingURL=indicator.pulse.d.ts.map

package/lib/components/indicator/indicator.pulse.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"indicator.pulse.d.ts","sourceRoot":"","sources":["../../../src/components/indicator/indicator.pulse.ts"],"names":[],"mappings":"AAAA,MAAM,WAAW,KAAK;IACpB,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,EAAE,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,GAAG,MAAM,CAAA;CACxD;AAED;;;GAGG;AACH,eAAO,MAAM,KAAK,SACV,MAAM,SACL,CAAC,MAAM,EAAE,MAAM,EAAE,MAAM,EAAE,MAAM,CAAC,KACtC,MA+BF,CAAA"}

package/lib/components/indicator/{indicator.pulse.cjs → indicator.pulse.js}

@@ -38,4 +38,3 @@ const pulse = (name, color) => `
   }
 `;
 exports.pulse = pulse;
-//# sourceMappingURL=indicator.pulse.cjs.map

package/lib/components/{indicator/index.d.cts → overlay/index.d.ts}

@@ -1,4 +1,4 @@
 export declare const make: () => Promise<{
     update: (data: any) => void;
 }>;
-//# sourceMappingURL=index.d.cts.map
+//# sourceMappingURL=index.d.ts.map

package/lib/components/overlay/index.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/components/overlay/index.ts"],"names":[],"mappings":"AAGA,eAAO,MAAM,IAAI;2BAAwC,IAAI;EAM5D,CAAA"}

package/lib/components/overlay/index.js

@@ -0,0 +1,21 @@
+"use strict";
+var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, generator) {
+    function adopt(value) { return value instanceof P ? value : new P(function (resolve) { resolve(value); }); }
+    return new (P || (P = Promise))(function (resolve, reject) {
+        function fulfilled(value) { try { step(generator.next(value)); } catch (e) { reject(e); } }
+        function rejected(value) { try { step(generator["throw"](value)); } catch (e) { reject(e); } }
+        function step(result) { result.done ? resolve(result.value) : adopt(result.value).then(fulfilled, rejected); }
+        step((generator = generator.apply(thisArg, _arguments || [])).next());
+    });
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.make = void 0;
+const overlay_component_js_1 = require("./overlay.component.js");
+const overlay_controller_js_1 = require("./overlay.controller.js");
+const make = () => __awaiter(void 0, void 0, void 0, function* () {
+    if (customElements.get(`bud-error`))
+        return;
+    customElements.define(`bud-error`, overlay_component_js_1.Component);
+    return new overlay_controller_js_1.Controller();
+});
+exports.make = make;

package/lib/components/overlay/{overlay.component.d.cts → overlay.component.d.ts}

@@ -19,4 +19,4 @@ export declare class Component extends HTMLElement {
     attributeChangedCallback(): void;
     connectedCallback(): void;
 }
-//# sourceMappingURL=overlay.component.d.cts.map
+//# sourceMappingURL=overlay.component.d.ts.map

package/lib/components/overlay/overlay.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"overlay.component.d.ts","sourceRoot":"","sources":["../../../src/components/overlay/overlay.component.ts"],"names":[],"mappings":"AAAA;;;;GAIG;AACH,qBAAa,SAAU,SAAQ,WAAW;IACjC,IAAI,EAAE,MAAM,CAAgB;IAEnC;;;;OAIG;IACI,OAAO,EAAE,GAAG,CAAA;IAEZ,iBAAiB,EAAE,GAAG,CAAA;IAE7B,IAAW,OAAO,WAEjB;;IAOM,YAAY,IAAI,IAAI;IA+G3B,WAAkB,kBAAkB,aAEnC;IAEM,wBAAwB;IAsBxB,iBAAiB;CAGzB"}

package/lib/components/overlay/{overlay.component.cjs → overlay.component.js}

@@ -13,11 +13,11 @@ class Component extends HTMLElement {
         this.renderShadow();
     }
     get message() {
-        return this.getAttribute('message');
+        return this.getAttribute(`message`);
     }
     renderShadow() {
-        const container = document.createElement('div');
-        container.classList.add('overlay');
+        const container = document.createElement(`div`);
+        container.classList.add(`overlay`);
         container.innerHTML = `
       <style>
         .overlay {
@@ -39,18 +39,20 @@ class Component extends HTMLElement {
         }
 
         .visible {
-          border-top: 5px solid red;
+          position: fixed;
           top: 0;
+          z-index: 9998;
           opacity: 1;
+          border-top: 5px solid red;
           transition: opacity 0.2s ease-in-out, border 0.4s ease-in-out;
-          z-index: 9998;
           max-width: 100vw;
         }
 
         .messages {
           background-color: white;
           border-radius: 5px;
-          filter: drop-shadow(0 1px 2px rgb(0 0 0 / 0.1)) drop-shadow(0 1px 1px rgb(0 0 0 / 0.06));          display: flex;
+          filter: drop-shadow(0 1px 2px rgb(0 0 0 / 0.1)) drop-shadow(0 1px 1px rgb(0 0 0 / 0.06));
+          display: flex;
           align-self: center;
           width: 800px;
           max-width: 90vw;
@@ -85,12 +87,6 @@ class Component extends HTMLElement {
           max-width:95vw;
         }
 
-        .messages > div > span {
-          font-size: 1.2rem;
-          line-height: 2rem;
-          font-weight: 300;
-        }
-
         .messages > div > pre {
           font-weight: 300;
           font-size: 0.8rem;
@@ -126,26 +122,26 @@ class Component extends HTMLElement {
       </style>
       <div class="messages"></div>
     `;
-        this.attachShadow({ mode: 'open' }).appendChild(container);
+        this.attachShadow({ mode: `open` }).appendChild(container);
     }
     static get observedAttributes() {
-        return ['message'];
+        return [`message`];
     }
     attributeChangedCallback() {
         var _a, _b, _c;
         if (!this.documentBodyStyle)
             this.documentBodyStyle = (_a = document.body) === null || _a === void 0 ? void 0 : _a.style;
-        if (this.getAttribute('message')) {
-            document.body.style.overflow = 'hidden';
-            this.shadowRoot.querySelector('.overlay').classList.add(`visible`);
-            this.shadowRoot.querySelector('.messages').innerHTML =
-                this.getAttribute('message');
+        if (this.getAttribute(`message`)) {
+            document.body.style.overflow = `hidden`;
+            this.shadowRoot.querySelector(`.overlay`).classList.add(`visible`);
+            this.shadowRoot.querySelector(`.messages`).innerHTML =
+                this.getAttribute(`message`);
             return;
         }
         if (((_b = this.documentBodyStyle) === null || _b === void 0 ? void 0 : _b.overflow) && ((_c = document === null || document === void 0 ? void 0 : document.body) === null || _c === void 0 ? void 0 : _c.style)) {
             document.body.style.overflow = this.documentBodyStyle.overflow;
         }
-        this.shadowRoot.querySelector('.overlay').classList.remove(`visible`);
+        this.shadowRoot.querySelector(`.overlay`).classList.remove(`visible`);
     }
     connectedCallback() {
         var _a;
@@ -154,4 +150,3 @@ class Component extends HTMLElement {
     }
 }
 exports.Component = Component;
-//# sourceMappingURL=overlay.component.cjs.map

package/lib/components/overlay/{overlay.controller.d.cts → overlay.controller.d.ts}

@@ -1,8 +1,3 @@
-import type Webpack from 'webpack';
-interface Payload {
-    hash: string;
-    errors: Array<Webpack.StatsError>;
-}
 /**
  * Overlay controller
  * @public
@@ -48,5 +43,4 @@ export declare class Controller {
      */
     update(payload: Payload): void;
 }
-export {};
-//# sourceMappingURL=overlay.controller.d.cts.map
+//# sourceMappingURL=overlay.controller.d.ts.map

package/lib/components/overlay/overlay.controller.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"overlay.controller.d.ts","sourceRoot":"","sources":["../../../src/components/overlay/overlay.controller.ts"],"names":[],"mappings":"AAEA;;;GAGG;AACH,qBAAa,UAAU;IACrB;;;OAGG;IACI,OAAO,EAAE,WAAW,CAAA;IAE3B;;;OAGG;IACI,OAAO,EAAE,OAAO,CAAA;IAEvB;;;OAGG;IACH,IAAW,OAAO,IAAI,MAAM,CAQ3B;IAED;;;;OAIG;;IAMH;;;;OAIG;IACI,WAAW;IAKlB;;;;OAIG;IACI,WAAW;IAIlB;;;;OAIG;IACI,MAAM,CAAC,OAAO,EAAE,OAAO,GAAG,IAAI;CAWtC"}

package/lib/components/overlay/{overlay.controller.cjs → overlay.controller.js}

@@ -1,7 +1,10 @@
 "use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
 Object.defineProperty(exports, "__esModule", { value: true });
 exports.Controller = void 0;
-const stripAnsi = require("strip-ansi");
+const strip_ansi_1 = __importDefault(require("strip-ansi"));
 /**
  * Overlay controller
  * @public
@@ -14,7 +17,7 @@ class Controller {
      */
     constructor() {
         this.update = this.update.bind(this);
-        this.element = document.createElement('bud-error');
+        this.element = document.createElement(`bud-error`);
     }
     /**
      * Formatted error message
@@ -23,11 +26,10 @@ class Controller {
     get message() {
         var _a;
         return (_a = this.payload.errors) === null || _a === void 0 ? void 0 : _a.reduce((a, c) => {
-            var _a, _b;
+            var _a;
             return `${a}
         <div>
-          <span>${(_a = c === null || c === void 0 ? void 0 : c.title) !== null && _a !== void 0 ? _a : 'Compilation error'}</span>
-          <pre>${(_b = stripAnsi.default(c === null || c === void 0 ? void 0 : c.message)) !== null && _b !== void 0 ? _b : ''}</pre>
+          <pre>${(_a = (0, strip_ansi_1.default)(c === null || c === void 0 ? void 0 : c.message)) !== null && _a !== void 0 ? _a : ``}</pre>
         </div>`;
         }, ``);
     }
@@ -38,7 +40,7 @@ class Controller {
      */
     createError() {
         var _a;
-        !document.body.querySelector('bud-error') &&
+        !document.body.querySelector(`bud-error`) &&
             ((_a = document.body) === null || _a === void 0 ? void 0 : _a.appendChild(this.element));
     }
     /**
@@ -48,7 +50,7 @@ class Controller {
      */
     removeError() {
         var _a;
-        (_a = document.body.querySelector('bud-error')) === null || _a === void 0 ? void 0 : _a.remove();
+        (_a = document.body.querySelector(`bud-error`)) === null || _a === void 0 ? void 0 : _a.remove();
     }
     /**
      * Update DOM
@@ -58,12 +60,11 @@ class Controller {
     update(payload) {
         var _a, _b;
         this.payload = payload;
-        this.element.setAttribute('message', (_a = this.message) !== null && _a !== void 0 ? _a : ``);
-        if ((_b = this.payload.errors) === null || _b === void 0 ? void 0 : _b.length) {
+        this.element.setAttribute(`message`, (_a = this.message) !== null && _a !== void 0 ? _a : ``);
+        if (((_b = this.payload.errors) === null || _b === void 0 ? void 0 : _b.length) > 0) {
             return this.createError();
         }
         this.removeError();
     }
 }
 exports.Controller = Controller;
-//# sourceMappingURL=overlay.controller.cjs.map