native-fn 1.3.1 → 1.3.3

package/dist/plugin/dimension/index.cjs

@@ -607,8 +607,8 @@ function createViewportSegmentObserver() {
             segments = viewport.segments;
         else
             segments = visualViewport.segments;
-        if (segments === null || typeof segments === 'undefined')
-            return [];
+        if (segments === null || typeof segments === 'undefined' || segments.length === 0)
+            return [buildFullViewportSegment()];
         var results = [];
         for (var i = 0; i < segments.length; i++) {
             var segment = segments[i];
@@ -725,31 +725,101 @@ function createViewportSegmentObserver() {
 }
 function createVirtualKeyboardObserver() {
     var onChangeSubscriptionManager = createSubscriptionManager(attachOnChange, detachOnChange);
+    var virtualKeyboard = globalThis.navigator.virtualKeyboard;
+    var pendingRaf = null;
+    var pendingStabilize = null;
+    var stableInnerHeight = globalThis.innerHeight;
+    var stableInnerWidth = globalThis.innerWidth;
     function attachOnChange() {
-        EventListener.add(globalThis.navigator.virtualKeyboard, { type: 'geometrychange', callback: onGeometryChange, options: { passive: true } });
+        EventListener.add(virtualKeyboard, { type: 'geometrychange', callback: onGeometryChange, options: { passive: true } });
+        EventListener.add(globalThis, { type: 'resize', callback: onResize, options: { passive: true } });
     }
     function detachOnChange() {
-        EventListener.remove(globalThis.navigator.virtualKeyboard, { type: 'geometrychange', callback: onGeometryChange, options: { passive: true } });
+        EventListener.remove(virtualKeyboard, { type: 'geometrychange', callback: onGeometryChange, options: { passive: true } });
+        EventListener.remove(globalThis, { type: 'resize', callback: onResize, options: { passive: true } });
+        if (pendingRaf !== null) {
+            globalThis.cancelAnimationFrame(pendingRaf);
+            pendingRaf = null;
+        }
+        if (pendingStabilize !== null) {
+            globalThis.clearTimeout(pendingStabilize);
+            pendingStabilize = null;
+        }
+    }
+    function emitAfterFrame() {
+        if (pendingRaf !== null)
+            globalThis.cancelAnimationFrame(pendingRaf);
+        if (typeof globalThis.requestAnimationFrame === 'function') {
+            pendingRaf = globalThis.requestAnimationFrame(function () {
+                pendingRaf = null;
+                onChangeSubscriptionManager.emit(getValue());
+            });
+        }
+        else {
+            defer(function () {
+                onChangeSubscriptionManager.emit(getValue());
+            });
+        }
     }
     function onGeometryChange() {
-        onChangeSubscriptionManager.emit(getValue());
+        var rect = virtualKeyboard.boundingRect;
+        if (rect.height === 0) {
+            if (pendingStabilize !== null) {
+                globalThis.clearTimeout(pendingStabilize);
+                pendingStabilize = null;
+            }
+            emitAfterFrame();
+            return;
+        }
+        if (pendingStabilize !== null)
+            globalThis.clearTimeout(pendingStabilize);
+        pendingStabilize = globalThis.setTimeout(function () {
+            pendingStabilize = null;
+            emitAfterFrame();
+        }, 100);
+    }
+    function onResize() {
+        var rect = virtualKeyboard.boundingRect;
+        if (rect.height === 0) {
+            stableInnerHeight = globalThis.innerHeight;
+            stableInnerWidth = globalThis.innerWidth;
+        }
+        else {
+            var currentInnerHeight = globalThis.innerHeight;
+            if (rect.y + rect.height > currentInnerHeight)
+                stableInnerHeight = currentInnerHeight - rect.height;
+            else
+                stableInnerHeight = currentInnerHeight;
+            stableInnerWidth = globalThis.innerWidth;
+        }
     }
     function getValue() {
-        var rect = globalThis.navigator.virtualKeyboard.boundingRect;
-        var left = rect.x;
-        var top = rect.y;
+        var rect = virtualKeyboard.boundingRect;
         var width = rect.width;
         var height = rect.height;
-        var right;
-        if (width === 0)
-            right = 0;
-        else
-            right = Math.max(0, globalThis.innerWidth - (left + width));
-        var bottom;
-        if (height === 0)
-            bottom = 0;
-        else
-            bottom = Math.max(0, globalThis.innerHeight - (top + height));
+        var top = 0;
+        var bottom = 0;
+        var left = 0;
+        var right = 0;
+        if (height === 0) {
+            stableInnerHeight = globalThis.innerHeight;
+            stableInnerWidth = globalThis.innerWidth;
+        }
+        else {
+            var keyboardMidY = rect.y + height / 2;
+            if (keyboardMidY < stableInnerHeight / 2 || rect.y + height > stableInnerHeight) {
+                top = stableInnerHeight - height;
+                bottom = 0;
+            }
+            else {
+                top = rect.y;
+                bottom = Math.max(0, stableInnerHeight - (rect.y + height));
+            }
+        }
+        if (width > 0) {
+            left = Math.max(0, rect.x);
+            right = Math.max(0, stableInnerWidth - (rect.x + width));
+        }
         return {
             top: top,
             right: right,
@@ -1222,26 +1292,26 @@ function screenOrientationSupported() {
 }
 function attachOnScreenOrientationChange() {
     if (typeof globalThis.screen !== 'undefined' && typeof globalThis.screen.orientation !== 'undefined' && typeof globalThis.screen.orientation.addEventListener === 'function')
-        EventListener.add(globalThis.screen.orientation, {
+        return EventListener.add(globalThis.screen.orientation, {
             type: 'change',
             callback: onScreenOrientationChange
         });
     else if (typeof globalThis.orientation !== 'undefined')
-        EventListener.add(globalThis, { type: 'orientationchange', callback: onScreenOrientationChange });
+        return EventListener.add(globalThis, { type: 'orientationchange', callback: onScreenOrientationChange });
     else if (exports.ORIENTATION_MEDIA_QUERY_LIST.media !== 'not all')
-        EventListener.add(exports.ORIENTATION_MEDIA_QUERY_LIST, { type: 'change', callback: onScreenOrientationChange });
+        return EventListener.add(exports.ORIENTATION_MEDIA_QUERY_LIST, { type: 'change', callback: onScreenOrientationChange });
     throw new NotSupportedError('\'screen.orientation\', \'window.orientation\', and the orientation media query are all unsupported');
 }
 function detachOnScreenOrientationChange() {
     if (typeof globalThis.screen !== 'undefined' && typeof globalThis.screen.orientation !== 'undefined' && typeof globalThis.screen.orientation.removeEventListener === 'function')
-        EventListener.remove(globalThis.screen.orientation, {
+        return EventListener.remove(globalThis.screen.orientation, {
             type: 'change',
             callback: onScreenOrientationChange
         });
     else if (typeof globalThis.orientation !== 'undefined')
-        EventListener.remove(globalThis, { type: 'orientationchange', callback: onScreenOrientationChange });
+        return EventListener.remove(globalThis, { type: 'orientationchange', callback: onScreenOrientationChange });
     else if (exports.ORIENTATION_MEDIA_QUERY_LIST.media !== 'not all')
-        EventListener.remove(exports.ORIENTATION_MEDIA_QUERY_LIST, { type: 'change', callback: onScreenOrientationChange });
+        return EventListener.remove(exports.ORIENTATION_MEDIA_QUERY_LIST, { type: 'change', callback: onScreenOrientationChange });
     throw new NotSupportedError('\'screen.orientation\', \'window.orientation\', and the orientation media query are all unsupported');
 }
 function onScreenOrientationChange() {

package/dist/plugin/dimension/index.mjs

@@ -603,8 +603,8 @@ function createViewportSegmentObserver() {
             segments = viewport.segments;
         else
             segments = visualViewport.segments;
-        if (segments === null || typeof segments === 'undefined')
-            return [];
+        if (segments === null || typeof segments === 'undefined' || segments.length === 0)
+            return [buildFullViewportSegment()];
         var results = [];
         for (var i = 0; i < segments.length; i++) {
             var segment = segments[i];
@@ -721,31 +721,101 @@ function createViewportSegmentObserver() {
 }
 function createVirtualKeyboardObserver() {
     var onChangeSubscriptionManager = createSubscriptionManager(attachOnChange, detachOnChange);
+    var virtualKeyboard = globalThis.navigator.virtualKeyboard;
+    var pendingRaf = null;
+    var pendingStabilize = null;
+    var stableInnerHeight = globalThis.innerHeight;
+    var stableInnerWidth = globalThis.innerWidth;
     function attachOnChange() {
-        EventListener.add(globalThis.navigator.virtualKeyboard, { type: 'geometrychange', callback: onGeometryChange, options: { passive: true } });
+        EventListener.add(virtualKeyboard, { type: 'geometrychange', callback: onGeometryChange, options: { passive: true } });
+        EventListener.add(globalThis, { type: 'resize', callback: onResize, options: { passive: true } });
     }
     function detachOnChange() {
-        EventListener.remove(globalThis.navigator.virtualKeyboard, { type: 'geometrychange', callback: onGeometryChange, options: { passive: true } });
+        EventListener.remove(virtualKeyboard, { type: 'geometrychange', callback: onGeometryChange, options: { passive: true } });
+        EventListener.remove(globalThis, { type: 'resize', callback: onResize, options: { passive: true } });
+        if (pendingRaf !== null) {
+            globalThis.cancelAnimationFrame(pendingRaf);
+            pendingRaf = null;
+        }
+        if (pendingStabilize !== null) {
+            globalThis.clearTimeout(pendingStabilize);
+            pendingStabilize = null;
+        }
+    }
+    function emitAfterFrame() {
+        if (pendingRaf !== null)
+            globalThis.cancelAnimationFrame(pendingRaf);
+        if (typeof globalThis.requestAnimationFrame === 'function') {
+            pendingRaf = globalThis.requestAnimationFrame(function () {
+                pendingRaf = null;
+                onChangeSubscriptionManager.emit(getValue());
+            });
+        }
+        else {
+            defer(function () {
+                onChangeSubscriptionManager.emit(getValue());
+            });
+        }
     }
     function onGeometryChange() {
-        onChangeSubscriptionManager.emit(getValue());
+        var rect = virtualKeyboard.boundingRect;
+        if (rect.height === 0) {
+            if (pendingStabilize !== null) {
+                globalThis.clearTimeout(pendingStabilize);
+                pendingStabilize = null;
+            }
+            emitAfterFrame();
+            return;
+        }
+        if (pendingStabilize !== null)
+            globalThis.clearTimeout(pendingStabilize);
+        pendingStabilize = globalThis.setTimeout(function () {
+            pendingStabilize = null;
+            emitAfterFrame();
+        }, 100);
+    }
+    function onResize() {
+        var rect = virtualKeyboard.boundingRect;
+        if (rect.height === 0) {
+            stableInnerHeight = globalThis.innerHeight;
+            stableInnerWidth = globalThis.innerWidth;
+        }
+        else {
+            var currentInnerHeight = globalThis.innerHeight;
+            if (rect.y + rect.height > currentInnerHeight)
+                stableInnerHeight = currentInnerHeight - rect.height;
+            else
+                stableInnerHeight = currentInnerHeight;
+            stableInnerWidth = globalThis.innerWidth;
+        }
     }
     function getValue() {
-        var rect = globalThis.navigator.virtualKeyboard.boundingRect;
-        var left = rect.x;
-        var top = rect.y;
+        var rect = virtualKeyboard.boundingRect;
         var width = rect.width;
         var height = rect.height;
-        var right;
-        if (width === 0)
-            right = 0;
-        else
-            right = Math.max(0, globalThis.innerWidth - (left + width));
-        var bottom;
-        if (height === 0)
-            bottom = 0;
-        else
-            bottom = Math.max(0, globalThis.innerHeight - (top + height));
+        var top = 0;
+        var bottom = 0;
+        var left = 0;
+        var right = 0;
+        if (height === 0) {
+            stableInnerHeight = globalThis.innerHeight;
+            stableInnerWidth = globalThis.innerWidth;
+        }
+        else {
+            var keyboardMidY = rect.y + height / 2;
+            if (keyboardMidY < stableInnerHeight / 2 || rect.y + height > stableInnerHeight) {
+                top = stableInnerHeight - height;
+                bottom = 0;
+            }
+            else {
+                top = rect.y;
+                bottom = Math.max(0, stableInnerHeight - (rect.y + height));
+            }
+        }
+        if (width > 0) {
+            left = Math.max(0, rect.x);
+            right = Math.max(0, stableInnerWidth - (rect.x + width));
+        }
         return {
             top: top,
             right: right,
@@ -1218,26 +1288,26 @@ function screenOrientationSupported() {
 }
 function attachOnScreenOrientationChange() {
     if (typeof globalThis.screen !== 'undefined' && typeof globalThis.screen.orientation !== 'undefined' && typeof globalThis.screen.orientation.addEventListener === 'function')
-        EventListener.add(globalThis.screen.orientation, {
+        return EventListener.add(globalThis.screen.orientation, {
             type: 'change',
             callback: onScreenOrientationChange
         });
     else if (typeof globalThis.orientation !== 'undefined')
-        EventListener.add(globalThis, { type: 'orientationchange', callback: onScreenOrientationChange });
+        return EventListener.add(globalThis, { type: 'orientationchange', callback: onScreenOrientationChange });
     else if (ORIENTATION_MEDIA_QUERY_LIST.media !== 'not all')
-        EventListener.add(ORIENTATION_MEDIA_QUERY_LIST, { type: 'change', callback: onScreenOrientationChange });
+        return EventListener.add(ORIENTATION_MEDIA_QUERY_LIST, { type: 'change', callback: onScreenOrientationChange });
     throw new NotSupportedError('\'screen.orientation\', \'window.orientation\', and the orientation media query are all unsupported');
 }
 function detachOnScreenOrientationChange() {
     if (typeof globalThis.screen !== 'undefined' && typeof globalThis.screen.orientation !== 'undefined' && typeof globalThis.screen.orientation.removeEventListener === 'function')
-        EventListener.remove(globalThis.screen.orientation, {
+        return EventListener.remove(globalThis.screen.orientation, {
             type: 'change',
             callback: onScreenOrientationChange
         });
     else if (typeof globalThis.orientation !== 'undefined')
-        EventListener.remove(globalThis, { type: 'orientationchange', callback: onScreenOrientationChange });
+        return EventListener.remove(globalThis, { type: 'orientationchange', callback: onScreenOrientationChange });
     else if (ORIENTATION_MEDIA_QUERY_LIST.media !== 'not all')
-        EventListener.remove(ORIENTATION_MEDIA_QUERY_LIST, { type: 'change', callback: onScreenOrientationChange });
+        return EventListener.remove(ORIENTATION_MEDIA_QUERY_LIST, { type: 'change', callback: onScreenOrientationChange });
     throw new NotSupportedError('\'screen.orientation\', \'window.orientation\', and the orientation media query are all unsupported');
 }
 function onScreenOrientationChange() {

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "native-fn",
-  "version": "1.3.1",
+  "version": "1.3.3",
   "description": "TypeScript library bridging Web APIs to native device capabilities — Picture-in-Picture, Fullscreen, Clipboard, Geolocation, Battery, Notifications, Vibration, Platform detection, and more.",
   "author": "Park Jungyoung <qkrwnss0509@gmail.com> (https://github.com/pjy0509)",
   "type": "module",