@gjsify/adwaita-nativescript 0.64.1 → 0.64.2-next.254

package/src/testing/ns-core.mts

@@ -23,10 +23,10 @@
 // port imports that this file does not export fails the build — measured, by renaming
 // `Button` away: rolldown answers `MISSING_EXPORT "Button" is not exported by ns-core.mts`,
 // exit 1, no bundle. That is the reachable slice held exactly. The other direction is not
-// held by anything: `ListPicker` and `Screen` are in the `.d.ts` and deliberately absent
-// here, because the only modules importing them are `*.android.ts` / `*.ios.ts`, which no
-// off-device bundle resolves. If one of them ever moves into a platform-neutral module the
-// build will say so on the next run.
+// held by anything: `ListPicker` is in the `.d.ts` and deliberately absent here, because the
+// only modules importing it are `*.android.ts` / `*.ios.ts`, which no off-device bundle
+// resolves. If it ever moves into a platform-neutral module the build will say so on the next
+// run, as `Screen` did when the icon lookup started asking for the device scale.
 //
 // WHAT IT IS NOT, and the driver's header says this again where a reader of the result will
 // look: it is not a device and it is not a measurement of NativeScript. It carries no layout
@@ -155,18 +155,53 @@ export interface TouchGestureEventData extends EventData {
 /** Parent links, written by {@link LayoutBase} and read back through {@link View.parent}. */
 const PARENTS = new WeakMap<object, View>();
 
+/** The views that are loaded — upstream's `_isLoaded`, kept off the instance for the reason {@link View.isLoaded} gives. */
+const LOADED = new WeakSet<object>();
+
+/** `ViewBase.loadView` / `unloadView`: a child follows its parent into and out of the tree. */
+function loadView(view: View): void {
+    if (view && !LOADED.has(view)) view.callLoaded();
+}
+
+function unloadView(view: View): void {
+    if (view && LOADED.has(view)) view.callUnloaded();
+}
+
+/**
+ * `ui/styling/style/index.ts`'s `Style` is an `Observable`, and a CSS property's setter notifies
+ * `<name>Change` on it (`CssProperty`, `ui/core/properties/index.ts`) — never on the view.
+ */
+export class Style extends Observable {
+    direction?: 'ltr' | 'rtl' | null = null;
+    readonly viewRef: WeakRef<View>;
+    #visibility = 'visible';
+
+    constructor(view: View) {
+        super();
+        this.viewRef = new WeakRef(view);
+    }
+
+    get visibility(): string {
+        return this.#visibility;
+    }
+
+    set visibility(value: string) {
+        const oldValue = this.#visibility;
+        if (value === oldValue) return;
+        this.#visibility = value;
+        this.notify({ eventName: 'visibilityChange', object: this, propertyName: 'visibility', value, oldValue });
+    }
+}
+
 export class View extends Observable {
     /**
      * `View` keeps its `Style` in `_style` and answers it from `style`: a subclass field of that
      * name replaces it, and every inherited-CSS pass then reads `viewRef` off the wrong object
      * (`Cannot read properties of undefined (reading 'get')`, measured on a device).
      */
-    _style: { direction?: 'ltr' | 'rtl' | null; viewRef: WeakRef<View> } = {
-        direction: null,
-        viewRef: new WeakRef(this),
-    };
+    _style: Style = new Style(this);
 
-    get style(): { direction?: 'ltr' | 'rtl' | null; viewRef: WeakRef<View> } {
+    get style(): Style {
         return this._style;
     }
 
@@ -221,8 +256,17 @@ export class View extends Observable {
     marginBottom = 0;
     marginLeft = 0;
     marginRight = 0;
-    /** `'visible' | 'hidden' | 'collapse'` — NativeScript's own default is `'visible'`. */
-    visibility = 'visible';
+    /**
+     * `'visible' | 'hidden' | 'collapse'` — NativeScript's own default is `'visible'`. A CSS
+     * property, so `View` reads and writes it on its {@link Style}, which notifies the change.
+     */
+    get visibility(): string {
+        return this._style.visibility;
+    }
+
+    set visibility(value: string) {
+        this._style.visibility = value;
+    }
     /** `isEnabledProperty` registers `defaultValue: true`. */
     isEnabled = true;
     /**
@@ -292,11 +336,48 @@ export class View extends Observable {
     isUserInteractionEnabled = true;
     translateX = 0;
     translateY = 0;
-    /** Never loaded here: nothing mounts a view into a page without a platform. */
-    readonly isLoaded: boolean = false;
-    /** Nothing loads a view here; a spec calls these to stand in for the platform's. */
-    onLoaded(): void {}
-    onUnloaded(): void {}
+    /**
+     * Loaded once something calls {@link onLoaded}: nothing mounts a view into a page without a
+     * platform, so a spec calls it to stand in for the platform's. Read from {@link LOADED} and
+     * not from this getter by the lifecycle, as upstream reads `_isLoaded`: a spec may pin the
+     * getter with `Object.defineProperty`.
+     */
+    get isLoaded(): boolean {
+        return LOADED.has(this);
+    }
+
+    /**
+     * `ViewBase.onLoaded` (`ui/core/view-base/index.ts`): loads the children BEFORE it emits
+     * `loaded` on itself, and a second call does nothing.
+     */
+    onLoaded(): void {
+        if (LOADED.has(this)) return;
+        LOADED.add(this);
+        this.eachChildView((child) => {
+            loadView(child);
+            return true;
+        });
+        this._emit('loaded');
+    }
+
+    /** `ViewBase.onUnloaded`: unloads the children before it emits `unloaded` on itself. */
+    onUnloaded(): void {
+        if (!LOADED.has(this)) return;
+        this.eachChildView((child) => {
+            unloadView(child);
+            return true;
+        });
+        LOADED.delete(this);
+        this._emit('unloaded');
+    }
+
+    callLoaded(): void {
+        this.onLoaded();
+    }
+
+    callUnloaded(): void {
+        this.onUnloaded();
+    }
     androidOverflowEdge = 'none';
     accessibilityRole: string | undefined;
     accessibilityState: string | undefined;
@@ -416,14 +497,17 @@ export class LayoutBase extends View {
         PARENTS.set(view, this);
     }
 
+    /** `_addViewCore` loads a child added to a loaded parent; `_removeView` unloads it first. */
     addChild(view: View): void {
         this.#adopt(view);
         this.#children.push(view);
+        if (LOADED.has(this)) loadView(view);
     }
 
     insertChild(view: View, atIndex: number): void {
         this.#adopt(view);
         this.#children.splice(atIndex, 0, view);
+        if (LOADED.has(this)) loadView(view);
     }
 
     /** `_removeView` refuses a view that is not this parent's; a silent no-op would hide it. */
@@ -431,12 +515,16 @@ export class LayoutBase extends View {
         if (PARENTS.get(view) !== this) {
             throw new Error(`View not added to this instance. View: ${view?.constructor.name}`);
         }
+        unloadView(view);
         this.#children.splice(this.#children.indexOf(view), 1);
         PARENTS.delete(view);
     }
 
     removeChildren(): void {
-        for (const view of this.#children) PARENTS.delete(view);
+        for (const view of this.#children) {
+            unloadView(view);
+            PARENTS.delete(view);
+        }
         this.#children.length = 0;
     }
 
@@ -660,8 +748,40 @@ export class ScrollView extends View {
     }
 }
 
+/**
+ * Upstream's `content` setter (`ui/content-view/index.ts`) `_removeView`s the old view and
+ * `_addView`s the new one, and `eachChildView` answers that one view — so the tree members see
+ * through it and a view already parented elsewhere is refused, as on a device.
+ */
 export class ContentView extends LayoutBase {
-    content: View = null;
+    #content: View | null = null;
+
+    get content(): View | null {
+        return this.#content;
+    }
+
+    set content(value: View | null) {
+        if (this.#content !== null) {
+            unloadView(this.#content);
+            PARENTS.delete(this.#content);
+        }
+        this.#content = null;
+        if (value) {
+            const parent = PARENTS.get(value);
+            if (parent !== undefined) {
+                throw new Error(
+                    `View already has a parent. View: ${value.constructor.name} Parent: ${parent.constructor.name}`,
+                );
+            }
+            PARENTS.set(value, this);
+            this.#content = value;
+            if (LOADED.has(this)) loadView(value);
+        }
+    }
+
+    eachChildView(callback: (child: View) => boolean): void {
+        if (this.#content !== null) callback(this.#content);
+    }
 }
 
 export class WrapLayout extends LayoutBase {
@@ -739,14 +859,23 @@ export class ImageSource {
     constructor(nativeSource?: unknown) {
         this.nativeSource = nativeSource;
     }
+
+    /** Decodes nothing: the source keeps the base64 it was given, for a spec to read back. */
+    static fromBase64Sync(source: string): ImageSource {
+        return new ImageSource({ base64: source });
+    }
 }
 
 export class Image extends View {
     src: string | ImageSource | undefined;
     imageSource: ImageSource | undefined;
     stretch = 'aspectFit';
+    tintColor: string | undefined;
 }
 
+/** One screen at scale 1, the density the port's own sizes are written in. */
+export const Screen = { mainScreen: { scale: 1, widthDIPs: 0, heightDIPs: 0 } };
+
 export class SegmentedBarItem extends Observable {
     title = '';
 }

package/src/theme/adwaita.css

@@ -1671,6 +1671,11 @@ Page.adw-window {
     background-color: #3584e4;
 }
 
+/* A grouped check button draws the round radio (`radio { border-radius: 100% }`). */
+.adw-check-indicator.radio {
+    border-radius: 10;
+}
+
 .adw-check-label {
     font-size: 15;
     color: rgba(0, 0, 0, 0.8);
@@ -1788,7 +1793,10 @@ Page.adw-window {
 .adw-about-dialog-developer,
 .adw-about-dialog-comments,
 .adw-about-dialog-website,
-.adw-about-dialog-copyright {
+.adw-about-dialog-copyright,
+.adw-about-dialog-release-notes,
+.adw-about-dialog-links,
+.adw-about-dialog-debug-info {
     font-size: 13;
     color: rgba(0, 0, 0, 0.6);
     margin: 2 0 2 0;
@@ -2622,7 +2630,10 @@ Page.ns-dark.adw-window {
 .ns-dark .adw-about-dialog-developer,
 .ns-dark .adw-about-dialog-comments,
 .ns-dark .adw-about-dialog-website,
-.ns-dark .adw-about-dialog-copyright {
+.ns-dark .adw-about-dialog-copyright,
+.ns-dark .adw-about-dialog-release-notes,
+.ns-dark .adw-about-dialog-links,
+.ns-dark .adw-about-dialog-debug-info {
     color: rgba(255, 255, 255, 0.6);
 }