@hkdigital/lib-sveltekit 0.1.31 → 0.1.33

package/dist/widgets/button-group/ButtonGroup.svelte

@@ -5,7 +5,10 @@
    * a time.
    */
 
-  /** @typedef {{text: string, disabled?: boolean, props?: Object}} ButtonDef */
+  import { onMount } from 'svelte';
+  import { findFirst } from '../../util/array/index.js';
+
+  /** @typedef {{text?: string, value?: any, label?: string, props?: Object}} ButtonDef */
 
   /**
    * @type {{
@@ -13,7 +16,8 @@
    *   bg?: string,
    *   classes?: string,
    *   buttons: Array<ButtonDef>,
-   *   selected?: (ButtonDef|null)
+   *   selected?: (ButtonDef|null),
+   *   select?: ( label:string ) => void,
    *   buttonSnippet: import('svelte').Snippet<[{text: string, props: Object}]>,
    *   [attr: string]: any
    * }}
@@ -24,6 +28,7 @@
     classes = '',
     buttons = [],
     selected = $bindable(null),
+    select = $bindable(),
     buttonSnippet,
     ...attrs
   } = $props();
@@ -34,11 +39,25 @@
    * Handle button selection
    */
   function handleSelect(index) {
-    if (!buttons[index].disabled) {
+    if (!buttons[index].props?.disabled) {
       selectedIndex = index;
       selected = buttons[selectedIndex] ?? null;
     }
   }
+
+  function handleSelectByLabel(label) {
+    for (let j = 0; j < buttons.length; j = j + 1) {
+      if (buttons[j].label === label) {
+        selectedIndex = j;
+        selected = buttons[j] ?? null;
+        break;
+      }
+    }
+  }
+
+  onMount(() => {
+    select = handleSelectByLabel;
+  });
 </script>
 
 <div
@@ -53,8 +72,7 @@
       text: button.text,
       props: {
         ...(button.props || {}),
-        disabled: button.disabled,
-        active: index === selectedIndex,
+        selected: index === selectedIndex,
         onclick: () => handleSelect(index)
       }
     })}

package/dist/widgets/button-group/ButtonGroup.svelte.d.ts

@@ -5,17 +5,20 @@ declare const ButtonGroup: import("svelte").Component<{
     bg?: string;
     classes?: string;
     buttons: Array<{
-        text: string;
-        disabled?: boolean;
+        text?: string;
+        value?: any;
+        label?: string;
         props?: any;
     }>;
     selected?: ({
-        text: string;
-        disabled?: boolean;
+        text?: string;
+        value?: any;
+        label?: string;
         props?: any;
     } | null);
+    select?: (label: string) => void;
     buttonSnippet: import("svelte").Snippet<[{
         text: string;
         props: any;
     }]>;
-}, {}, "selected">;
+}, {}, "select" | "selected">;

package/dist/widgets/presenter/Presenter.state.svelte.d.ts

@@ -29,6 +29,8 @@ export class PresenterState {
     pendingSlideName: string;
     /** @type {boolean} */
     configured: boolean;
+    /** @type {Map<Symbol, () => void>} */
+    onUpdateListeners: Map<Symbol, () => void>;
     /**
      * Configure the presentation
      *
@@ -81,5 +83,6 @@ export type PresenterRef = {
      * - Get the current slide name
      */
     getCurrentSlideName: () => string;
+    onUpdate: (callback: any) => Function;
 };
 import { HkPromise } from '../../classes/promise/index.js';

package/dist/widgets/presenter/Presenter.state.svelte.js

@@ -28,6 +28,7 @@ import { HkPromise } from '../../classes/promise/index.js';
  * @typedef {Object} PresenterRef
  * @property {(name: string) => void} gotoSlide - Navigate to a slide by name
  * @property {() => string} getCurrentSlideName - Get the current slide name
+ * @property {(callback)=>Function} onUpdate
  */
 
 const Z_BACK = 0;
@@ -94,6 +95,9 @@ export class PresenterState {
   /** @type {boolean} */
   configured = false;
 
+  /** @type {Map<Symbol, () => void>} */
+  onUpdateListeners = new Map();
+
   /**
    * Initialize the presenter state and set up reactivity
    */
@@ -400,6 +404,14 @@ export class PresenterState {
         }
       });
     }
+
+    this.#CallUpdateListeners();
+  }
+
+  #CallUpdateListeners() {
+    for (const fn of this.onUpdateListeners.values()) {
+      fn();
+    }
   }
 
   /**
@@ -544,7 +556,15 @@ export class PresenterState {
   getPresenterRef() {
     return {
       gotoSlide: (name) => this.gotoSlide(name),
-      getCurrentSlideName: () => this.currentSlideName
+      getCurrentSlideName: () => this.currentSlideName,
+      onUpdate: (callback) => {
+        const key = Symbol();
+        this.onUpdateListeners.set(key, callback);
+
+        return () => {
+          this.onUpdateListeners.delete(key);
+        };
+      }
     };
   }
 

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@hkdigital/lib-sveltekit",
-	"version": "0.1.31",
+	"version": "0.1.33",
 	"author": {
 		"name": "HKdigital",
 		"url": "https://hkdigital.nl"