@gjsify/adwaita-web 0.64.13-next.283 → 0.64.13

package/lib/types/elements/adw-bin.d.ts

@@ -5,6 +5,19 @@ export declare class AdwBin extends WidgetElement {
     get child(): Element | null;
     /** `adw_bin_set_child`: replace the current child, unparenting it. */
     set child(value: Element | null);
+    /**
+     * `adw_bin_get_child` / `adw_bin_set_child` — the METHOD spelling of {@link child}.
+     *
+     * The property alone is not the whole door. `Adw.Bin:child` is reached two ways and only
+     * one of them is a property: markup writes `child:`, but code built against GI calls
+     * `bin.get_child()` / `bin.set_child(w)`, which is the spelling a `.blp`-driven widget
+     * shared across renderers uses — GJS and the NativeScript bridge both answer it
+     * (`AdwSingleChildBase`), and here it was missing, so the shared code died with
+     * `get_child is not a function` on the web and nowhere else.
+     */
+    get_child(): Element | null;
+    /** `adw_bin_set_child`. Refuses a child that already has a parent, as {@link setChild} does. */
+    set_child(child: Element | null): void;
     connectedCallback(): void;
     disconnectedCallback(): void;
     /**

package/lib/types/widget-element.d.ts

@@ -9,7 +9,13 @@ export declare class WidgetElement extends HTMLElement {
     get_visible(): boolean;
     /** `gtk_widget_set_visible`. */
     set_visible(visible: boolean): void;
-    /** `gtk_widget_get_first_child`: the first child element, `null` for a leaf. */
+    /**
+     * `gtk_widget_get_first_child`: the first child WIDGET, `null` for a leaf.
+     *
+     * The five walkers skip the elements a port builds for its own insides — `isWidgetNode`
+     * in `@gjsify/adwaita-core` carries the rule and the incident behind it, and the
+     * registered-class copy in `widgetTreeMembers()` answers from the same function.
+     */
     get_first_child(): Element | null;
     /** `gtk_widget_get_last_child`. */
     get_last_child(): Element | null;
@@ -17,7 +23,7 @@ export declare class WidgetElement extends HTMLElement {
     get_next_sibling(): Element | null;
     /** `gtk_widget_get_prev_sibling`. */
     get_prev_sibling(): Element | null;
-    /** `gtk_widget_get_parent`. */
+    /** `gtk_widget_get_parent`: the nearest ancestor that is a widget, not a port's own wrapper. */
     get_parent(): Element | null;
     /** `gtk_widget_get_width`: the layout box in CSS px; 0 until the widget is rendered. */
     get_width(): number;

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@gjsify/adwaita-web",
-    "version": "0.64.13-next.283",
+    "version": "0.64.13",
     "description": "Adwaita/Libadwaita web components for browser targets",
     "type": "module",
     "main": "./src/index.ts",
@@ -58,14 +58,14 @@
         "@codemirror/language": "^6.12.4",
         "@codemirror/state": "^6.7.0",
         "@codemirror/view": "^6.43.4",
-        "@gjsify/adwaita-core": "0.64.13-next.283",
-        "@gjsify/adwaita-fonts": "0.64.13-next.283",
-        "@gjsify/adwaita-icons": "0.64.13-next.283",
-        "@gjsify/gtksource-core": "0.64.13-next.283",
+        "@gjsify/adwaita-core": "^0.64.13",
+        "@gjsify/adwaita-fonts": "^0.64.13",
+        "@gjsify/adwaita-icons": "^0.64.13",
+        "@gjsify/gtksource-core": "^0.64.13",
         "@lezer/highlight": "^1.2.3"
     },
     "peerDependencies": {
-        "@gjsify/app-settings": "0.64.13-next.283"
+        "@gjsify/app-settings": "^0.64.13"
     },
     "peerDependenciesMeta": {
         "@gjsify/app-settings": {
@@ -73,11 +73,11 @@
         }
     },
     "devDependencies": {
-        "@gjsify/app-settings": "0.64.13-next.283",
-        "@gjsify/blueprint": "0.64.13-next.283",
-        "@gjsify/cli": "0.64.13-next.283",
-        "@gjsify/unit": "0.64.13-next.283",
-        "@gjsify/vite-plugin-blueprint": "0.64.13-next.283",
+        "@gjsify/app-settings": "^0.64.13",
+        "@gjsify/blueprint": "^0.64.13",
+        "@gjsify/cli": "^0.64.13",
+        "@gjsify/unit": "^0.64.13",
+        "@gjsify/vite-plugin-blueprint": "^0.64.13",
         "sass": "^1.101.0",
         "typescript": "^6.0.3"
     },
@@ -114,6 +114,5 @@
     "bugs": {
         "url": "https://github.com/gjsify/gjsify/issues"
     },
-    "homepage": "https://github.com/gjsify/gjsify/tree/main/packages/web/adwaita-web#readme",
-    "gitHead": "05fae97125a374e84bf57c2d2d086fb53523f205"
+    "homepage": "https://github.com/gjsify/gjsify/tree/main/packages/web/adwaita-web#readme"
 }

package/src/adw-bin.spec.ts

@@ -61,6 +61,26 @@ export const AdwBinTest = async () => {
             other.remove();
         });
 
+        await it('answers `get_child()` / `set_child()` too, the spelling GI-built code uses', () => {
+            // `Adw.Bin:child` has two doors, and markup only takes one of them: code written
+            // against GI calls the methods, which is what a `.blp`-driven widget shared with
+            // GJS and NativeScript does. Both of those renderers answer them; the web did not,
+            // and shared code died here with `get_child is not a function`.
+            const { el, host } = mount();
+            expect(el.get_child()).toBeNull();
+            const child = document.createElement('div');
+            el.set_child(child);
+            expect(el.get_child()).toBe(child);
+            expect(el.child).toBe(child);
+            const next = document.createElement('span');
+            el.set_child(next);
+            expect(el.get_child()).toBe(next);
+            expect(el.childElementCount).toBe(1);
+            el.set_child(null);
+            expect(el.get_child()).toBeNull();
+            host.remove();
+        });
+
         await it('a bin is a column flex box, and its only child fills it', () => {
             const { el, host } = mount([document.createElement('div')]);
             // A bin takes the size it is GIVEN and hands all of it to the child, which

package/src/elements/adw-bin.ts

@@ -24,7 +24,7 @@
 // default `GENERIC` and a bin contributes nothing to the accessibility tree of its own.
 //
 // KNOWN_GAPS: none — `AdwBin`'s only property is `child`, a widget, which is a SLOT on
-// every renderer.
+// every renderer, and it is reachable BOTH ways: `child` and `get_child()`/`set_child()`.
 //
 // Reference: refs/libadwaita/src/adw-bin.c (adw_bin_set_child, class_init)
 // Copyright (c) 2021 Purism SPC / GNOME contributors (libadwaita). LGPLv2.1+.
@@ -46,6 +46,25 @@ export class AdwBin extends WidgetElement {
         this.setChild(value);
     }
 
+    /**
+     * `adw_bin_get_child` / `adw_bin_set_child` — the METHOD spelling of {@link child}.
+     *
+     * The property alone is not the whole door. `Adw.Bin:child` is reached two ways and only
+     * one of them is a property: markup writes `child:`, but code built against GI calls
+     * `bin.get_child()` / `bin.set_child(w)`, which is the spelling a `.blp`-driven widget
+     * shared across renderers uses — GJS and the NativeScript bridge both answer it
+     * (`AdwSingleChildBase`), and here it was missing, so the shared code died with
+     * `get_child is not a function` on the web and nowhere else.
+     */
+    get_child(): Element | null {
+        return this.child;
+    }
+
+    /** `adw_bin_set_child`. Refuses a child that already has a parent, as {@link setChild} does. */
+    set_child(child: Element | null): void {
+        this.setChild(child);
+    }
+
     connectedCallback() {
         // The NAME only. Every child of a bin already IS its content — there is no
         // internal structure to route into — so `.install()` is deliberately not called

package/src/pango-markup.spec.ts

@@ -73,6 +73,17 @@ export const PangoMarkupTest = async () => {
             expect(target.querySelector('i > u')?.textContent).toBe('b');
         });
 
+        await it("sub and sup carry pango's 1 / 1.2 font_scale fallback", () => {
+            const { target } = render('<sub>d</sub><sup>e</sup>');
+            // Compared as a computed ratio: browsers serialise the `calc()` differently
+            // (Firefox gives `calc(0.833333em)`).
+            const base = Number.parseFloat(getComputedStyle(target).fontSize);
+            for (const el of target.children) {
+                const ratio = Number.parseFloat(getComputedStyle(el).fontSize) / base;
+                expect(Math.abs(ratio - 1 / 1.2)).toBeLessThan(0.01);
+            }
+        });
+
         await it("<markup> draws its children — it is pango's implicit root, not a box", async () => {
             const { target } = render('<markup><b>x</b></markup>');
             expect(target.querySelector('b')?.textContent).toBe('x');

package/src/pango-markup.ts

@@ -59,8 +59,11 @@ export const TAG_STYLES: Readonly<Record<string, { element: string; style?: Read
     tt: { element: 'span', style: { 'font-family': 'monospace' } },
     big: { element: 'span', style: { 'font-size': 'larger' } },
     small: { element: 'span', style: { 'font-size': 'smaller' } },
-    sub: { element: 'sub' },
-    sup: { element: 'sup' },
+    // pango's `font_scale` for `<sub>`/`<sup>` falls back to `1 / 1.2` when the font's OpenType
+    // metrics carry no script size (pango/itemize.c, `PANGO_FONT_SCALE_SUBSCRIPT`/`SUPERSCRIPT`);
+    // spelled out so it does not depend on each UA's `font-size: smaller` ratio.
+    sub: { element: 'sub', style: { 'font-size': 'calc(1em / 1.2)' } },
+    sup: { element: 'sup', style: { 'font-size': 'calc(1em / 1.2)' } },
     markup: { element: 'span', style: { display: 'contents' } },
     span: { element: 'span' },
 };

package/src/widget-element.ts

@@ -16,10 +16,25 @@
 // Reference: GTK gtk/gtkwidget.c (gtk_widget_set_visible, gtk_widget_set_tooltip_text)
 // Copyright (c) GNOME contributors (GTK). LGPLv2.1+.
 
+import { isWidgetNode } from '@gjsify/adwaita-core';
+
 import { WIDGET_VISIBLE_GETTERS, installElementApi, markLazyElementApi, notifyElement } from './gobject-elements.js';
 import { dispatchedSignalsOf, type DispatchedSignals } from './signals.js';
 import { isMapped } from './widget-mapping.js';
 
+/** Element links, walked until one lands on a widget: `isWidgetNode` says which those are. */
+type ElementLink =
+    | 'firstElementChild'
+    | 'lastElementChild'
+    | 'nextElementSibling'
+    | 'previousElementSibling'
+    | 'parentElement';
+
+function widgetChild(from: Element, first: ElementLink, next: ElementLink): Element | null {
+    for (let at = from[first]; at !== null; at = at[next]) if (isWidgetNode(at)) return at;
+    return null;
+}
+
 export class WidgetElement extends HTMLElement {
     /** `Gtk.Widget::map` / `::unmap`, which every subclass inherits (`dispatchedSignalsOf`). */
     static readonly signals: DispatchedSignals = { map: 'map', unmap: 'unmap' };
@@ -41,25 +56,31 @@ export class WidgetElement extends HTMLElement {
     set_visible(visible: boolean): void {
         this.visible = visible;
     }
-    /** `gtk_widget_get_first_child`: the first child element, `null` for a leaf. */
+    /**
+     * `gtk_widget_get_first_child`: the first child WIDGET, `null` for a leaf.
+     *
+     * The five walkers skip the elements a port builds for its own insides — `isWidgetNode`
+     * in `@gjsify/adwaita-core` carries the rule and the incident behind it, and the
+     * registered-class copy in `widgetTreeMembers()` answers from the same function.
+     */
     get_first_child(): Element | null {
-        return this.firstElementChild;
+        return widgetChild(this, 'firstElementChild', 'nextElementSibling');
     }
     /** `gtk_widget_get_last_child`. */
     get_last_child(): Element | null {
-        return this.lastElementChild;
+        return widgetChild(this, 'lastElementChild', 'previousElementSibling');
     }
     /** `gtk_widget_get_next_sibling`. */
     get_next_sibling(): Element | null {
-        return this.nextElementSibling;
+        return widgetChild(this, 'nextElementSibling', 'nextElementSibling');
     }
     /** `gtk_widget_get_prev_sibling`. */
     get_prev_sibling(): Element | null {
-        return this.previousElementSibling;
+        return widgetChild(this, 'previousElementSibling', 'previousElementSibling');
     }
-    /** `gtk_widget_get_parent`. */
+    /** `gtk_widget_get_parent`: the nearest ancestor that is a widget, not a port's own wrapper. */
     get_parent(): Element | null {
-        return this.parentElement;
+        return widgetChild(this, 'parentElement', 'parentElement');
     }
     /** `gtk_widget_get_width`: the layout box in CSS px; 0 until the widget is rendered. */
     get_width(): number {

package/src/widget-members.spec.ts

@@ -60,10 +60,10 @@ export const WidgetMembersTest = async () => {
             expect(() => widget.set_direction(7)).toThrow();
         });
 
-        await it('walks the element tree with the GTK link names', () => {
+        await it('walks the widget tree with the GTK link names', () => {
             const parent = make('WidgetMembersParent');
-            const a = document.createElement('div');
-            const b = document.createElement('div');
+            const a = new Gtk.Label() as unknown as WidgetLike;
+            const b = new Gtk.Label() as unknown as WidgetLike;
             parent.append(a, b);
             expect(parent.get_first_child()).toBe(a);
             expect(parent.get_last_child()).toBe(b);
@@ -73,6 +73,45 @@ export const WidgetMembersTest = async () => {
             expect(parent.get_parent()).toBe(null);
         });
 
+        await it("steps over the plain elements a port builds for a widget's insides", () => {
+            // `gtk_widget_get_first_child` hands back a GtkWidget, always. In a DOM port the
+            // same `children` list also holds what the port made for itself — the `<span>` a
+            // label's markup renderer writes, the `<div>` a row lays its slots out in — and a
+            // caller walking the tree would get one of those and find no `get_first_child` on
+            // it at all. The custom-element hyphen separates the two kinds (`isWidgetNode`).
+            const parent = make('WidgetMembersInsides');
+            const a = new Gtk.Label() as unknown as WidgetLike;
+            const b = new Gtk.Label() as unknown as WidgetLike;
+            parent.append(
+                document.createElement('span'),
+                a,
+                document.createElement('div'),
+                b,
+                document.createElement('span'),
+            );
+            expect(parent.get_first_child()).toBe(a);
+            expect(parent.get_last_child()).toBe(b);
+            expect(a.get_next_sibling()).toBe(b);
+            expect(b.get_prev_sibling()).toBe(a);
+            expect(b.get_next_sibling()).toBe(null);
+        });
+
+        await it('a widget holding only its own markup is a LEAF', () => {
+            const label = make('WidgetMembersLeaf');
+            label.append(document.createElement('span'), document.createElement('span'));
+            expect(label.get_first_child()).toBe(null);
+            expect(label.get_last_child()).toBe(null);
+        });
+
+        await it('get_parent reports the nearest ancestor that is a widget', () => {
+            const box = new Gtk.Box() as unknown as WidgetLike;
+            const wrapper = document.createElement('div');
+            const label = new Gtk.Label() as unknown as WidgetLike;
+            box.append(wrapper);
+            wrapper.append(label);
+            expect(label.get_parent()).toBe(box);
+        });
+
         await it('walks the element tree of a built-in widget with the GTK link names', () => {
             const box = new Gtk.Box() as unknown as WidgetLike;
             const a = new Gtk.Label() as unknown as WidgetLike;