@wowlabtech/mini-app-adapter 0.2.1 → 0.2.2

package/dist/index.d.cts

@@ -56,6 +56,10 @@ interface MiniAppViewportInsets {
     safeArea: MiniAppSafeAreaInsets;
     contentSafeArea: MiniAppSafeAreaInsets;
 }
+interface MiniAppViewportState {
+    height: number;
+    stableHeight: number;
+}
 interface MiniAppInitOptions {
     /**
      * Enables verbose logs for platforms that support it.
@@ -170,6 +174,10 @@ interface MiniAppAdapter {
      * Requests fullscreen mode if supported by the platform.
      */
     requestFullscreen?(): void;
+    /**
+     * Subscribes to viewport size changes. Returns disposer.
+     */
+    onViewportChange?(callback: (state: MiniAppViewportState) => void): () => void;
     /**
      * Returns viewport safe area insets if supported by the platform.
      */
@@ -307,6 +315,10 @@ declare abstract class BaseMiniAppAdapter implements MiniAppAdapter {
     getLaunchParams(): unknown;
     decodeStartParam(_param: string): unknown;
     requestFullscreen(): void;
+    onViewportChange(callback: (state: {
+        height: number;
+        stableHeight: number;
+    }) => void): () => void;
     getViewportInsets(): MiniAppViewportInsets | undefined;
     shareMessage(_message: string): Promise<void>;
     shareUrl(_url: string, _text: string): void;
@@ -402,6 +414,10 @@ declare class TelegramMiniAppAdapter extends BaseMiniAppAdapter {
     decodeStartParam(param: string): unknown;
     requestFullscreen(): void;
     getViewportInsets(): MiniAppViewportInsets | undefined;
+    onViewportChange(callback: (state: {
+        height: number;
+        stableHeight: number;
+    }) => void): () => void;
     onAppearanceChange(callback: (appearance: 'dark' | 'light' | undefined) => void): () => void;
     setBackButtonVisibility(visible: boolean): void;
     enableVerticalSwipes(): void;
@@ -420,6 +436,8 @@ declare class TelegramMiniAppAdapter extends BaseMiniAppAdapter {
     private prepareViewport;
     private requestFullscreenInternal;
     private getViewportMountOptions;
+    private safeHeightFromSdk;
+    private stableHeightFromSdk;
     private notifyViewHide;
     private notifyViewRestore;
     protected onDestroy(): void;
@@ -536,4 +554,4 @@ declare function trackPixelEvent(event: string, payload?: Record<string, unknown
 
 declare function getPlatform(): MiniAppPlatform;
 
-export { AdapterProvider, BaseMiniAppAdapter, type CreateAdapterOptions, MaxMiniAppAdapter, type MiniAppAdapter, type MiniAppCapability, type MiniAppEnvironmentInfo, type MiniAppInitOptions, type MiniAppPlatform, type MiniAppPopupOptions, type MiniAppQrScanOptions, ShellMiniAppAdapter, TelegramMiniAppAdapter, VKMiniAppAdapter, WebMiniAppAdapter, configureVkPixel, createAdapter, createShellAPI, detectPlatform, getActiveAdapter, getPlatform, isShell, isShellAndroid, isShellIOS, readShellPlatform, requestShellPushPermission, shell, storeShellToken, trackConversionEvent, trackPixelEvent, useAdapterTheme, useMiniAppAdapter, useSafeArea };
+export { AdapterProvider, BaseMiniAppAdapter, type CreateAdapterOptions, MaxMiniAppAdapter, type MiniAppAdapter, type MiniAppCapability, type MiniAppEnvironmentInfo, type MiniAppInitOptions, type MiniAppPlatform, type MiniAppPopupOptions, type MiniAppQrScanOptions, type MiniAppViewportState, ShellMiniAppAdapter, TelegramMiniAppAdapter, VKMiniAppAdapter, WebMiniAppAdapter, configureVkPixel, createAdapter, createShellAPI, detectPlatform, getActiveAdapter, getPlatform, isShell, isShellAndroid, isShellIOS, readShellPlatform, requestShellPushPermission, shell, storeShellToken, trackConversionEvent, trackPixelEvent, useAdapterTheme, useMiniAppAdapter, useSafeArea };

package/dist/index.d.ts

@@ -56,6 +56,10 @@ interface MiniAppViewportInsets {
     safeArea: MiniAppSafeAreaInsets;
     contentSafeArea: MiniAppSafeAreaInsets;
 }
+interface MiniAppViewportState {
+    height: number;
+    stableHeight: number;
+}
 interface MiniAppInitOptions {
     /**
      * Enables verbose logs for platforms that support it.
@@ -170,6 +174,10 @@ interface MiniAppAdapter {
      * Requests fullscreen mode if supported by the platform.
      */
     requestFullscreen?(): void;
+    /**
+     * Subscribes to viewport size changes. Returns disposer.
+     */
+    onViewportChange?(callback: (state: MiniAppViewportState) => void): () => void;
     /**
      * Returns viewport safe area insets if supported by the platform.
      */
@@ -307,6 +315,10 @@ declare abstract class BaseMiniAppAdapter implements MiniAppAdapter {
     getLaunchParams(): unknown;
     decodeStartParam(_param: string): unknown;
     requestFullscreen(): void;
+    onViewportChange(callback: (state: {
+        height: number;
+        stableHeight: number;
+    }) => void): () => void;
     getViewportInsets(): MiniAppViewportInsets | undefined;
     shareMessage(_message: string): Promise<void>;
     shareUrl(_url: string, _text: string): void;
@@ -402,6 +414,10 @@ declare class TelegramMiniAppAdapter extends BaseMiniAppAdapter {
     decodeStartParam(param: string): unknown;
     requestFullscreen(): void;
     getViewportInsets(): MiniAppViewportInsets | undefined;
+    onViewportChange(callback: (state: {
+        height: number;
+        stableHeight: number;
+    }) => void): () => void;
     onAppearanceChange(callback: (appearance: 'dark' | 'light' | undefined) => void): () => void;
     setBackButtonVisibility(visible: boolean): void;
     enableVerticalSwipes(): void;
@@ -420,6 +436,8 @@ declare class TelegramMiniAppAdapter extends BaseMiniAppAdapter {
     private prepareViewport;
     private requestFullscreenInternal;
     private getViewportMountOptions;
+    private safeHeightFromSdk;
+    private stableHeightFromSdk;
     private notifyViewHide;
     private notifyViewRestore;
     protected onDestroy(): void;
@@ -536,4 +554,4 @@ declare function trackPixelEvent(event: string, payload?: Record<string, unknown
 
 declare function getPlatform(): MiniAppPlatform;
 
-export { AdapterProvider, BaseMiniAppAdapter, type CreateAdapterOptions, MaxMiniAppAdapter, type MiniAppAdapter, type MiniAppCapability, type MiniAppEnvironmentInfo, type MiniAppInitOptions, type MiniAppPlatform, type MiniAppPopupOptions, type MiniAppQrScanOptions, ShellMiniAppAdapter, TelegramMiniAppAdapter, VKMiniAppAdapter, WebMiniAppAdapter, configureVkPixel, createAdapter, createShellAPI, detectPlatform, getActiveAdapter, getPlatform, isShell, isShellAndroid, isShellIOS, readShellPlatform, requestShellPushPermission, shell, storeShellToken, trackConversionEvent, trackPixelEvent, useAdapterTheme, useMiniAppAdapter, useSafeArea };
+export { AdapterProvider, BaseMiniAppAdapter, type CreateAdapterOptions, MaxMiniAppAdapter, type MiniAppAdapter, type MiniAppCapability, type MiniAppEnvironmentInfo, type MiniAppInitOptions, type MiniAppPlatform, type MiniAppPopupOptions, type MiniAppQrScanOptions, type MiniAppViewportState, ShellMiniAppAdapter, TelegramMiniAppAdapter, VKMiniAppAdapter, WebMiniAppAdapter, configureVkPixel, createAdapter, createShellAPI, detectPlatform, getActiveAdapter, getPlatform, isShell, isShellAndroid, isShellIOS, readShellPlatform, requestShellPushPermission, shell, storeShellToken, trackConversionEvent, trackPixelEvent, useAdapterTheme, useMiniAppAdapter, useSafeArea };

package/dist/index.js

@@ -607,6 +607,27 @@ var BaseMiniAppAdapter = class {
   }
   requestFullscreen() {
   }
+  onViewportChange(callback) {
+    if (typeof window === "undefined") {
+      return () => {
+      };
+    }
+    const fallbackHeight = () => window.visualViewport?.height ?? window.innerHeight;
+    const notify = () => {
+      const height = fallbackHeight();
+      callback({ height, stableHeight: height });
+    };
+    notify();
+    const onResize = () => notify();
+    window.visualViewport?.addEventListener("resize", onResize);
+    window.visualViewport?.addEventListener("scroll", onResize);
+    window.addEventListener("resize", onResize);
+    return () => {
+      window.visualViewport?.removeEventListener("resize", onResize);
+      window.visualViewport?.removeEventListener("scroll", onResize);
+      window.removeEventListener("resize", onResize);
+    };
+  }
   getViewportInsets() {
     return void 0;
   }
@@ -1379,6 +1400,63 @@ var TelegramMiniAppAdapter = class extends BaseMiniAppAdapter {
       return void 0;
     }
   }
+  onViewportChange(callback) {
+    const disposers = [];
+    const fallbackHeight = () => typeof window !== "undefined" ? window.visualViewport?.height ?? window.innerHeight : 0;
+    const notify = (state) => {
+      const heightCandidate = state?.height ?? this.safeHeightFromSdk();
+      const stableCandidate = state?.stableHeight ?? this.stableHeightFromSdk();
+      const height = Number.isFinite(heightCandidate) ? heightCandidate : fallbackHeight();
+      const stableHeight = Number.isFinite(stableCandidate) && stableCandidate > 0 ? stableCandidate : height;
+      callback({ height, stableHeight });
+    };
+    const ensureMounted = async () => {
+      try {
+        await ensureViewportMounted(this.getViewportMountOptions());
+      } catch (error) {
+        console.warn("[tvm-app-adapter] ensureViewportMounted failed:", error);
+      }
+    };
+    void ensureMounted().finally(() => notify());
+    const { sdkViewport } = this.getViewportMountOptions();
+    if (typeof sdkViewport.on === "function") {
+      try {
+        const off2 = sdkViewport.on("change", (next) => notify(next));
+        if (typeof off2 === "function") {
+          disposers.push(off2);
+        }
+      } catch (error) {
+        console.warn("[tvm-app-adapter] viewport.on(change) subscription failed:", error);
+      }
+    }
+    try {
+      if (typeof sdkViewport.height?.sub === "function") {
+        disposers.push(sdkViewport.height.sub(() => notify()));
+      }
+      if (typeof sdkViewport.stableHeight?.sub === "function") {
+        disposers.push(sdkViewport.stableHeight.sub(() => notify()));
+      }
+    } catch (error) {
+      console.warn("[tvm-app-adapter] viewport signal subscriptions failed:", error);
+    }
+    if (typeof window !== "undefined") {
+      const onResize = () => notify();
+      window.visualViewport?.addEventListener("resize", onResize);
+      window.addEventListener("resize", onResize);
+      disposers.push(() => {
+        window.visualViewport?.removeEventListener("resize", onResize);
+        window.removeEventListener("resize", onResize);
+      });
+    }
+    return () => {
+      disposers.forEach((dispose) => {
+        try {
+          dispose();
+        } catch {
+        }
+      });
+    };
+  }
   onAppearanceChange(callback) {
     this.appearanceListeners.add(callback);
     callback(this.environment.appearance);
@@ -1609,6 +1687,26 @@ var TelegramMiniAppAdapter = class extends BaseMiniAppAdapter {
       }
     };
   }
+  safeHeightFromSdk() {
+    try {
+      if (typeof rawViewport.height === "function") {
+        return rawViewport.height();
+      }
+    } catch {
+      return void 0;
+    }
+    return void 0;
+  }
+  stableHeightFromSdk() {
+    try {
+      if (typeof rawViewport.stableHeight === "function") {
+        return rawViewport.stableHeight();
+      }
+    } catch {
+      return void 0;
+    }
+    return void 0;
+  }
   notifyViewHide() {
     for (const listener of this.viewHideListeners) {
       try {