fix other buttons in dialogs
This commit is contained in:
@@ -71,7 +71,7 @@ export const NormalizedRNGHPressable = React.forwardRef<View, PressableProps>(
|
||||
onFocus: _onFocus,
|
||||
...rest
|
||||
},
|
||||
ref,
|
||||
_ref,
|
||||
) {
|
||||
const onNormalizedPress = (event: PressableEvent) => {
|
||||
if (!onPress) return
|
||||
@@ -104,17 +104,15 @@ export const NormalizedRNGHPressable = React.forwardRef<View, PressableProps>(
|
||||
}
|
||||
|
||||
return (
|
||||
<View ref={ref}>
|
||||
<BSPressable
|
||||
onPress={onNormalizedPress}
|
||||
onLongPress={onNormalizedLongPress}
|
||||
onPressIn={onNormalizedPressIn}
|
||||
onPressOut={onNormalizedPressOut}
|
||||
onHoverIn={onNormalizedHoverIn}
|
||||
onHoverOut={onNormalizedHoverOut}
|
||||
{...rest}
|
||||
/>
|
||||
</View>
|
||||
<BSPressable
|
||||
onPress={onNormalizedPress}
|
||||
onLongPress={onNormalizedLongPress}
|
||||
onPressIn={onNormalizedPressIn}
|
||||
onPressOut={onNormalizedPressOut}
|
||||
onHoverIn={onNormalizedHoverIn}
|
||||
onHoverOut={onNormalizedHoverOut}
|
||||
{...rest}
|
||||
/>
|
||||
)
|
||||
},
|
||||
)
|
||||
|
||||
@@ -31,6 +31,7 @@ import {PageText_Stroke2_Corner0_Rounded as PageText} from '#/components/icons/P
|
||||
import {PlusLarge_Stroke2_Corner0_Rounded as Plus} from '#/components/icons/Plus'
|
||||
import {TimesLarge_Stroke2_Corner0_Rounded as X} from '#/components/icons/Times'
|
||||
import {Loader} from '#/components/Loader'
|
||||
import {NormalizedRNGHPressable} from '#/components/NormalizedRNGHPressable'
|
||||
import * as Prompt from '#/components/Prompt'
|
||||
import {Text} from '#/components/Typography'
|
||||
|
||||
@@ -169,7 +170,8 @@ function MutedWordsInner() {
|
||||
<Toggle.Item
|
||||
label={_(msg`Mute this word until you unmute it`)}
|
||||
name="forever"
|
||||
style={[a.flex_1]}>
|
||||
style={[a.flex_1]}
|
||||
PressableComponent={NormalizedRNGHPressable}>
|
||||
<TargetToggle>
|
||||
<View
|
||||
style={[a.flex_1, a.flex_row, a.align_center, a.gap_sm]}>
|
||||
@@ -184,7 +186,8 @@ function MutedWordsInner() {
|
||||
<Toggle.Item
|
||||
label={_(msg`Mute this word for 24 hours`)}
|
||||
name="24_hours"
|
||||
style={[a.flex_1]}>
|
||||
style={[a.flex_1]}
|
||||
PressableComponent={NormalizedRNGHPressable}>
|
||||
<TargetToggle>
|
||||
<View
|
||||
style={[a.flex_1, a.flex_row, a.align_center, a.gap_sm]}>
|
||||
@@ -208,7 +211,8 @@ function MutedWordsInner() {
|
||||
<Toggle.Item
|
||||
label={_(msg`Mute this word for 7 days`)}
|
||||
name="7_days"
|
||||
style={[a.flex_1]}>
|
||||
style={[a.flex_1]}
|
||||
PressableComponent={NormalizedRNGHPressable}>
|
||||
<TargetToggle>
|
||||
<View
|
||||
style={[a.flex_1, a.flex_row, a.align_center, a.gap_sm]}>
|
||||
@@ -223,7 +227,8 @@ function MutedWordsInner() {
|
||||
<Toggle.Item
|
||||
label={_(msg`Mute this word for 30 days`)}
|
||||
name="30_days"
|
||||
style={[a.flex_1]}>
|
||||
style={[a.flex_1]}
|
||||
PressableComponent={NormalizedRNGHPressable}>
|
||||
<TargetToggle>
|
||||
<View
|
||||
style={[a.flex_1, a.flex_row, a.align_center, a.gap_sm]}>
|
||||
@@ -257,7 +262,8 @@ function MutedWordsInner() {
|
||||
<Toggle.Item
|
||||
label={_(msg`Mute this word in post text and tags`)}
|
||||
name="content"
|
||||
style={[a.flex_1]}>
|
||||
style={[a.flex_1]}
|
||||
PressableComponent={NormalizedRNGHPressable}>
|
||||
<TargetToggle>
|
||||
<View
|
||||
style={[a.flex_1, a.flex_row, a.align_center, a.gap_sm]}>
|
||||
@@ -273,7 +279,8 @@ function MutedWordsInner() {
|
||||
<Toggle.Item
|
||||
label={_(msg`Mute this word in tags only`)}
|
||||
name="tag"
|
||||
style={[a.flex_1]}>
|
||||
style={[a.flex_1]}
|
||||
PressableComponent={NormalizedRNGHPressable}>
|
||||
<TargetToggle>
|
||||
<View
|
||||
style={[a.flex_1, a.flex_row, a.align_center, a.gap_sm]}>
|
||||
@@ -303,7 +310,8 @@ function MutedWordsInner() {
|
||||
name="exclude_following"
|
||||
style={[a.flex_row, a.justify_between]}
|
||||
value={excludeFollowing}
|
||||
onChange={setExcludeFollowing}>
|
||||
onChange={setExcludeFollowing}
|
||||
PressableComponent={NormalizedRNGHPressable}>
|
||||
<TargetToggle>
|
||||
<View style={[a.flex_1, a.flex_row, a.align_center, a.gap_sm]}>
|
||||
<Toggle.Checkbox />
|
||||
|
||||
@@ -1,9 +1,9 @@
|
||||
import React from 'react'
|
||||
import {Pressable, View, ViewStyle} from 'react-native'
|
||||
import {Pressable, PressableProps, View, ViewStyle} from 'react-native'
|
||||
import Animated, {LinearTransition} from 'react-native-reanimated'
|
||||
|
||||
import {HITSLOP_10} from '#/lib/constants'
|
||||
import {isNative} from '#/platform/detection'
|
||||
import {HITSLOP_10} from 'lib/constants'
|
||||
import {
|
||||
atoms as a,
|
||||
flatten,
|
||||
@@ -68,6 +68,7 @@ export type ItemProps = ViewStyleProp & {
|
||||
onChange?: (selected: boolean) => void
|
||||
isInvalid?: boolean
|
||||
children: ((props: ItemState) => React.ReactNode) | React.ReactNode
|
||||
PressableComponent?: React.ComponentType<PressableProps>
|
||||
}
|
||||
|
||||
export function useItemContext() {
|
||||
@@ -159,6 +160,7 @@ export function Item({
|
||||
style,
|
||||
type = 'checkbox',
|
||||
label,
|
||||
PressableComponent = Pressable,
|
||||
...rest
|
||||
}: ItemProps) {
|
||||
const {
|
||||
@@ -206,7 +208,7 @@ export function Item({
|
||||
|
||||
return (
|
||||
<ItemContext.Provider value={state}>
|
||||
<Pressable
|
||||
<PressableComponent
|
||||
accessibilityHint={undefined} // optional
|
||||
hitSlop={HITSLOP_10}
|
||||
{...rest}
|
||||
@@ -231,7 +233,7 @@ export function Item({
|
||||
onBlur={onBlur}
|
||||
style={[a.flex_row, a.align_center, a.gap_sm, flatten(style)]}>
|
||||
{typeof children === 'function' ? children(state) : children}
|
||||
</Pressable>
|
||||
</PressableComponent>
|
||||
</ItemContext.Provider>
|
||||
)
|
||||
}
|
||||
|
||||
@@ -13,6 +13,7 @@ import * as TextField from '#/components/forms/TextField'
|
||||
import * as ToggleButton from '#/components/forms/ToggleButton'
|
||||
import {Globe_Stroke2_Corner0_Rounded as Globe} from '#/components/icons/Globe'
|
||||
import {InlineLinkText} from '#/components/Link'
|
||||
import {NormalizedRNGHPressable} from '#/components/NormalizedRNGHPressable'
|
||||
import {P, Text} from '#/components/Typography'
|
||||
|
||||
export function ServerInputDialog({
|
||||
@@ -83,7 +84,10 @@ export function ServerInputDialog({
|
||||
label="Preferences"
|
||||
values={fixedOption}
|
||||
onChange={setFixedOption}>
|
||||
<ToggleButton.Button name={BSKY_SERVICE} label={_(msg`Bluesky`)}>
|
||||
<ToggleButton.Button
|
||||
name={BSKY_SERVICE}
|
||||
label={_(msg`Bluesky`)}
|
||||
PressableComponent={NormalizedRNGHPressable}>
|
||||
<ToggleButton.ButtonText>
|
||||
{_(msg`Bluesky`)}
|
||||
</ToggleButton.ButtonText>
|
||||
@@ -91,7 +95,8 @@ export function ServerInputDialog({
|
||||
<ToggleButton.Button
|
||||
testID="customSelectBtn"
|
||||
name="custom"
|
||||
label={_(msg`Custom`)}>
|
||||
label={_(msg`Custom`)}
|
||||
PressableComponent={NormalizedRNGHPressable}>
|
||||
<ToggleButton.ButtonText>
|
||||
{_(msg`Custom`)}
|
||||
</ToggleButton.ButtonText>
|
||||
|
||||
Reference in New Issue
Block a user