fix(core): linked doc named input box has excessive desire to select all

toeverything · Nov 19, 2024 · 3b8d61b · 3b8d61b
1 parent 4011062
commit 3b8d61b
Show file tree

Hide file tree

Showing 3 changed files with 16 additions and 12 deletions.
diff --git a/packages/frontend/component/src/hooks/focus-and-select.ts b/packages/frontend/component/src/hooks/focus-and-select.ts
@@ -21,7 +21,7 @@ export const useAutoFocus = <T extends HTMLElement = HTMLElement>(
 export const useAutoSelect = <T extends HTMLInputElement = HTMLInputElement>(
   autoSelect?: boolean
 ) => {
-  const ref = useAutoFocus<T>(autoSelect);
+  const ref = useRef<T | null>(null);
 
   useLayoutEffect(() => {
     if (ref.current && autoSelect) {

diff --git a/packages/frontend/component/src/ui/input/row-input.tsx b/packages/frontend/component/src/ui/input/row-input.tsx
@@ -45,17 +45,20 @@ export const RowInput = forwardRef<HTMLInputElement, RowInputProps>(
     const focusRef = useAutoFocus<HTMLInputElement>(autoFocus);
     const selectRef = useAutoSelect<HTMLInputElement>(autoSelect);
 
-    const inputRef = (el: HTMLInputElement | null) => {
-      focusRef.current = el;
-      selectRef.current = el;
-      if (upstreamRef) {
-        if (typeof upstreamRef === 'function') {
-          upstreamRef(el);
-        } else {
-          upstreamRef.current = el;
+    const inputRef = useCallback(
+      (el: HTMLInputElement | null) => {
+        focusRef.current = el;
+        selectRef.current = el;
+        if (upstreamRef) {
+          if (typeof upstreamRef === 'function') {
+            upstreamRef(el);
+          } else {
+            upstreamRef.current = el;
+          }
         }
-      }
-    };
+      },
+      [focusRef, selectRef, upstreamRef]
+    );
 
     // use native blur event to get event after unmount
     // don't use useLayoutEffect here, because the cleanup function will be called before unmount

diff --git a/...frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/spec-patchers.tsx b/...frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/spec-patchers.tsx
@@ -169,10 +169,10 @@ export function patchNotificationService({
           <div>
             <span style={{ marginBottom: 12 }}>{toReactNode(message)}</span>
             <Input
+              autoSelect={true}
               placeholder={placeholder}
               defaultValue={value}
               onChange={e => (value = e)}
-              ref={input => input?.select()}
             />
           </div>
         );
@@ -190,6 +190,7 @@ export function patchNotificationService({
           onCancel: () => {
             resolve(null);
           },
+          autoFocusConfirm: false,
         });
         abort?.addEventListener('abort', () => {
           resolve(null);