@hkdigital/lib-core 0.4.26 → 0.4.27

package/dist/network/loaders/audio/AudioScene.svelte.d.ts

@@ -22,10 +22,21 @@ export default class AudioScene {
         sourcesLoaded: number;
         numberOfSources: number;
     };
+    /**
+     * Get audio scene abort progress
+     */
+    get abortProgress(): {
+        sourcesAborted: number;
+        numberOfSources: number;
+    };
     /**
      * Start loading all audio sources
      */
     load(): void;
+    /**
+     * Abort loading all audio sources
+     */
+    abort(): void;
     destroy(): void;
     /**
      * Add in-memory audio source

package/dist/network/loaders/audio/AudioScene.svelte.js

@@ -6,8 +6,13 @@ import {
 	STATE_INITIAL,
 	STATE_LOADING,
 	STATE_LOADED,
+	STATE_ABORTING,
+	STATE_ABORTED,
+	STATE_ERROR,
 	LOAD,
-	LOADED
+	LOADED,
+	ABORT,
+	ABORTED
 } from '../../../state/machines.js';
 
 import AudioLoader from './AudioLoader.svelte.js';
@@ -83,6 +88,27 @@ export default class AudioScene {
 		};
 	});
 
+	#abortProgress = $derived.by(() => {
+		let sourcesAborted = 0;
+		const sources = this.#memorySources;
+		const numberOfSources = sources.length;
+
+		for (let j = 0; j < numberOfSources; j++) {
+			const source = sources[j];
+			const { audioLoader } = source;
+			const loaderState = audioLoader.state;
+
+			if (loaderState === STATE_ABORTED || loaderState === STATE_ERROR) {
+				sourcesAborted++;
+			}
+		} // end for
+
+		return {
+			sourcesAborted,
+			numberOfSources
+		};
+	});
+
 	/**
 	 * Construct AudioScene
 	 */
@@ -105,6 +131,17 @@ export default class AudioScene {
 			}
 		});
 
+		$effect(() => {
+			if (state.current === STATE_ABORTING) {
+				const { sourcesAborted, numberOfSources } = this.#abortProgress;
+
+				if (sourcesAborted === numberOfSources) {
+					// console.debug(`AudioScene: ${numberOfSources} sources aborted`);
+					this.#state.send(ABORTED);
+				}
+			}
+		});
+
 		state.onenter = ( currentState ) => {
       // console.log('onenter', currentState );
 
@@ -113,6 +150,11 @@ export default class AudioScene {
 				// console.log('AudioScene:loading');
 				this.#startLoading();
 			}
+			else if(currentState === STATE_ABORTING )
+			{
+				// console.log('AudioScene:aborting');
+				this.#startAbort();
+			}
 
 			this.state = state.current;
 		};
@@ -127,6 +169,13 @@ export default class AudioScene {
     return this.#progress;
   }
 
+	/**
+	 * Get audio scene abort progress
+	 */
+	get abortProgress() {
+		return this.#abortProgress;
+	}
+
 	/**
 	 * Start loading all audio sources
 	 */
@@ -134,6 +183,13 @@ export default class AudioScene {
 		this.#state.send(LOAD);
 	}
 
+	/**
+	 * Abort loading all audio sources
+	 */
+	abort() {
+		this.#state.send(ABORT);
+	}
+
 	destroy() {
 		// TODO: disconnect all audio sources?
 		// TODO: Unload AUdioLoaders?
@@ -212,6 +268,14 @@ export default class AudioScene {
 		}
 	}
 
+	#startAbort() {
+		// console.log('#startAbort');
+
+		for (const { audioLoader } of this.#memorySources) {
+			audioLoader.abort();
+		}
+	}
+
 	/* ==== Audio specific */
 
 	/**

package/dist/network/loaders/image/ImageScene.svelte.d.ts

@@ -19,10 +19,21 @@ export default class ImageScene {
         sourcesLoaded: number;
         numberOfSources: number;
     };
+    /**
+     * Get image scene abort progress
+     */
+    get abortProgress(): {
+        sourcesAborted: number;
+        numberOfSources: number;
+    };
     /**
      * Start loading all image sources
      */
     load(): void;
+    /**
+     * Abort loading all image sources
+     */
+    abort(): void;
     destroy(): void;
     /**
      * Add image source

package/dist/network/loaders/image/ImageScene.svelte.js

@@ -8,8 +8,13 @@ import {
   STATE_INITIAL,
   STATE_LOADING,
   STATE_LOADED,
+  STATE_ABORTING,
+  STATE_ABORTED,
+  STATE_ERROR,
   LOAD,
-  LOADED
+  LOADED,
+  ABORT,
+  ABORTED
 } from '../../../state/machines.js';
 
 import ImageLoader from './ImageLoader.svelte.js';
@@ -70,6 +75,27 @@ export default class ImageScene {
     };
   });
 
+  #abortProgress = $derived.by(() => {
+    let sourcesAborted = 0;
+    const sources = this.#imageSources;
+    const numberOfSources = sources.length;
+
+    for (let j = 0; j < numberOfSources; j++) {
+      const source = sources[j];
+      const { imageLoader } = source;
+      const loaderState = imageLoader.state;
+
+      if (loaderState === STATE_ABORTED || loaderState === STATE_ERROR) {
+        sourcesAborted++;
+      }
+    } // end for
+
+    return {
+      sourcesAborted,
+      numberOfSources
+    };
+  });
+
   #sourcesLoaded = $derived( this.#progress.sourcesLoaded );
   #numberOfSources = $derived( this.#progress.numberOfSources );
 
@@ -88,6 +114,17 @@ export default class ImageScene {
       }
     } );
 
+    $effect(() => {
+      if (state.current === STATE_ABORTING) {
+        const { sourcesAborted, numberOfSources } = this.#abortProgress;
+
+        if (sourcesAborted === numberOfSources) {
+          // console.debug(`ImageScene: ${numberOfSources} sources aborted`);
+          this.#state.send(ABORTED);
+        }
+      }
+    });
+
     state.onenter = ( currentState ) => {
       // console.log('onenter', currentState );
 
@@ -96,6 +133,11 @@ export default class ImageScene {
         // console.log('ImageScene:loading');
         this.#startLoading();
       }
+      else if(currentState === STATE_ABORTING )
+      {
+        // console.log('ImageScene:aborting');
+        this.#startAbort();
+      }
 
       this.state = currentState;
     };
@@ -110,6 +152,13 @@ export default class ImageScene {
     return this.#progress;
   }
 
+  /**
+   * Get image scene abort progress
+   */
+  get abortProgress() {
+    return this.#abortProgress;
+  }
+
   /**
    * Start loading all image sources
    */
@@ -117,6 +166,13 @@ export default class ImageScene {
     this.#state.send(LOAD);
   }
 
+  /**
+   * Abort loading all image sources
+   */
+  abort() {
+    this.#state.send(ABORT);
+  }
+
   destroy() {
     // TODO: disconnect all image sources?
     // TODO: Unload ImageLoaders?
@@ -191,6 +247,12 @@ export default class ImageScene {
     }
   }
 
+  #startAbort() {
+    for (const { imageLoader } of this.#imageSources) {
+      imageLoader.abort();
+    }
+  }
+
   /* ==== Internals */
 
   /**

package/dist/network/states/NetworkLoader.svelte.d.ts

@@ -45,9 +45,9 @@ export default class NetworkLoader {
     /**
      * Abort the current loading operation
      * - Only works when in STATE_LOADING
-     * - Aborts network requests and transitions to STATE_CANCELLED
+     * - Aborts network requests and transitions to STATE_ABORTING
      */
-    doAbort(): void;
+    abort(): void;
     /**
      * Get network data size in bytes
      * - Info comes from the content length response header

package/dist/network/states/NetworkLoader.svelte.js

@@ -7,14 +7,14 @@ import {
   STATE_LOADING,
   STATE_UNLOADING,
   STATE_LOADED,
-  STATE_CANCELLED,
-  STATE_ERROR,
+  STATE_ABORTING,
   LOAD,
   ERROR,
   LOADED,
   UNLOAD,
   INITIAL,
-  CANCEL
+  ABORT,
+  ABORTED
 } from '../../state/machines.js';
 
 import * as expect from '../../util/expect.js';
@@ -123,21 +123,23 @@ export default class NetworkLoader {
           }
           break;
 
-        case STATE_CANCELLED:
+        case STATE_ABORTING:
           {
-            // console.log('NetworkLoader:cancelled');
+            // console.log('NetworkLoader:aborting');
             if (this._abortLoading) {
               this._abortLoading();
               this._abortLoading = null;
             }
+            // Transition to aborted state after abort completes
+            this._state.send(ABORTED);
           }
           break;
 
-        case STATE_ERROR:
-          {
-            console.log('NetworkLoader:error', state.error);
-          }
-          break;
+        // case STATE_ERROR:
+        //   {
+        //     console.log('NetworkLoader:error', state.error);
+        //   }
+        //   break;
       } // end switch
     };
   }
@@ -160,10 +162,10 @@ export default class NetworkLoader {
   /**
    * Abort the current loading operation
    * - Only works when in STATE_LOADING
-   * - Aborts network requests and transitions to STATE_CANCELLED
+   * - Aborts network requests and transitions to STATE_ABORTING
    */
-  doAbort() {
-    this._state.send(CANCEL);
+  abort() {
+    this._state.send(ABORT);
   }
 
   /**

package/dist/state/machines/loading-state-machine/LoadingStateMachine.svelte.d.ts

@@ -10,13 +10,13 @@ export default class LoadingStateMachine extends FiniteStateMachine {
      * - Only valid when currently loading
      * - Useful for external timeout management
      */
-    doTimeout(): void;
+    timeout(): void;
     /**
-     * Transition to cancelled state
+     * Transition to aborting state
      * - Only valid when currently loading
-     * - Useful for external cancellation management
+     * - Useful for external abort management
      */
-    doCancel(): void;
+    abort(): void;
     #private;
 }
 import FiniteStateMachine from '../finite-state-machine/FiniteStateMachine.svelte.js';

package/dist/state/machines/loading-state-machine/LoadingStateMachine.svelte.js

@@ -8,14 +8,16 @@ import {
   STATE_LOADING,
   STATE_UNLOADING,
   STATE_LOADED,
-  STATE_CANCELLED,
+  STATE_ABORTING,
+  STATE_ABORTED,
   STATE_ERROR,
   STATE_TIMEOUT,
 
   // > Signals
   INITIAL,
   LOAD,
-  CANCEL,
+  ABORT,
+  ABORTED,
   ERROR,
   LOADED,
   UNLOAD,
@@ -41,7 +43,7 @@ export default class LoadingStateMachine extends FiniteStateMachine {
         // _enter: () => {
         //   console.log('LoadingStateMachine: enter LOADING');
         // },
-        [CANCEL]: STATE_CANCELLED,
+        [ABORT]: STATE_ABORTING,
         [ERROR]: STATE_ERROR,
         [LOADED]: STATE_LOADED,
         [TIMEOUT]: STATE_TIMEOUT
@@ -57,7 +59,11 @@ export default class LoadingStateMachine extends FiniteStateMachine {
         [ERROR]: STATE_ERROR,
         [INITIAL]: STATE_INITIAL
       },
-      [STATE_CANCELLED]: {
+      [STATE_ABORTING]: {
+        [ERROR]: STATE_ERROR,
+        [ABORTED]: STATE_ABORTED
+      },
+      [STATE_ABORTED]: {
         [LOAD]: STATE_LOADING,
         [UNLOAD]: STATE_UNLOADING
       },
@@ -99,16 +105,16 @@ export default class LoadingStateMachine extends FiniteStateMachine {
    * - Only valid when currently loading
    * - Useful for external timeout management
    */
-  doTimeout() {
+  timeout() {
     this.send(TIMEOUT);
   }
 
   /**
-   * Transition to cancelled state
+   * Transition to aborting state
    * - Only valid when currently loading
-   * - Useful for external cancellation management
+   * - Useful for external abort management
    */
-  doCancel() {
-    this.send(CANCEL);
+  abort() {
+    this.send(ABORT);
   }
 }

package/dist/state/machines/loading-state-machine/README.md

@@ -4,17 +4,18 @@ A specialized finite state machine designed for managing loading operations with
 
 ## Overview
 
-`LoadingStateMachine` extends `FiniteStateMachine` to provide a standardized way to handle loading workflows. It includes predefined states for initial, loading, loaded, unloading, cancelled, and error conditions.
+`LoadingStateMachine` extends `FiniteStateMachine` to provide a standardized way to handle loading workflows. It includes predefined states for initial, loading, loaded, unloading, aborted, and error conditions.
 
 ## States
 
-The machine defines seven primary states:
+The machine defines eight primary states:
 
 - **`INITIAL`** - Starting state, ready to begin loading
 - **`LOADING`** - Currently loading data or resources
 - **`LOADED`** - Successfully loaded, data available
 - **`UNLOADING`** - Cleaning up or releasing resources
-- **`CANCELLED`** - Loading operation was cancelled
+- **`ABORTING`** - Currently aborting loading operation
+- **`ABORTED`** - Loading operation was aborted
 - **`ERROR`** - An error occurred during loading
 - **`TIMEOUT`** - Loading operation exceeded time limit
 
@@ -25,7 +26,8 @@ Available events to trigger state transitions:
 - **`LOAD`** - Start loading operation
 - **`LOADED`** - Mark loading as complete
 - **`UNLOAD`** - Begin cleanup/unloading
-- **`CANCEL`** - Cancel the loading operation
+- **`ABORT`** - Start aborting the loading operation
+- **`ABORTED`** - Mark abort operation as complete
 - **`ERROR`** - Signal an error occurred
 - **`TIMEOUT`** - Signal operation has timed out
 - **`INITIAL`** - Return to initial state
@@ -44,7 +46,7 @@ import {
   LOAD,
   LOADED,
   ERROR,
-  CANCEL
+  ABORT
 } from '$lib/state/machines.js';
 
 const loader = new LoadingStateMachine();
@@ -67,10 +69,11 @@ console.log(loader.current); // STATE_LOADED
 
 ```
 INITIAL → LOADING
-LOADING → LOADED | CANCELLED | ERROR | TIMEOUT
+LOADING → LOADED | ABORTING | ERROR | TIMEOUT
 LOADED → LOADING | UNLOADING
 UNLOADING → INITIAL | ERROR
-CANCELLED → LOADING | UNLOADING
+ABORTING → ABORTED | ERROR
+ABORTED → LOADING | UNLOADING
 ERROR → LOADING | UNLOADING
 TIMEOUT → LOADING | UNLOADING
 ```
@@ -78,26 +81,26 @@ TIMEOUT → LOADING | UNLOADING
 ### Transition Diagram
 
 ```
-        ┌─────────┐
-        │ INITIAL │
-        └────┬────┘
-             │ LOAD
-             ▼
-    ┌─────────┐    CANCEL     ┌───────────┐
-    │ LOADING │──────────────→│ CANCELLED │
-    └────┬────┘               └─────┬─────┘
-         │                          │
-    LOADED│  ERROR  TIMEOUT    LOAD │ UNLOAD
-         │     │       │            │    │
-         ▼     ▼       ▼            ▼    ▼
-    ┌────────┐ ┌───────┐ ┌─────────┐ ┌──────────┐
-    │ LOADED │ │ ERROR │ │ TIMEOUT │ │UNLOADING │
-    └────┬───┘ └───┬───┘ └────┬────┘ └────┬─────┘
-         │         │          │           │
-   UNLOAD│    LOAD │ UNLOAD  LOAD│ UNLOAD INITIAL│ ERROR
-         ▼         ▼            ▼           ▼
-    ┌──────────┐◄──────────────────────────┘
-    │UNLOADING │
+    ┌─────────┐
+    │ INITIAL │
+    └────┬────┘
+     LOAD│
+         ▼
+    ┌─────────┐            ABORT              ┌──────────┐
+    │ LOADING │──────────────────────────────→│ ABORTING │
+    └────┬────┘                               └─────┬────┘
+         │                                          │
+   LOADED│       ERROR        TIMEOUT      ABORTED  │ERROR
+         │         │             │            │     │
+         ▼         ▼             ▼            ▼     ▼
+    ┌────────┐ ┌───────┐    ┌─────────┐     ┌─────────┐
+    │ LOADED │ │ ERROR │    │ TIMEOUT │     │ ABORTED │
+    └────┬───┘ └───┬───┘    └────┬────┘     └────┬────┘
+         │         │             │               │
+   UNLOAD│     LOAD│UNLOAD   LOAD│UNLOAD     LOAD│UNLOAD
+         ▼         ▼             ▼               ▼
+    ┌──────────┐                                 │
+    │UNLOADING │◄────────────────────────────────┘
     └──────────┘
 ```
 
@@ -184,7 +187,7 @@ const loader = new LoadingStateMachine();
 // External timeout management
 const timeoutId = setTimeout(() => {
   if (loader.current === STATE_LOADING) {
-    loader.doTimeout(); // Transitions to STATE_TIMEOUT
+    loader.timeout(); // Transitions to STATE_TIMEOUT
   }
 }, 10000); // 10 second timeout
 
@@ -201,13 +204,22 @@ loader.onenter = (currentState) => {
 };
 ```
 
-### doTimeout Method
+### timeout Method
 
-Use `doTimeout()` to manually trigger a timeout transition:
+Use `timeout()` to manually trigger a timeout transition:
 
 ```javascript
 // Only works when in STATE_LOADING
-loader.doTimeout(); // Sends TIMEOUT signal
+loader.timeout(); // Sends TIMEOUT signal
+```
+
+### abort Method
+
+Use `abort()` to manually trigger an abort transition:
+
+```javascript
+// Only works when in STATE_LOADING
+loader.abort(); // Sends ABORT signal, transitions to STATE_ABORTING
 ```
 
 ## Integration with Svelte Reactivity
@@ -313,7 +325,7 @@ export default class MultiSourceLoader {
     LOAD,
     LOADED,
     ERROR,
-    CANCEL
+    ABORT
   } from '$lib/state/machines.js';
   
   const loader = new LoadingStateMachine();
@@ -351,7 +363,7 @@ export default class MultiSourceLoader {
 {/if}
 ```
 
-### Advanced Component with Cancellation
+### Advanced Component with Abort Handling
 
 ```javascript
 <script>
@@ -360,12 +372,14 @@ export default class MultiSourceLoader {
     STATE_INITIAL,
     STATE_LOADING,
     STATE_LOADED,
-    STATE_CANCELLED,
+    STATE_ABORTING,
+    STATE_ABORTED,
     STATE_ERROR,
     LOAD,
     LOADED,
     ERROR,
-    CANCEL
+    ABORT,
+    ABORTED
   } from '$lib/state/machines.js';
   
   const loader = new LoadingStateMachine();
@@ -376,8 +390,11 @@ export default class MultiSourceLoader {
       case STATE_LOADING:
         startLoad();
         break;
-      case STATE_CANCELLED:
+      case STATE_ABORTING:
+        // Start abort process
         abortController?.abort();
+        // Simulate abort completion
+        setTimeout(() => loader.send(ABORTED), 100);
         break;
     }
   };
@@ -393,7 +410,7 @@ export default class MultiSourceLoader {
       loader.send(LOADED);
     } catch (error) {
       if (error.name === 'AbortError') {
-        // Request was cancelled, machine already in cancelled state
+        // Request was aborted, machine will transition to STATE_ABORTED
       } else {
         loader.send(ERROR, error);
       }
@@ -405,13 +422,15 @@ export default class MultiSourceLoader {
   {#if loader.current === STATE_INITIAL}
     <button onclick={() => loader.send(LOAD)}>Start Loading</button>
   {:else if loader.current === STATE_LOADING}
-    <button onclick={() => loader.send(CANCEL)}>Cancel Loading</button>
+    <button onclick={() => loader.send(ABORT)}>Abort Loading</button>
     <div>Loading data...</div>
+  {:else if loader.current === STATE_ABORTING}
+    <div>Aborting...</div>
   {:else if loader.current === STATE_LOADED}
     <div>Data loaded successfully!</div>
     <button onclick={() => loader.send(LOAD)}>Reload</button>
-  {:else if loader.current === STATE_CANCELLED}
-    <div>Loading cancelled</div>
+  {:else if loader.current === STATE_ABORTED}
+    <div>Loading aborted</div>
     <button onclick={() => loader.send(LOAD)}>Try Again</button>
   {:else if loader.current === STATE_ERROR}
     <div>Error: {loader.error.message}</div>
@@ -449,8 +468,11 @@ loader.onenter = (currentState) => {
       showErrorToast(loader.error.message);
       logError(loader.error);
       break;
-    case STATE_CANCELLED:
-      showMessage('Operation cancelled');
+    case STATE_ABORTING:
+      showMessage('Aborting operation...');
+      break;
+    case STATE_ABORTED:
+      showMessage('Operation aborted');
       break;
   }
 };
@@ -466,7 +488,8 @@ loader.onenter = (currentState) => {
       break;
     case STATE_LOADED:
     case STATE_ERROR:
-    case STATE_CANCELLED:
+    case STATE_ABORTING:
+    case STATE_ABORTED:
       hideProgressBar();
       break;
     case STATE_UNLOADING:
@@ -576,7 +599,8 @@ import {
   STATE_LOADING,
   STATE_LOADED,
   STATE_UNLOADING,
-  STATE_CANCELLED,
+  STATE_ABORTING,
+  STATE_ABORTED,
   STATE_ERROR,
   STATE_TIMEOUT,
   
@@ -584,7 +608,8 @@ import {
   LOAD,
   LOADED,
   UNLOAD,
-  CANCEL,
+  ABORT,
+  ABORTED,
   ERROR,
   INITIAL,
   TIMEOUT

package/dist/state/machines/loading-state-machine/constants.d.ts

@@ -2,12 +2,14 @@ export const STATE_INITIAL: "initial";
 export const STATE_LOADING: "loading";
 export const STATE_UNLOADING: "unloading";
 export const STATE_LOADED: "loaded";
-export const STATE_CANCELLED: "cancelled";
+export const STATE_ABORTING: "aborting";
+export const STATE_ABORTED: "aborted";
 export const STATE_ERROR: "error";
 export const STATE_TIMEOUT: "timeout";
 export const INITIAL: "initial";
 export const LOAD: "load";
-export const CANCEL: "cancel";
+export const ABORT: "abort";
+export const ABORTED: "aborted";
 export const ERROR: "error";
 export const LOADED: "loaded";
 export const UNLOAD: "unload";

package/dist/state/machines/loading-state-machine/constants.js

@@ -3,7 +3,8 @@ export const STATE_LOADING = 'loading';
 export const STATE_UNLOADING = 'unloading';
 export const STATE_LOADED = 'loaded';
 
-export const STATE_CANCELLED = 'cancelled';
+export const STATE_ABORTING = 'aborting';
+export const STATE_ABORTED = 'aborted';
 export const STATE_ERROR = 'error';
 export const STATE_TIMEOUT = 'timeout';
 
@@ -11,7 +12,8 @@ export const STATE_TIMEOUT = 'timeout';
 
 export const INITIAL = 'initial';
 export const LOAD = 'load';
-export const CANCEL = 'cancel';
+export const ABORT = 'abort';
+export const ABORTED = 'aborted';
 export const ERROR = 'error';
 export const LOADED = 'loaded';
 export const UNLOAD = 'unload';

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@hkdigital/lib-core",
-	"version": "0.4.26",
+	"version": "0.4.27",
 	"author": {
 		"name": "HKdigital",
 		"url": "https://hkdigital.nl"