JS: add oldBottomMargin, oldHeight & bottomMargin

doric-demo/src/KeyboardDemo.ts

@@ -1,4 +1,4 @@
-import { Group, Panel, gravity, Color, LayoutSpec, vlayout, LayoutConfigImpl, layoutConfig, modal, keyboard, text, input, Input, InputType, Gravity, stack } from "doric";
+import { Group, Panel, gravity, Color, LayoutSpec, vlayout, layoutConfig, modal, keyboard, text, input, Input, InputType, Gravity, stack } from "doric";
 import { title, label, colors } from "./utils";
 
 function getInput(c: Partial<Input>) {
@@ -69,7 +69,7 @@ class KeyboardDemo extends Panel {
                     layoutConfig: layoutConfig().just(),
                     onClick: () => {
                         keyboard(context).subscribe(data => {
-                            bottomView.translationY = -data.height
+                            bottomView.translationY = - (data.bottomMargin + data.height)
                         }).then(e => {
                             modal(context).toast(`Keyboard Subscribe`)
                             this.subscribeId = e

doric-js/index.d.ts

@@ -996,6 +996,9 @@ declare module 'doric/lib/src/native/keyboard' {
     import { BridgeContext } from "doric/lib/src/runtime/global";
     export function keyboard(context: BridgeContext): {
         subscribe: (callback: (data: {
+            oldBottomMargin: number;
+            oldHeight: number;
+            bottomMargin: number;
             height: number;
         }) => void) => Promise<string>;
         unsubscribe: (subscribeId: string) => Promise<any>;

doric-js/lib/src/native/keyboard.d.ts

@@ -1,6 +1,9 @@
 import { BridgeContext } from "../runtime/global";
 export declare function keyboard(context: BridgeContext): {
     subscribe: (callback: (data: {
+        oldBottomMargin: number;
+        oldHeight: number;
+        bottomMargin: number;
         height: number;
     }) => void) => Promise<string>;
     unsubscribe: (subscribeId: string) => Promise<any>;

doric-js/src/native/keyboard.ts

@@ -16,7 +16,7 @@
 import { BridgeContext } from "../runtime/global"
 export function keyboard(context: BridgeContext) {
     return {
-        subscribe: (callback: (data: { height: number }) => void) => {
+        subscribe: (callback: (data: { oldBottomMargin: number, oldHeight: number, bottomMargin: number, height: number }) => void) => {
             return context.callNative('keyboard', 'subscribe', context.function2Id(callback)) as Promise<string>
         },
         unsubscribe: (subscribeId: string) => {

doric-web/dist/index.js

@@ -4196,6 +4196,18 @@ function notch(context) {
     };
 }
 
+function keyboard(context) {
+    return {
+        subscribe: (callback) => {
+            return context.callNative('keyboard', 'subscribe', context.function2Id(callback));
+        },
+        unsubscribe: (subscribeId) => {
+            context.removeFuncById(subscribeId);
+            return context.callNative('keyboard', 'unsubscribe', subscribeId);
+        }
+    };
+}
+
 class Observable {
     constructor(provider, clz) {
         this.observers = new Set;
@@ -4342,6 +4354,7 @@ exports.hlayout = hlayout;
 exports.image = image;
 exports.input = input;
 exports.internalScheme = internalScheme;
+exports.keyboard = keyboard;
 exports.layoutConfig = layoutConfig;
 exports.list = list;
 exports.listItem = listItem;
@@ -4420,6 +4433,7 @@ var doric_web = (function (exports, axios, sandbox) {
         }
     }
 
+    exports.LayoutSpec = void 0;
     (function (LayoutSpec) {
         LayoutSpec[LayoutSpec["EXACTLY"] = 0] = "EXACTLY";
         LayoutSpec[LayoutSpec["WRAP_CONTENT"] = 1] = "WRAP_CONTENT";
@@ -5901,6 +5915,8 @@ ${content}
     exports.toPixelString = toPixelString;
     exports.toRGBAString = toRGBAString;
 
+    Object.defineProperty(exports, '__esModule', { value: true });
+
     return exports;
 
 }({}, axios, doric));