feat(html): add <media-gesture> element (#1305)

packages/react/src/presets/video/skin.tsx

@@ -237,7 +237,7 @@ export function VideoSkin(props: VideoSkinProps): ReactNode {
       <MediaHotkey keys="m" action="toggleMuted" />
       <MediaHotkey keys="f" action="toggleFullscreen" />
       <MediaHotkey keys="c" action="toggleSubtitles" />
-      <MediaHotkey keys="i" action="togglePiP" />
+      <MediaHotkey keys="i" action="togglePictureInPicture" />
       <MediaHotkey keys="ArrowRight" action="seekStep" value={5} />
       <MediaHotkey keys="ArrowLeft" action="seekStep" value={-5} />
       <MediaHotkey keys="l" action="seekStep" value={10} />

packages/react/src/ui/pip-button/pip-button.tsx

@@ -15,7 +15,7 @@ export const PiPButton = createMediaButton<PiPButtonCore, PiPButtonProps>({
   stateAttrMap: PiPButtonDataAttrs,
   selector: selectPiP,
   action: (core, state) => core.toggle(state),
-  hotkeyAction: 'togglePiP',
+  hotkeyAction: 'togglePictureInPicture',
 });
 
 export namespace PiPButton {