@vortexm/vjt 0.1.16 → 0.1.18

package/dist/index.js

@@ -4281,7 +4281,18 @@ var NetworkRuntime = class {
         }
         const contentType = response.headers.get("content-type") ?? "";
         if (!contentType.toLowerCase().includes("text/event-stream")) {
-          throw new Error(`SSE response has unexpected content-type: ${contentType || "<empty>"}`);
+          const previewText = await response.text().catch(() => "");
+          const normalizedPreview = previewText.replaceAll(/\s+/g, " ").trim().slice(0, 240);
+          const error = new Error(`SSE response has unexpected content-type: ${contentType || "<empty>"}`);
+          error.sseDetails = {
+            status: response.status,
+            statusText: response.statusText,
+            responseUrl: response.url,
+            redirected: response.redirected,
+            contentType,
+            bodyPreview: normalizedPreview
+          };
+          throw error;
         }
         logRuntimeDebug(this.debugLogging, "sse-open", {
           url: safeUrl,
@@ -4335,7 +4346,8 @@ var NetworkRuntime = class {
         reconnectReason = error instanceof Error ? error.message : "stream-error";
         logRuntimeError("sseConnection", error, {
           url: safeUrl,
-          transport: "fetch"
+          transport: "fetch",
+          ...typeof error === "object" && error !== null && "sseDetails" in error ? { response: error.sseDetails } : {}
         });
       } finally {
         activeAbortController = null;
@@ -7898,6 +7910,7 @@ function samePath(left, right) {
 // src/lib/render.ts
 var DEFAULT_DATE_FORMAT = "dd.MM.yyyy";
 var MOBILE_RATIO_THRESHOLD = 1.15;
+var SCROLL_END_DEBOUNCE_MS = 140;
 var globalErrorLoggingAttached = false;
 function escapeHtml(value) {
   return String(value).replaceAll("&", "&amp;").replaceAll("<", "&lt;").replaceAll(">", "&gt;").replaceAll('"', "&quot;").replaceAll("'", "&#39;");
@@ -8076,6 +8089,7 @@ var RuntimeRenderer = class {
   activeScrollAnimationFrameId = null;
   pendingCursorReference = null;
   pendingCursorFrameId = null;
+  scrollEndTimeoutIds = /* @__PURE__ */ new Map();
   constructor(description, options = {}) {
     this.description = deepClone(description);
     this.resourceManager = options.resourceManager ?? null;
@@ -8315,6 +8329,10 @@ var RuntimeRenderer = class {
         window.clearTimeout(timeoutId);
       }
       this.toastTimeoutIds.clear();
+      for (const timeoutId of this.scrollEndTimeoutIds.values()) {
+        window.clearTimeout(timeoutId);
+      }
+      this.scrollEndTimeoutIds.clear();
       this.voiceRuntime.dispose();
     };
   }
@@ -9504,6 +9522,7 @@ var RuntimeRenderer = class {
       }
       element.addEventListener("scroll", () => {
         this.syncScrollStateForElement(element, key);
+        this.scheduleScrollEndEvent(element, node, key);
       }, { passive: true });
     }
   }
@@ -9825,6 +9844,7 @@ var RuntimeRenderer = class {
     if (typeof window === "undefined") {
       initialElement.scrollTop = Math.max(0, Math.min(targetTop, getMaxScrollTop(initialElement)));
       this.syncScrollStateForReference(reference, initialElement);
+      this.scheduleProgrammaticScrollEndForReference(reference);
       return;
     }
     if (this.activeScrollAnimationFrameId !== null) {
@@ -9837,6 +9857,7 @@ var RuntimeRenderer = class {
     if (Math.abs(delta) < 1) {
       initialElement.scrollTop = clampedTargetTop;
       this.syncScrollStateForReference(reference, initialElement);
+      this.scheduleProgrammaticScrollEndForReference(reference);
       return;
     }
     const durationMs = 300;
@@ -9858,6 +9879,7 @@ var RuntimeRenderer = class {
       } else {
         liveElement.scrollTop = liveTargetTop;
         this.syncScrollStateForReference(reference, liveElement);
+        this.scheduleProgrammaticScrollEndForReference(reference);
         this.activeScrollAnimationFrameId = null;
       }
     };
@@ -9953,6 +9975,41 @@ var RuntimeRenderer = class {
     state.isScrolledToTop = element.scrollTop <= 1;
     state.isScrolledToBottom = element.scrollTop >= maxScrollTop - 1;
   }
+  scheduleScrollEndEvent(element, node, key) {
+    if (!node.events?.onScroll?.length || typeof window === "undefined") {
+      return;
+    }
+    const existingTimeoutId = this.scrollEndTimeoutIds.get(key);
+    if (existingTimeoutId !== void 0) {
+      window.clearTimeout(existingTimeoutId);
+    }
+    const timeoutId = window.setTimeout(() => {
+      this.scrollEndTimeoutIds.delete(key);
+      void this.actionRuntime.dispatchWidgetEvent(
+        node,
+        "onScroll",
+        key,
+        getActionInputValueForElement(element, node, this.stateByKey),
+        null
+      );
+    }, SCROLL_END_DEBOUNCE_MS);
+    this.scrollEndTimeoutIds.set(key, timeoutId);
+  }
+  scheduleProgrammaticScrollEndForReference(reference) {
+    const element = this.findScrollableWidgetElement(reference);
+    if (!(element instanceof HTMLElement)) {
+      return;
+    }
+    const key = element.dataset.widgetKey ?? reference.split(".")[0]?.trim() ?? "";
+    if (!key) {
+      return;
+    }
+    const node = this.nodeByKey.get(key) ?? this.nodeById.get(key);
+    if (!node || !isScrollableWidgetNode(node)) {
+      return;
+    }
+    this.scheduleScrollEndEvent(element, node, key);
+  }
   toScrollableIndex(value) {
     if (typeof value === "number" && Number.isFinite(value)) {
       return Math.max(0, Math.trunc(value));

package/dist/lib/types.d.ts

@@ -3,7 +3,7 @@ export type LayoutType = 'vertical' | 'horizontal' | 'grid';
 export type TextAlign = 'left' | 'center' | 'right';
 export type VerticalAlign = 'top' | 'center' | 'bottom';
 export type HeadingTag = 'h1' | 'h2' | 'h3' | 'h4' | 'h5' | 'h6';
-export type WidgetEventName = 'onClick' | 'onUserValueChange' | 'onRefresh' | 'onEnter' | 'onShiftEnter' | 'onControlEnter' | 'onPaste';
+export type WidgetEventName = 'onClick' | 'onUserValueChange' | 'onRefresh' | 'onEnter' | 'onShiftEnter' | 'onControlEnter' | 'onPaste' | 'onScroll';
 export type SystemEventName = 'onBeforeRender' | 'onAfterRender' | 'onBeforeNavigate' | 'onAfterNavigate' | 'onLayoutSwitchToMobile' | 'onLayoutSwitchToDesktop' | 'onSpeechDetected' | 'onRecordingStarted' | 'onRecordingStopped' | 'onRecordingError' | 'onListeningError' | 'onListeringError' | 'onPlayFinished' | 'onPlayingStopped';
 export type PrimitiveRequestType = 'int' | 'float' | 'boolean' | 'string';
 export type ClosableRuntimeResource = {

package/dist/lib/widgets/bindings.d.ts

@@ -12,7 +12,7 @@ type BindingEnvironment = {
     }) => void;
     updatePointerFromEvent: (event: MouseEvent) => void;
     updateOwningListElementDescriptor: (element: HTMLElement, mutate: (descriptor: DescriptionNode) => void) => void;
-    dispatchWidgetEvent: (node: DescriptionNode, eventName: 'onClick' | 'onUserValueChange' | 'onEnter' | 'onShiftEnter' | 'onControlEnter' | 'onPaste', key: string, inputValue?: unknown, pointer?: {
+    dispatchWidgetEvent: (node: DescriptionNode, eventName: 'onClick' | 'onUserValueChange' | 'onEnter' | 'onShiftEnter' | 'onControlEnter' | 'onPaste' | 'onScroll', key: string, inputValue?: unknown, pointer?: {
         x: number;
         y: number;
     } | null) => Promise<void>;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vortexm/vjt",
-  "version": "0.1.16",
+  "version": "0.1.18",
   "type": "module",
   "main": "./dist/index.js",
   "types": "./dist/index.d.ts",

package/vjt-styles.css

@@ -557,6 +557,12 @@ body {
   grid-area: 1 / 1;
   min-width: 0;
   min-height: 0;
+  position: relative;
+  pointer-events: none;
+}
+
+.vjt-overlay-layer > * {
+  pointer-events: auto;
 }
 
 .vjt-overlay-layer > .vjt-static-text,