@roots/bud-client 2024.7.3-7 → 2024.7.4-7

package/lib/hot/client.d.ts

@@ -1,4 +1,3 @@
-/// <reference types="webpack-env" />
 /**
  * Initializes bud.js HMR handling
  */

package/lib/hot/client.js

@@ -111,7 +111,7 @@ export const client = async (queryString, webpackHot) => {
             if (payload.name !== options.name)
                 return;
             window.bud.controllers.map(controller => controller?.update(payload));
-            if (payload.errors?.length > 0)
+            if (payload.errors?.length)
                 return;
             if (payload.action === `built` || payload.action === `sync`) {
                 if (isStale(payload.hash))

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

@@ -1,4 +1,3 @@
-/// <reference types="node" resolution-mode="require"/>
 /**
  * Indicator web component
  */
@@ -11,7 +10,7 @@ export declare class Component extends HTMLElement {
     /**
      * Timer
      */
-    timeout: NodeJS.Timeout;
+    timeout?: NodeJS.Timeout;
     /**
      * Component name
      */

package/lib/hot/components/indicator/indicator.component.js

@@ -24,6 +24,10 @@ export class Component extends HTMLElement {
          * Component name
          */
         this.name = `bud-activity-indicator`;
+        /**
+         * Has component rendered
+         */
+        this.rendered = false;
         this.renderShadow();
     }
     /**
@@ -32,9 +36,9 @@ export class Component extends HTMLElement {
     onError() {
         this.show();
         this.shadowRoot
-            .querySelector(this.selector)
-            .classList.remove(`warning`, `success`, `pending`);
-        this.shadowRoot.querySelector(this.selector).classList.add(`error`);
+            ?.querySelector(this.selector)
+            ?.classList.remove(`warning`, `success`, `pending`);
+        this.shadowRoot?.querySelector(this.selector)?.classList.add(`error`);
         this.hide();
     }
     /**
@@ -43,9 +47,9 @@ export class Component extends HTMLElement {
     onPending() {
         this.show();
         this.shadowRoot
-            .querySelector(this.selector)
-            .classList.remove(`error`, `warning`, `success`);
-        this.shadowRoot.querySelector(this.selector).classList.add(`pending`);
+            ?.querySelector(this.selector)
+            ?.classList.remove(`error`, `warning`, `success`);
+        this.shadowRoot?.querySelector(this.selector)?.classList.add(`pending`);
         this.hide();
     }
     /**
@@ -54,9 +58,9 @@ export class Component extends HTMLElement {
     onSuccess() {
         this.show();
         this.shadowRoot
-            .querySelector(this.selector)
-            .classList.remove(`error`, `warning`, `pending`);
-        this.shadowRoot.querySelector(this.selector).classList.add(`success`);
+            ?.querySelector(this.selector)
+            ?.classList.remove(`error`, `warning`, `pending`);
+        this.shadowRoot?.querySelector(this.selector)?.classList.add(`success`);
         this.hide();
     }
     /**
@@ -65,9 +69,9 @@ export class Component extends HTMLElement {
     onWarning() {
         this.show();
         this.shadowRoot
-            .querySelector(this.selector)
-            .classList.remove(`error`, `success`, `pending`);
-        this.shadowRoot.querySelector(this.selector).classList.add(`warning`);
+            ?.querySelector(this.selector)
+            ?.classList.remove(`error`, `success`, `pending`);
+        this.shadowRoot?.querySelector(this.selector)?.classList.add(`warning`);
         this.hide();
     }
     attributeChangedCallback() {
@@ -97,7 +101,9 @@ export class Component extends HTMLElement {
      */
     hide() {
         this.timeout = setTimeout(() => {
-            this.shadowRoot.querySelector(this.selector).classList.remove(`show`);
+            this.shadowRoot
+                ?.querySelector(this.selector)
+                ?.classList.remove(`show`);
         }, 2000);
     }
     /**
@@ -156,6 +162,6 @@ export class Component extends HTMLElement {
      */
     show() {
         this.timeout && clearTimeout(this.timeout);
-        this.shadowRoot.querySelector(this.selector).classList.add(`show`);
+        this.shadowRoot?.querySelector(this.selector)?.classList.add(`show`);
     }
 }

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

@@ -1,4 +1,3 @@
-/// <reference types="node" resolution-mode="require"/>
 /**
  * Activity indicator controller
  */
@@ -14,7 +13,7 @@ export declare class Controller {
     /**
      * Timer handler
      */
-    timer: NodeJS.Timeout;
+    timer?: NodeJS.Timeout;
     /**
      * Initialization
      */

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

@@ -35,9 +35,13 @@ export class Controller {
      * Update activity indicator
      */
     update(payload) {
-        this.node.toggleAttribute(`has-errors`, payload.errors?.length > 0);
-        this.node.toggleAttribute(`has-warnings`, payload.warnings?.length > 0);
+        if (!payload.action)
+            return;
         this.node.setAttribute(`action`, payload.action);
+        this.node.toggleAttribute(`has-errors`, payload?.errors?.length && payload.errors.length > 0 ? true : false);
+        this.node.toggleAttribute(`has-warnings`, payload?.warnings?.length && payload.warnings?.length > 0
+            ? true
+            : false);
         this.addNode();
     }
 }

package/lib/hot/events.d.ts

@@ -25,7 +25,7 @@ export declare const injectEvents: (eventSource: EventSourceFactory) => {
         /**
          * EventSource `addMessageListener` handler
          */
-        addListener(listener: Listener): this;
+        addListener(listener: Listener): any;
         onerror: (this: EventSource, ev: Event) => any;
         readonly readyState: number;
         readonly url: string;
@@ -35,10 +35,10 @@ export declare const injectEvents: (eventSource: EventSourceFactory) => {
         readonly OPEN: 1;
         readonly CLOSED: 2;
         addEventListener<K extends keyof EventSourceEventMap>(type: K, listener: (this: EventSource, ev: EventSourceEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener(type: string, listener: (this: EventSource, event: MessageEvent<any>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: (this: EventSource, event: MessageEvent) => any, options?: boolean | AddEventListenerOptions): void;
         addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
-        removeEventListener<K_1 extends keyof EventSourceEventMap>(type: K_1, listener: (this: EventSource, ev: EventSourceEventMap[K_1]) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener(type: string, listener: (this: EventSource, event: MessageEvent<any>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof EventSourceEventMap>(type: K, listener: (this: EventSource, ev: EventSourceEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: (this: EventSource, event: MessageEvent) => any, options?: boolean | EventListenerOptions): void;
         removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
         dispatchEvent(event: Event): boolean;
     };
@@ -69,7 +69,7 @@ export declare const injectEvents: (eventSource: EventSourceFactory) => {
         /**
          * EventSource `addMessageListener` handler
          */
-        addListener(listener: Listener): this;
+        addListener(listener: Listener): any;
         onerror: (this: EventSource, ev: Event) => any;
         readonly readyState: number;
         readonly url: string;
@@ -79,10 +79,10 @@ export declare const injectEvents: (eventSource: EventSourceFactory) => {
         readonly OPEN: 1;
         readonly CLOSED: 2;
         addEventListener<K extends keyof EventSourceEventMap>(type: K, listener: (this: EventSource, ev: EventSourceEventMap[K]) => any, options?: boolean | AddEventListenerOptions): void;
-        addEventListener(type: string, listener: (this: EventSource, event: MessageEvent<any>) => any, options?: boolean | AddEventListenerOptions): void;
+        addEventListener(type: string, listener: (this: EventSource, event: MessageEvent) => any, options?: boolean | AddEventListenerOptions): void;
         addEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | AddEventListenerOptions): void;
-        removeEventListener<K_1 extends keyof EventSourceEventMap>(type: K_1, listener: (this: EventSource, ev: EventSourceEventMap[K_1]) => any, options?: boolean | EventListenerOptions): void;
-        removeEventListener(type: string, listener: (this: EventSource, event: MessageEvent<any>) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener<K extends keyof EventSourceEventMap>(type: K, listener: (this: EventSource, ev: EventSourceEventMap[K]) => any, options?: boolean | EventListenerOptions): void;
+        removeEventListener(type: string, listener: (this: EventSource, event: MessageEvent) => any, options?: boolean | EventListenerOptions): void;
         removeEventListener(type: string, listener: EventListenerOrEventListenerObject, options?: boolean | EventListenerOptions): void;
         dispatchEvent(event: Event): boolean;
     };

package/lib/index.d.ts

@@ -9,6 +9,5 @@
  *
  *  @packageDocumentation
  */
-import domReady from '@roots/bud-client/dom-ready';
-import lazy from '@roots/bud-client/lazy';
-export { domReady, lazy };
+export { default as domReady } from '@roots/bud-client/dom-ready';
+export { default as lazy } from '@roots/bud-client/lazy';

package/lib/index.js

@@ -11,6 +11,5 @@
  *
  *  @packageDocumentation
  */
-import domReady from '@roots/bud-client/dom-ready';
-import lazy from '@roots/bud-client/lazy';
-export { domReady, lazy };
+export { default as domReady } from '@roots/bud-client/dom-ready';
+export { default as lazy } from '@roots/bud-client/lazy';

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@roots/bud-client",
-  "version": "2024.7.3-7",
+  "version": "2024.7.4-7",
   "description": "Client scripts for @roots/bud",
   "engines": {
     "node": ">=16"
@@ -44,11 +44,13 @@
     "src"
   ],
   "type": "module",
+  "module": "./lib/index.js",
+  "types": "./lib/index.d.ts",
   "exports": {
     ".": "./lib/index.js",
     "./dom-ready": "./lib/dom-ready.js",
     "./lazy": "./lib/lazy.js",
-    "./lib/*": "./lib/*"
+    "./lib/*": "./lib/*.js"
   },
   "typesVersions": {
     "*": {
@@ -62,20 +64,18 @@
         "./lib/lazy.d.ts"
       ],
       "lib/*": [
-        "./lib/*"
+        "./lib/*.d.ts"
       ]
     }
   },
-  "types": "./lib/index.d.ts",
-  "module": "./lib/index.mjs",
   "devDependencies": {
-    "@roots/bud": "2024.7.3-7",
+    "@roots/bud": "2024.7.4-7",
     "@skypack/package-check": "0.2.2",
-    "@types/node": "20.12.8",
-    "@types/webpack-env": "1.18.4"
+    "@types/node": "20.14.9",
+    "@types/webpack-env": "1.18.5"
   },
   "dependencies": {
-    "tslib": "2.6.2"
+    "tslib": "2.6.3"
   },
   "volta": {
     "extends": "../../../package.json"

package/src/hot/client.ts

@@ -137,7 +137,7 @@ export const client = async (
       if (payload.name !== options.name) return
       window.bud.controllers.map(controller => controller?.update(payload))
 
-      if (payload.errors?.length > 0) return
+      if (payload.errors?.length) return
 
       if (payload.action === `built` || payload.action === `sync`) {
         if (isStale(payload.hash)) return

package/src/hot/components/indicator/indicator.component.ts

@@ -20,7 +20,7 @@ export class Component extends HTMLElement {
   /**
    * Timer
    */
-  public timeout: NodeJS.Timeout
+  public timeout?: NodeJS.Timeout
 
   /**
    * Component name
@@ -30,7 +30,7 @@ export class Component extends HTMLElement {
   /**
    * Has component rendered
    */
-  public rendered: boolean
+  public rendered: boolean = false
 
   /**
    * Class constructor
@@ -47,9 +47,9 @@ export class Component extends HTMLElement {
     this.show()
 
     this.shadowRoot
-      .querySelector(this.selector)
-      .classList.remove(`warning`, `success`, `pending`)
-    this.shadowRoot.querySelector(this.selector).classList.add(`error`)
+      ?.querySelector(this.selector)
+      ?.classList.remove(`warning`, `success`, `pending`)
+    this.shadowRoot?.querySelector(this.selector)?.classList.add(`error`)
 
     this.hide()
   }
@@ -60,10 +60,10 @@ export class Component extends HTMLElement {
     this.show()
 
     this.shadowRoot
-      .querySelector(this.selector)
-      .classList.remove(`error`, `warning`, `success`)
+      ?.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()
   }
@@ -74,10 +74,10 @@ export class Component extends HTMLElement {
     this.show()
 
     this.shadowRoot
-      .querySelector(this.selector)
-      .classList.remove(`error`, `warning`, `pending`)
+      ?.querySelector(this.selector)
+      ?.classList.remove(`error`, `warning`, `pending`)
 
-    this.shadowRoot.querySelector(this.selector).classList.add(`success`)
+    this.shadowRoot?.querySelector(this.selector)?.classList.add(`success`)
 
     this.hide()
   }
@@ -88,10 +88,10 @@ export class Component extends HTMLElement {
     this.show()
 
     this.shadowRoot
-      .querySelector(this.selector)
-      .classList.remove(`error`, `success`, `pending`)
+      ?.querySelector(this.selector)
+      ?.classList.remove(`error`, `success`, `pending`)
 
-    this.shadowRoot.querySelector(this.selector).classList.add(`warning`)
+    this.shadowRoot?.querySelector(this.selector)?.classList.add(`warning`)
 
     this.hide()
   }
@@ -127,7 +127,9 @@ export class Component extends HTMLElement {
    */
   public hide() {
     this.timeout = setTimeout(() => {
-      this.shadowRoot.querySelector(this.selector).classList.remove(`show`)
+      this.shadowRoot
+        ?.querySelector(this.selector)
+        ?.classList.remove(`show`)
     }, 2000)
   }
 
@@ -190,6 +192,6 @@ export class Component extends HTMLElement {
    */
   public show() {
     this.timeout && clearTimeout(this.timeout)
-    this.shadowRoot.querySelector(this.selector).classList.add(`show`)
+    this.shadowRoot?.querySelector(this.selector)?.classList.add(`show`)
   }
 }

package/src/hot/components/indicator/indicator.controller.ts

@@ -15,7 +15,7 @@ export class Controller {
   /**
    * Timer handler
    */
-  public timer: NodeJS.Timeout
+  public timer?: NodeJS.Timeout
 
   /**
    * Initialization
@@ -49,12 +49,22 @@ export class Controller {
    * Update activity indicator
    */
   public update(payload: Payload) {
-    this.node.toggleAttribute(`has-errors`, payload.errors?.length > 0)
-
-    this.node.toggleAttribute(`has-warnings`, payload.warnings?.length > 0)
+    if (!payload.action) return
 
     this.node.setAttribute(`action`, payload.action)
 
+    this.node.toggleAttribute(
+      `has-errors`,
+      payload?.errors?.length && payload.errors.length > 0 ? true : false,
+    )
+
+    this.node.toggleAttribute(
+      `has-warnings`,
+      payload?.warnings?.length && payload.warnings?.length > 0
+        ? true
+        : false,
+    )
+
     this.addNode()
   }
 }

package/src/index.ts

@@ -13,7 +13,5 @@
  *  @packageDocumentation
  */
 
-import domReady from '@roots/bud-client/dom-ready'
-import lazy from '@roots/bud-client/lazy'
-
-export {domReady, lazy}
+export {default as domReady} from '@roots/bud-client/dom-ready'
+export {default as lazy} from '@roots/bud-client/lazy'