luulam/AFFiNE
1
0
Fork 0
Code Issues Pull Requests Actions 2 Packages Projects Releases Wiki Activity

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

Browse Source 
Fix issue [AF-1706](https://linear.app/affine-design/issue/AF-1706).
This commit is contained in:
akumatus
2024-11-20 06:25:36 +00:00
parent 2857568f03
commit b0ca3c6d58
3 changed files with 16 additions and 12 deletions
Download Patch File Download Diff File Expand all files Collapse all files

2
packages/frontend/component/src/hooks/focus-and-select.ts
View File

@@ -21,7 +21,7 @@ export const useAutoFocus = <T extends HTMLElement = HTMLElement>(
export const useAutoSelect = <T extends HTMLInputElement = HTMLInputElement>( export const useAutoSelect = <T extends HTMLInputElement = HTMLInputElement>(
autoSelect?: boolean autoSelect?: boolean
) => { ) => {
const ref = useAutoFocus<T>(autoSelect); const ref = useRef<T | null>(null);
useLayoutEffect(() => { useLayoutEffect(() => {
if (ref.current && autoSelect) { if (ref.current && autoSelect) {

23
packages/frontend/component/src/ui/input/row-input.tsx
View File

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

3
packages/frontend/core/src/components/blocksuite/block-suite-editor/specs/custom/spec-patchers.tsx
View File

@@ -169,10 +169,10 @@ export function patchNotificationService({
<div> <div>
<span style={{ marginBottom: 12 }}>{toReactNode(message)}</span> <span style={{ marginBottom: 12 }}>{toReactNode(message)}</span>
<Input <Input
autoSelect={true}
placeholder={placeholder} placeholder={placeholder}
defaultValue={value} defaultValue={value}
onChange={e => (value = e)} onChange={e => (value = e)}
ref={input => input?.select()}
/> />
</div> </div>
); );
@@ -190,6 +190,7 @@ export function patchNotificationService({
onCancel: () => { onCancel: () => {
resolve(null); resolve(null);
}, },
autoFocusConfirm: false,
}); });
abort?.addEventListener('abort', () => { abort?.addEventListener('abort', () => {
resolve(null); resolve(null);