Something went wrong. Try again.
Bluesky app fork with some witchin' additions 💫
Something went wrong. Try again.
1.4 kB · 46 lines
TSX
at main
1234567891011121314151617181920212223242526272829303132333435363738394041424344454647import {type SvgProps} from 'react-native-svg'
import {useEnableSquareButtons} from '#/state/preferences/enable-square-buttons'import {PressableWithHover} from '#/view/com/util/PressableWithHover'import {atoms as a, useTheme, web} from '#/alf'
export function ControlButton({ testID, active, activeLabel, inactiveLabel, activeIcon: ActiveIcon, inactiveIcon: InactiveIcon, onPress,}: { testID?: string active: boolean activeLabel: string inactiveLabel: string activeIcon: React.ComponentType<Pick<SvgProps, 'fill' | 'width'>> inactiveIcon: React.ComponentType<Pick<SvgProps, 'fill' | 'width'>> onPress: () => void}) { const t = useTheme() const enableSquareButtons = useEnableSquareButtons() return ( <PressableWithHover testID={testID} accessibilityRole="button" accessibilityLabel={active ? activeLabel : inactiveLabel} accessibilityHint="" onPress={onPress} style={[ a.p_xs, enableSquareButtons ? a.rounded_sm : a.rounded_full, web({transition: 'background-color 0.1s'}), ]} hoverStyle={{backgroundColor: 'rgba(255, 255, 255, 0.2)'}}> {active ? ( <ActiveIcon fill={t.palette.white} width={20} aria-hidden /> ) : ( <InactiveIcon fill={t.palette.white} width={20} aria-hidden /> )} </PressableWithHover> )}