verstak 0.95.25047 → 0.96.26001

package/build/dist/source/components/Button.v.js

@@ -1,39 +1,41 @@
 import { ReactiveTreeNode, Mode, derivative } from "reactronic";
-import { Block, JustText, OnClick } from "verstak";
+import { Block, OnClick } from "verstak";
 import { rxModel } from "./common/Utils.js";
 import { Theme } from "./Theme.js";
 import { Icon } from "./Icon.v.js";
 export function Button(declaration) {
     return (Block(derivative(declaration, {
         mode: Mode.autonomous,
-        preparation: el => {
+        preparation() {
             var _a;
-            (_a = el.model) !== null && _a !== void 0 ? _a : (el.model = rxModel({
+            (_a = this.model) !== null && _a !== void 0 ? _a : (this.model = rxModel({
                 icon: "fa-solid fa-square",
                 label: ReactiveTreeNode.current.key,
             }));
         },
-        script: el => {
-            const m = el.model;
+        body() {
+            const m = this.model;
             const theme = Theme.current.button;
-            el.useStylingPreset(theme.main);
+            this.useStylingPreset(theme.main);
             if (m.icon) {
                 Icon(m.icon, {
-                    script: (el, base) => {
+                    body(el, base) {
                         base();
-                        el.useStylingPreset(theme.icon);
+                        this.useStylingPreset(theme.icon);
                     },
                 });
             }
             if (m.label) {
-                JustText(m.label, false, {
-                    script: (el, base) => {
+                Block({
+                    body(el, base) {
                         base();
-                        el.useStylingPreset(theme.label);
+                        this.textIsFormatted = false;
+                        this.text = m.label;
+                        this.useStylingPreset(theme.label);
                     },
                 });
             }
-            OnClick(el.native, m.action);
+            OnClick(this.native, m.action);
         },
     })));
 }

package/build/dist/source/components/Icon.v.js

@@ -4,11 +4,11 @@ import { Theme } from "./Theme.js";
 export function Icon(name, declaration) {
     return (Block(derivative(declaration, {
         mode: Mode.autonomous,
-        triggers: { name },
-        script: el => {
+        signalArgs: { name },
+        body() {
             const theme = Theme.current.icon;
-            el.useStylingPreset(name);
-            el.useStylingPreset(theme.main);
+            this.useStylingPreset(name);
+            this.useStylingPreset(theme.main);
         },
     })));
 }

package/build/dist/source/components/Image.v.js

@@ -4,15 +4,15 @@ import { rxModel } from "./common/Utils.js";
 export function Image(declaration) {
     return (Block(derivative(declaration, {
         mode: Mode.autonomous,
-        preparation: el => {
+        preparation() {
             var _a;
-            (_a = el.model) !== null && _a !== void 0 ? _a : (el.model = rxModel({ source: undefined }));
+            (_a = this.model) !== null && _a !== void 0 ? _a : (this.model = rxModel({ source: undefined }));
         },
-        script: el => {
-            const m = el.model;
-            el.style.backgroundImage = `url(${m.source})`;
-            el.style.backgroundSize = "contain";
-            el.style.backgroundRepeat = "no-repeat";
+        body() {
+            const m = this.model;
+            this.style.backgroundImage = `url(${m.source})`;
+            this.style.backgroundSize = "contain";
+            this.style.backgroundRepeat = "no-repeat";
         },
     })));
 }

package/build/dist/source/components/Input.v.js

@@ -1,25 +1,25 @@
 import { Mode, derivative } from "reactronic";
-import { Block, JustText, OnFocus, rowBreak, Fragment, KeyboardModifiers, Horizontal, Vertical } from "verstak";
+import { Block, OnFocus, rowBreak, Fragment, KeyboardModifiers, Horizontal, Vertical } from "verstak";
 import { rxModel } from "./common/Utils.js";
 import { Theme } from "./Theme.js";
 import { Icon } from "./Icon.v.js";
 export function Input(declaration) {
     return (Block(derivative(declaration, {
         mode: Mode.autonomous,
-        preparation: el => {
+        preparation() {
             var _a;
-            (_a = el.model) !== null && _a !== void 0 ? _a : (el.model = composeInputModel());
-            el.native.dataForSensor.focus = el.model;
+            (_a = this.model) !== null && _a !== void 0 ? _a : (this.model = composeInputModel());
+            this.native.dataForSensor.focus = this.model;
         },
-        script: el => {
-            const m = el.model;
+        body() {
+            const m = this.model;
             const theme = Theme.current.input;
-            el.useStylingPreset(theme.main);
+            this.useStylingPreset(theme.main);
             if (m.icon)
                 Icon(m.icon, {
-                    script: (el, base) => {
+                    body(el, base) {
                         base();
-                        el.useStylingPreset(theme.icon);
+                        this.useStylingPreset(theme.icon);
                     },
                 });
             InputField(m, theme);
@@ -43,22 +43,22 @@ export function composeInputModel(props) {
     });
 }
 function InputField(model, styling) {
-    return (JustText(model.text, false, {
+    return (Block({
         key: InputField.name,
-        preparation: (el, base) => {
-            const e = el.native;
-            el.useStylingPreset(styling.field);
-            el.horizontally = Horizontal.stretch;
-            el.vertically = Vertical.stretch;
+        preparation(el, base) {
+            const e = this.native;
+            this.useStylingPreset(styling.field);
+            this.horizontally = Horizontal.stretch;
+            this.vertically = Vertical.stretch;
+            this.textIsEditable = true;
             e.tabIndex = 0;
-            e.contentEditable = "true";
             e.dataForSensor.focus = model;
             base();
         },
-        script: el => {
-            const e = el.native;
+        body() {
+            const e = this.native;
             if (!model.isEditMode)
-                e.innerText = model.text;
+                this.text = model.text;
             Fragment(() => {
                 const keyboard = e.sensors.keyboard;
                 if (keyboard.down) {
@@ -81,25 +81,31 @@ function InputField(model, styling) {
 function InputPopup(model, styling) {
     return (Block({
         key: InputPopup.name,
-        script: el => {
-            el.useStylingPreset(styling.popup);
-            Fragment(() => model.position = el.native.sensors.scroll.y);
-            const visible = el.overlayVisible = model.isEditMode;
+        body() {
+            this.useStylingPreset(styling.popup);
+            Fragment(() => model.position = this.native.sensors.scroll.y);
+            const visible = this.overlayVisible = model.isEditMode;
             if (visible) {
                 const options = model.options;
                 if (options.length > 0) {
                     for (const x of model.options) {
                         rowBreak();
-                        JustText(x, false, {
+                        Block({
                             key: x,
-                            preparation: el => {
-                                el.contentWrapping = false;
+                            preparation() {
+                                this.text = x;
+                                this.contentWrapping = false;
                             },
                         });
                     }
                 }
                 else
-                    JustText("(nothing)", false, { key: "(nothing)" });
+                    Block({
+                        key: "(nothing)",
+                        body() {
+                            this.text = "(nothing)";
+                        },
+                    });
             }
         },
     }));

package/build/dist/source/components/Markdown.v.d.ts

@@ -1 +1 @@
-export declare function Markdown(content: string): import("reactronic").ReactiveTreeNode<import("verstak").El<HTMLElement, void>>;
+export declare function Markdown(content: string): import("reactronic").ReactiveTreeNode<import("verstak").El<HTMLElement, unknown>>;

package/build/dist/source/components/Markdown.v.js

@@ -1,12 +1,16 @@
-import { JustText } from "verstak";
 import Md from "markdown-it";
 import * as prism from "prismjs";
+import { Block } from "verstak";
 export function Markdown(content) {
-    return (JustText(md.render(content), true, {
-        preparation: (el, base) => {
-            el.contentWrapping = true;
+    return (Block({
+        preparation(el, base) {
+            this.contentWrapping = true;
             base();
         },
+        body() {
+            this.textIsFormatted = true;
+            this.text = md.render(content);
+        },
     }));
 }
 const md = new Md({

package/build/dist/source/components/Spinner.v.js

@@ -1,16 +1,21 @@
 import { Mode, derivative } from "reactronic";
-import { Block, JustText } from "verstak";
+import { Block } from "verstak";
 import { rxModel } from "./common/Utils.js";
 export function Spinner(declaration) {
     return (Block(derivative(declaration, {
         mode: Mode.autonomous,
-        preparation: el => {
+        preparation() {
             var _a;
-            (_a = el.model) !== null && _a !== void 0 ? _a : (el.model = composeSpinnerModel());
+            (_a = this.model) !== null && _a !== void 0 ? _a : (this.model = composeSpinnerModel());
         },
-        script: el => {
-            const m = el.model;
-            m.active && JustText("loading...");
+        body() {
+            const m = this.model;
+            if (m.active)
+                Block({
+                    body() {
+                        this.text = "loading...";
+                    },
+                });
         },
     })));
 }

package/build/dist/source/components/Toggle.v.js

@@ -1,42 +1,43 @@
 import { ReactiveTreeNode, Mode, derivative } from "reactronic";
-import { Block, JustText, OnClick } from "verstak";
+import { Block, OnClick } from "verstak";
 import { rxModel } from "./common/Utils.js";
 import { Theme } from "./Theme.js";
 import { Icon } from "./Icon.v.js";
 export function Toggle(declaration) {
     return (Block(derivative(declaration, {
         mode: Mode.autonomous,
-        preparation: el => {
+        preparation() {
             var _a;
-            (_a = el.model) !== null && _a !== void 0 ? _a : (el.model = rxModel({
+            (_a = this.model) !== null && _a !== void 0 ? _a : (this.model = rxModel({
                 label: ReactiveTreeNode.current.key,
                 checked: true,
                 color: "green"
             }));
         },
-        script: el => {
-            const m = el.model;
+        body() {
+            const m = this.model;
             const theme = Theme.current;
             const toggleTheme = theme.toggle;
-            el.useStylingPreset(toggleTheme.main);
+            this.useStylingPreset(toggleTheme.main);
             Icon(`fa-solid fa-toggle-${m.checked ? "on" : "off"}`, {
-                script: (el, base) => {
+                body(el, base) {
                     var _a;
                     base();
-                    el.useStylingPreset(toggleTheme.icon);
-                    el.style.color = m.checked ? ((_a = theme.positiveColor) !== null && _a !== void 0 ? _a : "") : "";
+                    this.useStylingPreset(toggleTheme.icon);
+                    this.style.color = m.checked ? ((_a = theme.positiveColor) !== null && _a !== void 0 ? _a : "") : "";
                 },
             });
             if (m.label) {
-                JustText(m.label, false, {
-                    script: (el, base) => {
+                Block({
+                    body(el, base) {
                         base();
-                        el.useStylingPreset(toggleTheme.label);
+                        this.text = m.label;
+                        this.useStylingPreset(toggleTheme.label);
                     },
                 });
             }
-            OnClick(el.native, () => {
-                el.model.checked = !el.model.checked;
+            OnClick(this.native, () => {
+                this.model.checked = !this.model.checked;
             });
         },
     })));

package/build/dist/source/core/El.d.ts

@@ -16,6 +16,9 @@ export type El<T = any, M = any> = {
     stretchingStrengthVertically: number | undefined;
     contentWrapping: boolean;
     overlayVisible: boolean | undefined;
+    text: string | undefined;
+    textIsFormatted: boolean;
+    textIsEditable: boolean;
     sealed: Direction | undefined;
     splitView: Direction | undefined;
     widthPx: {
@@ -33,12 +36,11 @@ export type El<T = any, M = any> = {
 export declare enum ElKind {
     block = 0,
     table = 1,
-    text = 2,
-    group = 3,
-    partition = 4,
-    splitter = 5,
-    cursor = 6,
-    native = 7
+    group = 2,
+    partition = 3,
+    splitter = 4,
+    cursor = 5,
+    native = 6
 }
 export type ElCoords = {
     x1: number;

package/build/dist/source/core/El.js

@@ -2,12 +2,11 @@ export var ElKind;
 (function (ElKind) {
     ElKind[ElKind["block"] = 0] = "block";
     ElKind[ElKind["table"] = 1] = "table";
-    ElKind[ElKind["text"] = 2] = "text";
-    ElKind[ElKind["group"] = 3] = "group";
-    ElKind[ElKind["partition"] = 4] = "partition";
-    ElKind[ElKind["splitter"] = 5] = "splitter";
-    ElKind[ElKind["cursor"] = 6] = "cursor";
-    ElKind[ElKind["native"] = 7] = "native";
+    ElKind[ElKind["group"] = 2] = "group";
+    ElKind[ElKind["partition"] = 3] = "partition";
+    ElKind[ElKind["splitter"] = 4] = "splitter";
+    ElKind[ElKind["cursor"] = 5] = "cursor";
+    ElKind[ElKind["native"] = 6] = "native";
 })(ElKind || (ElKind = {}));
 export var Horizontal;
 (function (Horizontal) {

package/build/dist/source/core/ElDriver.d.ts

@@ -23,6 +23,9 @@ export declare class ElImpl<T extends Element = any, M = any> implements El<T, M
     private _stretchingStrengthVertically;
     private _contentWrapping;
     private _overlayVisible;
+    private _text;
+    private _textIsFormatted;
+    private _textIsEditable;
     private _sealed;
     private _splitView;
     private _hasStylingPresets;
@@ -72,6 +75,12 @@ export declare class ElImpl<T extends Element = any, M = any> implements El<T, M
     set contentWrapping(value: boolean);
     get overlayVisible(): boolean | undefined;
     set overlayVisible(value: boolean | undefined);
+    get text(): string | undefined;
+    set text(value: string | undefined);
+    get textIsFormatted(): boolean;
+    set textIsFormatted(value: boolean);
+    get textIsEditable(): boolean;
+    set textIsEditable(value: boolean);
     get sealed(): Direction | undefined;
     set sealed(value: Direction | undefined);
     get splitView(): Direction | undefined;
@@ -94,6 +103,9 @@ export declare class ElImpl<T extends Element = any, M = any> implements El<T, M
     private static applyOverlayVisible;
     static applySealed<T extends Element>(element: El<T, any>, value: Direction | undefined): void;
     static applySplitView<T extends Element>(element: El<T, any>, value: Direction | undefined): void;
+    static applyText<T extends Element>(element: El<T, any>, value: string | undefined): void;
+    static applyTextIsFormatted<T extends Element>(element: El<T, any>, value: boolean): void;
+    static applyTextIsEditable<T extends Element>(element: El<T, any>, value: boolean): void;
     private static applyStylingPreset;
 }
 export declare class ElLayoutInfo {

package/build/dist/source/core/ElDriver.js

@@ -36,6 +36,9 @@ export class ElImpl {
         this._stretchingStrengthVertically = undefined;
         this._contentWrapping = true;
         this._overlayVisible = undefined;
+        this._text = "";
+        this._textIsFormatted = false;
+        this._textIsEditable = false;
         this._sealed = undefined;
         this._splitView = undefined;
         this._hasStylingPresets = false;
@@ -47,7 +50,7 @@ export class ElImpl {
     get index() { return this.node.slot.index; }
     get isBlock() { return this.kind === ElKind.block; }
     get isTable() { return this.kind === ElKind.table; }
-    get isAuxiliary() { return this.kind > ElKind.text; }
+    get isAuxiliary() { return this.kind > ElKind.table; }
     get kind() { return this._kind; }
     set kind(value) {
         if (value !== this._kind || this.node.stamp >= Number.MAX_SAFE_INTEGER - 1) {
@@ -173,6 +176,27 @@ export class ElImpl {
             this._overlayVisible = value;
         }
     }
+    get text() { return this._text; }
+    set text(value) {
+        if (value !== this._text) {
+            ElImpl.applyText(this, value);
+            this._text = value;
+        }
+    }
+    get textIsFormatted() { return this._textIsFormatted; }
+    set textIsFormatted(value) {
+        if (value !== this._textIsFormatted) {
+            ElImpl.applyTextIsFormatted(this, value);
+            this._textIsFormatted = value;
+        }
+    }
+    get textIsEditable() { return this._textIsEditable; }
+    set textIsEditable(value) {
+        if (value !== this._textIsEditable) {
+            ElImpl.applyTextIsEditable(this, value);
+            this._textIsEditable = value;
+        }
+    }
     get sealed() { return this._sealed; }
     set sealed(value) {
         if (value !== this._sealed) {
@@ -526,6 +550,42 @@ export class ElImpl {
             });
         }
     }
+    static applyText(element, value) {
+        const e = element.native;
+        if (e instanceof HTMLElement) {
+            if (value) {
+                e.style.display = "inline-grid";
+                e.style.minWidth = "";
+            }
+            else {
+                e.style.display = "flex";
+                e.style.minWidth = "0";
+            }
+            if (element.textIsFormatted)
+                e.innerHTML = value !== null && value !== void 0 ? value : "";
+            else
+                e.innerText = value !== null && value !== void 0 ? value : "";
+        }
+    }
+    static applyTextIsFormatted(element, value) {
+        var _a, _b;
+        const e = element.native;
+        if (e instanceof HTMLElement) {
+            if (value)
+                e.innerHTML = (_a = element.text) !== null && _a !== void 0 ? _a : "";
+            else
+                e.innerText = (_b = element.text) !== null && _b !== void 0 ? _b : "";
+        }
+    }
+    static applyTextIsEditable(element, value) {
+        const e = element.native;
+        if (e instanceof HTMLElement) {
+            if (value)
+                e.contentEditable = "true";
+            else
+                e.contentEditable = "";
+        }
+    }
     static applyStylingPreset(element, secondary, styleName, enabled) {
         const native = element.native;
         enabled !== null && enabled !== void 0 ? enabled : (enabled = true);
@@ -708,7 +768,7 @@ export const Constants = {
     wrapper: "wrapper",
     splitter: "splitter",
     group: "group",
-    layouts: ["block", "table", "text", "group", "", "", ""],
+    layouts: ["block", "table", "group", "", "", ""],
     keyAttrName: "key",
     kindAttrName: "kind",
     ownReactiveTreeNodeKey: Symbol("own-reactive-tree-node"),
@@ -734,13 +794,6 @@ const DriversByLayout = [
         s.gridAutoColumns = "minmax(min-content, 1fr)";
         s.textAlign = "initial";
     },
-    el => {
-        const owner = el.node.owner.element;
-        const s = el.style;
-        s.alignSelf = owner.isTable ? "stretch" : "center";
-        s.display = "inline-grid";
-        s.flexShrink = "1";
-    },
     el => {
         const s = el.style;
         s.display = "contents";

package/build/dist/source/core/Elements.d.ts

@@ -14,25 +14,23 @@ export declare function Splitter<M = unknown>(declaration?: ReactiveTreeNodeDecl
 export declare function rowBreak(shiftCursorDown?: number): void;
 export declare function declareSplitter<T>(index: number, splitViewNode: ReactiveTreeNode<El<T>>): ReactiveTreeNode<El<HTMLElement>>;
 export declare function cursor(place: ElPlace): void;
-export declare function JustText(content: string, formatted?: boolean, declaration?: ReactiveTreeNodeDecl<El<HTMLElement, void>>): ReactiveTreeNode<El<HTMLElement, void>>;
-export declare function Group<M = unknown>(script?: Script<El<HTMLElement, M>>, scriptAsync?: ScriptAsync<El<HTMLElement, M>>, key?: string, mode?: Mode, preparation?: Script<El<HTMLElement, M>>, preparationAsync?: ScriptAsync<El<HTMLElement, M>>, finalization?: Script<El<HTMLElement, M>>, triggers?: unknown, basis?: ReactiveTreeNodeDecl<El<HTMLElement, M>>): ReactiveTreeNode<El<HTMLElement, M>>;
+export declare function Group<M = unknown>(body?: Script<El<HTMLElement, M>>, bodyTask?: ScriptAsync<El<HTMLElement, M>>, key?: string, mode?: Mode, preparation?: Script<El<HTMLElement, M>>, preparationAsync?: ScriptAsync<El<HTMLElement, M>>, finalization?: Script<El<HTMLElement, M>>, triggers?: unknown, basis?: ReactiveTreeNodeDecl<El<HTMLElement, M>>): ReactiveTreeNode<El<HTMLElement, M>>;
 export declare function Group<M = unknown>(declaration?: ReactiveTreeNodeDecl<El<HTMLElement, M>>): ReactiveTreeNode<El<HTMLElement, M>>;
-export declare function Fragment<M = unknown>(script: Script<El<void, M>>): ReactiveTreeNode<El<void, M>>;
-export declare function PseudoElement<M = unknown>(script?: Script<El<void, M>>, scriptAsync?: ScriptAsync<El<void, M>>, key?: string, mode?: Mode, preparation?: Script<El<void, M>>, preparationAsync?: ScriptAsync<El<void, M>>, finalization?: Script<El<void, M>>, triggers?: unknown, basis?: ReactiveTreeNodeDecl<El<void, M>>): ReactiveTreeNode<El<void, M>>;
+export declare function Fragment<M = unknown>(body: Script<El<void, M>>): ReactiveTreeNode<El<void, M>>;
+export declare function PseudoElement<M = unknown>(body?: Script<El<void, M>>, bodyTask?: ScriptAsync<El<void, M>>, key?: string, mode?: Mode, preparation?: Script<El<void, M>>, preparationAsync?: ScriptAsync<El<void, M>>, finalization?: Script<El<void, M>>, triggers?: unknown, basis?: ReactiveTreeNodeDecl<El<void, M>>): ReactiveTreeNode<El<void, M>>;
 export declare function PseudoElement<M = unknown>(declaration?: ReactiveTreeNodeDecl<El<void, M>>): ReactiveTreeNode<El<void, M>>;
 export declare class BlockDriver<T extends HTMLElement> extends HtmlDriver<T> {
-    runScript(node: ReactiveTreeNode<El<T>>): void | Promise<void>;
+    buildBody(node: ReactiveTreeNode<El<T>>): void | Promise<void>;
     declareChild(ownerNode: ReactiveTreeNode<El<T, any>>, childDriver: ReactiveTreeNodeDriver<any>, childDeclaration?: ReactiveTreeNodeDecl<any> | undefined, childBasis?: ReactiveTreeNodeDecl<any> | undefined): LinkedItem<ReactiveTreeNode> | undefined;
 }
 export declare function isSplitViewPartition(childDriver: ReactiveTreeNodeDriver): boolean;
 export declare class PartitionDriver<T extends HTMLElement> extends HtmlDriver<T> {
-    runScript(node: ReactiveTreeNode<El<T>>): void | Promise<void>;
+    buildBody(node: ReactiveTreeNode<El<T>>): void | Promise<void>;
     provideHost(node: ReactiveTreeNode<El<T, any>>): ReactiveTreeNode<El<T, any>>;
 }
 export declare const Drivers: {
     block: BlockDriver<HTMLElement>;
     table: HtmlDriver<HTMLElement, any>;
-    text: HtmlDriver<HTMLElement, any>;
     group: HtmlDriver<HTMLElement, any>;
     partition: PartitionDriver<HTMLElement>;
     wrapper: HtmlDriver<HTMLElement, any>;

package/build/dist/source/core/Elements.js

@@ -1,4 +1,4 @@
-import { ReactiveTreeNode, Mode, declare, derivative, launch, runNonReactive } from "reactronic";
+import { ReactiveTreeNode, Mode, declare, launch, runNonReactive } from "reactronic";
 import { ElKind, Direction } from "./El.js";
 import { clamp } from "./ElUtils.js";
 import { Constants, CursorCommandDriver, ElDriver, ElLayoutInfo, InitialElLayoutInfo } from "./ElDriver.js";
@@ -30,10 +30,12 @@ export function declareSplitter(index, splitViewNode) {
     return (Splitter({
         key,
         mode: Mode.autonomous,
-        preparation: el => el.native.className = `splitter ${key}`,
-        script: b => {
-            const e = b.native;
-            const model = b.model;
+        preparation() {
+            this.native.className = `splitter ${key}`;
+        },
+        body() {
+            const e = this.native;
+            const model = this.model;
             const dataForSensor = e.dataForSensor;
             dataForSensor.draggable = key;
             dataForSensor.drag = key;
@@ -80,35 +82,25 @@ export function declareSplitter(index, splitViewNode) {
 }
 export function cursor(place) {
     declare(Drivers.cursor, {
-        script: el => {
-            el.place = place;
+        body() {
+            this.place = place;
         },
     });
 }
-export function JustText(content, formatted, declaration) {
-    return declare(Drivers.text, derivative(declaration, {
-        script: el => {
-            if (formatted)
-                el.native.innerHTML = content;
-            else
-                el.native.innerText = content;
-        },
-    }));
-}
-export function Group(scriptOrDeclaration, scriptAsync, key, mode, preparation, preparationAsync, finalization, triggers, basis) {
-    return declare(Drivers.group, scriptOrDeclaration, scriptAsync, key, mode, preparation, preparationAsync, finalization, triggers, basis);
+export function Group(bodyOrDeclaration, bodyTask, key, mode, preparation, preparationAsync, finalization, triggers, basis) {
+    return declare(Drivers.group, bodyOrDeclaration, bodyTask, key, mode, preparation, preparationAsync, finalization, triggers, basis);
 }
-export function Fragment(script) {
-    return PseudoElement({ mode: Mode.autonomous, script });
+export function Fragment(body) {
+    return PseudoElement({ mode: Mode.autonomous, body });
 }
-export function PseudoElement(scriptOrDeclaration, scriptAsync, key, mode, preparation, preparationAsync, finalization, triggers, basis) {
-    return declare(Drivers.pseudo, scriptOrDeclaration, scriptAsync, key, mode, preparation, preparationAsync, finalization, triggers, basis);
+export function PseudoElement(bodyOrDeclaration, bodyTask, key, mode, preparation, preparationAsync, finalization, triggers, basis) {
+    return declare(Drivers.pseudo, bodyOrDeclaration, bodyTask, key, mode, preparation, preparationAsync, finalization, triggers, basis);
 }
 export class BlockDriver extends HtmlDriver {
-    runScript(node) {
+    buildBody(node) {
         rowBreak();
         const el = node.element;
-        const result = super.runScript(node);
+        const result = super.buildBody(node);
         if (el.splitView !== undefined) {
             if (el.layoutInfo === undefined)
                 el.layoutInfo = new ElLayoutInfo(InitialElLayoutInfo);
@@ -128,7 +120,7 @@ export class BlockDriver extends HtmlDriver {
             });
             const relayoutEl = PseudoElement({
                 mode: Mode.autonomous,
-                script: () => {
+                body() {
                     const native = el.native;
                     const isHorizontal = el.splitView === Direction.horizontal;
                     if (layoutInfo.isUpdateFinished) {
@@ -192,10 +184,10 @@ export class BlockDriver extends HtmlDriver {
                 }
                 const isHorizontal = el.splitView === Direction.horizontal;
                 if (childDeclaration !== undefined) {
-                    if (childDeclaration.triggers === undefined)
-                        childDeclaration.triggers = {};
-                    Object.defineProperty(childDeclaration.triggers, "index", { value: partCount });
-                    overrideMethod(childDeclaration, "script", el => {
+                    if (childDeclaration.signalArgs === undefined)
+                        childDeclaration.signalArgs = {};
+                    Object.defineProperty(childDeclaration.signalArgs, "index", { value: partCount });
+                    overrideMethod(childDeclaration, "body", el => {
                         if (isHorizontal)
                             el.style.gridColumn = `${partCount + 1}`;
                         else
@@ -226,32 +218,32 @@ function overrideMethod(declaration, method, func) {
         : (el, base) => { base(); func.call(el, el); };
 }
 export class PartitionDriver extends HtmlDriver {
-    runScript(node) {
-        const result = super.runScript(node);
+    buildBody(node) {
+        const result = super.buildBody(node);
         const ownerEl = node.owner.element;
         if (ownerEl.sealed !== undefined) {
             node.element.style.flexGrow = "1";
             declare(Drivers.wrapper, {
-                script: el => {
-                    const ownerEl = el.node.owner.owner.element;
+                body() {
+                    const ownerEl = this.node.owner.owner.element;
                     if (ownerEl.splitView !== undefined) {
-                        el.style.display = "grid";
-                        el.style.flexDirection = "";
+                        this.style.display = "grid";
+                        this.style.flexDirection = "";
                     }
                     else {
                         if (ownerEl.isTable) {
-                            el.style.display = "contents";
-                            el.style.flexDirection = "";
+                            this.style.display = "contents";
+                            this.style.flexDirection = "";
                         }
                         else {
-                            el.style.display = "flex";
-                            el.style.flexDirection = "row";
+                            this.style.display = "flex";
+                            this.style.flexDirection = "row";
                         }
                     }
-                    el.style.position = "absolute";
-                    el.style.inset = "0";
-                    el.style.overflow = "auto";
-                    el.style.gap = "inherit";
+                    this.style.position = "absolute";
+                    this.style.inset = "0";
+                    this.style.overflow = "auto";
+                    this.style.gap = "inherit";
                 },
             });
         }
@@ -270,7 +262,6 @@ export class PartitionDriver extends HtmlDriver {
 export const Drivers = {
     block: new BlockDriver(Constants.element, false, el => el.kind = ElKind.block),
     table: new HtmlDriver(Constants.element, false, el => el.kind = ElKind.table),
-    text: new HtmlDriver(Constants.element, false, el => el.kind = ElKind.text),
     group: new HtmlDriver(Constants.group, false, el => el.kind = ElKind.group),
     partition: new PartitionDriver(Constants.partition, true, el => el.kind = ElKind.partition),
     wrapper: new HtmlDriver(Constants.wrapper, false, el => el.kind = ElKind.native),

package/build/dist/source/core/WebDriver.d.ts

@@ -6,7 +6,7 @@ export declare class WebDriver<T extends Element, M = unknown> extends ElDriver<
     runPreparation(node: ReactiveTreeNode<El<T, M>>): void | Promise<void>;
     runFinalization(node: ReactiveTreeNode<El<T, M>>, isLeader: boolean): boolean;
     runMount(node: ReactiveTreeNode<El<T, M>>): void;
-    runScript(node: ReactiveTreeNode<El<T, M>>): void | Promise<void>;
+    buildBody(node: ReactiveTreeNode<El<T, M>>): void | Promise<void>;
     private assignExtraAttributesAndProperties;
     private clearExtraAttributesAndProperties;
     static getOwnNodeOfNativeElement<T extends Element>(element: T): ReactiveTreeNode<El<T>> | undefined;

package/build/dist/source/core/WebDriver.js

@@ -57,11 +57,11 @@ export class WebDriver extends ElDriver {
             }
         }
     }
-    runScript(node) {
+    buildBody(node) {
         const el = node.element;
         if (el instanceof ElImpl)
             el.prepareForUpdate();
-        let result = super.runScript(node);
+        let result = super.buildBody(node);
         result = proceedSyncOrAsync(result, v => {
             if (el.place === undefined) {
                 const oel = node.owner.element;
@@ -69,7 +69,7 @@ export class WebDriver extends ElDriver {
                     el.place = undefined;
             }
             if (gBlinkingEffectMarker)
-                blink(el.native, ReactiveTreeNode.currentScriptPriority, node.stamp);
+                blink(el.native, ReactiveTreeNode.currentBodyPriority, node.stamp);
         }, e => {
         });
         return result;

package/build/dist/source/core/sensors/Handlers.js

@@ -14,8 +14,8 @@ export function OnClick(target, action, key) {
         PseudoElement({
             key,
             mode: Mode.autonomous,
-            triggers: { target },
-            script: el => {
+            signalArgs: { target },
+            body() {
                 const pointer = target.sensors.pointer;
                 if (target.dataForSensor.click !== undefined && pointer.clicked === target.dataForSensor.click || target.dataForSensor.click === undefined && pointer.clicked) {
                     if (action instanceof Function) {
@@ -34,18 +34,20 @@ export function OnClickAsync(target, action, key) {
         PseudoElement({
             key,
             mode: Mode.autonomous,
-            triggers: { target },
-            scriptAsync: (el) => __awaiter(this, void 0, void 0, function* () {
-                const pointer = target.sensors.pointer;
-                if (target.dataForSensor.click !== undefined && pointer.clicked === target.dataForSensor.click || target.dataForSensor.click === undefined && pointer.clicked) {
-                    if (action instanceof Function) {
-                        yield runNonReactive(() => action(pointer));
+            signalArgs: { target },
+            bodyTask() {
+                return __awaiter(this, void 0, void 0, function* () {
+                    const pointer = target.sensors.pointer;
+                    if (target.dataForSensor.click !== undefined && pointer.clicked === target.dataForSensor.click || target.dataForSensor.click === undefined && pointer.clicked) {
+                        if (action instanceof Function) {
+                            yield runNonReactive(() => action(pointer));
+                        }
+                        else if (action instanceof ToggleRef) {
+                            runNonReactive(() => action.toggle());
+                        }
                     }
-                    else if (action instanceof ToggleRef) {
-                        runNonReactive(() => action.toggle());
-                    }
-                }
-            }),
+                });
+            },
         });
     }
 }
@@ -54,8 +56,8 @@ export function OnResize(target, action, key) {
         PseudoElement({
             key,
             mode: Mode.autonomous,
-            triggers: { target },
-            script: el => {
+            signalArgs: { target },
+            body() {
                 const resize = target.sensors.resize;
                 resize.resizedElements.forEach(x => {
                     action(x);
@@ -68,11 +70,11 @@ export function OnFocus(target, model, switchEditMode = undefined, key) {
     PseudoElement({
         key,
         mode: Mode.autonomous,
-        triggers: { target, model },
-        preparation: el => {
-            el.node.configureReactivity({ throttling: 0 });
+        signalArgs: { target, model },
+        preparation() {
+            this.node.configureReactivity({ throttling: 0 });
         },
-        script: el => {
+        body() {
             if (switchEditMode === undefined && !(target instanceof HTMLInputElement || target.hasAttribute("tabindex")))
                 console.warn(`"${key !== null && key !== void 0 ? key : "noname"}" element must have "tabindex" attribute set in order to be focusable`);
             if (switchEditMode !== undefined) {

package/build/dist/source/html/DraggableArea.view.js

@@ -4,9 +4,9 @@ import { Fragment } from "../core/Elements.js";
 export function DraggableArea(draggingId, builder) {
     return (Div(derivative(builder, {
         mode: Mode.autonomous,
-        script: b => {
-            const e = b.native;
-            const model = b.model;
+        body() {
+            const e = this.native;
+            const model = this.model;
             const dataForSensor = e.dataForSensor;
             dataForSensor.draggable = draggingId;
             dataForSensor.drag = draggingId;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "verstak",
-  "version": "0.95.25047",
+  "version": "0.96.26001",
   "description": "Verstak - Front-End Library",
   "publisher": "Nezaboodka Software",
   "license": "Apache-2.0",
@@ -42,7 +42,7 @@
     "markdown-it": "^14.1.0",
     "markdown-it-prism": "^2.3.0",
     "prismjs": "^1.30.0",
-    "reactronic": "^0.95.25047"
+    "reactronic": "^0.96.26001"
   },
   "devDependencies": {
     "@types/markdown-it": "14.1.2",