[bug] body bottom padding doesn't get removed when using shared virtual keyboard

Description

Bottom padding CSS gets added to the HTML body element, when opening a virtual keyboard and is removed when closing the keyboard. However, when using a shared keyboard across multiple fields, it doesn’t seem to detect the keyboard being closed and keeps adding to the padding each time a keyboard is opened.

Steps to Reproduce

Can be reproduced with basic implementation of shared keyboard:

import * as Mathlive from 'mathlive'

const app = document.querySelector('#app')

const mathfields = [
  new Mathlive.MathfieldElement({ keyboardMode: 'onfocus' }),
  new Mathlive.MathfieldElement({ keyboardMode: 'onfocus' }),
  new Mathlive.MathfieldElement({ keyboardMode: 'onfocus' })
]

mathfields.forEach(f => app.appendChild(f))

Mathlive.makeSharedVirtualKeyboard({})

OR

1. Go to https://mathlive-shared-keyboard.vercel.app/
2. Focus on fields a couple of times to open keyboard
3. Inspect the HTML body style attribute

Actual Behavior

The padding style in HTML body piles up.

Expected Behavior

It should not pile up, padding should be removed each time a keyboard is closed.

Environment

0.76.1

Browser [Chrome}

[sbondaryev]

@arnog the idea was to add/remove a div placeholder in virtualKeyboardContainer instead of changing the its padding-button but I realized that the content of virtualKeyboardContainer can be also changed - so, not a good idea.

[sbondaryev]

@arnog Great I will close the PR then. Thank you!