fix(ios): avoid keyboard covering dialog (#11681)

close PD-2540

packages/frontend/component/src/ui/modal/context.ts

@@ -7,6 +7,10 @@ export interface ModalConfig {
    * return a function to handle close/unmount callback
    */
   onOpen?: () => OnClose;
+  /**
+   * For mobile
+   */
+  dynamicKeyboardHeight?: string | number;
 }
 export const ModalConfigContext = createContext<ModalConfig>({});
 

packages/frontend/component/src/ui/modal/modal.tsx

@@ -131,7 +131,8 @@ function createContainer() {
 
 export const ModalInner = forwardRef<HTMLDivElement, ModalProps>(
   (props, ref) => {
-    const { onOpen: modalConfigOnOpen } = useContext(ModalConfigContext);
+    const { onOpen: modalConfigOnOpen, dynamicKeyboardHeight } =
+      useContext(ModalConfigContext);
     const {
       modal,
       portalOptions,
@@ -243,7 +244,7 @@ export const ModalInner = forwardRef<HTMLDivElement, ModalProps>(
           >
             <SafeArea
               bottom={BUILD_CONFIG.isMobileEdition}
-              bottomOffset={12}
+              bottomOffset={dynamicKeyboardHeight ?? 12}
               data-full-screen={fullScreen}
               data-modal={modal}
               className={clsx(