reflet-sdk 0.4.1 → 0.4.2

package/CHANGELOG.md

@@ -5,6 +5,13 @@ All notable changes to `reflet-sdk` will be documented in this file.
 The format is based on [Keep a Changelog](https://keepachangelog.com/en/1.0.0/),
 and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0.html).
 
+## [0.4.2] - 2026-09-22
+
+### Fixed
+
+- Keys typed in the widget no longer trigger the host page's keyboard shortcuts — Space in the message types a space instead of playing or pausing the host's video
+- Host shortcuts listening in the capture phase still run first; they should read `event.composedPath()[0]` rather than `event.target` to recognise the widget's text fields
+
 ## [0.4.1] - 2026-09-20
 
 ### Added

package/dist/feedback.js

@@ -810,7 +810,7 @@ function collectPageContext(options) {
 }
 //#endregion
 //#region src/feedback/types.ts
-const SDK_VERSION = "0.4.1";
+const SDK_VERSION = "0.4.2";
 const DEFAULT_WIDGET_LABELS = {
 	annotateHint: "Draw on the screenshot to point at the problem.",
 	attachElement: "Attach this element",
@@ -2621,14 +2621,23 @@ function FloatingWidget({ labels, position, state }) {
 	useEffect(() => {
 		if (!showPanel || state.step !== "compose") return;
 		const onKeyDown = (event) => {
-			if (event.key === "Escape" && !event.defaultPrevented) {
+			if (event instanceof KeyboardEvent && event.key === "Escape" && !event.defaultPrevented) {
 				setMinimized(true);
 				requestAnimationFrame(() => launcherRef.current?.focus());
 			}
 		};
+		const widgetRoot = floating.rootRef.current?.getRootNode();
 		document.addEventListener("keydown", onKeyDown);
-		return () => document.removeEventListener("keydown", onKeyDown);
-	}, [showPanel, state.step]);
+		widgetRoot?.addEventListener("keydown", onKeyDown);
+		return () => {
+			document.removeEventListener("keydown", onKeyDown);
+			widgetRoot?.removeEventListener("keydown", onKeyDown);
+		};
+	}, [
+		floating.rootRef,
+		showPanel,
+		state.step
+	]);
 	return /* @__PURE__ */ jsxs("div", {
 		className: "root",
 		"data-editing": state.isOpen && (state.step === "picking" || state.step === "annotate"),
@@ -3446,6 +3455,11 @@ ${PICKER_STYLES}
 //#endregion
 //#region src/feedback/ui/shadow-portal.tsx
 const DARK_QUERY = "(prefers-color-scheme: dark)";
+const KEY_EVENTS = [
+	"keydown",
+	"keyup",
+	"keypress"
+];
 function useResolvedTheme(theme) {
 	const [systemDark, setSystemDark] = useState(false);
 	useEffect(() => {
@@ -3471,6 +3485,7 @@ function ShadowPortal({ children, offset, primaryColor, theme }) {
 		const host = document.createElement("div");
 		host.setAttribute(WIDGET_MARKER, "");
 		const root = host.attachShadow({ mode: "open" });
+		for (const type of KEY_EVENTS) root.addEventListener(type, (event) => event.stopPropagation());
 		const style = document.createElement("style");
 		style.textContent = WIDGET_STYLES;
 		root.append(style);
@@ -4099,7 +4114,7 @@ function useWidgetState(props) {
 		setStep("compose");
 		return submission.submit({
 			context: {
-				...activeScreenshot?.context ?? collectPageContext({ sdkVersion: "0.4.1" }),
+				...activeScreenshot?.context ?? collectPageContext({ sdkVersion: "0.4.2" }),
 				consoleEvents: consoleRef.current?.events(),
 				metadata: props.metadata,
 				selections
@@ -4181,8 +4196,8 @@ function RefletFeedback(props) {
 				else open();
 			}
 		};
-		document.addEventListener("keydown", onKeyDown);
-		return () => document.removeEventListener("keydown", onKeyDown);
+		document.addEventListener("keydown", onKeyDown, true);
+		return () => document.removeEventListener("keydown", onKeyDown, true);
 	}, [
 		close,
 		enabled,