steel-frame 5.1.13 → 5.1.15

package/lib/index.js

@@ -2,7 +2,7 @@ import { devArrayModel, devAwaited, DevDelay, devEnsure, devExpr, DevFor, devMap
 import { devModal, devPrompt, devRouterApp, devMount } from "vasille-web/dev";
 import { devScreen } from "vasille-router/dev";
 import { Inspector } from "./inspector.js";
-export { executionPosition, wrapFn, runFn, registerReference, shareStateById, positionedText } from "vasille/dev";
+export { executionPosition, wrapFn, runFn, registerReference, shareStateById, positionedText, setupPosition, } from "vasille/dev";
 export { setErrorHandler, earlyInspector } from "vasille-jsx/dev";
 export { safe, } from "vasille-web";
 export { setLaptopMaxWidth, setTabletMaxWidth, setMobileMaxWidth } from "vasille-css";

package/lib/inspector.js

@@ -88,7 +88,8 @@ class AppHandler {
             return;
         }
         const tags = new Set();
-        this.iterateFragment(this.app, new Set(ids), tags);
+        const texts = new Set();
+        this.iterateFragment(this.app, new Set(ids), tags, texts);
         const canvas = this.canvas;
         const ctx = canvas?.getContext("2d");
         if (ctx && canvas) {
@@ -99,6 +100,16 @@ class AppHandler {
                 ctx.fillRect(rect.x, rect.y, rect.width, rect.height);
             }
         }
+        const sel = window.getSelection();
+        if (sel) {
+            sel.removeAllRanges();
+            for (const text of texts) {
+                const range = document.createRange();
+                // @ts-expect-error node field is protected
+                range.selectNodeContents(text.node);
+                sel.addRange(range);
+            }
+        }
     }
     setLookup(active) {
         this.active.V = active;
@@ -112,13 +123,13 @@ class AppHandler {
             }
         }
     }
-    iterateFragment(node, ids, set) {
+    iterateFragment(node, ids, set, texts) {
         for (const child of node.children) {
             if ("id" in child && ids.has(child.id)) {
-                this.addReactive(child, set);
+                this.addReactive(child, set, texts);
             }
             else if (child instanceof Fragment) {
-                this.iterateFragment(child, ids, set);
+                this.iterateFragment(child, ids, set, texts);
             }
         }
     }
@@ -134,20 +145,21 @@ class AppHandler {
             set.add(it);
         }
     }
-    addFragment(node, set) {
+    addFragment(node, set, texts) {
         for (const child of node.children) {
-            this.addReactive(child, set);
+            this.addReactive(child, set, texts);
         }
     }
-    addReactive(node, set) {
+    addReactive(node, set, texts) {
         if (node instanceof DevTag) {
             this.addTag(node, set);
         }
         else if (node instanceof DevTextNode) {
             this.addText(node, set);
+            texts.add(node);
         }
         else if (node instanceof DevFragment) {
-            this.addFragment(node, set);
+            this.addFragment(node, set, texts);
         }
     }
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "steel-frame",
-  "version": "5.1.13",
+  "version": "5.1.15",
   "description": "SteelFrame: Build Fault-Tolerant Web Applications Effortlessly.",
   "main": "index.js",
   "types": "./index.d.ts",

package/src/index.ts

@@ -24,7 +24,15 @@ import { TagOptions } from "vasille/web-runner";
 import { devScreen } from "vasille-router/dev";
 import { Inspector } from "./inspector.js";
 
-export { executionPosition, wrapFn, runFn, registerReference, shareStateById, positionedText } from "vasille/dev";
+export {
+    executionPosition,
+    wrapFn,
+    runFn,
+    registerReference,
+    shareStateById,
+    positionedText,
+    setupPosition,
+} from "vasille/dev";
 export { setErrorHandler, earlyInspector } from "vasille-jsx/dev";
 export { type IdeSide, type AppSide } from "./communication.js";
 

package/src/inspector.ts

@@ -105,8 +105,9 @@ class AppHandler implements AppSide {
         }
 
         const tags = new Set<DevTag>();
+        const texts = new Set<DevTextNode>();
 
-        this.iterateFragment(this.app as unknown as Fragment<Node, Element, TagOptions>, new Set(ids), tags);
+        this.iterateFragment(this.app as unknown as Fragment<Node, Element, TagOptions>, new Set(ids), tags, texts);
 
         const canvas = this.canvas;
         const ctx = canvas?.getContext("2d");
@@ -121,6 +122,19 @@ class AppHandler implements AppSide {
                 ctx.fillRect(rect.x, rect.y, rect.width, rect.height);
             }
         }
+
+        const sel = window.getSelection();
+
+        if (sel) {
+            sel.removeAllRanges();
+
+            for (const text of texts) {
+                const range = document.createRange();
+                // @ts-expect-error node field is protected
+                range.selectNodeContents(text.node);
+                sel.addRange(range);
+            }
+        }
     }
     public setLookup(active: boolean): void {
         this.active.V = active;
@@ -137,12 +151,17 @@ class AppHandler implements AppSide {
         }
     }
 
-    protected iterateFragment(node: Fragment<Node, Element, TagOptions>, ids: Set<number>, set: Set<DevTag>) {
+    protected iterateFragment(
+        node: Fragment<Node, Element, TagOptions>,
+        ids: Set<number>,
+        set: Set<DevTag>,
+        texts: Set<DevTextNode>,
+    ) {
         for (const child of node.children) {
             if ("id" in child && ids.has(child.id as number)) {
-                this.addReactive(child, set);
+                this.addReactive(child, set, texts);
             } else if (child instanceof Fragment) {
-                this.iterateFragment(child, ids, set);
+                this.iterateFragment(child, ids, set, texts);
             }
         }
     }
@@ -163,19 +182,20 @@ class AppHandler implements AppSide {
         }
     }
 
-    protected addFragment(node: DevFragment<Node, Element, TagOptions>, set: Set<DevTag>) {
+    protected addFragment(node: DevFragment<Node, Element, TagOptions>, set: Set<DevTag>, texts: Set<DevTextNode>) {
         for (const child of node.children) {
-            this.addReactive(child, set);
+            this.addReactive(child, set, texts);
         }
     }
 
-    protected addReactive(node: Reactive, set: Set<DevTag>) {
+    protected addReactive(node: Reactive, set: Set<DevTag>, texts: Set<DevTextNode>) {
         if (node instanceof DevTag) {
             this.addTag(node, set);
         } else if (node instanceof DevTextNode) {
             this.addText(node, set);
+            texts.add(node);
         } else if (node instanceof DevFragment) {
-            this.addFragment(node, set);
+            this.addFragment(node, set, texts);
         }
     }
 }

package/types/index.d.ts

@@ -4,7 +4,7 @@ import { devModal, devPrompt } from "vasille-web/dev";
 import { App } from "vasille";
 import { TagOptions } from "vasille/web-runner";
 import { devScreen } from "vasille-router/dev";
-export { executionPosition, wrapFn, runFn, registerReference, shareStateById, positionedText } from "vasille/dev";
+export { executionPosition, wrapFn, runFn, registerReference, shareStateById, positionedText, setupPosition, } from "vasille/dev";
 export { setErrorHandler, earlyInspector } from "vasille-jsx/dev";
 export { type IdeSide, type AppSide } from "./communication.js";
 export { type QueryParams, type ScreenProps, type RouteParameters, type FallbackScreenProps, type ErrorScreenProps, type WebRouterInitialization, type NavigationMode, type Router, safe, } from "vasille-web";