verstak 0.23.121 → 0.23.122

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

@@ -17,8 +17,8 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 import { reactive, unobs, Transaction, options, Reentrance, Rx, MergeList, ObservableObject, raw } from "reactronic";
-import { BlockKind, Priority, Mode, Align } from "./Interfaces.js";
-import { emitLetters, equalBlockCoords, parseBlockCoords, getCallerInfo } from "./Utils.js";
+import { ElKind, Priority, Mode, Align } from "./Interfaces.js";
+import { emitLetters, equalElCoords, parseElCoords, getCallerInfo } from "./Utils.js";
 export class Verstak {
     static claim(driver, builder, base) {
         var _a;
@@ -37,50 +37,50 @@ export class Verstak {
                 if (((_a = last === null || last === void 0 ? void 0 : last.instance) === null || _a === void 0 ? void 0 : _a.node.driver) === driver)
                     ex = last;
             }
-            ex !== null && ex !== void 0 ? ex : (ex = children.claim(key = key || generateKey(owner), undefined, "nested blocks can be declared inside update function only"));
+            ex !== null && ex !== void 0 ? ex : (ex = children.claim(key = key || generateKey(owner), undefined, "nested elements can be declared inside update function only"));
             if (ex) {
                 result = ex.instance;
                 const node = result.node;
                 if (node.driver !== driver && driver !== undefined)
-                    throw new Error(`changing block driver is not yet supported: "${result.node.driver.name}" -> "${driver === null || driver === void 0 ? void 0 : driver.name}"`);
+                    throw new Error(`changing element driver is not yet supported: "${result.node.driver.name}" -> "${driver === null || driver === void 0 ? void 0 : driver.name}"`);
                 const exTriggers = node.builder.triggers;
                 if (triggersAreEqual(builder.triggers, exTriggers))
                     builder.triggers = exTriggers;
                 node.builder = builder;
             }
             else {
-                result = new BlockImpl(key || generateKey(owner), driver, owner, builder);
+                result = new ElImpl(key || generateKey(owner), driver, owner, builder);
                 result.node.ties = children.add(result);
             }
         }
         else {
-            result = new BlockImpl(key || "", driver, owner, builder);
+            result = new ElImpl(key || "", driver, owner, builder);
             result.node.ties = MergeList.createItem(result);
             triggerUpdate(result.node.ties);
         }
         return result;
     }
-    static get block() {
+    static get element() {
         if (gCurrent === undefined)
-            throw new Error("current block is undefined");
+            throw new Error("current element is undefined");
         return gCurrent.instance;
     }
-    static triggerUpdate(block, triggers) {
-        const b = block;
-        const builder = b.node.builder;
+    static triggerUpdate(element, triggers) {
+        const el = element;
+        const builder = el.node.builder;
         if (!triggersAreEqual(triggers, builder.triggers)) {
             builder.triggers = triggers;
-            triggerUpdate(b.node.ties);
+            triggerUpdate(el.node.ties);
         }
     }
     static updateNestedTreesThenDo(action) {
         runUpdateNestedTreesThenDo(undefined, action);
     }
     static getDefaultLoggingOptions() {
-        return BlockImpl.logging;
+        return ElImpl.logging;
     }
     static setDefaultLoggingOptions(logging) {
-        BlockImpl.logging = logging;
+        ElImpl.logging = logging;
     }
 }
 Verstak.shortFrameDuration = 16;
@@ -93,44 +93,44 @@ export class BaseDriver {
         this.isRow = isRow;
         this.preset = preset;
     }
-    claim(block) {
-        const b = block;
-        chainedClaim(b, b.node.builder);
+    claim(element) {
+        const el = element;
+        chainedClaim(el, el.node.builder);
     }
-    create(block, b) {
-        chainedCreate(block, block.node.builder);
+    create(element, result) {
+        chainedCreate(element, element.node.builder);
     }
-    initialize(block) {
+    initialize(element) {
         var _a;
-        const b = block;
-        (_a = this.preset) === null || _a === void 0 ? void 0 : _a.call(this, b);
-        chainedInitialize(b, b.node.builder);
+        const el = element;
+        (_a = this.preset) === null || _a === void 0 ? void 0 : _a.call(this, el);
+        chainedInitialize(el, el.node.builder);
     }
-    mount(block) {
+    mount(element, nativeHost) {
     }
-    update(block) {
-        chainedUpdated(block, block.node.builder);
+    update(element) {
+        chainedUpdated(element, element.node.builder);
     }
-    finalize(block, isLeader) {
-        const b = block;
-        chainedFinalize(b, b.node.builder);
+    finalize(element, isLeader) {
+        const el = element;
+        chainedFinalize(el, el.node.builder);
         return isLeader;
     }
-    applyKind(block, value) { }
-    applyCoords(block, value) { }
-    applyWidthGrowth(block, value) { }
-    applyMinWidth(block, value) { }
-    applyMaxWidth(block, value) { }
-    applyHeightGrowth(block, value) { }
-    applyMinHeight(block, value) { }
-    applyMaxHeight(block, value) { }
-    applyContentAlignment(block, value) { }
-    applyBlockAlignment(block, value) { }
-    applyContentWrapping(block, value) { }
-    applyOverlayVisible(block, value) { }
-    applyStyle(block, secondary, styleName, enabled) { }
-}
-BaseDriver.fragment = new BaseDriver("fragment", false, b => b.kind = BlockKind.Group);
+    applyKind(element, value) { }
+    applyCoords(element, value) { }
+    applyWidthGrowth(element, value) { }
+    applyMinWidth(element, value) { }
+    applyMaxWidth(element, value) { }
+    applyHeightGrowth(element, value) { }
+    applyMinHeight(element, value) { }
+    applyMaxHeight(element, value) { }
+    applyContentAlignment(element, value) { }
+    applyElementAlignment(element, value) { }
+    applyContentWrapping(element, value) { }
+    applyOverlayVisible(element, value) { }
+    applyStyle(element, secondary, styleName, enabled) { }
+}
+BaseDriver.fragment = new BaseDriver("fragment", false, el => el.kind = ElKind.Group);
 function generateKey(owner) {
     const n = owner.node.numerator++;
     const lettered = emitLetters(n);
@@ -145,64 +145,64 @@ function chainedMode(bb) {
     var _a;
     return (_a = bb === null || bb === void 0 ? void 0 : bb.mode) !== null && _a !== void 0 ? _a : ((bb === null || bb === void 0 ? void 0 : bb.base) ? chainedMode(bb === null || bb === void 0 ? void 0 : bb.base) : Mode.Default);
 }
-function chainedClaim(block, bb) {
-    const claim = bb.claim;
-    const base = bb.base;
+function chainedClaim(element, elb) {
+    const claim = elb.claim;
+    const base = elb.base;
     if (claim)
-        claim(block, base ? () => chainedClaim(block, base) : NOP);
+        claim(element, base ? () => chainedClaim(element, base) : NOP);
     else if (base)
-        chainedClaim(block, base);
+        chainedClaim(element, base);
 }
-function chainedCreate(block, bb) {
-    const create = bb.create;
-    const base = bb.base;
+function chainedCreate(element, elb) {
+    const create = elb.create;
+    const base = elb.base;
     if (create)
-        create(block, base ? () => chainedCreate(block, base) : NOP);
+        create(element, base ? () => chainedCreate(element, base) : NOP);
     else if (base)
-        chainedCreate(block, base);
+        chainedCreate(element, base);
 }
-function chainedInitialize(block, bb) {
-    const initialize = bb.initialize;
-    const base = bb.base;
+function chainedInitialize(element, elb) {
+    const initialize = elb.initialize;
+    const base = elb.base;
     if (initialize)
-        initialize(block, base ? () => chainedInitialize(block, base) : NOP);
+        initialize(element, base ? () => chainedInitialize(element, base) : NOP);
     else if (base)
-        chainedInitialize(block, base);
+        chainedInitialize(element, base);
 }
-function chainedUpdated(block, bb) {
-    const update = bb.update;
-    const base = bb.base;
+function chainedUpdated(element, elb) {
+    const update = elb.update;
+    const base = elb.base;
     if (update)
-        update(block, base ? () => chainedUpdated(block, base) : NOP);
+        update(element, base ? () => chainedUpdated(element, base) : NOP);
     else if (base)
-        chainedUpdated(block, base);
+        chainedUpdated(element, base);
 }
-function chainedFinalize(block, bb) {
-    const finalize = bb.finalize;
-    const base = bb.base;
+function chainedFinalize(element, elb) {
+    const finalize = elb.finalize;
+    const base = elb.base;
     if (finalize)
-        finalize(block, base ? () => chainedFinalize(block, base) : NOP);
+        finalize(element, base ? () => chainedFinalize(element, base) : NOP);
     else if (base)
-        chainedFinalize(block, base);
+        chainedFinalize(element, base);
 }
 export class StaticDriver extends BaseDriver {
-    constructor(element, name, isRow, preset) {
+    constructor(native, name, isRow, preset) {
         super(name, isRow, preset);
-        this.element = element;
+        this.native = native;
     }
-    create(block, b) {
-        b.native = this.element;
+    create(element, result) {
+        result.native = this.native;
     }
 }
 export class CursorCommand {
 }
 export class CursorCommandDriver extends BaseDriver {
     constructor() {
-        super("cursor", false, b => b.kind = BlockKind.Cursor);
+        super("cursor", false, el => el.kind = ElKind.Cursor);
     }
-    create(block, b) {
-        b.native = new CursorCommand();
-        super.create(block, b);
+    create(element, result) {
+        result.native = new CursorCommand();
+        super.create(element, result);
     }
 }
 export class SubTreeVariable {
@@ -210,13 +210,13 @@ export class SubTreeVariable {
         this.defaultValue = defaultValue;
     }
     set value(value) {
-        BlockImpl.setSubTreeVariableValue(this, value);
+        ElImpl.setSubTreeVariableValue(this, value);
     }
     get value() {
-        return BlockImpl.useSubTreeVariableValue(this);
+        return ElImpl.useSubTreeVariableValue(this);
     }
     get valueOrUndefined() {
-        return BlockImpl.tryUseSubTreeVariable(this);
+        return ElImpl.tryUseSubTreeVariable(this);
     }
 }
 class CursorPosition {
@@ -235,9 +235,9 @@ var CursorFlags;
     CursorFlags[CursorFlags["UsesRunningColumnCount"] = 2] = "UsesRunningColumnCount";
     CursorFlags[CursorFlags["UsesRunningRowCount"] = 4] = "UsesRunningRowCount";
 })(CursorFlags || (CursorFlags = {}));
-const UndefinedBlockCoords = Object.freeze({ x1: 0, y1: 0, x2: 0, y2: 0 });
+const UndefinedElCoords = Object.freeze({ x1: 0, y1: 0, x2: 0, y2: 0 });
 const InitialCursorPosition = Object.freeze(new CursorPosition({ x: 1, y: 1, runningMaxX: 0, runningMaxY: 0, flags: CursorFlags.None }));
-class BlockCtxImpl extends ObservableObject {
+class ElCtxImpl extends ObservableObject {
     constructor(variable, value) {
         super();
         this.next = undefined;
@@ -248,12 +248,12 @@ class BlockCtxImpl extends ObservableObject {
 __decorate([
     raw,
     __metadata("design:type", Object)
-], BlockCtxImpl.prototype, "next", void 0);
+], ElCtxImpl.prototype, "next", void 0);
 __decorate([
     raw,
     __metadata("design:type", SubTreeVariable)
-], BlockCtxImpl.prototype, "variable", void 0);
-class BlockNodeImpl {
+], ElCtxImpl.prototype, "variable", void 0);
+class ElNodeImpl {
     constructor(key, driver, builder, self, owner) {
         this.maxColumnCount = 0;
         this.maxRowCount = 0;
@@ -272,9 +272,9 @@ class BlockNodeImpl {
             this.outer = self;
         }
         this.host = self;
-        this.children = new MergeList(getBlockKey, true);
+        this.children = new MergeList(getElNodeKey, true);
         this.ties = undefined;
-        this.stamp = 0;
+        this.stamp = Number.MAX_SAFE_INTEGER;
         this.context = undefined;
         this.numerator = 0;
         this.maxColumnCount = 0;
@@ -282,15 +282,15 @@ class BlockNodeImpl {
         this.cursorPosition = undefined;
     }
 }
-class BlockImpl {
+class ElImpl {
     constructor(key, driver, owner, builder) {
-        this.node = new BlockNodeImpl(key, driver, builder, this, owner);
+        this.node = new ElNodeImpl(key, driver, builder, this, owner);
         this.native = undefined;
         this.model = undefined;
         this.controller = undefined;
-        this._kind = BlockKind.Row;
+        this._kind = ElKind.Row;
         this._area = undefined;
-        this._coords = UndefinedBlockCoords;
+        this._coords = UndefinedElCoords;
         this._widthGrowth = 0;
         this._minWidth = "";
         this._maxWidth = "";
@@ -298,15 +298,15 @@ class BlockImpl {
         this._minHeight = "";
         this._maxHeight = "";
         this._contentAlignment = Align.Default;
-        this._blockAlignment = Align.Default;
+        this._elementAlignment = Align.Default;
         this._contentWrapping = true;
         this._overlayVisible = undefined;
         this._hasStyles = false;
         this.updatePriority = Priority.Realtime;
         this.childrenShuffling = false;
-        BlockImpl.grandBlockCount++;
-        if (this.isOn(Mode.PinpointUpdate))
-            BlockImpl.disposableBlockCount++;
+        ElImpl.grandElementCount++;
+        if (this.hasMode(Mode.PinpointUpdate))
+            ElImpl.disposableElementCount++;
     }
     update(_triggers) {
         updateNow(this.node.ties);
@@ -315,20 +315,19 @@ class BlockImpl {
         this._area = undefined;
         this._hasStyles = false;
     }
-    isOn(mode) {
+    hasMode(mode) {
         return (chainedMode(this.node.builder) & mode) === mode;
     }
-    get isInitialUpdate() { return this.node.stamp === 2; }
-    get isAuxiliary() { return this.kind > BlockKind.Note; }
-    get isSection() { return this.kind === BlockKind.Section; }
-    get isTable() { return this.kind === BlockKind.Table; }
-    get isAutoMountEnabled() { return !this.isOn(Mode.ManualMount) && this.node.host !== this; }
+    get isInitialUpdate() { return this.node.stamp === 1; }
+    get isAuxiliary() { return this.kind > ElKind.Note; }
+    get isSection() { return this.kind === ElKind.Section; }
+    get isTable() { return this.kind === ElKind.Table; }
     get isMoved() { return this.node.owner.node.children.isMoved(this.node.ties); }
     get strictOrder() { return this.node.children.isStrict; }
     set strictOrder(value) { this.node.children.isStrict = value; }
     get kind() { return this._kind; }
     set kind(value) {
-        if (value !== this._kind || this.node.stamp < 2) {
+        if (value !== this._kind || this.node.stamp >= Number.MAX_SAFE_INTEGER - 1) {
             this.node.driver.applyKind(this, value);
             this._kind = value;
         }
@@ -342,9 +341,9 @@ class BlockImpl {
             const owner = node.owner.node;
             const cursorPosition = (_b = (_a = node.ties.prev) === null || _a === void 0 ? void 0 : _a.instance.node.cursorPosition) !== null && _b !== void 0 ? _b : InitialCursorPosition;
             const newCursorPosition = node.cursorPosition = owner.children.isStrict ? new CursorPosition(cursorPosition) : undefined;
-            const isCursorBlock = driver instanceof CursorCommandDriver;
-            const coords = getEffectiveBlockCoords(!isCursorBlock, value, owner.maxColumnCount, owner.maxRowCount, cursorPosition, newCursorPosition);
-            if (!equalBlockCoords(coords, this._coords)) {
+            const isCursorElement = driver instanceof CursorCommandDriver;
+            const coords = getEffectiveElCoords(!isCursorElement, value, owner.maxColumnCount, owner.maxRowCount, cursorPosition, newCursorPosition);
+            if (!equalElCoords(coords, this._coords)) {
                 driver.applyCoords(this, coords);
                 this._coords = coords;
             }
@@ -402,11 +401,11 @@ class BlockImpl {
             this._contentAlignment = value;
         }
     }
-    get blockAlignment() { return this._blockAlignment; }
-    set blockAlignment(value) {
-        if (value !== this._blockAlignment) {
-            this.node.driver.applyBlockAlignment(this, value);
-            this._blockAlignment = value;
+    get elementAlignment() { return this._elementAlignment; }
+    set elementAlignment(value) {
+        if (value !== this._elementAlignment) {
+            this.node.driver.applyElementAlignment(this, value);
+            this._elementAlignment = value;
         }
     }
     get contentWrapping() { return this._contentWrapping; }
@@ -428,32 +427,32 @@ class BlockImpl {
         this._hasStyles = true;
     }
     configureReactronic(options) {
-        if (this.node.stamp !== 1 || !this.isOn(Mode.PinpointUpdate))
-            throw new Error("reactronic can be configured only for blocks with separate reaction mode and only inside initialize");
+        if (this.node.stamp < Number.MAX_SAFE_INTEGER - 1 || !this.hasMode(Mode.PinpointUpdate))
+            throw new Error("reactronic can be configured only for elements with pinpoint update mode and only inside initialize");
         return Rx.getReaction(this.update).configure(options);
     }
     static get curr() {
         if (!gCurrent)
-            throw new Error("current block is undefined");
+            throw new Error("current element is undefined");
         return gCurrent;
     }
     static tryUseSubTreeVariable(variable) {
         var _a, _b;
-        let b = BlockImpl.curr.instance;
-        while (((_a = b.node.context) === null || _a === void 0 ? void 0 : _a.variable) !== variable && b.node.owner !== b)
-            b = b.node.outer;
-        return (_b = b.node.context) === null || _b === void 0 ? void 0 : _b.value;
+        let el = ElImpl.curr.instance;
+        while (((_a = el.node.context) === null || _a === void 0 ? void 0 : _a.variable) !== variable && el.node.owner !== el)
+            el = el.node.outer;
+        return (_b = el.node.context) === null || _b === void 0 ? void 0 : _b.value;
     }
     static useSubTreeVariableValue(variable) {
         var _a;
-        const result = (_a = BlockImpl.tryUseSubTreeVariable(variable)) !== null && _a !== void 0 ? _a : variable.defaultValue;
+        const result = (_a = ElImpl.tryUseSubTreeVariable(variable)) !== null && _a !== void 0 ? _a : variable.defaultValue;
         if (!result)
             throw new Error("context doesn't exist");
         return result;
     }
     static setSubTreeVariableValue(variable, value) {
-        const b = BlockImpl.curr.instance;
-        const node = b.node;
+        const el = ElImpl.curr.instance;
+        const node = el.node;
         const owner = node.owner;
         const hostCtx = unobs(() => { var _a; return (_a = owner.node.context) === null || _a === void 0 ? void 0 : _a.value; });
         if (value && value !== hostCtx) {
@@ -468,7 +467,7 @@ class BlockImpl {
                     ctx.value = value;
                 }
                 else
-                    node.context = new BlockCtxImpl(variable, value);
+                    node.context = new ElCtxImpl(variable, value);
             });
         }
         else if (hostCtx)
@@ -485,9 +484,9 @@ class BlockImpl {
         newCursorPosition.y = newCursorPosition.runningMaxY + 1;
     }
 }
-BlockImpl.grandBlockCount = 0;
-BlockImpl.disposableBlockCount = 0;
-BlockImpl.logging = undefined;
+ElImpl.grandElementCount = 0;
+ElImpl.disposableElementCount = 0;
+ElImpl.logging = undefined;
 __decorate([
     reactive,
     options({
@@ -498,19 +497,19 @@ __decorate([
     __metadata("design:type", Function),
     __metadata("design:paramtypes", [Object]),
     __metadata("design:returntype", void 0)
-], BlockImpl.prototype, "update", null);
-function getBlockKey(block) {
-    const node = block.node;
+], ElImpl.prototype, "update", null);
+function getElNodeKey(element) {
+    const node = element.node;
     return node.stamp >= 0 ? node.key : undefined;
 }
-function getEffectiveBlockCoords(isRegularBlock, area, maxX, maxY, cursorPosition, newCursorPosition) {
+function getEffectiveElCoords(isRegularElement, area, maxX, maxY, cursorPosition, newCursorPosition) {
     var _a, _b;
     let result;
     if (typeof (area) === "string") {
-        result = parseBlockCoords(area, { x1: 0, y1: 0, x2: 0, y2: 0 });
-        absolutizeBlockCoords(result, cursorPosition.x, cursorPosition.y, maxX || Infinity, maxY || Infinity, result);
+        result = parseElCoords(area, { x1: 0, y1: 0, x2: 0, y2: 0 });
+        absolutizeElCoords(result, cursorPosition.x, cursorPosition.y, maxX || Infinity, maxY || Infinity, result);
         if (newCursorPosition) {
-            newCursorPosition.x = isRegularBlock ? result.x2 + 1 : result.x1;
+            newCursorPosition.x = isRegularElement ? result.x2 + 1 : result.x1;
             newCursorPosition.y = result.y1;
             newCursorPosition.flags = CursorFlags.OwnCursorPosition;
         }
@@ -527,12 +526,12 @@ function getEffectiveBlockCoords(isRegularBlock, area, maxX, maxY, cursorPositio
         const runningX = maxX !== 0 ? maxX : cursorPosition.runningMaxX;
         const runningY = maxY !== 0 ? maxY : cursorPosition.runningMaxY;
         result = { x1: 0, y1: 0, x2: 0, y2: 0 };
-        if (dx === 0 && isRegularBlock) {
+        if (dx === 0 && isRegularElement) {
             dx = runningX || 1;
             newCursorPosition.flags = CursorFlags.UsesRunningColumnCount;
         }
         if (dx >= 0) {
-            if (isRegularBlock) {
+            if (isRegularElement) {
                 result.x1 = cursorPosition.x;
                 result.x2 = absolutizePosition(result.x1 + dx - 1, 0, maxX || Infinity);
                 newCursorPosition.x = result.x2 + 1;
@@ -543,7 +542,7 @@ function getEffectiveBlockCoords(isRegularBlock, area, maxX, maxY, cursorPositio
             }
         }
         else {
-            if (isRegularBlock) {
+            if (isRegularElement) {
                 result.x1 = Math.max(cursorPosition.x + dx, 1);
                 result.x2 = cursorPosition.x;
                 newCursorPosition.x = result.x2 + 1;
@@ -553,12 +552,12 @@ function getEffectiveBlockCoords(isRegularBlock, area, maxX, maxY, cursorPositio
                 newCursorPosition.x = result.x2;
             }
         }
-        if (dy === 0 && isRegularBlock) {
+        if (dy === 0 && isRegularElement) {
             dy = runningY || 1;
             newCursorPosition.flags |= CursorFlags.UsesRunningRowCount;
         }
         if (dy >= 0) {
-            if (isRegularBlock) {
+            if (isRegularElement) {
                 result.y1 = cursorPosition.y;
                 result.y2 = absolutizePosition(result.y1 + dy - 1, 0, maxY || Infinity);
                 if (result.y2 > newCursorPosition.runningMaxY)
@@ -568,7 +567,7 @@ function getEffectiveBlockCoords(isRegularBlock, area, maxX, maxY, cursorPositio
                 result.y1 = result.y2 = cursorPosition.y + dy;
         }
         else {
-            if (isRegularBlock) {
+            if (isRegularElement) {
                 result.y1 = Math.max(cursorPosition.y + dy, 1);
                 result.y2 = cursorPosition.y;
             }
@@ -582,7 +581,7 @@ function getEffectiveBlockCoords(isRegularBlock, area, maxX, maxY, cursorPositio
 }
 function runUpdateNestedTreesThenDo(error, action) {
     var _a;
-    const curr = BlockImpl.curr;
+    const curr = ElImpl.curr;
     const owner = curr.instance;
     const children = owner.node.children;
     if (children.isMergeInProgress) {
@@ -601,10 +600,10 @@ function runUpdateNestedTreesThenDo(error, action) {
                 for (const item of children.items()) {
                     if (Transaction.isCanceled)
                         break;
-                    const block = item.instance;
-                    const isRow = block.node.driver.isRow;
+                    const el = item.instance;
+                    const isRow = el.node.driver.isRow;
                     const host = isRow ? owner : hostingRow;
-                    const p = (_a = block.updatePriority) !== null && _a !== void 0 ? _a : Priority.Realtime;
+                    const p = (_a = el.updatePriority) !== null && _a !== void 0 ? _a : Priority.Realtime;
                     mounting = markToMountIfNecessary(mounting, host, item, children, sequential);
                     if (p === Priority.Realtime)
                         triggerUpdate(item);
@@ -613,7 +612,7 @@ function runUpdateNestedTreesThenDo(error, action) {
                     else
                         p2 = push(item, p2);
                     if (ownerIsSection && isRow)
-                        hostingRow = block;
+                        hostingRow = el;
                 }
                 if (!Transaction.isCanceled && (p1 !== undefined || p2 !== undefined))
                     promised = startIncrementalUpdate(curr, children, p1, p2).then(() => action(error), e => action(e));
@@ -626,9 +625,9 @@ function runUpdateNestedTreesThenDo(error, action) {
     }
 }
 function markToMountIfNecessary(mounting, host, ties, children, sequential) {
-    const b = ties.instance;
-    const node = b.node;
-    if (b.native && !b.isOn(Mode.ManualMount)) {
+    const el = ties.instance;
+    const node = el.node;
+    if (el.native && !el.hasMode(Mode.ManualMount)) {
         if (mounting || node.host !== host) {
             children.markAsMoved(ties);
             mounting = false;
@@ -651,12 +650,12 @@ function startIncrementalUpdate(owner, allChildren, priority1, priority2) {
 function updateIncrementally(owner, stamp, allChildren, items, priority) {
     return __awaiter(this, void 0, void 0, function* () {
         yield Transaction.requestNextFrame();
-        const block = owner.instance;
+        const el = owner.instance;
         if (!Transaction.isCanceled || !Transaction.isFrameOver(1, Verstak.shortFrameDuration / 3)) {
             let outerPriority = Verstak.currentUpdatePriority;
             Verstak.currentUpdatePriority = priority;
             try {
-                if (block.childrenShuffling)
+                if (el.childrenShuffling)
                     shuffle(items);
                 const frameDurationLimit = priority === Priority.Background ? Verstak.shortFrameDuration : Infinity;
                 let frameDuration = Math.min(frameDurationLimit, Math.max(Verstak.frameDuration / 4, Verstak.shortFrameDuration));
@@ -680,81 +679,86 @@ function updateIncrementally(owner, stamp, allChildren, items, priority) {
     });
 }
 function triggerUpdate(ties) {
-    const b = ties.instance;
-    const node = b.node;
+    const el = ties.instance;
+    const node = el.node;
     if (node.stamp >= 0) {
-        if (b.isOn(Mode.PinpointUpdate)) {
-            if (node.stamp === 0) {
+        if (el.hasMode(Mode.PinpointUpdate)) {
+            if (node.stamp === Number.MAX_SAFE_INTEGER) {
                 Transaction.outside(() => {
                     if (Rx.isLogging)
-                        Rx.setLoggingHint(b, node.key);
-                    Rx.getReaction(b.update).configure({
+                        Rx.setLoggingHint(el, node.key);
+                    Rx.getReaction(el.update).configure({
                         order: node.level,
                     });
                 });
             }
-            unobs(b.update, node.builder.triggers);
+            unobs(el.update, node.builder.triggers);
         }
         else
             updateNow(ties);
     }
 }
-function mountIfNecessary(block) {
-    const node = block.node;
+function mountOrRemountIfNecessary(element) {
+    const node = element.node;
     const driver = node.driver;
-    if (node.stamp === 0) {
-        node.stamp = 1;
+    if (node.stamp === Number.MAX_SAFE_INTEGER) {
+        node.stamp = Number.MAX_SAFE_INTEGER - 1;
         unobs(() => {
-            driver.create(block, block);
-            driver.initialize(block);
-            if (block.isAutoMountEnabled)
-                driver.mount(block);
+            driver.create(element, element);
+            driver.initialize(element);
+            if (!element.hasMode(Mode.ManualMount)) {
+                node.stamp = 0;
+                if (element.node.host !== element)
+                    driver.mount(element);
+            }
         });
     }
-    else if (block.isMoved && block.isAutoMountEnabled)
-        unobs(() => driver.mount(block));
+    else if (element.isMoved && !element.hasMode(Mode.ManualMount) && element.node.host !== element)
+        unobs(() => driver.mount(element));
 }
 function updateNow(ties) {
-    const b = ties.instance;
-    const node = b.node;
+    const el = ties.instance;
+    const node = el.node;
     if (node.stamp >= 0) {
         let result = undefined;
         runInside(ties, () => {
-            try {
-                mountIfNecessary(b);
-                node.stamp++;
-                node.numerator = 0;
-                b.prepareForUpdate();
-                node.children.beginMerge();
-                const driver = node.driver;
-                result = driver.update(b);
-                if (b.area === undefined && node.owner.isTable)
-                    b.area = undefined;
-                if (result instanceof Promise)
-                    result.then(v => { runUpdateNestedTreesThenDo(undefined, NOP); return v; }, e => { console.log(e); runUpdateNestedTreesThenDo(e !== null && e !== void 0 ? e : new Error("unknown error"), NOP); });
-                else
-                    runUpdateNestedTreesThenDo(undefined, NOP);
-            }
-            catch (e) {
-                runUpdateNestedTreesThenDo(e, NOP);
-                console.log(`Update failed: ${node.key}`);
-                console.log(`${e}`);
+            mountOrRemountIfNecessary(el);
+            if (node.stamp < Number.MAX_SAFE_INTEGER - 1) {
+                try {
+                    node.stamp++;
+                    node.numerator = 0;
+                    el.prepareForUpdate();
+                    node.children.beginMerge();
+                    const driver = node.driver;
+                    result = driver.update(el);
+                    if (el.area === undefined && node.owner.isTable)
+                        el.area = undefined;
+                    if (result instanceof Promise)
+                        result.then(v => { runUpdateNestedTreesThenDo(undefined, NOP); return v; }, e => { console.log(e); runUpdateNestedTreesThenDo(e !== null && e !== void 0 ? e : new Error("unknown error"), NOP); });
+                    else
+                        runUpdateNestedTreesThenDo(undefined, NOP);
+                }
+                catch (e) {
+                    runUpdateNestedTreesThenDo(e, NOP);
+                    console.log(`Update failed: ${node.key}`);
+                    console.log(`${e}`);
+                }
             }
         });
     }
 }
 function triggerFinalization(ties, isLeader, individual) {
-    const b = ties.instance;
-    const node = b.node;
+    const el = ties.instance;
+    const node = el.node;
     if (node.stamp >= 0) {
         const driver = node.driver;
         if (individual && node.key !== node.builder.key && !driver.isRow)
-            console.log(`WARNING: it is recommended to assign explicit key for conditional block in order to avoid unexpected side effects: ${node.key}`);
+            console.log(`WARNING: it is recommended to assign explicit key for conditional element in order to avoid unexpected side effects: ${node.key}`);
         node.stamp = ~node.stamp;
-        const childrenAreLeaders = unobs(() => driver.finalize(b, isLeader));
-        b.native = null;
-        b.controller = null;
-        if (b.isOn(Mode.PinpointUpdate)) {
+        const childrenAreLeaders = unobs(() => driver.finalize(el, isLeader));
+        el.native = null;
+        el.controller = null;
+        if (el.hasMode(Mode.PinpointUpdate)) {
             ties.aux = undefined;
             const last = gLastToDispose;
             if (last)
@@ -768,7 +772,7 @@ function triggerFinalization(ties, isLeader, individual) {
         }
         for (const item of node.children.items())
             triggerFinalization(item, childrenAreLeaders, false);
-        BlockImpl.grandBlockCount--;
+        ElImpl.grandElementCount--;
     }
 }
 function runDisposalLoop() {
@@ -780,7 +784,7 @@ function runDisposalLoop() {
                 yield Transaction.requestNextFrame();
             Rx.dispose(item.instance);
             item = item.aux;
-            BlockImpl.disposableBlockCount--;
+            ElImpl.disposableElementCount--;
         }
         gFirstToDispose = gLastToDispose = undefined;
     });
@@ -824,7 +828,7 @@ function triggersAreEqual(a1, a2) {
     }
     return result;
 }
-function absolutizeBlockCoords(area, cursorX, cursorY, maxWidth, maxHeight, result) {
+function absolutizeElCoords(area, cursorX, cursorY, maxWidth, maxHeight, result) {
     const x1 = absolutizePosition(area.x1, cursorX, maxWidth);
     const x2 = absolutizePosition(area.x2, x1, maxWidth);
     if (x1 <= x2)