@gjsify/example-gtk-adwaita-storybook 0.31.0 → 0.33.0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gjsify/example-gtk-adwaita-storybook",
-  "version": "0.31.0",
+  "version": "0.33.0",
   "description": "Interactive component browser for Libadwaita widgets — a native Adwaita storybook built on @gjsify/storybook, debuggable over DBus/MCP via @gjsify/devtools",
   "type": "module",
   "main": "dist/gjs.js",
@@ -47,11 +47,11 @@
     "@girs/glib-2.0": "^4.1.0",
     "@girs/gobject-2.0": "^4.1.0",
     "@girs/gtk-4.0": "^4.1.0",
-    "@gjsify/adwaita-web": "^0.31.0",
-    "@gjsify/cli": "^0.31.0",
+    "@gjsify/adwaita-web": "^0.33.0",
+    "@gjsify/cli": "^0.33.0",
     "@gjsify/node-gi": "file:../../../packages/node-gi/node-gi",
-    "@gjsify/storybook": "^0.31.0",
-    "@gjsify/adwaita-storybook": "^0.31.0",
+    "@gjsify/storybook": "^0.33.0",
+    "@gjsify/adwaita-storybook": "^0.33.0",
     "@types/node": "^25.9.2",
     "typescript": "^6.0.3"
   },

package/src/browser/buttons/split-button.web.ts

@@ -1,6 +1,8 @@
 // Browser port of the Split Button stories — adw-split-button, a primary action
 // paired with a dropdown menu. Shares its metadata/controls with the GTK twins
-// (split-button.story.ts) so the two render identically.
+// (split-button.story.ts). Their shared BEHAVIOUR is held by the
+// @gjsify/adwaita-core/conformance split-button vectors; that they render
+// identically is not measured anywhere (#1052).
 
 import { StoryElement, type StoryArgs, type StoryMeta, type WebStoryModule } from '@gjsify/adwaita-storybook';
 import { splitButtonFlatMeta, splitButtonMeta } from '../../buttons/split-button.meta.js';

package/src/browser/feedback/about-dialog.web.ts

@@ -49,9 +49,11 @@ export class AboutDialogWebStory extends StoryElement {
         if (!this._dialog) return;
         const dialog = this._dialog;
         dialog.setAttribute('application-name', (this.args.applicationName as string) ?? 'Adwaita Storybook');
-        // The native story uses `application-x-executable-symbolic`; that glyph
-        // does not ship in the web icon set, so leave it unset to fall back to
-        // the component's generic application icon (emblem-system).
+        // The native story uses `application-x-executable-symbolic`; the web icon
+        // set ships the same glyph under the unsuffixed name. It has to be named
+        // here: GTK draws NO icon for an application that set none
+        // (adw-about-dialog.c:2313-2314), so the element no longer invents one.
+        dialog.setAttribute('application-icon', 'application-x-executable');
         dialog.setAttribute('developer-name', 'A GJSify Project');
         dialog.setAttribute('version', (this.args.version as string) ?? '0.11.0');
         dialog.setAttribute('comments', 'A live catalogue of native GTK and Adwaita widgets, rendered under GJS.');

package/src/browser/layout/clamp.web.ts

@@ -38,6 +38,10 @@ export class ClampWebStory extends StoryElement {
     private _syncClamp(): void {
         if (!this._clamp) return;
         this._clamp.setAttribute('maximum-size', String(this.args.maximumSize as number));
+        // The story has exposed this control since it was written, but until the
+        // clamp curve moved into @gjsify/adwaita-core only the GTK pane responded
+        // to it — the storybook was comparing three panes of which two were deaf.
+        this._clamp.setAttribute('tightening-threshold', String(this.args.tighteningThreshold as number));
     }
 }
 

package/src/browser/main.ts

@@ -1,8 +1,10 @@
 // Browser entry — mounts the Adwaita storybook as a web app built from
 // @gjsify/adwaita-web custom elements, mirroring the native GTK storybook
 // (launched via `gjsify storybook`). Each *.web.ts story shares its metadata
-// with the GTK *.story.ts twin, so the two targets expose identical controls
-// and can be compared 1:1 via screenshots.
+// with the GTK *.story.ts twin, so the two targets expose identical controls.
+// They are NOT compared by screenshot — no such harness exists (#1052); the
+// parity that is held is behavioural, via the @gjsify/adwaita-core/conformance
+// vectors both renderer suites assert against.
 //
 // The story list lives in `./stories.ts` so the standalone entry here and the
 // embeddable `mount(container)` (`./embed.ts`, used by the gjsify website) stay

package/src/browser/view-switching/carousel.web.ts

@@ -38,6 +38,18 @@ function buildPage(title: string, accent: string): HTMLElement {
     return card;
 }
 
+/**
+ * Push the two boolean controls onto the element.
+ *
+ * `allow-scroll-wheel` defaults to TRUE (adw-carousel.c:1103-1106), so it cannot
+ * be a bare presence attribute — REMOVING it would turn the wheel back ON. The
+ * element reads the explicit string, which is what a `false` control must write.
+ */
+function syncCarouselArgs(carousel: HTMLElement, args: StoryArgs): void {
+    carousel.setAttribute('allow-scroll-wheel', args.allowScrollWheel ? 'true' : 'false');
+    carousel.setAttribute('allow-long-swipes', args.allowLongSwipes ? 'true' : 'false');
+}
+
 /** Shared body for both indicator variants — only the indicator tag differs. */
 abstract class CarouselWebStoryBase extends StoryElement {
     private _carousel: HTMLElement | null = null;
@@ -49,8 +61,7 @@ abstract class CarouselWebStoryBase extends StoryElement {
         const carousel = document.createElement('adw-carousel');
         carousel.id = `adw-carousel-${nextCarouselId++}`;
         carousel.style.cssText = 'width:480px;height:280px;';
-        carousel.toggleAttribute('allow-scroll-wheel', this.args.allowScrollWheel as boolean);
-        carousel.toggleAttribute('allow-long-swipes', this.args.allowLongSwipes as boolean);
+        syncCarouselArgs(carousel, this.args);
         for (const page of PAGES) {
             carousel.appendChild(buildPage(page.title, page.accent));
         }
@@ -68,8 +79,7 @@ abstract class CarouselWebStoryBase extends StoryElement {
 
     updateArgs(_args: StoryArgs): void {
         if (!this._carousel) return;
-        this._carousel.toggleAttribute('allow-scroll-wheel', this.args.allowScrollWheel as boolean);
-        this._carousel.toggleAttribute('allow-long-swipes', this.args.allowLongSwipes as boolean);
+        syncCarouselArgs(this._carousel, this.args);
     }
 }