diff --git a/plasmicpkgs/react-aria/src/registerModal.tsx b/plasmicpkgs/react-aria/src/registerModal.tsx
index e9a1b40dfb4..2767319ae09 100644
--- a/plasmicpkgs/react-aria/src/registerModal.tsx
+++ b/plasmicpkgs/react-aria/src/registerModal.tsx
@@ -48,6 +48,7 @@ export const BaseModal = forwardRef<BaseModalActions, BaseModalProps>(
       isOpen,
       resetClassName,
       setControlContextData,
+      isDismissable,
       ...rest
     } = props;
 
@@ -57,6 +58,15 @@ export const BaseModal = forwardRef<BaseModalActions, BaseModalProps>(
     const isStandalone = !contextProps;
     const mergedProps = mergeProps(contextProps, rest, {
       isOpen: isStandalone ? isSelected || isOpen : contextProps.isOpen,
+      /**
+       * isDismissable on canvas (non-interactive mode) causes the following two issues:
+       * 1. Clicking anywhere inside the modal dismisses it
+       * 2. If the modal is auto-opened due to selection in outline tab, the modal stays open despite issue #1, but the text elements inside the modal are no longer selectable, and therefore the text or headings inside the modal are not editable.
+       *
+       * To fix the above issue, we set an interim isDismissable state to false while the modal is auto-open (`isSelected` is true).
+       * Also note that `isSelected` can only be true in canvas (non-interactive mode), so we can safely (temporarily) set `isDismissable` to false in this case, because it only matters in interactive mode.
+       *  */
+      isDismissable: isSelected ? false : isDismissable,
     });
 
     setControlContextData?.({