diff --git a/src/components/Button.tsx b/src/components/Button.tsx index 98ad1709c4..0c7c1ac46d 100644 --- a/src/components/Button.tsx +++ b/src/components/Button.tsx @@ -89,7 +89,7 @@ export type ButtonProps = Pick< style?: StyleProp hoverStyle?: StyleProp children: NonTextElements | ((context: ButtonContext) => NonTextElements) - Component?: React.ComponentType + PressableComponent?: React.ComponentType } export type ButtonTextProps = TextProps & VariantProps & {disabled?: boolean} @@ -117,7 +117,7 @@ export const Button = React.forwardRef( disabled = false, style, hoverStyle: hoverStyleProp, - Component, + PressableComponent, ...rest }, ref, @@ -125,11 +125,11 @@ export const Button = React.forwardRef( // This will pick the correct default pressable to use. If we are inside a dialog, we need to use the RNGH // pressable so that it is usable inside the dialog. const {insideDialog} = useDialogContext() - if (!Component) { + if (!PressableComponent) { if (insideDialog) { - Component = NormalizedRNGHPressable + PressableComponent = NormalizedRNGHPressable } else { - Component = Pressable + PressableComponent = Pressable } } @@ -464,7 +464,7 @@ export const Button = React.forwardRef( const flattenedBaseStyles = flatten([baseStyles, style]) return ( - ( {typeof children === 'function' ? children(context) : children} - + ) }, ) diff --git a/src/components/ReportDialog/SubmitView.tsx b/src/components/ReportDialog/SubmitView.tsx index e323d15042..682e918c2d 100644 --- a/src/components/ReportDialog/SubmitView.tsx +++ b/src/components/ReportDialog/SubmitView.tsx @@ -16,6 +16,7 @@ import * as Toggle from '#/components/forms/Toggle' import {Check_Stroke2_Corner0_Rounded as Check} from '#/components/icons/Check' import {ChevronLeft_Stroke2_Corner0_Rounded as ChevronLeft} from '#/components/icons/Chevron' import {Loader} from '#/components/Loader' +import {NormalizedRNGHPressable} from '#/components/NormalizedRNGHPressable' import {Text} from '#/components/Typography' import {ReportDialogProps} from './types' @@ -153,7 +154,8 @@ export function SubmitView({ + label={title} + PressableComponent={NormalizedRNGHPressable}> ) diff --git a/src/components/dialogs/MutedWords.tsx b/src/components/dialogs/MutedWords.tsx index daa18f94e7..55fd98d711 100644 --- a/src/components/dialogs/MutedWords.tsx +++ b/src/components/dialogs/MutedWords.tsx @@ -30,6 +30,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' @@ -168,7 +169,8 @@ function MutedWordsInner() { + style={[a.flex_1]} + PressableComponent={NormalizedRNGHPressable}> @@ -183,7 +185,8 @@ function MutedWordsInner() { + style={[a.flex_1]} + PressableComponent={NormalizedRNGHPressable}> @@ -207,7 +210,8 @@ function MutedWordsInner() { + style={[a.flex_1]} + PressableComponent={NormalizedRNGHPressable}> @@ -222,7 +226,8 @@ function MutedWordsInner() { + style={[a.flex_1]} + PressableComponent={NormalizedRNGHPressable}> @@ -256,7 +261,8 @@ function MutedWordsInner() { + style={[a.flex_1]} + PressableComponent={NormalizedRNGHPressable}> @@ -272,7 +278,8 @@ function MutedWordsInner() { + style={[a.flex_1]} + PressableComponent={NormalizedRNGHPressable}> @@ -302,7 +309,8 @@ function MutedWordsInner() { name="exclude_following" style={[a.flex_row, a.justify_between]} value={excludeFollowing} - onChange={setExcludeFollowing}> + onChange={setExcludeFollowing} + PressableComponent={NormalizedRNGHPressable}> diff --git a/src/components/dialogs/PostInteractionSettingsDialog.tsx b/src/components/dialogs/PostInteractionSettingsDialog.tsx index 93be838542..5f0b381e37 100644 --- a/src/components/dialogs/PostInteractionSettingsDialog.tsx +++ b/src/components/dialogs/PostInteractionSettingsDialog.tsx @@ -37,6 +37,7 @@ import * as Toggle from '#/components/forms/Toggle' import {Check_Stroke2_Corner0_Rounded as Check} from '#/components/icons/Check' import {CircleInfo_Stroke2_Corner0_Rounded as CircleInfo} from '#/components/icons/CircleInfo' import {Loader} from '#/components/Loader' +import {NormalizedRNGHPressable} from '#/components/NormalizedRNGHPressable' import {Text} from '#/components/Typography' export type PostInteractionSettingsFormProps = { @@ -303,7 +304,8 @@ export function PostInteractionSettingsForm({ } value={quotesEnabled} onChange={onChangeQuotesEnabled} - style={[, a.justify_between, a.pt_xs]}> + style={[a.justify_between, a.pt_xs]} + PressableComponent={NormalizedRNGHPressable}> {quotesEnabled ? ( Quote posts enabled diff --git a/src/components/forms/Toggle.tsx b/src/components/forms/Toggle.tsx index 6dc387b239..bb5f154df0 100644 --- a/src/components/forms/Toggle.tsx +++ b/src/components/forms/Toggle.tsx @@ -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 } 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 ( - {typeof children === 'function' ? children(state) : children} - + ) } diff --git a/src/view/com/auth/server-input/index.tsx b/src/view/com/auth/server-input/index.tsx index de7ed6d15b..659ff7f733 100644 --- a/src/view/com/auth/server-input/index.tsx +++ b/src/view/com/auth/server-input/index.tsx @@ -12,6 +12,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({ @@ -82,7 +83,10 @@ export function ServerInputDialog({ label="Preferences" values={fixedOption} onChange={setFixedOption}> - + {_(msg`Bluesky`)} @@ -90,7 +94,8 @@ export function ServerInputDialog({ + label={_(msg`Custom`)} + PressableComponent={NormalizedRNGHPressable}> {_(msg`Custom`)} diff --git a/src/view/com/util/post-ctrls/RepostButton.tsx b/src/view/com/util/post-ctrls/RepostButton.tsx index 14c869df8d..896e197b65 100644 --- a/src/view/com/util/post-ctrls/RepostButton.tsx +++ b/src/view/com/util/post-ctrls/RepostButton.tsx @@ -156,7 +156,6 @@ let RepostButton = ({