Close web mention suggestions popup on Escape (#8605)
* alf web typeahead * fix type error * fix escape behaviour * change selection on hover * rm React. * undo random change
This commit is contained in:
@@ -1,7 +1,6 @@
|
||||
import React, {
|
||||
type ComponentProps,
|
||||
forwardRef,
|
||||
import {
|
||||
useCallback,
|
||||
useImperativeHandle,
|
||||
useMemo,
|
||||
useRef,
|
||||
useState,
|
||||
@@ -9,7 +8,6 @@ import React, {
|
||||
import {
|
||||
type NativeSyntheticEvent,
|
||||
Text as RNText,
|
||||
type TextInput as RNTextInput,
|
||||
type TextInputSelectionChangeEventData,
|
||||
View,
|
||||
} from 'react-native'
|
||||
@@ -33,57 +31,38 @@ import {
|
||||
import {atoms as a, useAlf} from '#/alf'
|
||||
import {normalizeTextStyles} from '#/alf/typography'
|
||||
import {Autocomplete} from './mobile/Autocomplete'
|
||||
|
||||
export interface TextInputRef {
|
||||
focus: () => void
|
||||
blur: () => void
|
||||
getCursorPosition: () => DOMRect | undefined
|
||||
}
|
||||
|
||||
interface TextInputProps extends ComponentProps<typeof RNTextInput> {
|
||||
richtext: RichText
|
||||
placeholder: string
|
||||
webForceMinHeight: boolean
|
||||
hasRightPadding: boolean
|
||||
isActive: boolean
|
||||
setRichText: (v: RichText) => void
|
||||
onPhotoPasted: (uri: string) => void
|
||||
onPressPublish: (richtext: RichText) => void
|
||||
onNewLink: (uri: string) => void
|
||||
onError: (err: string) => void
|
||||
}
|
||||
import {type TextInputProps} from './TextInput.types'
|
||||
|
||||
interface Selection {
|
||||
start: number
|
||||
end: number
|
||||
}
|
||||
|
||||
export const TextInput = forwardRef(function TextInputImpl(
|
||||
{
|
||||
richtext,
|
||||
placeholder,
|
||||
hasRightPadding,
|
||||
setRichText,
|
||||
onPhotoPasted,
|
||||
onNewLink,
|
||||
onError,
|
||||
...props
|
||||
}: TextInputProps,
|
||||
export function TextInput({
|
||||
ref,
|
||||
) {
|
||||
richtext,
|
||||
placeholder,
|
||||
hasRightPadding,
|
||||
setRichText,
|
||||
onPhotoPasted,
|
||||
onNewLink,
|
||||
onError,
|
||||
...props
|
||||
}: TextInputProps) {
|
||||
const {theme: t, fonts} = useAlf()
|
||||
const textInput = useRef<PasteInputRef>(null)
|
||||
const textInputSelection = useRef<Selection>({start: 0, end: 0})
|
||||
const theme = useTheme()
|
||||
const [autocompletePrefix, setAutocompletePrefix] = useState('')
|
||||
const prevLength = React.useRef(richtext.length)
|
||||
const prevLength = useRef(richtext.length)
|
||||
|
||||
React.useImperativeHandle(ref, () => ({
|
||||
useImperativeHandle(ref, () => ({
|
||||
focus: () => textInput.current?.focus(),
|
||||
blur: () => {
|
||||
textInput.current?.blur()
|
||||
},
|
||||
getCursorPosition: () => undefined, // Not implemented on native
|
||||
maybeClosePopup: () => false, // Not needed on native
|
||||
}))
|
||||
|
||||
const pastSuggestedUris = useRef(new Set<string>())
|
||||
@@ -185,7 +164,7 @@ export const TextInput = forwardRef(function TextInputImpl(
|
||||
[onChangeText, richtext, setAutocompletePrefix],
|
||||
)
|
||||
|
||||
const inputTextStyle = React.useMemo(() => {
|
||||
const inputTextStyle = useMemo(() => {
|
||||
const style = normalizeTextStyles(
|
||||
[a.text_lg, a.leading_snug, t.atoms.text],
|
||||
{
|
||||
@@ -277,4 +256,4 @@ export const TextInput = forwardRef(function TextInputImpl(
|
||||
/>
|
||||
</View>
|
||||
)
|
||||
})
|
||||
}
|
||||
|
||||
Reference in New Issue
Block a user