@jsenv/navi 0.21.1 → 0.21.3

package/dist/jsenv_navi.js

@@ -6325,12 +6325,14 @@ const DIMENSION_PROPS = {
     }
     const inVerticalFlexFlow =
       parentBoxFlow === "flex-y" || parentBoxFlow === "inline-flex-y";
+    const inHorizontalFlexFlow =
+      parentBoxFlow === "flex-x" || parentBoxFlow === "inline-flex-x";
     const selfVerticalFlexFlow =
       boxFlow === "flex-y" || boxFlow === "inline-flex-y";
     if (selfVerticalFlexFlow || inVerticalFlexFlow) {
       if (!inVerticalFlexFlow) {
-        if (parentBoxFlow === "flex-x" || parentBoxFlow === "inline-flex-x") {
-          return { minHeight: "100%", height: "auto" };
+        if (inHorizontalFlexFlow) {
+          return { alignSelf: "stretch" };
         }
         return {
           flexGrow: 1,
@@ -6341,8 +6343,8 @@ const DIMENSION_PROPS = {
       }
       return { flexGrow: 1, flexBasis: "0%" }; // Grow vertically in row
     }
-    if (parentBoxFlow === "flex-x") {
-      return { minHeight: "100%", height: "auto" }; // Take full height in column
+    if (inHorizontalFlexFlow) {
+      return { alignSelf: "stretch" }; // Stretch to cross-axis height in flex-x
     }
     return { minHeight: "100%", height: "auto" }; // Take full height outside flex
   },
@@ -21164,7 +21166,12 @@ installImportMetaCssBuild(import.meta);import.meta.css = [/* css */`
       --button-outline-width: 1px;
       --button-border-width: 1px;
       --button-border-radius: 2px;
+      /* Global padding defaults — override these to change all button paddings. */
+      /* Use --button-padding, --button-padding-x, --button-padding-y for per-button overrides. */
+      --button-padding-x-default: 6px;
+      --button-padding-y-default: 1px;
       /* default */
+
       --button-outline-color: var(--navi-focus-outline-color);
       --button-loader-color: var(--navi-loader-color);
       --button-border-color: light-dark(#767676, #8e8e93);
@@ -21219,22 +21226,6 @@ installImportMetaCssBuild(import.meta);import.meta.css = [/* css */`
     --x-button-outer-width: calc(
       var(--x-button-border-width) + var(--x-button-outline-width)
     );
-    --x-button-padding-top: var(
-      --button-padding-top,
-      var(--button-padding-y, var(--button-padding, 1px))
-    );
-    --x-button-padding-right: var(
-      --button-padding-right,
-      var(--button-padding-x, var(--button-padding, 6px))
-    );
-    --x-button-padding-bottom: var(
-      --button-padding-bottom,
-      var(--button-padding-y, var(--button-padding, 1px))
-    );
-    --x-button-padding-left: var(
-      --button-padding-left,
-      var(--button-padding-x, var(--button-padding, 6px))
-    );
     --x-button-outline-color: var(--button-outline-color);
     --x-button-border-color: var(--button-border-color);
     --x-button-background: var(--button-background);
@@ -21264,10 +21255,34 @@ installImportMetaCssBuild(import.meta);import.meta.css = [/* css */`
       aspect-ratio: inherit;
       width: 100%;
       height: 100%;
-      padding-top: var(--x-button-padding-top);
-      padding-right: var(--x-button-padding-right);
-      padding-bottom: var(--x-button-padding-bottom);
-      padding-left: var(--x-button-padding-left);
+      padding-top: var(
+        --button-padding-top,
+        var(
+          --button-padding-y,
+          var(--button-padding, var(--button-padding-y-default))
+        )
+      );
+      padding-right: var(
+        --button-padding-right,
+        var(
+          --button-padding-x,
+          var(--button-padding, var(--button-padding-x-default))
+        )
+      );
+      padding-bottom: var(
+        --button-padding-bottom,
+        var(
+          --button-padding-y,
+          var(--button-padding, var(--button-padding-y-default))
+        )
+      );
+      padding-left: var(
+        --button-padding-left,
+        var(
+          --button-padding-x,
+          var(--button-padding, var(--button-padding-x-default))
+        )
+      );
       align-items: inherit;
       justify-content: inherit;
       color: var(--x-button-color);