diff --git a/packages/lexical-playground/src/nodes/ExcalidrawNode/ExcalidrawComponent.tsx b/packages/lexical-playground/src/nodes/ExcalidrawNode/ExcalidrawComponent.tsx
index ee80664f93e..ca9a4c30025 100644
--- a/packages/lexical-playground/src/nodes/ExcalidrawNode/ExcalidrawComponent.tsx
+++ b/packages/lexical-playground/src/nodes/ExcalidrawNode/ExcalidrawComponent.tsx
@@ -16,9 +16,7 @@ import {useLexicalNodeSelection} from '@lexical/react/useLexicalNodeSelection';
 import {mergeRegister} from '@lexical/utils';
 import {
   $getNodeByKey,
-  CLICK_COMMAND,
   COMMAND_PRIORITY_LOW,
-  isDOMNode,
   KEY_BACKSPACE_COMMAND,
   KEY_DELETE_COMMAND,
 } from 'lexical';
@@ -47,7 +45,6 @@ export default function ExcalidrawComponent({
     data === '[]' && editor.isEditable(),
   );
   const imageContainerRef = useRef<HTMLDivElement | null>(null);
-  const buttonRef = useRef<HTMLButtonElement | null>(null);
   const captionButtonRef = useRef<HTMLButtonElement | null>(null);
   const [isSelected, setSelected, clearSelection] =
     useLexicalNodeSelection(nodeKey);
@@ -75,35 +72,6 @@ export default function ExcalidrawComponent({
       return;
     }
     return mergeRegister(
-      editor.registerCommand(
-        CLICK_COMMAND,
-        (event: MouseEvent) => {
-          const buttonElem = buttonRef.current;
-          const eventTarget = event.target;
-
-          if (isResizing) {
-            return true;
-          }
-
-          if (
-            buttonElem !== null &&
-            isDOMNode(eventTarget) &&
-            buttonElem.contains(eventTarget)
-          ) {
-            if (!event.shiftKey) {
-              clearSelection();
-            }
-            setSelected(!isSelected);
-            if (event.detail > 1) {
-              setModalOpen(true);
-            }
-            return true;
-          }
-
-          return false;
-        },
-        COMMAND_PRIORITY_LOW,
-      ),
       editor.registerCommand(
         KEY_DELETE_COMMAND,
         $onDelete,
@@ -221,9 +189,7 @@ export default function ExcalidrawComponent({
         />
       )}
       {elements.length > 0 && (
-        <button
-          ref={buttonRef}
-          className={`excalidraw-button ${isSelected ? 'selected' : ''}`}>
+        <div className={`excalidraw-button ${isSelected ? 'selected' : ''}`}>
           <ExcalidrawImage
             imageContainerRef={imageContainerRef}
             className="image"
@@ -234,9 +200,8 @@ export default function ExcalidrawComponent({
             height={height}
           />
           {isSelected && isEditable && (
-            <div
+            <button
               className="image-edit-button"
-              role="button"
               tabIndex={0}
               onMouseDown={(event) => event.preventDefault()}
               onClick={openModal}
@@ -254,7 +219,7 @@ export default function ExcalidrawComponent({
               captionsEnabled={true}
             />
           )}
-        </button>
+        </div>
       )}
     </>
   );
diff --git a/packages/lexical-playground/src/nodes/ImageComponent.tsx b/packages/lexical-playground/src/nodes/ImageComponent.tsx
index 6eb6a3d7cc8..1a73ccd0d90 100644
--- a/packages/lexical-playground/src/nodes/ImageComponent.tsx
+++ b/packages/lexical-playground/src/nodes/ImageComponent.tsx
@@ -35,7 +35,6 @@ import {
   $isNodeSelection,
   $isRangeSelection,
   $setSelection,
-  CLICK_COMMAND,
   COMMAND_PRIORITY_LOW,
   createCommand,
   DRAGSTART_COMMAND,
@@ -300,11 +299,6 @@ export default function ImageComponent({
         },
         COMMAND_PRIORITY_LOW,
       ),
-      editor.registerCommand<MouseEvent>(
-        CLICK_COMMAND,
-        onClick,
-        COMMAND_PRIORITY_LOW,
-      ),
       editor.registerCommand<MouseEvent>(
         RIGHT_CLICK_IMAGE_COMMAND,
         onClick,
diff --git a/packages/lexical-playground/src/nodes/InlineImageNode/InlineImageComponent.tsx b/packages/lexical-playground/src/nodes/InlineImageNode/InlineImageComponent.tsx
index 6cbd4377861..266a6b00b0a 100644
--- a/packages/lexical-playground/src/nodes/InlineImageNode/InlineImageComponent.tsx
+++ b/packages/lexical-playground/src/nodes/InlineImageNode/InlineImageComponent.tsx
@@ -23,7 +23,6 @@ import {
   $getSelection,
   $isNodeSelection,
   $setSelection,
-  CLICK_COMMAND,
   COMMAND_PRIORITY_LOW,
   DRAGSTART_COMMAND,
   KEY_BACKSPACE_COMMAND,
@@ -288,24 +287,6 @@ export default function InlineImageComponent({
         },
         COMMAND_PRIORITY_LOW,
       ),
-      editor.registerCommand<MouseEvent>(
-        CLICK_COMMAND,
-        (payload) => {
-          const event = payload;
-          if (event.target === imageRef.current) {
-            if (event.shiftKey) {
-              setSelected(!isSelected);
-            } else {
-              clearSelection();
-              setSelected(true);
-            }
-            return true;
-          }
-
-          return false;
-        },
-        COMMAND_PRIORITY_LOW,
-      ),
       editor.registerCommand(
         DRAGSTART_COMMAND,
         (event) => {
diff --git a/packages/lexical-playground/src/nodes/PageBreakNode/index.tsx b/packages/lexical-playground/src/nodes/PageBreakNode/index.tsx
index 0b4911c4383..ebb02896ca4 100644
--- a/packages/lexical-playground/src/nodes/PageBreakNode/index.tsx
+++ b/packages/lexical-playground/src/nodes/PageBreakNode/index.tsx
@@ -13,7 +13,6 @@ import {mergeRegister} from '@lexical/utils';
 import {
   $getSelection,
   $isNodeSelection,
-  CLICK_COMMAND,
   COMMAND_PRIORITY_HIGH,
   COMMAND_PRIORITY_LOW,
   DecoratorNode,
@@ -53,23 +52,6 @@ function PageBreakComponent({nodeKey}: {nodeKey: NodeKey}) {
 
   useEffect(() => {
     return mergeRegister(
-      editor.registerCommand(
-        CLICK_COMMAND,
-        (event: MouseEvent) => {
-          const pbElem = editor.getElementByKey(nodeKey);
-
-          if (event.target === pbElem) {
-            if (!event.shiftKey) {
-              clearSelection();
-            }
-            setSelected(!isSelected);
-            return true;
-          }
-
-          return false;
-        },
-        COMMAND_PRIORITY_LOW,
-      ),
       editor.registerCommand(
         KEY_DELETE_COMMAND,
         $onDelete,
diff --git a/packages/lexical-playground/src/nodes/PollComponent.tsx b/packages/lexical-playground/src/nodes/PollComponent.tsx
index 52119d350cd..8f71430d98b 100644
--- a/packages/lexical-playground/src/nodes/PollComponent.tsx
+++ b/packages/lexical-playground/src/nodes/PollComponent.tsx
@@ -19,7 +19,6 @@ import {
   $getSelection,
   $isNodeSelection,
   BaseSelection,
-  CLICK_COMMAND,
   COMMAND_PRIORITY_LOW,
   KEY_BACKSPACE_COMMAND,
   KEY_DELETE_COMMAND,
@@ -142,7 +141,6 @@ export default function PollComponent({
   const [isSelected, setSelected, clearSelection] =
     useLexicalNodeSelection(nodeKey);
   const [selection, setSelection] = useState<BaseSelection | null>(null);
-  const ref = useRef(null);
 
   const $onDelete = useCallback(
     (payload: KeyboardEvent) => {
@@ -166,23 +164,6 @@ export default function PollComponent({
       editor.registerUpdateListener(({editorState}) => {
         setSelection(editorState.read(() => $getSelection()));
       }),
-      editor.registerCommand<MouseEvent>(
-        CLICK_COMMAND,
-        (payload) => {
-          const event = payload;
-
-          if (event.target === ref.current) {
-            if (!event.shiftKey) {
-              clearSelection();
-            }
-            setSelected(!isSelected);
-            return true;
-          }
-
-          return false;
-        },
-        COMMAND_PRIORITY_LOW,
-      ),
       editor.registerCommand(
         KEY_DELETE_COMMAND,
         $onDelete,
@@ -220,9 +201,7 @@ export default function PollComponent({
   const isFocused = $isNodeSelection(selection) && isSelected;
 
   return (
-    <div
-      className={`PollNode__container ${isFocused ? 'focused' : ''}`}
-      ref={ref}>
+    <div className={`PollNode__container ${isFocused ? 'focused' : ''}`}>
       <div className="PollNode__inner">
         <h2 className="PollNode__heading">{question}</h2>
         {options.map((option, index) => {
diff --git a/packages/lexical-react/src/LexicalBlockWithAlignableContents.tsx b/packages/lexical-react/src/LexicalBlockWithAlignableContents.tsx
index c2b68ff747a..a86a7f2e243 100644
--- a/packages/lexical-react/src/LexicalBlockWithAlignableContents.tsx
+++ b/packages/lexical-react/src/LexicalBlockWithAlignableContents.tsx
@@ -21,14 +21,13 @@ import {
   $isDecoratorNode,
   $isNodeSelection,
   $isRangeSelection,
-  CLICK_COMMAND,
   COMMAND_PRIORITY_LOW,
   FORMAT_ELEMENT_COMMAND,
   KEY_BACKSPACE_COMMAND,
   KEY_DELETE_COMMAND,
 } from 'lexical';
 import * as React from 'react';
-import {ReactNode, useCallback, useEffect, useRef} from 'react';
+import {ReactNode, useCallback, useEffect} from 'react';
 
 type Props = Readonly<{
   children: ReactNode;
@@ -50,7 +49,6 @@ export function BlockWithAlignableContents({
 
   const [isSelected, setSelected, clearSelection] =
     useLexicalNodeSelection(nodeKey);
-  const ref = useRef(null);
 
   const $onDelete = useCallback(
     (event: KeyboardEvent) => {
@@ -102,23 +100,6 @@ export function BlockWithAlignableContents({
         },
         COMMAND_PRIORITY_LOW,
       ),
-      editor.registerCommand<MouseEvent>(
-        CLICK_COMMAND,
-        (event) => {
-          if (event.target === ref.current) {
-            event.preventDefault();
-            if (!event.shiftKey) {
-              clearSelection();
-            }
-
-            setSelected(!isSelected);
-            return true;
-          }
-
-          return false;
-        },
-        COMMAND_PRIORITY_LOW,
-      ),
       editor.registerCommand(
         KEY_DELETE_COMMAND,
         $onDelete,
@@ -137,7 +118,6 @@ export function BlockWithAlignableContents({
       className={[className.base, isSelected ? className.focus : null]
         .filter(Boolean)
         .join(' ')}
-      ref={ref}
       style={{
         textAlign: format ? format : undefined,
       }}>
diff --git a/packages/lexical-react/src/LexicalHorizontalRuleNode.tsx b/packages/lexical-react/src/LexicalHorizontalRuleNode.tsx
index 41339c51c7d..16940006cd9 100644
--- a/packages/lexical-react/src/LexicalHorizontalRuleNode.tsx
+++ b/packages/lexical-react/src/LexicalHorizontalRuleNode.tsx
@@ -28,7 +28,6 @@ import {
   $applyNodeReplacement,
   $getSelection,
   $isNodeSelection,
-  CLICK_COMMAND,
   COMMAND_PRIORITY_LOW,
   createCommand,
   DecoratorNode,
@@ -66,23 +65,6 @@ function HorizontalRuleComponent({nodeKey}: {nodeKey: NodeKey}) {
 
   useEffect(() => {
     return mergeRegister(
-      editor.registerCommand(
-        CLICK_COMMAND,
-        (event: MouseEvent) => {
-          const hrElem = editor.getElementByKey(nodeKey);
-
-          if (event.target === hrElem) {
-            if (!event.shiftKey) {
-              clearSelection();
-            }
-            setSelected(!isSelected);
-            return true;
-          }
-
-          return false;
-        },
-        COMMAND_PRIORITY_LOW,
-      ),
       editor.registerCommand(
         KEY_DELETE_COMMAND,
         $onDelete,
diff --git a/packages/lexical-rich-text/src/index.ts b/packages/lexical-rich-text/src/index.ts
index 3bc75ca6580..8b86da6cfc2 100644
--- a/packages/lexical-rich-text/src/index.ts
+++ b/packages/lexical-rich-text/src/index.ts
@@ -44,6 +44,7 @@ import {
 } from '@lexical/utils';
 import {
   $applyNodeReplacement,
+  $createNodeSelection,
   $createParagraphNode,
   $createRangeSelection,
   $createTabNode,
@@ -565,13 +566,25 @@ export function registerRichText(editor: LexicalEditor): () => void {
   const removeListener = mergeRegister(
     editor.registerCommand(
       CLICK_COMMAND,
-      (payload) => {
-        const selection = $getSelection();
-        if ($isNodeSelection(selection)) {
-          selection.clear();
-          return true;
+      (event) => {
+        if (!(event.target instanceof Element)) {
+          return false;
         }
-        return false;
+        const decorator = event.target.closest(
+          '[data-lexical-decorator="true"]',
+        );
+        if (!decorator) {
+          return false;
+        }
+        editor.update(() => {
+          const node = $getNearestNodeFromDOMNode(decorator);
+          if ($isDecoratorNode(node)) {
+            const selection = $createNodeSelection();
+            selection.add(node.getKey());
+            $setSelection(selection);
+          }
+        });
+        return true;
       },
       0,
     ),
diff --git a/packages/lexical/src/LexicalEditor.ts b/packages/lexical/src/LexicalEditor.ts
index f25305691ac..806a9942c15 100644
--- a/packages/lexical/src/LexicalEditor.ts
+++ b/packages/lexical/src/LexicalEditor.ts
@@ -786,7 +786,7 @@ export class LexicalEditor {
    * deterministically in the order of registration.
    *
    * @param command - the command that will trigger the callback.
-   * @param listener - the function that will execute when the command is dispatched.
+   * @param listener - the function that will execute when the command is dispatched. Returns true to stop propagation, false to continue.
    * @param priority - the relative priority of the listener. 0 | 1 | 2 | 3 | 4
    *   (or {@link COMMAND_PRIORITY_EDITOR} |
    *     {@link COMMAND_PRIORITY_LOW} |