@hkdigital/lib-core 0.5.39 → 0.5.41

package/dist/ui/components/drag-drop/Draggable.svelte

@@ -162,13 +162,13 @@
    * @param {DragEvent} event
    */
   function handleDragStart(event) {
-    console.debug('handleDragStart called', {
-      target: event.target,
-      currentTarget: event.currentTarget,
-      disabled,
-      canDrag: canDrag(item),
-      dataTransfer: !!event.dataTransfer
-    });
+    // console.debug('handleDragStart called', {
+    //   target: event.target,
+    //   currentTarget: event.currentTarget,
+    //   disabled,
+    //   canDrag: canDrag(item),
+    //   dataTransfer: !!event.dataTransfer
+    // });
 
     if (disabled || !canDrag(item)) {
       console.debug('Drag prevented: disabled or cannot drag');
@@ -189,7 +189,7 @@
       return;
     }
 
-    console.debug('Starting drag operation');
+    // console.debug('Starting drag operation');
     currentState = DRAGGING;
     startDrag(event);
   }

package/dist/ui/components/game-box/GameBox.svelte

@@ -12,10 +12,7 @@
     getIsMobile
   } from '../../../browser/info/device.js';
 
-  import {
-    getIsPwa,
-    getIsFullscreen
-  } from '../../../browser/info/display.js';
+  import { getIsPwa, getIsFullscreen } from '../../../browser/info/display.js';
 
   import ScaledContainer from './ScaledContainer.svelte';
 
@@ -53,6 +50,7 @@
    *   snippetPortrait?: GameBoxSnippet,
    *   snippetRequireFullscreen?: GameBoxSnippet,
    *   snippetInstallOnHomeScreen?: GameBoxSnippet,
+   *   allowDevModeOnLocalhost?: boolean,
    *   debug?: boolean,
    *   [attr: string]: any
    * }}
@@ -87,6 +85,7 @@
     snippetRequireFullscreen,
     snippetInstallOnHomeScreen,
 
+    allowDevModeOnLocalhost = true,
     debug = false
   } = $props();
 
@@ -105,23 +104,21 @@
 
   let isLandscape = $state();
 
-  let gameWidth = $derived.by( () => {
-    if( isLandscape ) {
+  let gameWidth = $derived.by(() => {
+    if (isLandscape) {
       return gameWidthOnLandscape;
-    }
-    else {
+    } else {
       return gameWidthOnPortrait;
     }
-  } );
+  });
 
-  let gameHeight = $derived.by( () => {
-    if( isLandscape ) {
+  let gameHeight = $derived.by(() => {
+    if (isLandscape) {
       return gameHeightOnLandscape;
-    }
-    else {
+    } else {
       return gameHeightOnPortrait;
     }
-  } );
+  });
 
   // iPad is also considered Apple mobile
   const isAppleMobile = getIsAppleMobile();
@@ -132,12 +129,7 @@
 
   // Update iOS dimensions when window size changes
   $effect(() => {
-    if (
-      isPwa &&
-      isAppleMobile &&
-      windowWidth &&
-      windowHeight
-    ) {
+    if (isPwa && isAppleMobile && windowWidth && windowHeight) {
       updateIosWidthHeightAndOrientation();
     }
   });
@@ -146,8 +138,9 @@
     // Use matchMedia as a trigger for orientation changes
     // The actual orientation is determined in updateIosWidthHeightAndOrientation()
     if (typeof window !== 'undefined') {
-      const isPortraitMedia =
-        window.matchMedia('(orientation: portrait)').matches;
+      const isPortraitMedia = window.matchMedia(
+        '(orientation: portrait)'
+      ).matches;
 
       // Trigger iOS dimension update when orientation might have changed
       if (isPwa && isAppleMobile) {
@@ -164,10 +157,20 @@
     if (debug) {
       console.log('[GameBox] isLandscape:', isLandscape);
       console.log('[GameBox] windowWidth/Height:', windowWidth, windowHeight);
-      console.log('[GameBox] iosWindowWidth/Height:',
-        iosWindowWidth, iosWindowHeight);
-
-      console.log( {isPwa, isAppleMobile, isMobile, isIos, isAndroid, isFullscreen} );
+      console.log(
+        '[GameBox] iosWindowWidth/Height:',
+        iosWindowWidth,
+        iosWindowHeight
+      );
+
+      console.log({
+        isPwa,
+        isAppleMobile,
+        isMobile,
+        isIos,
+        isAndroid,
+        isFullscreen
+      });
     }
   });
 
@@ -181,8 +184,7 @@
     const availWidth = width - marginLeft - marginRight;
     const availHeight = height - marginTop - marginBottom;
 
-    if( debug )
-    {
+    if (debug) {
       console.debug('GameBox margins:', {
         marginLeft,
         marginRight,
@@ -201,30 +203,24 @@
         aspectOnLandscape
       });
 
-      if( aspectOnLandscape )
-      {
+      if (aspectOnLandscape) {
         gameHeightOnLandscape = gameWidthOnLandscape / aspectOnLandscape;
-      }
-      else {
+      } else {
         gameHeightOnLandscape = availHeight;
       }
-    }
-    else {
+    } else {
       gameWidthOnPortrait = getGameWidthOnPortrait({
         windowWidth: availWidth,
         windowHeight: availHeight,
         aspectOnPortrait
       });
 
-      if( aspectOnPortrait )
-      {
+      if (aspectOnPortrait) {
         gameHeightOnPortrait = gameWidthOnPortrait / aspectOnPortrait;
-      }
-      else {
+      } else {
         gameHeightOnPortrait = availHeight;
       }
     }
-
   });
 
   let show = $state(false);
@@ -242,7 +238,6 @@
 
   function updateIosWidthHeightAndOrientation() {
     if (isAppleMobile) {
-
       // unreliable on ios >>
       // const angle = screen.orientation.angle;
       // if( window.matchMedia('(orientation: portrait)').matches ) {
@@ -276,16 +271,13 @@
       iosWindowWidth = window.innerWidth;
       iosWindowHeight = window.innerHeight;
 
-      if( iosWindowHeight > iosWindowWidth )
-      {
+      if (iosWindowHeight > iosWindowWidth) {
         isLandscape = false;
-      }
-      else {
+      } else {
         isLandscape = true;
       }
 
-      if( debug )
-      {
+      if (debug) {
         console.debug('updateIosWidthHeightAndOrientation', {
           'screen.orientation.type': screen.orientation.type,
           isLandscape,
@@ -330,8 +322,7 @@
     // App visibility detection for iOS debugging
     const handleVisibilityChange = () => {
       if (document.visibilityState === 'visible') {
-
-        if( debug ) {
+        if (debug) {
           console.log('App became visible:', {
             'window.innerWidth': window.innerWidth,
             'window.innerHeight': window.innerHeight,
@@ -339,13 +330,13 @@
             'screen.height': screen.height,
             'screen.orientation.angle': screen.orientation.angle,
             'screen.orientation.type': screen.orientation.type,
-            'matchMedia portrait':
-              window.matchMedia('(orientation: portrait)').matches,
-            'isLandscape': isLandscape,
-            'gameWidth': gameWidth,
-            'gameHeight': gameHeight,
-            'iosWindowWidth': iosWindowWidth,
-            'iosWindowHeight': iosWindowHeight
+            'matchMedia portrait': window.matchMedia('(orientation: portrait)')
+              .matches,
+            isLandscape: isLandscape,
+            gameWidth: gameWidth,
+            gameHeight: gameHeight,
+            iosWindowWidth: iosWindowWidth,
+            iosWindowHeight: iosWindowHeight
           });
         }
 
@@ -384,7 +375,7 @@
     // };
     return () => {
       html.classList.remove(gameBoxNoScroll);
-    }
+    };
   });
 
   async function requestFullscreen() {
@@ -432,7 +423,7 @@
   }
 
   $effect(() => {
-    if (location.hostname === 'localhost') {
+    if (allowDevModeOnLocalhost && location.hostname === 'localhost') {
       isDevMode = true;
     }
   });
@@ -444,6 +435,24 @@
       window.history.pushState({}, '', url);
     }
   });
+
+  let snippetParams = $derived({
+    isLandscape,
+    isPortrait: !isLandscape,
+    isMobile,
+    isIos,
+    isAndroid,
+    isIpadOS,
+    isPwa,
+    isFullscreen,
+    isDevMode,
+    requestDevmode,
+    requestFullscreen,
+    gameWidth,
+    gameHeight
+  });
+
+  // $inspect('snippetParams', snippetParams);
 </script>
 
 <svelte:window bind:innerWidth={windowWidth} bind:innerHeight={windowHeight} />
@@ -467,213 +476,144 @@
       style:margin="{marginTop}px {marginRight}px {marginBottom}px {marginLeft}px"
       {style}
     >
-      {#if show}
-        <!-- Render both orientations, toggle visibility to preserve state -->
+      {#if show && clamping }
+
         {#if snippetRequireFullscreen}
-          <!-- Require fullscreen -->
+
           {#if isFullscreen && !isDevMode}
+
+            <!--
+              snippetRequireFullscreen &&
+              Fullscreen
+              => Render both orientations, set visibility to preserve state
+            -->
+
             <!-- Landscape content -->
             <ScaledContainer
-              enableScaling={enableScaling}
+              {enableScaling}
               design={designLandscape}
               {clamping}
               width={gameWidthOnLandscape}
               height={gameHeightOnLandscape}
+              snippet={snippetLandscape}
+              {snippetParams}
               hidden={!isLandscape}
-            >
-              {@render snippetLandscape({
-                isLandscape,
-                isPortrait: !isLandscape,
-                isMobile,
-                isIos,
-                isAndroid,
-                isIpadOS,
-                isPwa,
-                isFullscreen,
-                isDevMode,
-                requestDevmode,
-                requestFullscreen,
-                gameWidth,
-                gameHeight
-              })}
-            </ScaledContainer>
+            ></ScaledContainer>
+
             <!-- Portrait content -->
             <ScaledContainer
-              enableScaling={enableScaling}
+              {enableScaling}
               design={designPortrait}
               {clamping}
               width={gameWidthOnPortrait}
               height={gameHeightOnPortrait}
+              snippet={snippetPortrait}
+              {snippetParams}
               hidden={isLandscape}
-            >
-              {@render snippetPortrait({
-                isLandscape,
-                isPortrait: !isLandscape,
-                isMobile,
-                isIos,
-                isAndroid,
-                isIpadOS,
-                isPwa,
-                isFullscreen,
-                isDevMode,
-                requestDevmode,
-                requestFullscreen,
-                gameWidth,
-                gameHeight
-              })}
-            </ScaledContainer>
-          {:else if supportsFullscreen && !isDevMode}
-            <!-- Require fullscreen -->
+            ></ScaledContainer>
+
+          {:else if isMobile && snippetInstallOnHomeScreen && !isPwa && !isDevMode}
+
+            <!--
+              snippetRequireFullscreen &&
+              isMobile &&
+              snippetInstallOnHomeScreen &&
+              Not PWA
+              => show install on home screen message
+            -->
+
             <ScaledContainer
-              enableScaling={enableScaling}
+              {enableScaling}
               design={isLandscape ? designLandscape : designPortrait}
               {clamping}
               width={gameWidth}
               height={gameHeight}
-            >
-              {@render snippetRequireFullscreen({
-                isLandscape,
-                isPortrait: !isLandscape,
-                isMobile,
-                isIos,
-                isAndroid,
-                isIpadOS,
-                isPwa,
-                isFullscreen,
-                isDevMode,
-                requestDevmode,
-                requestFullscreen,
-                gameWidth,
-                gameHeight
-              })}
-            </ScaledContainer>
-          {:else if isMobile && snippetInstallOnHomeScreen && !isPwa && !isDevMode}
-            <!-- Require install on home screen on mobile -->
+              snippet={snippetInstallOnHomeScreen}
+              {snippetParams}
+            ></ScaledContainer>
+
+          {:else if supportsFullscreen && !isDevMode}
+
+            <!--
+              snippetRequireFullscreen &&
+              Fullscreen supported &&
+              Not fullscreen &&
+              (Not mobile OR no install snippet OR already PWA)
+              => show fullscreen required message
+            -->
+
             <ScaledContainer
-              enableScaling={enableScaling}
+              {enableScaling}
               design={isLandscape ? designLandscape : designPortrait}
               {clamping}
               width={gameWidth}
               height={gameHeight}
-            >
-              {@render snippetInstallOnHomeScreen({
-                isLandscape,
-                isPortrait: !isLandscape,
-                isMobile,
-                isIos,
-                isAndroid,
-                isIpadOS,
-                isPwa,
-                isFullscreen,
-                isDevMode,
-                requestDevmode,
-                requestFullscreen,
-                gameWidth,
-                gameHeight
-              })}
-            </ScaledContainer>
+              snippet={snippetRequireFullscreen}
+              {snippetParams}
+            ></ScaledContainer>
+
           {:else}
+            <!--
+              snippetRequireFullscreen &&
+              (Dev mode OR
+               Fullscreen not supported OR
+               Not mobile OR
+               No install snippet OR
+               Already PWA)
+              => show game content
+            -->
+
             <!-- Landscape content -->
+
             <ScaledContainer
-              enableScaling={enableScaling}
+              {enableScaling}
               design={designLandscape}
               {clamping}
               width={gameWidthOnLandscape}
               height={gameHeightOnLandscape}
+              snippet={snippetLandscape}
+              {snippetParams}
               hidden={!isLandscape}
-            >
-              {@render snippetLandscape({
-                isLandscape,
-                isPortrait: !isLandscape,
-                isMobile,
-                isIos,
-                isAndroid,
-                isIpadOS,
-                isPwa,
-                isFullscreen,
-                isDevMode,
-                requestDevmode,
-                requestFullscreen,
-                gameWidth,
-                gameHeight
-              })}
-            </ScaledContainer>
+            ></ScaledContainer>
+
             <!-- Portrait content -->
             <ScaledContainer
-              enableScaling={enableScaling}
+              {enableScaling}
               design={designPortrait}
               {clamping}
               width={gameWidthOnPortrait}
               height={gameHeightOnPortrait}
+              snippet={snippetPortrait}
+              {snippetParams}
               hidden={isLandscape}
-            >
-              {@render snippetPortrait({
-                isLandscape,
-                isPortrait: !isLandscape,
-                isMobile,
-                isIos,
-                isAndroid,
-                isIpadOS,
-                isPwa,
-                isFullscreen,
-                isDevMode,
-                requestDevmode,
-                requestFullscreen,
-                gameWidth,
-                gameHeight
-              })}
-            </ScaledContainer>
+            ></ScaledContainer>
           {/if}
         {:else}
           <!-- Do not require fullscreen -->
+
           <!-- Landscape content -->
           <ScaledContainer
-            enableScaling={enableScaling}
+            {enableScaling}
             design={designLandscape}
             {clamping}
             width={gameWidthOnLandscape}
             height={gameHeightOnLandscape}
+            snippet={snippetLandscape}
+            {snippetParams}
             hidden={!isLandscape}
-          >
-            {@render snippetLandscape({
-              isLandscape,
-              isPortrait: !isLandscape,
-              isMobile,
-              isIos,
-              isAndroid,
-              os,
-              isFullscreen,
-              isDevMode,
-              requestDevmode,
-              requestFullscreen,
-              gameWidth,
-              gameHeight
-            })}
-          </ScaledContainer>
+          ></ScaledContainer>
+
           <!-- Portrait content -->
           <ScaledContainer
-            enableScaling={enableScaling}
+            {enableScaling}
             design={designPortrait}
             {clamping}
             width={gameWidthOnPortrait}
             height={gameHeightOnPortrait}
+            snippet={snippetPortrait}
+            {snippetParams}
             hidden={isLandscape}
-          >
-            {@render snippetPortrait({
-              isLandscape,
-              isPortrait: !isLandscape,
-              isMobile,
-              isIos,
-              isAndroid,
-              os,
-              isFullscreen,
-              isDevMode,
-              requestDevmode,
-              requestFullscreen,
-              gameWidth,
-              gameHeight
-            })}
-          </ScaledContainer>
+          ></ScaledContainer>
         {/if}
       {/if}
     </div>

package/dist/ui/components/game-box/GameBox.svelte.d.ts

@@ -45,6 +45,7 @@ type GameBox = {
         snippetPortrait?: Snippet<[SnippetParams]> | undefined;
         snippetRequireFullscreen?: Snippet<[SnippetParams]> | undefined;
         snippetInstallOnHomeScreen?: Snippet<[SnippetParams]> | undefined;
+        allowDevModeOnLocalhost?: boolean | undefined;
         debug?: boolean | undefined;
     }>): void;
 };
@@ -92,5 +93,6 @@ declare const GameBox: import("svelte").Component<{
     snippetPortrait?: import("svelte").Snippet<[import("./typedef.js").SnippetParams]>;
     snippetRequireFullscreen?: import("svelte").Snippet<[import("./typedef.js").SnippetParams]>;
     snippetInstallOnHomeScreen?: import("svelte").Snippet<[import("./typedef.js").SnippetParams]>;
+    allowDevModeOnLocalhost?: boolean;
     debug?: boolean;
 }, {}, "">;

package/dist/ui/components/game-box/ScaledContainer.svelte

@@ -1,22 +1,5 @@
 <script>
-  import { enableContainerScaling } from '../../../design/index.js';
-
-  /**
-   * @typedef {{
-   *   enableScaling?: boolean,
-   *   design?: {width: number, height: number},
-   *   clamping?: {
-   *     ui: {min: number, max: number},
-   *     textBase: {min: number, max: number},
-   *     textHeading: {min: number, max: number},
-   *     textUi: {min: number, max: number}
-   *   },
-   *   width: number,
-   *   height: number,
-   *   hidden?: boolean,
-   *   children: import('svelte').Snippet
-   * }}
-   */
+  import { clamp, enableContainerScaling } from '../../../design/index.js';
 
   /**
    * Wrapper component that applies container scaling to its children
@@ -24,7 +7,7 @@
    * @type {{
    *   enableScaling?: boolean,
    *   design?: {width: number, height: number},
-   *   clamping?: {
+   *   clamping: {
    *     ui: {min: number, max: number},
    *     textBase: {min: number, max: number},
    *     textHeading: {min: number, max: number},
@@ -33,17 +16,19 @@
    *   width: number,
    *   height: number,
    *   hidden?: boolean,
-   *   children: import('svelte').Snippet
+   *   snippet?: import('./typedef.js').GameBoxSnippet,
+   *   snippetParams: import('./typedef.js').SnippetParams
    * }}
    */
   let {
     enableScaling = false,
-    design = undefined,
-    clamping = undefined,
+    design,
+    clamping,
     width,
     height,
     hidden = false,
-    children
+    snippet,
+    snippetParams
   } = $props();
 
   let container = $state();
@@ -51,12 +36,13 @@
   // Apply container scaling when enabled and not hidden
   $effect(() => {
     if (
-      !enableScaling ||
       !container ||
+      !enableScaling ||
       !width ||
       !height ||
-      hidden ||
-      !design
+      !design ||
+      !clamping ||
+      hidden
     ) {
       return;
     }
@@ -72,14 +58,16 @@
   });
 </script>
 
-<div
-  bind:this={container}
-  class:hidden
-  style:width="{width}px"
-  style:height="{height}px"
->
-  {@render children()}
-</div>
+{#if snippet && snippetParams}
+  <div
+    bind:this={container}
+    class:hidden
+    style:width="{width}px"
+    style:height="{height}px"
+  >
+    {@render snippet(snippetParams)}
+  </div>
+{/if}
 
 <style>
   .hidden {

package/dist/ui/components/game-box/ScaledContainer.svelte.d.ts

@@ -7,7 +7,7 @@ type ScaledContainer = {
             width: number;
             height: number;
         } | undefined;
-        clamping?: {
+        clamping: {
             ui: {
                 min: number;
                 max: number;
@@ -24,11 +24,12 @@ type ScaledContainer = {
                 min: number;
                 max: number;
             };
-        } | undefined;
+        };
         width: number;
         height: number;
         hidden?: boolean | undefined;
-        children: Snippet<[]>;
+        snippet?: Snippet<[SnippetParams]> | undefined;
+        snippetParams: SnippetParams;
     }>): void;
 };
 declare const ScaledContainer: import("svelte").Component<{
@@ -37,7 +38,7 @@ declare const ScaledContainer: import("svelte").Component<{
         width: number;
         height: number;
     };
-    clamping?: {
+    clamping: {
         ui: {
             min: number;
             max: number;
@@ -58,5 +59,6 @@ declare const ScaledContainer: import("svelte").Component<{
     width: number;
     height: number;
     hidden?: boolean;
-    children: import("svelte").Snippet;
+    snippet?: import("./typedef.js").GameBoxSnippet;
+    snippetParams: import("./typedef.js").SnippetParams;
 }, {}, "">;

package/dist/util/unique/index.d.ts

@@ -69,18 +69,25 @@ export function generateOrGetInstanceId(randomSize?: number, reset?: boolean): s
  * @param {number} [timeMs]
  *   Custom time value to be used instead of Date.now()
  *
- * @returns {string} global id
+ * @returns {string}
+ *   Global id (max 39 chars: 1 length prefix + 23 instance + 15 local)
  */
 export function generateGlobalId(timeMs?: number): string;
 /**
  * Generates and returns a new unique local id
- * - The generated id is garanteed to be unique on the currently running
+ * - The generated id is guaranteed to be unique on the currently running
  *   local system
+ * - Format: <boot-prefix><length-indicator><time-based><count-based>
+ * - Boot prefix provides uniqueness across process restarts
+ * - Time-based component changes every 30 seconds
+ * - Counter resets every 30 seconds (656M IDs per 30s window = 5 chars)
+ * - Optimized for high-frequency generation (thousands per second)
  *
  * @param {number} [timeMs]
  *   Custom time value to be used instead of Date.now()
  *
- * @returns {string} local id
+ * @returns {string}
+ *   Local id (max 15 chars: 3 boot prefix + 1 length + 6 time + 5 count)
  */
 export function generateLocalId(timeMs?: number): string;
 /**

package/dist/util/unique/index.js

@@ -141,8 +141,8 @@ export function generateClientSessionId() {
  */
 export function generateOrGetInstanceId(randomSize = 16, reset = false) {
   if (!vars.instanceId || reset) {
-    const timeBasedPart = getTimeBasedNumber30sBase58();
-    const lengthPrefix = base58fromNumber(timeBasedPart.length);
+    const timeBasedPart = getTimeBasedNumber30sBase58(); // max 6 chars
+    const lengthPrefix = base58fromNumber(timeBasedPart.length); // 1 char
 
     vars.instanceId =
       lengthPrefix +
@@ -166,25 +166,35 @@ export function generateOrGetInstanceId(randomSize = 16, reset = false) {
  * @param {number} [timeMs]
  *   Custom time value to be used instead of Date.now()
  *
- * @returns {string} global id
+ * @returns {string}
+ *   Global id (max 39 chars: 1 length prefix + 23 instance + 15 local)
  */
 export function generateGlobalId(timeMs) {
-  const instanceId = generateOrGetInstanceId();
-  const localId = generateLocalId(timeMs);
+  const instanceId = generateOrGetInstanceId();  // max 1 + 6 + 16 = 23 chars
+  const localId = generateLocalId(timeMs);       // max 15 chars
+
+  // Max 1 char (23 + 15 = 38)
   const lengthPrefix = base58fromNumber(instanceId.length + localId.length);
 
+  // Max 39 chars (1 + 23 + 15 = 39)
   return lengthPrefix + instanceId + localId;
 }
 
 /**
  * Generates and returns a new unique local id
- * - The generated id is garanteed to be unique on the currently running
+ * - The generated id is guaranteed to be unique on the currently running
  *   local system
+ * - Format: <boot-prefix><length-indicator><time-based><count-based>
+ * - Boot prefix provides uniqueness across process restarts
+ * - Time-based component changes every 30 seconds
+ * - Counter resets every 30 seconds (656M IDs per 30s window = 5 chars)
+ * - Optimized for high-frequency generation (thousands per second)
  *
  * @param {number} [timeMs]
  *   Custom time value to be used instead of Date.now()
  *
- * @returns {string} local id
+ * @returns {string}
+ *   Local id (max 15 chars: 3 boot prefix + 1 length + 6 time + 5 count)
  */
 export function generateLocalId(timeMs) {
   const timeBasedNumber = getTimeBasedNumber30s(timeMs);
@@ -222,6 +232,15 @@ export function generateLocalId(timeMs) {
   //
   // @note ALPHABET_BASE_58 is used because it is faster than
   //       base58fromNumber for single character encoding
+
+  //
+  // bootTimePrefix => 3 chars
+  // ALPHABET_BASE_58[timeBasedValue58.length] => 1 char
+  // timeBasedValue58 => max 6 chars
+  // countBasedValue58 => max 5 chars
+  // (resets every 30 seconds => 58^5 = 656.356.768)
+  //
+  // Realistic max length: 3 + 1 + 6 + 5 = 15 chars
   //
   const id =
     // idFormatPrefix

package/package.json

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