@base44-preview/vite-plugin 1.0.23-pr.92.8c371fd → 1.0.24-pr.93.2320a2c

package/dist/html-injections-plugin.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"html-injections-plugin.d.ts","sourceRoot":"","sources":["../src/html-injections-plugin.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAqB,MAAM,MAAM,CAAC;AAyEtD,wBAAgB,oBAAoB,CAAC,EACnC,WAAW,EACX,kBAAkB,EAClB,eAAe,EACf,gBAAgB,GACjB,EAAE;IACD,WAAW,EAAE,OAAO,CAAC;IACrB,kBAAkB,EAAE,OAAO,CAAC;IAC5B,eAAe,EAAE,OAAO,CAAC;IACzB,gBAAgB,EAAE,OAAO,CAAC;CAC3B,GAmFM,MAAM,CACZ"}
+{"version":3,"file":"html-injections-plugin.d.ts","sourceRoot":"","sources":["../src/html-injections-plugin.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,MAAM,EAAqB,MAAM,MAAM,CAAC;AA8EtD,wBAAgB,oBAAoB,CAAC,EACnC,WAAW,EACX,kBAAkB,EAClB,eAAe,EACf,gBAAgB,GACjB,EAAE;IACD,WAAW,EAAE,OAAO,CAAC;IACrB,kBAAkB,EAAE,OAAO,CAAC;IAC5B,eAAe,EAAE,OAAO,CAAC;IACzB,gBAAgB,EAAE,OAAO,CAAC;CAC3B,GAoFM,MAAM,CACZ"}

package/dist/html-injections-plugin.js

@@ -52,6 +52,11 @@ const INJECTIONS = {
         injectTo: "head",
         mode: "dev",
     },
+    keyboardViewport: {
+        src: "/node_modules/@base44/vite-plugin/dist/injections/keyboard-viewport-bridge.js",
+        injectTo: "head",
+        mode: "dev",
+    },
     analyticsTracker: {
         injectTo: "head",
         mode: "production",
@@ -64,6 +69,7 @@ export function htmlInjectionsPlugin({ hmrNotifier, navigationNotifier, visualEd
         sandboxMount: true,
         hmrNotifier,
         navigationNotifier,
+        keyboardViewport: true,
         analyticsTracker,
     };
     let resolvedEnv = {};

package/dist/html-injections-plugin.js.map

@@ -1 +1 @@
-{"version":3,"file":"html-injections-plugin.js","sourceRoot":"","sources":["../src/html-injections-plugin.ts"],"names":[],"mappings":"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"}
+{"version":3,"file":"html-injections-plugin.js","sourceRoot":"","sources":["../src/html-injections-plugin.ts"],"names":[],"mappings":"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"}

package/dist/injections/keyboard-viewport-bridge.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=keyboard-viewport-bridge.d.ts.map

package/dist/injections/keyboard-viewport-bridge.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"keyboard-viewport-bridge.d.ts","sourceRoot":"","sources":["../../src/injections/keyboard-viewport-bridge.ts"],"names":[],"mappings":""}

package/dist/injections/keyboard-viewport-bridge.js

@@ -0,0 +1,75 @@
+/// <reference types="vite/client" />
+// keyboard-viewport-bridge — applies the parent-measured, keyboard-adjusted
+// visible height inside the preview iframe.
+//
+// The on-screen keyboard shrinks the builder's (top-level) visual viewport but
+// NOT the preview iframe's, so the app rendered inside the iframe can't tell it
+// has less room and leaves a blank gap above the keyboard (bottom-anchored
+// inputs end up behind it). The published app doesn't hit this — it's the
+// top-level document, so the browser reflows it for the keyboard.
+//
+// The builder is the only side that sees the keyboard, so it measures the
+// visible height and posts { type: "keyboard-viewport", height }. Here we cap
+// the app's full-height roots to that height while the keyboard is open, so a
+// flex column reflows its content (and its bottom input) above the keyboard.
+//
+// Inert until the parent posts; only runs inside the preview iframe.
+if (window.self !== window.top) {
+    const MESSAGE_TYPE = "keyboard-viewport";
+    const HEIGHT_VAR = "--base44-keyboard-viewport-height";
+    const STYLE_ID = "base44-keyboard-viewport-style";
+    // Treat the keyboard as open only when the reported height is meaningfully
+    // below the layout height — filters out no-op / rounding resizes.
+    const KEYBOARD_OPEN_MIN_DELTA_PX = 100;
+    const ensureStyle = () => {
+        if (document.getElementById(STYLE_ID))
+            return;
+        const style = document.createElement("style");
+        style.id = STYLE_ID;
+        // Active only while HEIGHT_VAR is set on <html> (keyboard open). Cap the
+        // document, the mount node, and the app's full-height wrappers to the
+        // visible height. `code_generator` guarantees the app root uses
+        // `min-h-screen`/`h-screen`, so constraining those (plus 100vh/100dvh
+        // inline styles) makes the layout fit above the keyboard.
+        style.textContent = [
+            `html[style*="${HEIGHT_VAR}"], html[style*="${HEIGHT_VAR}"] body {`,
+            `  height: var(${HEIGHT_VAR}) !important;`,
+            `  min-height: var(${HEIGHT_VAR}) !important;`,
+            `}`,
+            `html[style*="${HEIGHT_VAR}"] #root {`,
+            `  height: var(${HEIGHT_VAR}) !important;`,
+            `  min-height: var(${HEIGHT_VAR}) !important;`,
+            `  overflow: hidden;`,
+            `}`,
+            `html[style*="${HEIGHT_VAR}"] :is(.h-screen, .min-h-screen),`,
+            `html[style*="${HEIGHT_VAR}"] [style*="100vh"],`,
+            `html[style*="${HEIGHT_VAR}"] [style*="100dvh"] {`,
+            `  height: var(${HEIGHT_VAR}) !important;`,
+            `  min-height: var(${HEIGHT_VAR}) !important;`,
+            `}`,
+        ].join("\n");
+        document.head.appendChild(style);
+    };
+    const apply = (height) => {
+        const root = document.documentElement;
+        const keyboardOpen = Number.isFinite(height) &&
+            height > 0 &&
+            window.innerHeight - height > KEYBOARD_OPEN_MIN_DELTA_PX;
+        if (!keyboardOpen) {
+            // Keyboard closed (or negligible delta) — release the cap so the app
+            // returns to its natural full-height layout.
+            root.style.removeProperty(HEIGHT_VAR);
+            return;
+        }
+        ensureStyle();
+        root.style.setProperty(HEIGHT_VAR, `${Math.round(height)}px`);
+    };
+    window.addEventListener("message", (event) => {
+        const data = event.data;
+        if (!data || data.type !== MESSAGE_TYPE || typeof data.height !== "number")
+            return;
+        apply(data.height);
+    });
+}
+export {};
+//# sourceMappingURL=keyboard-viewport-bridge.js.map

package/dist/injections/keyboard-viewport-bridge.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"keyboard-viewport-bridge.js","sourceRoot":"","sources":["../../src/injections/keyboard-viewport-bridge.ts"],"names":[],"mappings":"AAAA,qCAAqC;AACrC,4EAA4E;AAC5E,4CAA4C;AAC5C,EAAE;AACF,+EAA+E;AAC/E,gFAAgF;AAChF,2EAA2E;AAC3E,0EAA0E;AAC1E,kEAAkE;AAClE,EAAE;AACF,0EAA0E;AAC1E,8EAA8E;AAC9E,8EAA8E;AAC9E,6EAA6E;AAC7E,EAAE;AACF,qEAAqE;AAErE,IAAI,MAAM,CAAC,IAAI,KAAK,MAAM,CAAC,GAAG,EAAE,CAAC;IAC/B,MAAM,YAAY,GAAG,mBAAmB,CAAC;IACzC,MAAM,UAAU,GAAG,mCAAmC,CAAC;IACvD,MAAM,QAAQ,GAAG,gCAAgC,CAAC;IAClD,2EAA2E;IAC3E,kEAAkE;IAClE,MAAM,0BAA0B,GAAG,GAAG,CAAC;IAEvC,MAAM,WAAW,GAAG,GAAS,EAAE;QAC7B,IAAI,QAAQ,CAAC,cAAc,CAAC,QAAQ,CAAC;YAAE,OAAO;QAC9C,MAAM,KAAK,GAAG,QAAQ,CAAC,aAAa,CAAC,OAAO,CAAC,CAAC;QAC9C,KAAK,CAAC,EAAE,GAAG,QAAQ,CAAC;QACpB,yEAAyE;QACzE,sEAAsE;QACtE,gEAAgE;QAChE,sEAAsE;QACtE,0DAA0D;QAC1D,KAAK,CAAC,WAAW,GAAG;YAClB,gBAAgB,UAAU,oBAAoB,UAAU,WAAW;YACnE,iBAAiB,UAAU,eAAe;YAC1C,qBAAqB,UAAU,eAAe;YAC9C,GAAG;YACH,gBAAgB,UAAU,YAAY;YACtC,iBAAiB,UAAU,eAAe;YAC1C,qBAAqB,UAAU,eAAe;YAC9C,qBAAqB;YACrB,GAAG;YACH,gBAAgB,UAAU,mCAAmC;YAC7D,gBAAgB,UAAU,sBAAsB;YAChD,gBAAgB,UAAU,wBAAwB;YAClD,iBAAiB,UAAU,eAAe;YAC1C,qBAAqB,UAAU,eAAe;YAC9C,GAAG;SACJ,CAAC,IAAI,CAAC,IAAI,CAAC,CAAC;QACb,QAAQ,CAAC,IAAI,CAAC,WAAW,CAAC,KAAK,CAAC,CAAC;IACnC,CAAC,CAAC;IAEF,MAAM,KAAK,GAAG,CAAC,MAAc,EAAQ,EAAE;QACrC,MAAM,IAAI,GAAG,QAAQ,CAAC,eAAe,CAAC;QACtC,MAAM,YAAY,GAChB,MAAM,CAAC,QAAQ,CAAC,MAAM,CAAC;YACvB,MAAM,GAAG,CAAC;YACV,MAAM,CAAC,WAAW,GAAG,MAAM,GAAG,0BAA0B,CAAC;QAC3D,IAAI,CAAC,YAAY,EAAE,CAAC;YAClB,qEAAqE;YACrE,6CAA6C;YAC7C,IAAI,CAAC,KAAK,CAAC,cAAc,CAAC,UAAU,CAAC,CAAC;YACtC,OAAO;QACT,CAAC;QACD,WAAW,EAAE,CAAC;QACd,IAAI,CAAC,KAAK,CAAC,WAAW,CAAC,UAAU,EAAE,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,IAAI,CAAC,CAAC;IAChE,CAAC,CAAC;IAEF,MAAM,CAAC,gBAAgB,CAAC,SAAS,EAAE,CAAC,KAAmB,EAAE,EAAE;QACzD,MAAM,IAAI,GAAG,KAAK,CAAC,IAAiD,CAAC;QACrE,IAAI,CAAC,IAAI,IAAI,IAAI,CAAC,IAAI,KAAK,YAAY,IAAI,OAAO,IAAI,CAAC,MAAM,KAAK,QAAQ;YAAE,OAAO;QACnF,KAAK,CAAC,IAAI,CAAC,MAAM,CAAC,CAAC;IACrB,CAAC,CAAC,CAAC;AACL,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@base44-preview/vite-plugin",
-  "version": "1.0.23-pr.92.8c371fd",
+  "version": "1.0.24-pr.93.2320a2c",
   "description": "The Vite plugin for base44 based applications",
   "type": "module",
   "license": "MIT",

package/src/html-injections-plugin.ts

@@ -64,6 +64,11 @@ const INJECTIONS: Record<string, Injection> = {
     injectTo: "head",
     mode: "dev",
   },
+  keyboardViewport: {
+    src: "/node_modules/@base44/vite-plugin/dist/injections/keyboard-viewport-bridge.js",
+    injectTo: "head",
+    mode: "dev",
+  },
   analyticsTracker: {
     injectTo: "head",
     mode: "production",
@@ -87,6 +92,7 @@ export function htmlInjectionsPlugin({
     sandboxMount: true,
     hmrNotifier,
     navigationNotifier,
+    keyboardViewport: true,
     analyticsTracker,
   };
 

package/src/injections/keyboard-viewport-bridge.ts

@@ -0,0 +1,76 @@
+/// <reference types="vite/client" />
+// keyboard-viewport-bridge — applies the parent-measured, keyboard-adjusted
+// visible height inside the preview iframe.
+//
+// The on-screen keyboard shrinks the builder's (top-level) visual viewport but
+// NOT the preview iframe's, so the app rendered inside the iframe can't tell it
+// has less room and leaves a blank gap above the keyboard (bottom-anchored
+// inputs end up behind it). The published app doesn't hit this — it's the
+// top-level document, so the browser reflows it for the keyboard.
+//
+// The builder is the only side that sees the keyboard, so it measures the
+// visible height and posts { type: "keyboard-viewport", height }. Here we cap
+// the app's full-height roots to that height while the keyboard is open, so a
+// flex column reflows its content (and its bottom input) above the keyboard.
+//
+// Inert until the parent posts; only runs inside the preview iframe.
+
+if (window.self !== window.top) {
+  const MESSAGE_TYPE = "keyboard-viewport";
+  const HEIGHT_VAR = "--base44-keyboard-viewport-height";
+  const STYLE_ID = "base44-keyboard-viewport-style";
+  // Treat the keyboard as open only when the reported height is meaningfully
+  // below the layout height — filters out no-op / rounding resizes.
+  const KEYBOARD_OPEN_MIN_DELTA_PX = 100;
+
+  const ensureStyle = (): void => {
+    if (document.getElementById(STYLE_ID)) return;
+    const style = document.createElement("style");
+    style.id = STYLE_ID;
+    // Active only while HEIGHT_VAR is set on <html> (keyboard open). Cap the
+    // document, the mount node, and the app's full-height wrappers to the
+    // visible height. `code_generator` guarantees the app root uses
+    // `min-h-screen`/`h-screen`, so constraining those (plus 100vh/100dvh
+    // inline styles) makes the layout fit above the keyboard.
+    style.textContent = [
+      `html[style*="${HEIGHT_VAR}"], html[style*="${HEIGHT_VAR}"] body {`,
+      `  height: var(${HEIGHT_VAR}) !important;`,
+      `  min-height: var(${HEIGHT_VAR}) !important;`,
+      `}`,
+      `html[style*="${HEIGHT_VAR}"] #root {`,
+      `  height: var(${HEIGHT_VAR}) !important;`,
+      `  min-height: var(${HEIGHT_VAR}) !important;`,
+      `  overflow: hidden;`,
+      `}`,
+      `html[style*="${HEIGHT_VAR}"] :is(.h-screen, .min-h-screen),`,
+      `html[style*="${HEIGHT_VAR}"] [style*="100vh"],`,
+      `html[style*="${HEIGHT_VAR}"] [style*="100dvh"] {`,
+      `  height: var(${HEIGHT_VAR}) !important;`,
+      `  min-height: var(${HEIGHT_VAR}) !important;`,
+      `}`,
+    ].join("\n");
+    document.head.appendChild(style);
+  };
+
+  const apply = (height: number): void => {
+    const root = document.documentElement;
+    const keyboardOpen =
+      Number.isFinite(height) &&
+      height > 0 &&
+      window.innerHeight - height > KEYBOARD_OPEN_MIN_DELTA_PX;
+    if (!keyboardOpen) {
+      // Keyboard closed (or negligible delta) — release the cap so the app
+      // returns to its natural full-height layout.
+      root.style.removeProperty(HEIGHT_VAR);
+      return;
+    }
+    ensureStyle();
+    root.style.setProperty(HEIGHT_VAR, `${Math.round(height)}px`);
+  };
+
+  window.addEventListener("message", (event: MessageEvent) => {
+    const data = event.data as { type?: string; height?: number } | null;
+    if (!data || data.type !== MESSAGE_TYPE || typeof data.height !== "number") return;
+    apply(data.height);
+  });
+}