@effindomv2/fui-as 0.1.49 → 0.1.51

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@effindomv2/fui-as",
-  "version": "0.1.49",
+  "version": "0.1.51",
   "private": false,
   "license": "AGPL-3.0-only OR LicenseRef-EffinDom-Commercial",
   "description": "EffinDom v2 AssemblyScript frontend framework SDK and browser harness",

package/scripts/build.sh

@@ -217,6 +217,7 @@ resolve_runtime_dist_dir() {
 }
 
 RUNTIME_DIST_DIR="$(resolve_runtime_dist_dir)"
+RUNTIME_SET_HASH="$(node -e 'const fs=require("fs"); const value=JSON.parse(fs.readFileSync(process.argv[1], "utf8")).runtime_set_hash; if (typeof value !== "string" || value.length === 0) process.exit(1); process.stdout.write(value);' "${RUNTIME_DIST_DIR}/effindom.v2.manifest.json")"
 
 write_runtime_config() {
   local destination="$1"
@@ -224,7 +225,11 @@ write_runtime_config() {
 
   cat > "${destination}/${RUNTIME_CONFIG_FILE}" <<EOF
 window.__effindomRuntime = Object.assign({}, window.__effindomRuntime, {
-  manifestUrl: new URL('${manifest_url}', document.currentScript && document.currentScript.src ? document.currentScript.src : document.baseURI).toString(),
+  manifestUrls: [
+    'https://runtimes.effindom.dev/v2/manifests/${RUNTIME_SET_HASH}.json',
+    new URL('${manifest_url}', document.currentScript && document.currentScript.src ? document.currentScript.src : document.baseURI).toString(),
+  ],
+  expectedRuntimeSetHash: '${RUNTIME_SET_HASH}',
   buildMode: 'debug',
 });
 EOF

package/src/controls/Button.ts

@@ -74,10 +74,6 @@ export class Button extends FlexBox {
   private readonly disposables: Array<Disposable> = new Array<Disposable>();
   private action: ((event: ClickEventArgs) => void) | null = null;
   private actionBinding: Callback1<ClickEventArgs> | null = null;
-  private doubleAction: ((event: ClickEventArgs) => void) | null = null;
-  private doubleActionBinding: Callback1<ClickEventArgs> | null = null;
-  private tripleAction: ((event: ClickEventArgs) => void) | null = null;
-  private tripleActionBinding: Callback1<ClickEventArgs> | null = null;
   private hoverChanged: ((event: HoverChangedEventArgs) => void) | null = null;
   private hoverChangedBinding: Callback1<HoverChangedEventArgs> | null = null;
   private disposed: bool = false;
@@ -171,40 +167,6 @@ export class Button extends FlexBox {
     return this;
   }
 
-  onDoubleClick(cb: (event: ClickEventArgs) => void): this {
-    this.doubleAction = cb;
-    this.doubleActionBinding = null;
-    return this;
-  }
-
-  bindDoubleClick<Owner>(owner: Owner, handler: Handler1<Owner, ClickEventArgs>): this {
-    this.doubleAction = null;
-    this.doubleActionBinding = bind1<Owner, ClickEventArgs>(owner, handler);
-    return this;
-  }
-
-  onDoubleClickWith<Owner>(owner: Owner, handler: Handler1<Owner, ClickEventArgs>): this {
-    this.bindDoubleClick(owner, handler);
-    return this;
-  }
-
-  onTripleClick(cb: (event: ClickEventArgs) => void): this {
-    this.tripleAction = cb;
-    this.tripleActionBinding = null;
-    return this;
-  }
-
-  bindTripleClick<Owner>(owner: Owner, handler: Handler1<Owner, ClickEventArgs>): this {
-    this.tripleAction = null;
-    this.tripleActionBinding = bind1<Owner, ClickEventArgs>(owner, handler);
-    return this;
-  }
-
-  onTripleClickWith<Owner>(owner: Owner, handler: Handler1<Owner, ClickEventArgs>): this {
-    this.bindTripleClick(owner, handler);
-    return this;
-  }
-
   onHoverChanged(cb: (event: HoverChangedEventArgs) => void): this {
     this.hoverChanged = cb;
     this.hoverChangedBinding = null;
@@ -369,7 +331,7 @@ export class Button extends FlexBox {
     this.pressed.value = true;
   }
 
-  endPress(clickCount: i32 = 1, fireAction: bool = true): void {
+  endPress(fireAction: bool = true): void {
     const wasPressed = this.pressed.value;
     this.pressed.value = false;
     if (!wasPressed || !fireAction) {
@@ -383,26 +345,6 @@ export class Button extends FlexBox {
     if (binding !== null) {
       binding.invoke(ClickEventArgs.Empty);
     }
-    if (clickCount == 2) {
-      const doubleCallback = this.doubleAction;
-      if (doubleCallback !== null) {
-        doubleCallback(ClickEventArgs.Empty);
-      }
-      const doubleBinding = this.doubleActionBinding;
-      if (doubleBinding !== null) {
-        doubleBinding.invoke(ClickEventArgs.Empty);
-      }
-    }
-    if (clickCount == 3) {
-      const tripleCallback = this.tripleAction;
-      if (tripleCallback !== null) {
-        tripleCallback(ClickEventArgs.Empty);
-      }
-      const tripleBinding = this.tripleActionBinding;
-      if (tripleBinding !== null) {
-        tripleBinding.invoke(ClickEventArgs.Empty);
-      }
-    }
   }
 
   cancelPress(): void {
@@ -459,7 +401,7 @@ export class Button extends FlexBox {
       return;
     }
     if (eventType == PointerEventType.Up && this.pressed.value) {
-      this.endPress(event === null || event.clickCount <= 0 ? 1 : event.clickCount, true);
+      this.endPress(true);
     }
   }
 
@@ -497,7 +439,7 @@ export class Button extends FlexBox {
     }
     if (eventType == KeyEventType.Up && this.keyboardArmedKey !== null && changetype<string>(this.keyboardArmedKey) == key) {
       this.keyboardArmedKey = null;
-      this.endPress(1, true);
+      this.endPress(true);
       return true;
     }
     return callbackHandled;

package/src/controls/Checkbox.ts

@@ -1,6 +1,6 @@
 import { Callback1, Handler1 } from "../core/BoundCallback";
 import { SemanticCheckedState, SemanticRole } from "../core/ffi";
-import { CheckboxChangedEventArgs } from "../core/Node";
+import { CheckboxChangedEventArgs, ClickEventArgs } from "../core/Node";
 import { PersistedInt32Codec, PersistedValueState } from "../core/PersistedState";
 import { bind1 } from "../core/bind";
 import { LabeledControlSizing } from "./ControlSizing";
@@ -124,6 +124,21 @@ export class Checkbox extends PressableLabeledControl {
     return this;
   }
 
+  onClick(callback: (event: ClickEventArgs) => void): this {
+    super.onClick(callback);
+    return this;
+  }
+
+  bindClick<Owner>(owner: Owner, handler: Handler1<Owner, ClickEventArgs>): this {
+    super.bindClick(owner, handler);
+    return this;
+  }
+
+  onClickWith<Owner>(owner: Owner, handler: Handler1<Owner, ClickEventArgs>): this {
+    super.onClickWith(owner, handler);
+    return this;
+  }
+
   bindChanged<Owner>(owner: Owner, handler: Handler1<Owner, CheckboxChangedEventArgs>): this {
     this.changedCallback = null;
     this.changedBinding = bind1<Owner, CheckboxChangedEventArgs>(owner, handler);

package/src/controls/RadioButton.ts

@@ -1,6 +1,6 @@
 import { Callback1, Handler1 } from "../core/BoundCallback";
 import { KeyEventType, SemanticCheckedState, SemanticRole } from "../core/ffi";
-import { RadioButtonChangedEventArgs } from "../core/Node";
+import { ClickEventArgs, RadioButtonChangedEventArgs } from "../core/Node";
 import { activeTheme } from "../core/Theme";
 import { bind1 } from "../core/bind";
 import { LabeledControlSizing } from "./ControlSizing";
@@ -87,6 +87,21 @@ export class RadioButton extends PressableLabeledControl {
     return this;
   }
 
+  onClick(callback: (event: ClickEventArgs) => void): this {
+    super.onClick(callback);
+    return this;
+  }
+
+  bindClick<Owner>(owner: Owner, handler: Handler1<Owner, ClickEventArgs>): this {
+    super.bindClick(owner, handler);
+    return this;
+  }
+
+  onClickWith<Owner>(owner: Owner, handler: Handler1<Owner, ClickEventArgs>): this {
+    super.onClickWith(owner, handler);
+    return this;
+  }
+
   bindChanged<Owner>(owner: Owner, handler: Handler1<Owner, RadioButtonChangedEventArgs>): this {
     this.changedCallback = null;
     this.changedBinding = bind1<Owner, RadioButtonChangedEventArgs>(owner, handler);

package/src/controls/Switch.ts

@@ -1,6 +1,6 @@
 import { Callback1, Handler1 } from "../core/BoundCallback";
 import { SemanticCheckedState, SemanticRole } from "../core/ffi";
-import { SwitchChangedEventArgs } from "../core/Node";
+import { ClickEventArgs, SwitchChangedEventArgs } from "../core/Node";
 import { PersistedBoolCodec, PersistedValueState } from "../core/PersistedState";
 import { bind1 } from "../core/bind";
 import { activeTheme } from "../core/Theme";
@@ -92,6 +92,21 @@ export class Switch extends PressableLabeledControl {
     return this;
   }
 
+  onClick(callback: (event: ClickEventArgs) => void): this {
+    super.onClick(callback);
+    return this;
+  }
+
+  bindClick<Owner>(owner: Owner, handler: Handler1<Owner, ClickEventArgs>): this {
+    super.bindClick(owner, handler);
+    return this;
+  }
+
+  onClickWith<Owner>(owner: Owner, handler: Handler1<Owner, ClickEventArgs>): this {
+    super.onClickWith(owner, handler);
+    return this;
+  }
+
   bindChanged<Owner>(owner: Owner, handler: Handler1<Owner, SwitchChangedEventArgs>): this {
     this.changedCallback = null;
     this.changedBinding = bind1<Owner, SwitchChangedEventArgs>(owner, handler);

package/src/controls/internal/PressableLabeledControl.ts

@@ -1,9 +1,11 @@
 import { rgba } from "../../color";
 import { HandlerAction } from "../../core/Action";
+import { Callback1, Handler1 } from "../../core/BoundCallback";
+import { bind1 } from "../../core/bind";
 import { Disposable, disposeAll } from "../../core/Disposable";
 import { FocusAdornerManager } from "../../core/FocusAdornerManager";
 import { keyboardFocusVisible } from "../../core/FocusVisibility";
-import { Node } from "../../core/Node";
+import { ClickEventArgs, Node } from "../../core/Node";
 import {
   AlignItems,
   CursorStyle,
@@ -37,6 +39,8 @@ export class PressableLabeledControl extends FlexBox {
   protected focusedState: bool = false;
   private keyPressedState: bool = false;
   private pointerPressedState: bool = false;
+  private clickCallback: ((event: ClickEventArgs) => void) | null = null;
+  private clickBinding: Callback1<ClickEventArgs> | null = null;
 
   constructor(role: SemanticRole, label: string, indicatorPresenterRoot: FlexBox) {
     super();
@@ -106,6 +110,7 @@ export class PressableLabeledControl extends FlexBox {
       this.pressedState = false;
       this.syncVisualState();
       this.handleActivated();
+      this.fireSemanticClick();
     }
   }
 
@@ -125,6 +130,7 @@ export class PressableLabeledControl extends FlexBox {
       this.pressedState = false;
       this.syncVisualState();
       this.handleActivated();
+      this.fireSemanticClick();
       return true;
     }
     return callbackHandled;
@@ -157,6 +163,23 @@ export class PressableLabeledControl extends FlexBox {
 
   protected handleActivated(): void {}
 
+  onClick(callback: (event: ClickEventArgs) => void): this {
+    this.clickCallback = callback;
+    this.clickBinding = null;
+    return this;
+  }
+
+  bindClick<Owner>(owner: Owner, handler: Handler1<Owner, ClickEventArgs>): this {
+    this.clickCallback = null;
+    this.clickBinding = bind1<Owner, ClickEventArgs>(owner, handler);
+    return this;
+  }
+
+  onClickWith<Owner>(owner: Owner, handler: Handler1<Owner, ClickEventArgs>): this {
+    this.bindClick(owner, handler);
+    return this;
+  }
+
   protected syncVisualState(): void {}
 
   protected replaceIndicatorRoot(nextRoot: FlexBox): void {
@@ -245,4 +268,16 @@ export class PressableLabeledControl extends FlexBox {
     }
     FocusAdornerManager.hideOwner(this);
   }
+
+  private fireSemanticClick(): void {
+    const callback = this.clickCallback;
+    if (callback !== null) {
+      callback(ClickEventArgs.Empty);
+      return;
+    }
+    const binding = this.clickBinding;
+    if (binding !== null) {
+      binding.invoke(ClickEventArgs.Empty);
+    }
+  }
 }

package/src/core/Application.ts

@@ -1,4 +1,6 @@
 import { FlexBox } from "../nodes/FlexBox";
+import { HandlerAction } from "./Action";
+import { Disposable } from "./Disposable";
 import { ContextMenuManager } from "./ContextMenuManager";
 import { disposeAllFetchRequests } from "./Fetch";
 import { disposeAllFileRequests } from "./File";
@@ -38,6 +40,8 @@ function disposeAppScopedAsyncWork(): void {
 }
 
 class ApplicationShell extends FlexBox {
+  private themeSubscription: Disposable | null = null;
+
   constructor(root: Node) {
     super();
     this.width(100.0, Unit.Percent)
@@ -48,6 +52,23 @@ class ApplicationShell extends FlexBox {
       .child(FocusAdornerManager.createDefaultHost())
       .child(ContextMenuManager.createDefaultMenu())
       .child(ToolTipManager.createDefaultHost());
+    this.themeSubscription = activeTheme.addAction(new HandlerAction<ApplicationShell, Theme>(this, (shell: ApplicationShell, theme: Theme): void => {
+      shell.applyTheme(theme);
+    }));
+    this.applyTheme(activeTheme.value);
+  }
+
+  dispose(): void {
+    const subscription = this.themeSubscription;
+    if (subscription !== null) {
+      this.themeSubscription = null;
+      subscription.dispose();
+    }
+    super.dispose();
+  }
+
+  private applyTheme(theme: Theme): void {
+    this.bgColor(theme.colors.background);
   }
 }
 

package/src/core/Node.ts

@@ -684,6 +684,10 @@ export abstract class Node implements DragGestureHost, Disposable {
   private portalFlag: bool = false;
   private pointerClickCallback: ((event: PointerClickEventArgs) => void) | null = null;
   private pointerClickBinding: Callback1<PointerClickEventArgs> | null = null;
+  private pointerDoubleClickCallback: ((event: PointerClickEventArgs) => void) | null = null;
+  private pointerDoubleClickBinding: Callback1<PointerClickEventArgs> | null = null;
+  private pointerTripleClickCallback: ((event: PointerClickEventArgs) => void) | null = null;
+  private pointerTripleClickBinding: Callback1<PointerClickEventArgs> | null = null;
   private pointerDownEventCallback: ((event: PointerEventArgs) => void) | null = null;
   private pointerDownEventBinding: Callback1<PointerEventArgs> | null = null;
   private pointerMoveEventCallback: ((event: PointerEventArgs) => void) | null = null;
@@ -1104,6 +1108,44 @@ export abstract class Node implements DragGestureHost, Disposable {
     return this;
   }
 
+  onPointerDoubleClick(cb: (event: PointerClickEventArgs) => void): this {
+    this.pointerDoubleClickCallback = cb;
+    this.pointerDoubleClickBinding = null;
+    this.requireInteractive();
+    return this;
+  }
+
+  bindPointerDoubleClick<Owner>(owner: Owner, handler: Handler1<Owner, PointerClickEventArgs>): this {
+    this.pointerDoubleClickCallback = null;
+    this.pointerDoubleClickBinding = bind1<Owner, PointerClickEventArgs>(owner, handler);
+    this.requireInteractive();
+    return this;
+  }
+
+  onPointerDoubleClickWith<Owner>(owner: Owner, handler: Handler1<Owner, PointerClickEventArgs>): this {
+    this.bindPointerDoubleClick(owner, handler);
+    return this;
+  }
+
+  onPointerTripleClick(cb: (event: PointerClickEventArgs) => void): this {
+    this.pointerTripleClickCallback = cb;
+    this.pointerTripleClickBinding = null;
+    this.requireInteractive();
+    return this;
+  }
+
+  bindPointerTripleClick<Owner>(owner: Owner, handler: Handler1<Owner, PointerClickEventArgs>): this {
+    this.pointerTripleClickCallback = null;
+    this.pointerTripleClickBinding = bind1<Owner, PointerClickEventArgs>(owner, handler);
+    this.requireInteractive();
+    return this;
+  }
+
+  onPointerTripleClickWith<Owner>(owner: Owner, handler: Handler1<Owner, PointerClickEventArgs>): this {
+    this.bindPointerTripleClick(owner, handler);
+    return this;
+  }
+
   onPointerDown(cb: (event: PointerEventArgs) => void): this {
     this.pointerDownEventCallback = cb;
     this.pointerDownEventBinding = null;
@@ -2166,12 +2208,43 @@ export abstract class Node implements DragGestureHost, Disposable {
     const callback = this.pointerClickCallback;
     if (callback !== null) {
       callback(clickEvent);
-      return;
+    } else {
+      const binding = this.pointerClickBinding;
+      if (binding !== null) {
+        binding.invoke(clickEvent);
+      }
     }
-    const binding = this.pointerClickBinding;
-    if (binding !== null) {
-      binding.invoke(clickEvent);
+    if (clickEvent.clickCount == 2) {
+      const doubleCallback = this.pointerDoubleClickCallback;
+      if (doubleCallback !== null) {
+        doubleCallback(clickEvent);
+      } else {
+        const doubleBinding = this.pointerDoubleClickBinding;
+        if (doubleBinding !== null) {
+          doubleBinding.invoke(clickEvent);
+        }
+      }
+    } else if (clickEvent.clickCount == 3) {
+      const tripleCallback = this.pointerTripleClickCallback;
+      if (tripleCallback !== null) {
+        tripleCallback(clickEvent);
+      } else {
+        const tripleBinding = this.pointerTripleClickBinding;
+        if (tripleBinding !== null) {
+          tripleBinding.invoke(clickEvent);
+        }
+      }
     }
+    event.handled = clickEvent.handled;
+  }
+
+  private hasPointerClickHandler(): bool {
+    return this.pointerClickCallback !== null
+      || this.pointerClickBinding !== null
+      || this.pointerDoubleClickCallback !== null
+      || this.pointerDoubleClickBinding !== null
+      || this.pointerTripleClickCallback !== null
+      || this.pointerTripleClickBinding !== null;
   }
 
   private cancelDragState(): void {
@@ -2212,7 +2285,7 @@ export abstract class Node implements DragGestureHost, Disposable {
     if (!event.handled) {
       if (event.eventType == PointerEventType.Down) {
         const isPrimaryButton = isPrimaryActivationPointer(event);
-        this.clickPending = isPrimaryButton && (this.pointerClickCallback !== null || this.pointerClickBinding !== null);
+        this.clickPending = isPrimaryButton && this.hasPointerClickHandler();
         this.clickPendingCount = event.clickCount;
       } else if (event.eventType == PointerEventType.Up) {
         if (this.clickPending) {
@@ -2259,14 +2332,14 @@ export abstract class Node implements DragGestureHost, Disposable {
       if (dragGesture !== null && isPrimaryButton) {
         const waitForLongPress = event.pointerType == PointerType.Touch || event.pointerType == PointerType.Pen;
         dragGesture.handlePointerDown(nodeX, nodeY, _modifiers, waitForLongPress);
-        this.dragClickPending = this.pointerClickCallback !== null || this.pointerClickBinding !== null;
+        this.dragClickPending = this.hasPointerClickHandler();
         this.dragClickPendingCount = event.clickCount;
         this.clickPending = false;
         this.clickPendingCount = 0;
       } else {
         this.dragClickPending = false;
         this.dragClickPendingCount = 0;
-        this.clickPending = isPrimaryButton && (this.pointerClickCallback !== null || this.pointerClickBinding !== null);
+        this.clickPending = isPrimaryButton && this.hasPointerClickHandler();
         this.clickPendingCount = event.clickCount;
       }
       return;

package/src/nodes/FlexBox.ts

@@ -619,6 +619,16 @@ export class FlexBox extends Node {
     return this;
   }
 
+  onPointerDoubleClick(cb: (event: PointerClickEventArgs) => void): this {
+    super.onPointerDoubleClick(cb);
+    return this;
+  }
+
+  onPointerTripleClick(cb: (event: PointerClickEventArgs) => void): this {
+    super.onPointerTripleClick(cb);
+    return this;
+  }
+
   onPointerEnter(cb: (event: PointerEventArgs) => void): this {
     super.onPointerEnter(cb);
     return this;

package/src/nodes/Grid.ts

@@ -129,6 +129,16 @@ export class Grid extends FlexBox {
     return this;
   }
 
+  onPointerDoubleClick(cb: (event: PointerClickEventArgs) => void): this {
+    super.onPointerDoubleClick(cb);
+    return this;
+  }
+
+  onPointerTripleClick(cb: (event: PointerClickEventArgs) => void): this {
+    super.onPointerTripleClick(cb);
+    return this;
+  }
+
   onPointerEnter(cb: (event: PointerEventArgs) => void): this {
     super.onPointerEnter(cb);
     return this;

package/src/nodes/ScrollView.ts

@@ -362,6 +362,16 @@ export class ScrollView extends Node {
     return this;
   }
 
+  onPointerDoubleClick(cb: (event: PointerClickEventArgs) => void): this {
+    super.onPointerDoubleClick(cb);
+    return this;
+  }
+
+  onPointerTripleClick(cb: (event: PointerClickEventArgs) => void): this {
+    super.onPointerTripleClick(cb);
+    return this;
+  }
+
   onPointerEnter(cb: (event: PointerEventArgs) => void): this {
     super.onPointerEnter(cb);
     return this;

package/src/nodes/TextCore.ts

@@ -618,6 +618,16 @@ export class TextCore extends Node {
     return this;
   }
 
+  onPointerDoubleClick(cb: (event: PointerClickEventArgs) => void): this {
+    super.onPointerDoubleClick(cb);
+    return this;
+  }
+
+  onPointerTripleClick(cb: (event: PointerClickEventArgs) => void): this {
+    super.onPointerTripleClick(cb);
+    return this;
+  }
+
   onPointerEnter(cb: (event: PointerEventArgs) => void): this {
     super.onPointerEnter(cb);
     return this;