verstak 0.22.515 → 0.22.516

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

@@ -6,4 +6,6 @@ export interface CellRange {
 }
 export declare function parseCellRange(text: string, result: CellRange): CellRange;
 export declare function emitCellRange(value: CellRange): string;
+export declare function emitLetters(n: number): string;
+export declare function emitCellPosition(x: number, y: number): string;
 export declare function equalCellRanges(a: CellRange, b: CellRange): boolean;

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

@@ -134,22 +134,7 @@ export function emitCellRange(value) {
     const p2 = emitCellPosition(value.x2, value.y2);
     return `${p1}${p2 !== "" ? `:${p2}` : ""}`;
 }
-export function equalCellRanges(a, b) {
-    return a.x1 === b.x1 && a.y1 === b.y1 && a.x2 === b.x2 && a.y1 === b.y2;
-}
-function isWhitespace(char) {
-    return char === 32 || (char >= 9 && char <= 13) || char === 133 || char === 160;
-}
-function isDigit(input, index) {
-    return 48 <= input && input <= 57;
-}
-function isCapitalLetter(ch) {
-    return 65 <= ch && ch <= 90;
-}
-function isLowercaseLetter(ch) {
-    return 97 <= ch && ch <= 122;
-}
-function emitLetters(n) {
+export function emitLetters(n) {
     if (n < 0)
         throw new Error(`emitLetters: argument (${n}) should not be negative or zero`);
     let result = "";
@@ -160,7 +145,7 @@ function emitLetters(n) {
     }
     return result;
 }
-function emitCellPosition(x, y) {
+export function emitCellPosition(x, y) {
     let result = "";
     if (x > 0 && y > 0)
         result = `${emitLetters(x - 1)}${y}`;
@@ -174,3 +159,18 @@ function emitCellPosition(x, y) {
         result = "";
     return result;
 }
+export function equalCellRanges(a, b) {
+    return a.x1 === b.x1 && a.y1 === b.y1 && a.x2 === b.x2 && a.y1 === b.y2;
+}
+function isWhitespace(char) {
+    return char === 32 || (char >= 9 && char <= 13) || char === 133 || char === 160;
+}
+function isDigit(input, index) {
+    return 48 <= input && input <= 57;
+}
+function isCapitalLetter(ch) {
+    return 65 <= ch && ch <= 90;
+}
+function isLowercaseLetter(ch) {
+    return 97 <= ch && ch <= 122;
+}

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

@@ -1 +1,2 @@
 export declare function objectHasMember<T>(obj: any, member: string): obj is T;
+export declare function getCallerInfo(prefix: string): string;

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

@@ -1,3 +1,35 @@
 export function objectHasMember(obj, member) {
     return obj === Object(obj) && !Array.isArray(obj) && member in obj;
 }
+export function getCallerInfo(prefix) {
+    const restore = Error.stackTraceLimit = 20;
+    const error = new Error();
+    const stack = error.stack || "";
+    Error.stackTraceLimit = restore;
+    const lines = stack.split("\n");
+    let i = lines.findIndex(x => x.indexOf(".claim") >= 0);
+    i = i >= 0 ? i + 2 : 5;
+    let caller = extractFunctionAndLocation(lines[i]);
+    let location = caller;
+    if (caller.func === "VerstakDriver.render" || caller.func === "render") {
+        i = i - 1;
+        caller = extractFunctionAndLocation(lines[i]);
+        location = extractFunctionAndLocation(lines[i + 1]);
+    }
+    else {
+        while (!caller.func) {
+            i = i - 1;
+            caller = extractFunctionAndLocation(lines[i]);
+        }
+        location = extractFunctionAndLocation(lines[i + 1]);
+    }
+    const result = `${prefix}:${caller.func}@${location.file}`;
+    return result;
+}
+function extractFunctionAndLocation(s) {
+    const match = s.match(/(?:\s*at\s+)?(?:(\S+)\s\()?(?:.*?)([^\/\(\):]+)(?:(:|\d)*\)?)$/);
+    return {
+        func: (match === null || match === void 0 ? void 0 : match[1]) || "",
+        file: (match === null || match === void 0 ? void 0 : match[2]) || "",
+    };
+}

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

@@ -21,8 +21,8 @@ export interface BlockVmt<T = unknown, M = unknown, R = void> {
     finalize?: Render<T, M, R>;
 }
 export declare function asBaseFor<T, M, R>(outer: BlockBody<T, M, R> | undefined, base: BlockBody<T, M, R>): BlockVmt<T, M, R>;
-export declare function setContext<T extends Object>(type: Type<T>, context: T): void;
-export declare function use<T extends Object>(type: Type<T>): T;
+export declare function nestedContext<T extends Object>(type: Type<T>, context: T): void;
+export declare function useContext<T extends Object>(type: Type<T>): T;
 export declare abstract class VBlock<T = unknown, M = unknown, R = void> {
     static readonly shortFrameDuration = 16;
     static readonly longFrameDuration = 300;
@@ -58,13 +58,14 @@ export declare abstract class VBlock<T = unknown, M = unknown, R = void> {
     static renderNestedTreesThenDo(action: (error: unknown) => void): void;
     static runForAllBlocks<T>(action: (e: T) => void): void;
     static claim<T = undefined, M = unknown, R = void>(driver: AbstractDriver<T> | undefined, body: BlockBody<T, M, R>): VBlock<T, M, R>;
+    private static generateKey;
     static getDefaultLoggingOptions(): LoggingOptions | undefined;
     static setDefaultLoggingOptions(logging?: LoggingOptions): void;
 }
 export declare enum LayoutKind {
     Block = 0,
     Grid = 1,
-    Row = 2,
+    Line = 2,
     Group = 3,
     Text = 4
 }
@@ -77,7 +78,7 @@ export declare class AbstractDriver<T> {
     get isAuxiliary(): boolean;
     get isBlock(): boolean;
     get isGrid(): boolean;
-    get isRow(): boolean;
+    get isLine(): boolean;
     constructor(name: string, layout: LayoutKind, createCursor?: () => Cursor);
     initialize(block: VBlock<T>, native: T): void;
     finalize(block: VBlock<T>, isLeader: boolean): boolean;

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

@@ -17,7 +17,8 @@ var __awaiter = (this && this.__awaiter) || function (thisArg, _arguments, P, ge
     });
 };
 import { reactive, nonreactive, Transaction, options, Reentrance, Rx, Collection, ObservableObject, raw } from "reactronic";
-import { equalCellRanges } from "./CellRange";
+import { getCallerInfo } from "./Utils";
+import { emitLetters, equalCellRanges } from "./CellRange";
 import { Cursor, Align } from "./Cursor";
 export var Priority;
 (function (Priority) {
@@ -37,10 +38,10 @@ function via(outer, base) {
     const inherited = base !== null && base !== void 0 ? base : NOP;
     return outer ? b => outer(b, () => inherited(b)) : inherited;
 }
-export function setContext(type, context) {
+export function nestedContext(type, context) {
     return VBlockImpl.setContext(type, context);
 }
-export function use(type) {
+export function useContext(type) {
     return VBlockImpl.use(type);
 }
 export class VBlock {
@@ -70,12 +71,12 @@ export class VBlock {
         if (body instanceof Function)
             body = { render: body };
         let key = body.key;
-        if (driver.isRow) {
+        if (driver.isLine) {
             const last = children.lastClaimedItem();
             if (((_a = last === null || last === void 0 ? void 0 : last.instance) === null || _a === void 0 ? void 0 : _a.driver) === driver)
                 ex = last;
         }
-        ex !== null && ex !== void 0 ? ex : (ex = children.claim(key = key || `${++owner.numerator}!`, undefined, "nested blocks can be declared inside render function only"));
+        ex !== null && ex !== void 0 ? ex : (ex = children.claim(key = key || VBlock.generateKey(owner), undefined, "nested blocks can be declared inside render function only"));
         if (ex) {
             result = ex.instance;
             if (result.driver !== driver && driver !== undefined)
@@ -86,7 +87,7 @@ export class VBlock {
             result.body = body;
         }
         else {
-            result = new VBlockImpl(key || `${++owner.numerator}!`, driver, owner, body);
+            result = new VBlockImpl(key || VBlock.generateKey(owner), driver, owner, body);
             result.item = children.add(result);
             VBlockImpl.grandCount++;
             if (body.reacting)
@@ -94,6 +95,16 @@ export class VBlock {
         }
         return result;
     }
+    static generateKey(owner) {
+        const n = owner.numerator++;
+        const lettered = emitLetters(n);
+        let result;
+        if (Rx.isLogging)
+            result = `[${getCallerInfo(lettered)}]`;
+        else
+            result = `[${lettered}]`;
+        return result;
+    }
     static getDefaultLoggingOptions() {
         return VBlockImpl.logging;
     }
@@ -109,7 +120,7 @@ export var LayoutKind;
 (function (LayoutKind) {
     LayoutKind[LayoutKind["Block"] = 0] = "Block";
     LayoutKind[LayoutKind["Grid"] = 1] = "Grid";
-    LayoutKind[LayoutKind["Row"] = 2] = "Row";
+    LayoutKind[LayoutKind["Line"] = 2] = "Line";
     LayoutKind[LayoutKind["Group"] = 3] = "Group";
     LayoutKind[LayoutKind["Text"] = 4] = "Text";
 })(LayoutKind || (LayoutKind = {}));
@@ -124,7 +135,7 @@ export class AbstractDriver {
     get isAuxiliary() { return (this.layout & 2) === 2; }
     get isBlock() { return this.layout === LayoutKind.Block; }
     get isGrid() { return this.layout === LayoutKind.Grid; }
-    get isRow() { return this.layout === LayoutKind.Row; }
+    get isLine() { return this.layout === LayoutKind.Line; }
     initialize(block, native) {
         var _a, _b;
         const b = block;
@@ -278,16 +289,16 @@ class VBlockImpl extends VBlock {
     }
     get minHeight() { return this.appliedMinHeight; }
     set minHeight(value) {
-        if (value !== this.appliedMinWidth) {
-            this.driver.applyMinWidth(this, value);
-            this.appliedMinWidth = value;
+        if (value !== this.appliedMinHeight) {
+            this.driver.applyMinHeight(this, value);
+            this.appliedMinHeight = value;
         }
     }
     get maxHeight() { return this.appliedMaxHeight; }
     set maxHeight(value) {
-        if (value !== this.appliedMaxWidth) {
-            this.driver.applyMaxWidth(this, value);
-            this.appliedMaxWidth = value;
+        if (value !== this.appliedMaxHeight) {
+            this.driver.applyMaxHeight(this, value);
+            this.appliedMaxHeight = value;
         }
     }
     get contentAlignment() { return this.appliedContentAlignment; }
@@ -381,10 +392,7 @@ function runRenderNestedTreesThenDo(error, action) {
         try {
             children.endMerge(error);
             for (const item of children.removedItems(true)) {
-                const b = item.instance;
-                if (b.key !== b.body.key)
-                    console.warn(`every conditionally rendered block requires explicit key: ${b.key}, ${b.driver.name}`);
-                runFinalize(item, true);
+                runFinalize(item, true, true);
             }
             if (!error) {
                 const ownerIsBlock = owner.driver.isBlock;
@@ -400,7 +408,7 @@ function runRenderNestedTreesThenDo(error, action) {
                         break;
                     const block = item.instance;
                     const driver = block.driver;
-                    const host = driver.isRow ? owner : partHost;
+                    const host = driver.isLine ? owner : partHost;
                     const p = (_a = block.renderingPriority) !== null && _a !== void 0 ? _a : Priority.SyncP0;
                     redeploy = markToRedeployIfNecessary(redeploy, host, item, children, sequential);
                     if (p === Priority.SyncP0)
@@ -409,7 +417,7 @@ function runRenderNestedTreesThenDo(error, action) {
                         p1 = push(item, p1);
                     else
                         p2 = push(item, p2);
-                    if (ownerIsBlock && driver.isRow)
+                    if (ownerIsBlock && driver.isLine)
                         partHost = block;
                 }
                 if (!Transaction.isCanceled && (p1 !== undefined || p2 !== undefined))
@@ -523,7 +531,7 @@ function runRender(item) {
                 block.assignedCells = undefined;
                 block.children.beginMerge();
                 result = block.driver.render(block);
-                if (block.driver.isRow)
+                if (block.driver.isLine)
                     block.host.cursor.lineFeed();
                 else if (block.assignedCells === undefined)
                     block.cells = undefined;
@@ -540,10 +548,12 @@ function runRender(item) {
         });
     }
 }
-function runFinalize(item, isLeader) {
+function runFinalize(item, isLeader, individual) {
     var _a;
     const block = item.instance;
     if (block.stamp >= 0) {
+        if (individual && block.key !== block.body.key && !block.driver.isLine)
+            console.log(`WARNING: it is recommended to assign explicit key for conditionally rendered block in order to avoid unexpected side effects: ${block.key}`);
         block.stamp = ~block.stamp;
         const childrenAreLeaders = block.driver.finalize(block, isLeader);
         if ((_a = block.body) === null || _a === void 0 ? void 0 : _a.reacting) {
@@ -559,7 +569,7 @@ function runFinalize(item, isLeader) {
                 });
         }
         for (const item of block.children.items())
-            runFinalize(item, childrenAreLeaders);
+            runFinalize(item, childrenAreLeaders, false);
         VBlockImpl.grandCount--;
     }
 }

package/build/dist/source/html/Blocks.d.ts

@@ -4,7 +4,7 @@ export declare function Block<M = unknown, R = void>(body: BlockBody<HTMLElement
 export declare function PlainText(content: string, body?: BlockBody<HTMLElement, void, void>): VBlock<HTMLElement, void, void>;
 export declare function HtmlText(content: string, body?: BlockBody<HTMLElement, void, void>): VBlock<HTMLElement, void, void>;
 export declare function Grid<M = unknown, R = void>(body: BlockBody<HTMLElement, M, R>): VBlock<HTMLElement, M, R>;
-export declare function Line<T = void>(body: (block: void) => T): void;
+export declare function line<T = void>(body: (block: void) => T): void;
 export declare function lineFeed(noCoalescing?: boolean, key?: string): VBlock<HTMLElement>;
 export declare function Group<M = unknown, R = void>(body: BlockBody<HTMLElement, M, R>): VBlock<HTMLElement, M, R>;
 export declare class VerstakDriver<T extends HTMLElement> extends HtmlDriver<T> {

package/build/dist/source/html/Blocks.js

@@ -20,13 +20,12 @@ export function HtmlText(content, body) {
 export function Grid(body) {
     return VBlock.claim(VerstakTags.grid, body);
 }
-export function Line(body) {
+export function line(body) {
     lineFeed();
     body();
-    lineFeed();
 }
 export function lineFeed(noCoalescing, key) {
-    return VBlock.claim(VerstakTags.row, { key });
+    return VBlock.claim(VerstakTags.line, { key });
 }
 export function Group(body) {
     return VBlock.claim(VerstakTags.group, body);
@@ -63,14 +62,14 @@ export class VerstakDriver extends HtmlDriver {
         block.native.style.maxWidth = `${maxWidth}`;
     }
     applyHeightGrowth(block, heightGrowth) {
-        if (block.driver.isRow) {
+        if (block.driver.isLine) {
             const css = block.native.style;
             if (heightGrowth > 0)
                 css.flexGrow = `${heightGrowth}`;
             else
                 css.flexGrow = "";
         }
-        else if (block.host.driver.isRow) {
+        else if (block.host.driver.isLine) {
             block.driver.applyFrameAlignment(block, Align.Stretch);
             block.host.driver.applyHeightGrowth(block.host, heightGrowth);
         }
@@ -118,8 +117,8 @@ export class VerstakDriver extends HtmlDriver {
             block.native.removeAttribute("floating");
     }
     render(block) {
-        if (block.driver.layout < LayoutKind.Row)
-            VBlock.claim(VerstakTags.row, {});
+        if (block.driver.layout < LayoutKind.Line)
+            lineFeed();
         return super.render(block);
     }
 }
@@ -127,7 +126,7 @@ const VerstakTags = {
     block: new VerstakDriver("v-block", LayoutKind.Block),
     text: new VerstakDriver("v-text", LayoutKind.Text),
     grid: new VerstakDriver("v-grid", LayoutKind.Grid, () => new GridCursor()),
-    row: new VerstakDriver("v-row", LayoutKind.Row),
+    line: new VerstakDriver("v-line", LayoutKind.Line),
     group: new VerstakDriver("v-group", LayoutKind.Group),
 };
 const AlignToCss = ["stretch", "start", "center", "end"];

package/build/dist/source/html/HtmlDriver.js

@@ -3,8 +3,8 @@ import { VBlock, AbstractDriver } from "../core/api";
 export class BaseHtmlDriver extends AbstractDriver {
     initialize(block, element) {
         element = this.createElement(block);
-        if (Rx.isLogging && this.name)
-            element.setAttribute("n", block.key);
+        if (Rx.isLogging && !block.driver.isLine && this.name)
+            element.setAttribute("key", block.key);
         super.initialize(block, element);
     }
     finalize(block, isLeader) {
@@ -23,9 +23,9 @@ export class BaseHtmlDriver extends AbstractDriver {
         if (e) {
             const nativeParent = BaseHtmlDriver.findNearestParentHtmlBlock(block).native;
             if (nativeParent) {
-                if (sequential) {
+                if (sequential && !block.driver.isLine) {
                     const after = BaseHtmlDriver.findPrevSiblingHtmlBlock(block.item);
-                    if (after === undefined) {
+                    if (after === undefined || after.instance.driver.isLine) {
                         if (nativeParent !== e.parentNode || !e.previousSibling)
                             nativeParent.prepend(e);
                     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "verstak",
-  "version": "0.22.515",
+  "version": "0.22.516",
   "description": "Verstak - Front-End Library",
   "publisher": "Nezaboodka Software",
   "license": "Apache-2.0",
@@ -31,7 +31,7 @@
   },
   "homepage": "https://github.com/nezaboodka/verstak/blob/master/README.md#readme",
   "dependencies": {
-    "reactronic": "^0.22.509"
+    "reactronic": "^0.22.510"
   },
   "devDependencies": {
     "@types/node": "18.11.9",