@hkdigital/lib-sveltekit 0.1.94 → 0.1.96

package/dist/classes/svelte/image/ImageVariantsLoader.svelte.d.ts

@@ -1,3 +1,4 @@
+/** @typedef {import('../../../typedef/image.js').ImageMeta} ImageMeta */
 export default class ImageVariantsLoader {
     /**
      * @param {ImageMeta[]} imagesMeta
@@ -19,7 +20,7 @@ export default class ImageVariantsLoader {
         fit?: "cover" | "contain" | "fill";
     }): void;
     get loaded(): boolean;
-    get variant(): import("./typedef.js").ImageMeta;
+    get variant(): import("../../../typedef/image.js").ImageMeta;
     /**
      * Get object URL that can be used as src parameter of an HTML image
      *
@@ -39,4 +40,4 @@ export default class ImageVariantsLoader {
     getOptimalImageMeta(containerWidth: number): ImageMeta | null;
     #private;
 }
-export type ImageMeta = import("./typedef.js").ImageMeta;
+export type ImageMeta = import("../../../typedef/image.js").ImageMeta;

package/dist/classes/svelte/image/ImageVariantsLoader.svelte.js

@@ -1,13 +1,9 @@
-/** @typedef {import('./typedef.js').ImageMeta} ImageMeta */
-
-// import * as expect from '../../../util/expect/index.js';
-
 import { calculateEffectiveWidth } from '../../../util/image/index.js';
 
-import { untrack } from 'svelte';
-
 import ImageLoader from './ImageLoader.svelte.js';
 
+/** @typedef {import('../../../typedef/image.js').ImageMeta} ImageMeta */
+
 export default class ImageVariantsLoader {
   /** @type {number} */
   #devicePixelRatio;
@@ -37,6 +33,7 @@ export default class ImageVariantsLoader {
   constructor(imagesMeta, { devicePixelRatio = 1 } = {}) {
     this.#devicePixelRatio = devicePixelRatio ?? 1;
     this.#imagesMeta = [...imagesMeta].sort((a, b) => a.width - b.width);
+    // console.debug("imagesMeta",imagesMeta);
   }
 
   /**
@@ -60,6 +57,8 @@ export default class ImageVariantsLoader {
 
     const newVariant = this.getOptimalImageMeta(effectiveWidth);
 
+    // console.debug("updateOptimalImageMeta", effectiveWidth, newVariant );
+
     if (
       !newVariant ||
       !this.#imageVariant ||
@@ -76,6 +75,7 @@ export default class ImageVariantsLoader {
         imageMeta: newVariant
       });
 
+
       this.#imageLoader.load();
     }
   }

package/dist/classes/svelte/network-loader/NetworkLoader.svelte.js

@@ -87,6 +87,7 @@ export default class NetworkLoader {
     this._url = url;
 
     const state = this._state;
+    const progress = this.progress;
 
     //
     // ISSUE: $effect is not triggered by  this._state changes,
@@ -110,10 +111,15 @@ export default class NetworkLoader {
 
         case STATE_LOADED:
           {
-            // console.error(
-            //   'NetworkLoader:loaded',
-            //   $state.snapshot({ bytes: this.size })
-            // );
+            // console.debug('NetworkLoader:loaded', $state.snapshot(state));
+
+            // setTimeout(() => {
+            //   console.debug(
+            //     'NetworkLoader:loaded',
+            //     $state.snapshot(state),
+            //     progress
+            //   );
+            // }, 500);
 
             // Abort function is no longer needed
             this._abortLoading = null;
@@ -140,7 +146,7 @@ export default class NetworkLoader {
    * Start loading all network data
    */
   load() {
-    // console.log('NetworkLoader: load() called');
+    // console.debug('NetworkLoader: load() called');
     this._state.send(LOAD);
   }
 
@@ -301,6 +307,8 @@ export default class NetworkLoader {
 
       this._buffer = await bufferPromise;
 
+      // console.debug('#load', this._buffer, this._bytesLoaded);
+
       this._state.send(LOADED);
     } catch (e) {
       this._state.send(ERROR, e);

package/dist/components/drag-drop/DropZone.svelte

@@ -211,13 +211,13 @@
 >
   <GridLayers heightFrom={heightMode === 'flexible' ? 'content' : null}>
     {#if children}
-      <div
+      <!-- <div
         data-layer="content"
         class:relative={heightMode === 'flexible'}
         class:w-full={heightMode === 'flexible'}
-      >
+      > -->
         {@render children()}
-      </div>
+      <!-- </div> -->
     {/if}
 
     {#if showPreview && dropPreviewSnippet}
@@ -231,9 +231,11 @@
 <style>
   [data-component="drop-zone"] {
     -webkit-tap-highlight-color: transparent;
+
+
   }
 
-  [data-layer='content']:not(.relative) {
+/*  [data-layer='content']:not(.relative) {
     position: absolute;
     left: 0;
     right: 0;
@@ -245,7 +247,7 @@
     position: relative;
     width: 100%;
   }
-
+*/
   [data-layer='preview'] {
     position: absolute;
     left: 0;

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@hkdigital/lib-sveltekit",
-	"version": "0.1.94",
+	"version": "0.1.96",
 	"author": {
 		"name": "HKdigital",
 		"url": "https://hkdigital.nl"
@@ -105,7 +105,7 @@
 		"tailwindcss": "^3.4.17",
 		"typescript": "^5.8.2",
 		"vite": "^6.2.0",
-		"vite-imagetools": "^7.0.5",
+		"vite-imagetools": "^7.1.0",
 		"vitest": "^3.0.7",
 		"zod": "^3.24.2"
 	}