verstak 0.95.25047 → 0.95.25048

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

@@ -6,34 +6,34 @@ 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;
+        script() {
+            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) => {
+                    script(el, base) {
                         base();
-                        el.useStylingPreset(theme.icon);
+                        this.useStylingPreset(theme.icon);
                     },
                 });
             }
             if (m.label) {
                 JustText(m.label, false, {
-                    script: (el, base) => {
+                    script(el, base) {
                         base();
-                        el.useStylingPreset(theme.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 },
+        script() {
             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";
+        script() {
+            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

@@ -6,20 +6,20 @@ 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;
+        script() {
+            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) => {
+                    script(el, base) {
                         base();
-                        el.useStylingPreset(theme.icon);
+                        this.useStylingPreset(theme.icon);
                     },
                 });
             InputField(m, theme);
@@ -45,18 +45,18 @@ export function composeInputModel(props) {
 function InputField(model, styling) {
     return (JustText(model.text, false, {
         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;
             e.tabIndex = 0;
             e.contentEditable = "true";
             e.dataForSensor.focus = model;
             base();
         },
-        script: el => {
-            const e = el.native;
+        script() {
+            const e = this.native;
             if (!model.isEditMode)
                 e.innerText = model.text;
             Fragment(() => {
@@ -81,10 +81,10 @@ 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;
+        script() {
+            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) {
@@ -92,8 +92,8 @@ function InputPopup(model, styling) {
                         rowBreak();
                         JustText(x, false, {
                             key: x,
-                            preparation: el => {
-                                el.contentWrapping = false;
+                            preparation() {
+                                this.contentWrapping = false;
                             },
                         });
                     }

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

@@ -3,8 +3,8 @@ import Md from "markdown-it";
 import * as prism from "prismjs";
 export function Markdown(content) {
     return (JustText(md.render(content), true, {
-        preparation: (el, base) => {
-            el.contentWrapping = true;
+        preparation(el, base) {
+            this.contentWrapping = true;
             base();
         },
     }));

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

@@ -4,12 +4,12 @@ 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;
+        script() {
+            const m = this.model;
             m.active && JustText("loading...");
         },
     })));

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

@@ -6,37 +6,37 @@ 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;
+        script() {
+            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) => {
+                script(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) => {
+                    script(el, base) {
                         base();
-                        el.useStylingPreset(toggleTheme.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/Elements.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}`;
+        },
+        script() {
+            const e = this.native;
+            const model = this.model;
             const dataForSensor = e.dataForSensor;
             dataForSensor.draggable = key;
             dataForSensor.drag = key;
@@ -80,18 +82,18 @@ export function declareSplitter(index, splitViewNode) {
 }
 export function cursor(place) {
     declare(Drivers.cursor, {
-        script: el => {
-            el.place = place;
+        script() {
+            this.place = place;
         },
     });
 }
 export function JustText(content, formatted, declaration) {
     return declare(Drivers.text, derivative(declaration, {
-        script: el => {
+        script() {
             if (formatted)
-                el.native.innerHTML = content;
+                this.native.innerHTML = content;
             else
-                el.native.innerText = content;
+                this.native.innerText = content;
         },
     }));
 }
@@ -128,7 +130,7 @@ export class BlockDriver extends HtmlDriver {
             });
             const relayoutEl = PseudoElement({
                 mode: Mode.autonomous,
-                script: () => {
+                script() {
                     const native = el.native;
                     const isHorizontal = el.splitView === Direction.horizontal;
                     if (layoutInfo.isUpdateFinished) {
@@ -192,9 +194,9 @@ 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 });
+                    if (childDeclaration.signalArgs === undefined)
+                        childDeclaration.signalArgs = {};
+                    Object.defineProperty(childDeclaration.signalArgs, "index", { value: partCount });
                     overrideMethod(childDeclaration, "script", el => {
                         if (isHorizontal)
                             el.style.gridColumn = `${partCount + 1}`;
@@ -232,26 +234,26 @@ export class PartitionDriver extends HtmlDriver {
         if (ownerEl.sealed !== undefined) {
             node.element.style.flexGrow = "1";
             declare(Drivers.wrapper, {
-                script: el => {
-                    const ownerEl = el.node.owner.owner.element;
+                script() {
+                    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";
                 },
             });
         }

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 },
+            script() {
                 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 },
+            scriptAsync() {
+                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 },
+            script() {
                 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 => {
+        script() {
             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;
+        script() {
+            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.95.25048",
   "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.95.25048"
   },
   "devDependencies": {
     "@types/markdown-it": "14.1.2",