[FEAT] Advanced Keyboard fixes

[roman-rr]

• Review body resizing for iOS / Android with all:

• capacitor / cordova / web

• iOS / Android
  Determinate a reason of resizing and prevent it.

• Memorize setHeight position for opened keyboard to bounce back on hide

• Add proper height value to offset on start click (in case of dragging after setHeight with keyboard)

[bazuka5801]

@roman-rr Keyboard issues is my common work when I started a new mobile project.
I want to explain my experience to help cupertino pane make better.

On ios/android we have these options to control resize mode from @capacitor/keyboard plugin, same in cordova only another name.

Members	Value	Description	Since
Body	'body'	Only the body HTML element will be resized. Relative units are not affected, because the viewport does not change.	1.0.0
Ionic	'ionic'	Only the ion-app HTML element will be resized. Use it only for Ionic Framework apps.	1.0.0
Native	'native'	The whole native Web View will be resized when the keyboard shows/hides. This affects the vh relative unit.	1.0.0
None	'none'	Neither the app nor the Web View are resized.	1.0.0

On android we also have soft input, we can use it multiple using |, ex.

<activity android:windowSoftInputMode="stateHidden|adjustResize" ... >

In my projects i am using none resizing and control to control all by my self, it's right way to do app without keyboard glitch for users.
And for android i use "adjustPan", but for newer android it not working, but works with "stateHidden|adjustPan|adjustNothing". A bit strange adjustNothing not available in docs, i found it in some stack overflow question few days ago.

For smooth animation, when keyboard open, I inject css variable

Keyboard.addListener('keyboardWillShow', info => {
    document.documentElement.style.setProperty('--keyboard-height', info.keyboardHeight + 'px')
})

And use it in css

.cupertino-pane {
   padding-bottom: var(--keyboard-height);
}

If you have any questions, I'm willing to help.