Fix play

packages/sdk-components-react/package.json

@@ -52,7 +52,8 @@
     "@webstudio-is/react-sdk": "workspace:*",
     "@webstudio-is/sdk": "workspace:*",
     "colord": "^2.9.3",
-    "micromark": "^4.0.0"
+    "micromark": "^4.0.0",
+    "await-interaction-response": "^0.0.2"
   },
   "devDependencies": {
     "@testing-library/react": "^14.2.2",

packages/sdk-components-react/src/vimeo-play-button.tsx

@@ -3,9 +3,11 @@ import {
   type ElementRef,
   type ComponentProps,
   useContext,
+  useCallback,
 } from "react";
 import { VimeoContext } from "./vimeo";
 import { Button, defaultTag } from "./button";
+import interactionResponse from "await-interaction-response";
 
 export { defaultTag };
 
@@ -14,10 +16,17 @@ type Props = ComponentProps<typeof Button>;
 export const VimeoPlayButton = forwardRef<ElementRef<typeof defaultTag>, Props>(
   (props, ref) => {
     const vimeoContext = useContext(VimeoContext);
+
+    const handleClick = useCallback(async () => {
+      await interactionResponse();
+      vimeoContext.onInitPlayer();
+    }, [vimeoContext]);
+
     if (vimeoContext.status !== "initial") {
       return;
     }
-    return <Button {...props} onClick={vimeoContext.onInitPlayer} ref={ref} />;
+
+    return <Button {...props} onClick={handleClick} ref={ref} />;
   }
 );