@triniwiz/nativescript-masonkit 1.0.0-beta.106 → 1.0.0-beta.108

package/common.d.ts

@@ -229,8 +229,19 @@ export declare class ViewBase extends CustomLayoutView implements AddChildFromBu
     _unregisterNativeEvent(arg: string, callback: any, thisArg?: any): void;
     initNativeView(): void;
     _setNativeViewFrame(nativeView: any, frame: CGRect): void;
+    /**
+     * iOS: the views in this subtree a root's layout pass must visit (non-Mason children, which core
+     * lays out, and Mason views listening to layoutChanged). The pass skips subtrees where it's 0.
+     */
+    _masonLayoutWork: number;
+    private _masonAddLayoutWork;
+    private _masonListensToLayout;
+    _addViewCore(view: any, atIndex?: number): void;
+    _removeViewCore(view: any): void;
     addEventListener(arg: string, callback: any, thisArg?: any): void;
     removeEventListener(arg: string, callback: any, thisArg?: any): void;
+    private _addEventListener;
+    private _removeEventListener;
     private _applyPseudoClassStyles;
     _hoverHandler(subscribe: boolean): void;
     _handler(subscribe: boolean): void;
@@ -241,6 +252,7 @@ export declare class ViewBase extends CustomLayoutView implements AddChildFromBu
     get _viewChildren(): NSView[];
     eachLayoutChild(callback: (child: NSView, isLast: boolean) => void): void;
     eachChild(callback: (child: NSViewBase) => boolean): void;
+    private _eachViewChild;
     /** True for a Mason view whose frame the Mason tree sets natively (iOS). */
     get _masonPlacedNatively(): boolean;
     /** Size a non-Mason child with core's measure: its native view rarely implements sizeThatFits. */
@@ -251,9 +263,17 @@ export declare class ViewBase extends CustomLayoutView implements AddChildFromBu
      * it when its native sizing can't express one. `false` when core should handle it.
      */
     _setChildPercentSize(child: any, horizontal: boolean, fraction: number | null): boolean;
+    /**
+     * A native removal relays out natively but runs no core layout pass, so `layoutChanged`
+     * and non-Mason descendants miss it. Ask for one; a subtree being torn down is unloaded.
+     */
+    _masonRequestLayoutAfterRemoval(): void;
     /** Lay out the non-Mason views in this root's subtree from the frames Mason set. */
     _masonLayoutForeignDescendants(): void;
+    private _masonClimbRoot;
+    private _masonClimbTurn;
     requestLayout(): void;
+    _parentChanged(oldParent: any): void;
     getMeasuredWidth(): number;
     getMeasuredHeight(): number;
     eachChildView(callback: (child: NSView) => boolean): void;
@@ -401,8 +421,8 @@ export declare class ViewBase extends CustomLayoutView implements AddChildFromBu
     get flexFlowProperty(): "row nowrap" | "row wrap" | "row wrap-reverse" | "row-reverse nowrap" | "row-reverse wrap" | "row-reverse wrap-reverse" | "column nowrap" | "column wrap" | "column wrap-reverse" | "column-reverse nowrap" | "column-reverse wrap" | "column-reverse wrap-reverse";
     set inset(value: LengthAuto);
     get inset(): LengthAuto;
-    set textOverFlow(value: string);
-    get textOverFlow(): string;
+    set textOverFlow(value: CoreTypes.TextOverflowType);
+    get textOverFlow(): CoreTypes.TextOverflowType;
 }
 export declare class TextBase extends ViewBase {
     [fontInternalProperty.setNative]: (value: any) => void;

package/common.js

@@ -212,6 +212,19 @@ function clearWindowsActive(view) {
 const TEARDOWN_SLICE_MS = 8;
 // Reading the clock costs more than a teardown on some devices.
 const TEARDOWNS_PER_CLOCK_READ = 16;
+// Mason roots whose requestLayout already climbed to the page in this turn.
+let climbedRoots = null;
+function markClimbed(root) {
+    if (!climbedRoots) {
+        climbedRoots = new Set();
+        queueMicrotask(() => (climbedRoots = null));
+    }
+    climbedRoots.add(root);
+}
+// A layout in between clears core's flag, so the next request climbs again.
+function climbedThisTurn(root) {
+    return !!climbedRoots?.has(root) && !!root.isLayoutRequested;
+}
 export class ViewBase extends CustomLayoutView {
     _tearDownUI(force) {
         if ((__ANDROID__ || __APPLE__ || __WINDOWS__) && !force && !this.reusable && this._context && this.nativeViewProtected) {
@@ -314,6 +327,12 @@ export class ViewBase extends CustomLayoutView {
         this[_c] = false;
         this[_d] = {};
         this._pendingEventsRegistration = [];
+        /**
+         * iOS: the views in this subtree a root's layout pass must visit (non-Mason children, which core
+         * lays out, and Mason views listening to layoutChanged). The pass skips subtrees where it's 0.
+         */
+        this._masonLayoutWork = 0;
+        this._masonClimbTurn = null;
         // `width`/`height` are core CssAnimationProperties whose stylesheet accessor
         // is non-configurable, so units Mason understands but core does not (`vh`,
         // `rem`, `pt`, …) have to be resolved on this view's own Style object.
@@ -382,7 +401,13 @@ export class ViewBase extends CustomLayoutView {
         }
         if (!nativeHit)
             return null;
-        return nativeOwnerFor(nativeHit) ?? findOwnerForNativeView(this, nativeHit);
+        const known = nativeOwnerFor(nativeHit);
+        if (known)
+            return known;
+        // Owners are remembered on first hit rather than for every view at init.
+        const found = findOwnerForNativeView(this, nativeHit);
+        found?._rememberNativeOwner?.(nativeHit);
+        return found;
     }
     _registerNativeEvent(arg, callback, thisArg) {
         if (!this[native_]) {
@@ -519,7 +544,6 @@ export class ViewBase extends CustomLayoutView {
     }
     initNativeView() {
         super.initNativeView();
-        this._rememberNativeOwner();
         if (this._pendingEventsRegistration.length > 0) {
             const pending = this._pendingEventsRegistration.splice(0);
             for (const registration of pending) {
@@ -530,7 +554,50 @@ export class ViewBase extends CustomLayoutView {
     _setNativeViewFrame(nativeView, frame) {
         // nativeView.frame = frame;
     }
+    _masonAddLayoutWork(delta) {
+        // Up to the root: a non-Mason parent is laid out by core and its Mason roots keep their own count.
+        let view = this;
+        while (view?.[isMasonView_]) {
+            view._masonLayoutWork += delta;
+            view = view.parent;
+        }
+    }
+    _masonListensToLayout() {
+        return this.hasListeners(NSView.layoutChangedEvent);
+    }
+    _addViewCore(view, atIndex) {
+        // Before setup: listeners the child gains while loading add themselves through `parent`.
+        if (__APPLE__) {
+            const work = view?.[isMasonView_] ? view._masonLayoutWork : 1;
+            if (work)
+                this._masonAddLayoutWork(work);
+        }
+        // @ts-ignore
+        super._addViewCore(view, atIndex);
+    }
+    _removeViewCore(view) {
+        // @ts-ignore
+        super._removeViewCore(view);
+        // After teardown: listeners removed while unloading already subtracted themselves.
+        if (__APPLE__) {
+            const work = view?.[isMasonView_] ? view._masonLayoutWork : 1;
+            if (work)
+                this._masonAddLayoutWork(-work);
+        }
+    }
     addEventListener(arg, callback, thisArg) {
+        const listened = __APPLE__ && this._masonListensToLayout();
+        this._addEventListener(arg, callback, thisArg);
+        if (__APPLE__ && !listened && this._masonListensToLayout())
+            this._masonAddLayoutWork(1);
+    }
+    removeEventListener(arg, callback, thisArg) {
+        const listened = __APPLE__ && this._masonListensToLayout();
+        this._removeEventListener(arg, callback, thisArg);
+        if (__APPLE__ && listened && !this._masonListensToLayout())
+            this._masonAddLayoutWork(-1);
+    }
+    _addEventListener(arg, callback, thisArg) {
         if (typeof thisArg === 'boolean') {
             thisArg = {
                 capture: thisArg,
@@ -548,7 +615,7 @@ export class ViewBase extends CustomLayoutView {
         }
         super.addEventListener(arg, callback, thisArg);
     }
-    removeEventListener(arg, callback, thisArg) {
+    _removeEventListener(arg, callback, thisArg) {
         if (typeof thisArg === 'boolean') {
             thisArg = {
                 capture: thisArg,
@@ -644,8 +711,16 @@ export class ViewBase extends CustomLayoutView {
         }
     }
     eachChild(callback) {
-        for (const child of this._viewChildren) {
-            callback(child);
+        this._eachViewChild(callback);
+    }
+    // Live and allocation-free, like core's LayoutBase.eachChildView (walks run per view).
+    _eachViewChild(callback) {
+        const children = this._children;
+        for (let i = 0, length = children.length; i < length; i++) {
+            const child = children[i];
+            if (child && !child[isPlaceholder_] && child instanceof NSView) {
+                callback(child);
+            }
         }
     }
     // Core's iOS requestLayout climbs to the Page and re-measures the whole tree in JS.
@@ -714,6 +789,14 @@ export class ViewBase extends CustomLayoutView {
         }
         return true;
     }
+    /**
+     * A native removal relays out natively but runs no core layout pass, so `layoutChanged`
+     * and non-Mason descendants miss it. Ask for one; a subtree being torn down is unloaded.
+     */
+    _masonRequestLayoutAfterRemoval() {
+        if (__APPLE__ && this.isLoaded)
+            this.requestLayout();
+    }
     /** Lay out the non-Mason views in this root's subtree from the frames Mason set. */
     _masonLayoutForeignDescendants() {
         if (!__APPLE__)
@@ -721,6 +804,8 @@ export class ViewBase extends CustomLayoutView {
         const visit = (view) => {
             view.eachChildView((child) => {
                 if (child[isMasonView_]) {
+                    if (!(child._masonLayoutWork > 0))
+                        return true;
                     // Keep `layoutChanged` working for the few views that listen to it.
                     if (child.hasListeners?.(NSView.layoutChangedEvent)) {
                         const b = child._getCurrentLayoutBounds();
@@ -746,13 +831,29 @@ export class ViewBase extends CustomLayoutView {
         // A natively placed view only needs its Mason root re-measured: skip the
         // per-ancestor hops (each a JS call plus a native setNeedsLayout).
         if (this._masonPlacedNatively) {
+            // CSS asks once per layout property; reuse this turn's root while it is still flagged.
+            if (climbedRoots && this._masonClimbTurn === climbedRoots && climbedThisTurn(this._masonClimbRoot))
+                return;
             let root = this.parent;
             while (root?.parent?.[isMasonView_])
                 root = root.parent;
-            root?.requestLayout();
+            if (root && !climbedThisTurn(root))
+                root.requestLayout();
+            this._masonClimbRoot = root;
+            this._masonClimbTurn = climbedRoots;
             return;
         }
+        // Core climbs on every call, once per changed property; once per turn is enough.
+        if (__APPLE__ && climbedThisTurn(this))
+            return;
         super.requestLayout();
+        if (__APPLE__)
+            markClimbed(this);
+    }
+    _parentChanged(oldParent) {
+        climbedRoots?.delete(this);
+        this._masonClimbTurn = null;
+        super._parentChanged(oldParent);
     }
     getMeasuredWidth() {
         if (this._masonPlacedNatively && this.nativeViewProtected) {
@@ -767,24 +868,37 @@ export class ViewBase extends CustomLayoutView {
         return super.getMeasuredHeight();
     }
     eachChildView(callback) {
-        for (const view of this._viewChildren) {
-            callback(view);
-        }
+        this._eachViewChild(callback);
     }
     _addChildFromBuilder(name, value) {
         this.addChild(value);
     }
     getChildrenCount() {
-        return this._viewChildren.length;
+        let count = 0;
+        this._eachViewChild(() => count++);
+        return count;
     }
     get _childrenCount() {
-        return this._viewChildren.length;
+        return this.getChildrenCount();
     }
     getChildAt(index) {
-        return this._viewChildren[index];
+        let found;
+        let i = 0;
+        this._eachViewChild((child) => {
+            if (i++ === index)
+                found = child;
+        });
+        return found;
     }
     getChildIndex(child) {
-        return this._viewChildren.indexOf(child);
+        let index = -1;
+        let i = 0;
+        this._eachViewChild((c) => {
+            if (c === child && index === -1)
+                index = i;
+            i++;
+        });
+        return index;
     }
     getChildById(id) {
         return getViewById(this, id);
@@ -1582,7 +1696,7 @@ export class ViewBase extends CustomLayoutView {
     _nativeBorderRadiusCorners() {
         // @ts-ignore
         const style = this._styleHelper;
-        if (__ANDROID__ && style && !style.hasBorderRadius()) {
+        if ((__ANDROID__ || __APPLE__) && style && !style.hasBorderRadius()) {
             return borderRadiusCorners('0');
         }
         const native = String(style?.borderRadius ?? '').trim();
@@ -1606,13 +1720,18 @@ export class ViewBase extends CustomLayoutView {
         const css = lengthToCssString(masonLength(value));
         const radius = (corners[corner] = /\s/.test(css) ? parseCornerRadius(css) : [css, css]);
         const shorthand = composeBorderRadius(corners);
-        if (__ANDROID__ && style._writeCornerRadius(corner, radius, shorthand)) {
+        if ((__ANDROID__ || __APPLE__) && style._writeCornerRadius(corner, radius, shorthand)) {
             return;
         }
         // @ts-ignore
         style.borderRadius = shorthand;
     }
     _nativeCornerRadius(corner) {
+        // @ts-ignore
+        const style = this._styleHelper;
+        if ((__ANDROID__ || __APPLE__) && style && !style.hasBorderRadius()) {
+            return '0';
+        }
         const [h, v] = this._nativeBorderRadiusCorners()[corner];
         return h === v ? h : `${h} ${v}`;
     }
@@ -1641,7 +1760,7 @@ export class ViewBase extends CustomLayoutView {
         this._borderRadiusCorner(3, value);
     }
     _borderSideColor(side, value) {
-        if (__ANDROID__) {
+        if (__ANDROID__ || __APPLE__) {
             const s = this._styleHelper;
             if (s) {
                 s.setBorderSideColor(side === 't' ? 'top' : side === 'r' ? 'right' : side === 'b' ? 'bottom' : 'left', value);
@@ -1854,8 +1973,12 @@ export class ViewBase extends CustomLayoutView {
                 nodeHelper().setBorderColor(this.nativeView, String(value));
         }
         else if (__APPLE__) {
+            const s = this._styleHelper;
+            if (s)
+                s.setBorderColor(String(value));
             // @ts-ignore
-            this.nativeView.style.setBorderColor(String(value));
+            else
+                this.nativeView.style.setBorderColor(String(value));
         }
         else if (__WINDOWS__) {
             // @ts-ignore
@@ -2564,17 +2687,16 @@ export class ViewBase extends CustomLayoutView {
         return this.style.inset;
     }
     set textOverFlow(value) {
-        this.style.textOverFlow = value;
+        this.style.textOverflow = value;
     }
     get textOverFlow() {
-        return this.style.textOverFlow;
+        return this.style.textOverflow;
     }
     [textOverFlowProperty.setNative](value) {
         // @ts-ignore
         const style = this._styleHelper;
         if (style) {
-            // @ts-ignore
-            style.textOverFlow = value;
+            style.textOverflow = value;
         }
     }
     [clearProperty.setNative](value) {