Hovertemplate's text does not change between sliders.steps when on mobile and there's also no method of closing the tool-tip once opened

I have a stacked bar chart with two simple traces and two sliders.steps.
Each trace has a hovertemplate: "%{y} - %{x:.2f}% <extra></extra>" property.

On mobile when I touch a bar I get its appropriate hovertemplate text, which is good.
But from here there are two issues:

• first is that no matter where I touch on the screen, the hovertemplate won't disappear . So once opened, it's always open.
• the second issue is that if the hovertemplate is open and I change from one slider step to the other, the info in the tool-tip does not change with the appropriate info from the selected step.

Here is a simple bar chart that, when switched to mobile, behaves how I described: https://es7kb8.csb.app/

Here is the code: https://codesandbox.io/s/relaxed-brahmagupta-es7kb8?resolutionWidth=484&resolutionHeight=675&file=/src/App.js

まず、指定されたモバイル解像度で、リンク先の CodeSandbox におけるモバイル動作を再現します。その際、2つの traces と2つの sliders.steps を持つ積み上げ棒グラフを使用します。hovertemplate の状態が touch による閉じる操作と slider の変更にどのように応答するかを追跡します。完了条件は、モバイルで tooltip を閉じられ、開いている間は選択された step のデータに更新されることです。