@automattic/jetpack-components 1.12.3 → 1.12.5

package/CHANGELOG.md

@@ -2,13 +2,21 @@
 
 ### This is a list detailing changes for the Jetpack RNA Components package releases.
 
+## [1.12.5] - 2026-06-08
+### Fixed
+- NavigatorModal: Keep the modal open when the control inside opens an external WP Modal. [#49389]
+
+## [1.12.4] - 2026-06-08
+### Changed
+- Internal updates.
+
 ## [1.12.3] - 2026-06-03
 ### Changed
 - Internal updates.
 
 ## [1.12.2] - 2026-06-02
 ### Changed
-- AdminPage: expand the Hello Dolly normalize rule (was a single `background-color`) to cover the full visual treatment (italic, gray text, white background, right-aligned, hidden under 660px) so individual plugins don't need their own per-page overrides. No position/offsets are set so per-page `position: absolute` overrides (e.g. My Jetpack) keep working. [#48472]
+- AdminPage: Expand the Hello Dolly normalize rule to cover the full visual treatment (italic, gray text, white background, right-aligned, hidden under 660px). [#48472]
 
 ### Fixed
 - Pricing table: render feature tooltips as a portal so they are no longer hidden behind the admin sidebar [#49318]
@@ -1824,6 +1832,8 @@
 ### Changed
 - Update node version requirement to 14.16.1
 
+[1.12.5]: https://github.com/Automattic/jetpack-components/compare/1.12.4...1.12.5
+[1.12.4]: https://github.com/Automattic/jetpack-components/compare/1.12.3...1.12.4
 [1.12.3]: https://github.com/Automattic/jetpack-components/compare/1.12.2...1.12.3
 [1.12.2]: https://github.com/Automattic/jetpack-components/compare/1.12.1...1.12.2
 [1.12.1]: https://github.com/Automattic/jetpack-components/compare/1.12.0...1.12.1

package/build/components/navigator-modal/index.js

@@ -16,16 +16,27 @@ function InternalNavigatorModal({ children, className, ...props }) {
     const { onClose, initialPath } = useContext(NavigatorModalContext);
     const overlayRef = useRef(null);
     const isUserInteracting = useRef(false);
-    // Track pointer interaction on the overlay so we can distinguish
-    // user-initiated overlay clicks from the WP Modal dismisser mechanism,
-    // which also calls onRequestClose() without an event argument.
+    /*
+     * Track pointer interaction on the overlay so we can distinguish
+     * user-initiated overlay (backdrop) clicks from the WP Modal dismisser
+     * mechanism, which also calls onRequestClose() without an event argument.
+     *
+     * Only a pointerdown on the overlay element itself counts as a backdrop
+     * interaction — mirroring WP Modal's own `event.target === event.currentTarget`
+     * check. Without this target guard, a pointerdown on any control inside the
+     * modal (e.g. the "Generate image" button) would bubble up and set the flag,
+     * so when that control opens an external Modal (Image Studio) the resulting
+     * dismisser call would be misread as an overlay click and wrongly close us.
+     */
     useEffect(() => {
         const overlay = overlayRef.current;
         if (!overlay) {
             return;
         }
-        const handler = () => {
-            isUserInteracting.current = true;
+        const handler = (event) => {
+            if (event.target === overlay) {
+                isUserInteracting.current = true;
+            }
         };
         overlay.addEventListener('pointerdown', handler);
         return () => overlay.removeEventListener('pointerdown', handler);

package/components/navigator-modal/index.tsx

@@ -27,16 +27,27 @@ function InternalNavigatorModal( {
 	const overlayRef = useRef< HTMLDivElement >( null );
 	const isUserInteracting = useRef( false );
 
-	// Track pointer interaction on the overlay so we can distinguish
-	// user-initiated overlay clicks from the WP Modal dismisser mechanism,
-	// which also calls onRequestClose() without an event argument.
+	/*
+	 * Track pointer interaction on the overlay so we can distinguish
+	 * user-initiated overlay (backdrop) clicks from the WP Modal dismisser
+	 * mechanism, which also calls onRequestClose() without an event argument.
+	 *
+	 * Only a pointerdown on the overlay element itself counts as a backdrop
+	 * interaction — mirroring WP Modal's own `event.target === event.currentTarget`
+	 * check. Without this target guard, a pointerdown on any control inside the
+	 * modal (e.g. the "Generate image" button) would bubble up and set the flag,
+	 * so when that control opens an external Modal (Image Studio) the resulting
+	 * dismisser call would be misread as an overlay click and wrongly close us.
+	 */
 	useEffect( () => {
 		const overlay = overlayRef.current;
 		if ( ! overlay ) {
 			return;
 		}
-		const handler = () => {
-			isUserInteracting.current = true;
+		const handler = ( event: PointerEvent ) => {
+			if ( event.target === overlay ) {
+				isUserInteracting.current = true;
+			}
 		};
 		overlay.addEventListener( 'pointerdown', handler );
 		return () => overlay.removeEventListener( 'pointerdown', handler );

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@automattic/jetpack-components",
-	"version": "1.12.3",
+	"version": "1.12.5",
 	"description": "Jetpack Components Package",
 	"homepage": "https://github.com/Automattic/jetpack/tree/HEAD/projects/js-packages/components/#readme",
 	"bugs": {
@@ -73,10 +73,10 @@
 	],
 	"dependencies": {
 		"@automattic/format-currency": "1.0.1",
-		"@automattic/jetpack-api": "^1.0.27",
-		"@automattic/jetpack-boost-score-api": "^1.0.45",
+		"@automattic/jetpack-api": "^1.0.28",
+		"@automattic/jetpack-boost-score-api": "^1.0.46",
 		"@automattic/jetpack-script-data": "^0.6.4",
-		"@automattic/number-formatters": "^1.2.1",
+		"@automattic/number-formatters": "^1.2.2",
 		"@babel/runtime": "^7",
 		"@gravatar-com/hovercards": "0.16.0",
 		"@wordpress/admin-ui": "2.1.0",