@gjsify/adwaita-nativescript 0.13.2 → 0.14.0

package/lib/esm/widgets/adw-clamp.js

@@ -1 +1 @@
-import"../_virtual/_rolldown/runtime.js";import{GridLayout as e,ItemSpec as t}from"@nativescript/core";const n=600;var AdwClamp=class extends e{_maximumSize=600;_child=null;constructor(){super(),this.className=`adw-clamp`,this.addColumn(new t(1,`star`)),this.addRow(new t(1,`star`))}setChild(t){this._child&&=(this.removeChild(this._child),null),t&&(t.horizontalAlignment=`center`,t.width=this._maximumSize,e.setColumn(t,0),e.setRow(t,0),this.addChild(t),this._child=t)}get child(){return this._child}get maximumSize(){return this._maximumSize}set maximumSize(e){this._maximumSize=Number.isFinite(e)&&e>0?e:600,this._child&&(this._child.width=this._maximumSize)}};export{AdwClamp,n as DEFAULT_CLAMP_MAX_SIZE};
+import"../_virtual/_rolldown/runtime.js";import{GridLayout as e,ItemSpec as t}from"@nativescript/core";const n=600;var AdwClamp=class extends e{_maximumSize=600;_child=null;constructor(){super(),this.className=`adw-clamp`,this.addColumn(new t(1,`star`)),this.addRow(new t(1,`auto`))}setChild(t){this._child&&=(this.removeChild(this._child),null),t&&(t.horizontalAlignment=`center`,t.width=this._maximumSize,e.setColumn(t,0),e.setRow(t,0),this.addChild(t),this._child=t)}get child(){return this._child}get maximumSize(){return this._maximumSize}set maximumSize(e){this._maximumSize=Number.isFinite(e)&&e>0?e:600,this._child&&(this._child.width=this._maximumSize)}};export{AdwClamp,n as DEFAULT_CLAMP_MAX_SIZE};

package/package.json

@@ -1,6 +1,6 @@
 {
     "name": "@gjsify/adwaita-nativescript",
-    "version": "0.13.2",
+    "version": "0.14.0",
     "description": "Native Adwaita widgets for the NativeScript runtime — real NativeScript components (StackLayout/GridLayout/Switch/Label) styled like Libadwaita, not a webview",
     "type": "module",
     "module": "lib/esm/index.js",
@@ -47,9 +47,9 @@
         "design-system"
     ],
     "dependencies": {
-        "@gjsify/adwaita-fonts": "^0.13.2",
-        "@gjsify/adwaita-icons": "^0.13.2",
-        "@gjsify/native-platform": "^0.13.2"
+        "@gjsify/adwaita-fonts": "^0.14.0",
+        "@gjsify/adwaita-icons": "^0.14.0",
+        "@gjsify/native-platform": "^0.14.0"
     },
     "peerDependencies": {
         "@nativescript/core": "*"
@@ -60,8 +60,8 @@
         }
     },
     "devDependencies": {
-        "@gjsify/cli": "^0.13.2",
-        "@gjsify/unit": "^0.13.2",
+        "@gjsify/cli": "^0.14.0",
+        "@gjsify/unit": "^0.14.0",
         "@types/node": "^25.9.2",
         "typescript": "^6.0.3"
     },

package/src/theme/adwaita.css

@@ -57,8 +57,12 @@ Page.adw-window {
      * transparent row lets the card's rounded fill show through (Adwaita rows are
      * transparent at rest anyway; they tint only on hover/press). */
     background-color: transparent;
-    /* Tight Adwaita ~56px rhythm; rows in a boxed list are flush (margin 0). */
-    padding: 10 16 10 16;
+    /* Native Adwaita list-row minimum (libadwaita _lists.scss: 50px) so rows are
+     * not cramped vs the desktop; content is vertically centred via the
+     * .adw-row-text / -prefix / -suffix `vertical-align`. Boxed-list rows are
+     * flush (margin 0). */
+    min-height: 50;
+    padding: 12 16 12 16;
     margin: 0;
 }
 
@@ -86,6 +90,7 @@ Page.adw-window {
 
 .adw-row-text {
     margin: 0;
+    vertical-align: center;
 }
 
 /* Leading symbolic icon (column 0) — Adwaita sets a 12px gap to the title and
@@ -383,6 +388,7 @@ Page.adw-window {
 
 .adw-window-title {
     margin: 0;
+    vertical-align: center;
 }
 
 .adw-window-title-title {
@@ -411,6 +417,8 @@ Page.adw-window {
     /* Non-flat header carries a 1px bottom separator (NS subset has no shadow). */
     border-bottom-width: 1;
     border-bottom-color: rgba(0, 0, 0, 0.1);
+    /* Native Adwaita header-bar minimum (libadwaita _header-bar.scss: 47px). */
+    min-height: 47;
     padding: 6 8 6 8;
 }
 
@@ -422,6 +430,7 @@ Page.adw-window {
 .adw-header-bar-start,
 .adw-header-bar-end {
     margin: 0;
+    vertical-align: center;
 }
 
 /* ===== Toolbar view ===== */
@@ -431,13 +440,21 @@ Page.adw-window {
 }
 
 .adw-toolbar-view-top {
-    background-color: transparent;
+    /* Match the header-bar background so the TOP safe-area inset (status bar) is
+     * painted in the header colour — the chrome reaches the screen edge but the
+     * header content does not slide under the clock. Host app feeds the inset
+     * into --safeAreaInsetTop (falls back to 0 when unset). */
+    background-color: #ffffff;
+    padding-top: var(--safeAreaInsetTop, 0);
 }
 
 .adw-toolbar-view-bottom {
     background-color: #ffffff;
     border-top-width: 1;
     border-top-color: rgba(0, 0, 0, 0.1);
+    /* BOTTOM safe-area inset (nav bar / gesture pill) painted in the bottom-bar
+     * colour. Host app feeds --safeAreaInsetBottom (falls back to 0). */
+    padding-bottom: var(--safeAreaInsetBottom, 0);
 }
 
 /* ===== View stack (page container) ===== */
@@ -505,6 +522,9 @@ Page.adw-window {
 
 .adw-status-page {
     background-color: #fafafb;
+    /* Fill the parent so the centered content stack sits in the vertical middle
+     * (Adw.StatusPage is a full-page empty state), not hugging the top. */
+    height: 100%;
 }
 
 .adw-status-page-content {
@@ -1230,6 +1250,10 @@ Page.ns-dark.adw-window {
     background-color: #222226;
 }
 
+.ns-dark .adw-toolbar-view-top {
+    background-color: #2e2e32;
+}
+
 .ns-dark .adw-toolbar-view-bottom {
     background-color: #2e2e32;
     border-top-color: rgba(255, 255, 255, 0.12);