feat: add mouse down handler to prevent input blur and implement rapid click guard

apps/app/src/features/page-tree/hooks/use-page-create.tsx

@@ -42,6 +42,12 @@ const CreateButtonInner: FC<CreateButtonInnerProps> = ({
     return null;
   }
 
+  const handleMouseDown = (e: React.MouseEvent) => {
+    // Prevent focus change which would trigger blur on the input field
+    // and cause cancelCreating to be called
+    e.preventDefault();
+  };
+
   const handleClick = (e: React.MouseEvent) => {
     // Always stop propagation to prevent parent item click handlers
     e.stopPropagation();
@@ -59,6 +65,7 @@ const CreateButtonInner: FC<CreateButtonInnerProps> = ({
           id={`page-create-button-in-page-tree-${buttonId}`}
           type="button"
           className="border-0 rounded btn btn-page-item-control p-0"
+          onMouseDown={handleMouseDown}
           onClick={handleClick}
         >
           <span className="material-symbols-outlined p-0">add_circle</span>

apps/app/src/features/page-tree/states/_inner/page-tree-create.ts

@@ -32,6 +32,10 @@ type CreatingParentInfo = {
 
 const creatingParentInfoAtom = atom<CreatingParentInfo>(null);
 
+// Module-level flag for synchronous guard against rapid clicks
+// This is shared across all hook instances
+let isCreatingFlag = false;
+
 /**
  * Hook to get the current creating parent ID
  */
@@ -75,12 +79,19 @@ export const usePageTreeCreateActions = (): PageTreeCreateActions => {
 
   const startCreating = useCallback(
     (parentId: string, parentPath: string) => {
+      // Synchronous check to prevent rapid clicks
+      // Uses module-level flag shared across all hook instances
+      if (isCreatingFlag) {
+        return;
+      }
+      isCreatingFlag = true;
       setCreatingParentInfo({ id: parentId, path: parentPath });
     },
     [setCreatingParentInfo],
   );
 
   const cancelCreating = useCallback(() => {
+    isCreatingFlag = false;
     setCreatingParentInfo(null);
   }, [setCreatingParentInfo]);