verstak 0.24.273 → 0.24.276

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

@@ -5,7 +5,7 @@ export type El<T = any, M = any> = {
     native: T;
     model: M;
     kind: ElKind;
-    area: ElArea;
+    place: ElPlace;
     width: Range;
     height: Range;
     horizontal: PosH | undefined;
@@ -50,13 +50,15 @@ export declare enum PosH {
     left = 0,
     center = 1,
     right = 2,
-    stretch = 3
+    stretch = 3,
+    stretchAndFix = 4
 }
 export declare enum PosV {
     top = 0,
     center = 1,
     bottom = 2,
-    stretch = 3
+    stretch = 3,
+    stretchAndFix = 4
 }
 export type Range = {
     readonly min?: string;
@@ -66,7 +68,7 @@ export type Range = {
 export type MarkedRange = Range & {
     readonly marker?: string;
 };
-export type ElArea = undefined | string | {
+export type ElPlace = undefined | string | {
     cellsOverWidth?: number;
     cellsOverHeight?: number;
 };
@@ -85,7 +87,7 @@ export declare class ElImpl<T extends Element = any, M = any> implements El<T, M
     native: T;
     model: M;
     private _kind;
-    private _area;
+    private _place;
     private _coords;
     private _width;
     private _height;
@@ -108,8 +110,8 @@ export declare class ElImpl<T extends Element = any, M = any> implements El<T, M
     get isAuxiliary(): boolean;
     get kind(): ElKind;
     set kind(value: ElKind);
-    get area(): ElArea;
-    set area(value: ElArea);
+    get place(): ElPlace;
+    set place(value: ElPlace);
     get width(): Range;
     set width(value: Range);
     get widthPx(): {

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

@@ -26,6 +26,7 @@ export var PosH;
     PosH[PosH["center"] = 1] = "center";
     PosH[PosH["right"] = 2] = "right";
     PosH[PosH["stretch"] = 3] = "stretch";
+    PosH[PosH["stretchAndFix"] = 4] = "stretchAndFix";
 })(PosH || (PosH = {}));
 export var PosV;
 (function (PosV) {
@@ -33,6 +34,7 @@ export var PosV;
     PosV[PosV["center"] = 1] = "center";
     PosV[PosV["bottom"] = 2] = "bottom";
     PosV[PosV["stretch"] = 3] = "stretch";
+    PosV[PosV["stretchAndFix"] = 4] = "stretchAndFix";
 })(PosV || (PosV = {}));
 export var Direction;
 (function (Direction) {
@@ -62,7 +64,7 @@ export class ElImpl {
         this.native = undefined;
         this.model = undefined;
         this._kind = ElKind.part;
-        this._area = undefined;
+        this._place = undefined;
         this._coords = UndefinedElCoords;
         this._width = Transaction.separate(() => new Size());
         this._height = Transaction.separate(() => new Size());
@@ -79,7 +81,7 @@ export class ElImpl {
         this._hasStylingPresets = false;
     }
     prepareForUpdate() {
-        this._area = undefined;
+        this._place = undefined;
         this._hasStylingPresets = false;
     }
     get index() { return this.node.seat.index; }
@@ -94,8 +96,8 @@ export class ElImpl {
             this._kind = value;
         }
     }
-    get area() { return this._area; }
-    set area(value) {
+    get place() { return this._place; }
+    set place(value) {
         var _a, _b;
         const node = this.node;
         const driver = node.driver;
@@ -112,7 +114,7 @@ export class ElImpl {
                     ElImpl.applyCoords(this, coords);
                 this._coords = coords;
             }
-            this._area = value !== null && value !== void 0 ? value : {};
+            this._place = value !== null && value !== void 0 ? value : {};
         }
         else
             this.rowBreak();
@@ -370,6 +372,7 @@ export class ElImpl {
                     css.marginRight = "";
                 break;
             case PosH.stretch:
+            case PosH.stretchAndFix:
                 css.justifySelf = "stretch";
                 if (oldPrimary === PosH.center) {
                     css.marginLeft = "";
@@ -394,11 +397,12 @@ export class ElImpl {
                 css.textAlign = "right";
                 break;
             case PosH.stretch:
+            case PosH.stretchAndFix:
                 css.alignItems = "stretch";
                 css.textAlign = "justify";
                 break;
         }
-        if (newPrimary === PosH.stretch && strength === undefined)
+        if (newPrimary >= PosH.stretch && strength === undefined)
             ElImpl.applyStretchingStrengthH(element, 0, 1);
     }
     static applyVertical(element, oldPrimary, newPrimary, oldInside, newInside, strength) {
@@ -446,6 +450,7 @@ export class ElImpl {
                 css.alignSelf = "end";
                 break;
             case PosV.stretch:
+            case PosV.stretchAndFix:
                 css.alignSelf = "stretch";
                 break;
         }
@@ -461,10 +466,11 @@ export class ElImpl {
                 css.justifyContent = "end";
                 break;
             case PosV.stretch:
+            case PosV.stretchAndFix:
                 css.justifyContent = "stretch";
                 break;
         }
-        if (newPrimary === PosV.stretch && strength === undefined)
+        if (newPrimary >= PosV.stretch && strength === undefined)
             ElImpl.applyStretchingStrengthV(element, 0, 1);
     }
     static applyStretchingStrengthH(element, existing, value) {
@@ -640,11 +646,11 @@ var ElLayoutInfoFlags;
 })(ElLayoutInfoFlags || (ElLayoutInfoFlags = {}));
 const UndefinedElCoords = Object.freeze({ x1: 0, y1: 0, x2: 0, y2: 0 });
 export const InitialElLayoutInfo = Object.freeze(new ElLayoutInfo({ x: 1, y: 1, runningMaxX: 0, runningMaxY: 0, flags: ElLayoutInfoFlags.none, effectiveSizePx: 0, offsetXpx: 0, offsetYpx: 0, contentSizeXpx: 0, contentSizeYpx: 0, borderSizeXpx: 0, borderSizeYpx: 0, isConstrained: false }));
-function getElCoordsAndAdjustLayoutInfo(isRegularElement, area, maxX, maxY, prevElLayoutInfo, layoutInfo) {
+function getElCoordsAndAdjustLayoutInfo(isRegularElement, place, maxX, maxY, prevElLayoutInfo, layoutInfo) {
     var _a, _b;
     let result;
-    if (typeof (area) === "string") {
-        result = parseElCoords(area, { x1: 0, y1: 0, x2: 0, y2: 0 });
+    if (typeof (place) === "string") {
+        result = parseElCoords(place, { x1: 0, y1: 0, x2: 0, y2: 0 });
         absolutizeElCoords(result, prevElLayoutInfo.x, prevElLayoutInfo.y, maxX || Infinity, maxY || Infinity, result);
         if (layoutInfo) {
             layoutInfo.x = isRegularElement ? result.x2 + 1 : result.x1;
@@ -655,9 +661,9 @@ function getElCoordsAndAdjustLayoutInfo(isRegularElement, area, maxX, maxY, prev
     else if (layoutInfo) {
         let dx;
         let dy;
-        if (area) {
-            dx = (_a = area.cellsOverWidth) !== null && _a !== void 0 ? _a : 1;
-            dy = (_b = area.cellsOverHeight) !== null && _b !== void 0 ? _b : 1;
+        if (place) {
+            dx = (_a = place.cellsOverWidth) !== null && _a !== void 0 ? _a : 1;
+            dy = (_b = place.cellsOverHeight) !== null && _b !== void 0 ? _b : 1;
         }
         else
             dx = dy = 1;
@@ -717,15 +723,15 @@ function getElCoordsAndAdjustLayoutInfo(isRegularElement, area, maxX, maxY, prev
         throw new Error("relative layout requires sequential children");
     return result;
 }
-function absolutizeElCoords(area, cursorX, cursorY, maxWidth, maxHeight, result) {
-    const x1 = absolutizePosition(area.x1, cursorX, maxWidth);
-    const x2 = absolutizePosition(area.x2, x1, maxWidth);
+function absolutizeElCoords(place, cursorX, cursorY, maxWidth, maxHeight, result) {
+    const x1 = absolutizePosition(place.x1, cursorX, maxWidth);
+    const x2 = absolutizePosition(place.x2, x1, maxWidth);
     if (x1 <= x2)
         result.x1 = x1, result.x2 = x2;
     else
         result.x1 = x2, result.x2 = x1;
-    const y1 = absolutizePosition(area.y1, cursorY, maxHeight);
-    const y2 = absolutizePosition(area.y2, y1, maxHeight);
+    const y1 = absolutizePosition(place.y1, cursorY, maxHeight);
+    const y2 = absolutizePosition(place.y2, y1, maxHeight);
     if (y1 <= y2)
         result.y1 = y1, result.y2 = y2;
     else
@@ -753,7 +759,7 @@ export const Constants = {
     partition: "part",
     splitter: "splitter",
     group: "group",
-    layouts: ["section", "table", "note", "group", "", "", ""],
+    layouts: ["panel", "table", "note", "group", "", "", ""],
     keyAttrName: "key",
     kindAttrName: "kind",
 };
@@ -802,6 +808,7 @@ const VerstakDriversByLayout = [
         const s = el.style;
         s.display = owner.isTable ? "contents" : "flex";
         s.flexDirection = "row";
+        s.alignItems = "center";
         s.gap = "inherit";
     },
     el => {

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

@@ -1,5 +1,5 @@
 import { RxNodeDecl, RxNodeDriver, RxNode, Delegate, MergedItem } from "reactronic";
-import { CursorCommandDriver, El, ElArea } from "./El.js";
+import { CursorCommandDriver, El, ElPlace } from "./El.js";
 import { HtmlDriver } from "./HtmlDriver.js";
 export declare function Panel<M = unknown>(declaration?: RxNodeDecl<El<HTMLElement, M>>, preset?: RxNodeDecl<El<HTMLElement, M>>): RxNode<El<HTMLElement, M>>;
 export declare function Table<M = unknown, R = void>(declaration?: RxNodeDecl<El<HTMLElement, M>>, preset?: RxNodeDecl<El<HTMLElement, M>>): RxNode<El<HTMLElement, M>>;
@@ -7,7 +7,7 @@ export declare function row<T = void>(builder?: (element: void) => T, shiftCurso
 export declare function Splitter<M = unknown, R = void>(declaration?: RxNodeDecl<El<HTMLElement, M>>, preset?: RxNodeDecl<El<HTMLElement, M>>): RxNode<El<HTMLElement, M>>;
 export declare function rowBreak(shiftCursorDown?: number): void;
 export declare function declareSplitter<T>(index: number, splitViewNode: RxNode<El<T>>): RxNode<El<HTMLElement>>;
-export declare function cursor(areaParams: ElArea): void;
+export declare function cursor(areaParams: ElPlace): void;
 export declare function Note(content: string, formatted?: boolean, declaration?: RxNodeDecl<El<HTMLElement, void>>): RxNode<El<HTMLElement, void>>;
 export declare function Group<M = unknown, R = void>(declaration?: RxNodeDecl<El<HTMLElement, M>>, preset?: RxNodeDecl<El<HTMLElement, M>>): RxNode<El<HTMLElement, M>>;
 export declare function Handling<M = unknown>(onChange: Delegate<El<void, M>>): RxNode<El<void, M>>;

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

@@ -85,7 +85,7 @@ export function declareSplitter(index, splitViewNode) {
 export function cursor(areaParams) {
     RxNode.declare(Drivers.cursor, {
         onChange: el => {
-            el.area = areaParams;
+            el.place = areaParams;
         },
     });
 }

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

@@ -57,10 +57,10 @@ export class WebDriver extends ElDriver {
         if (element instanceof ElImpl)
             element.prepareForUpdate();
         const result = super.update(node);
-        if (element.area === undefined) {
+        if (element.place === undefined) {
             const oel = node.owner.element;
             if (oel instanceof ElImpl && oel.isTable)
-                element.area = undefined;
+                element.place = undefined;
         }
         if (gBlinkingEffectMarker)
             blink(element.native, RxNode.currentUpdatePriority, node.stamp);

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "verstak",
-  "version": "0.24.273",
+  "version": "0.24.276",
   "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.24.271"
+    "reactronic": "^0.24.272"
   },
   "devDependencies": {
     "@types/node": "20.11.17",