Leahnaya/nxapi
1
0
Fork 0
mirror of https://github.com/samuelthomas2774/nxapi.git synced 2026-04-26 00:13:08 -05:00
Code Issues Actions Packages Projects Releases Wiki Activity

Don't show macOS themed buttons as pressed when the cursor isn't over them

Browse Source
This commit is contained in:
Samuel Elliott 2022-06-12 16:58:13 +01:00
parent b3c9fd8d8b
commit aa08c81a2a
No known key found for this signature in database
GPG Key ID: 8420C7CDE43DC4D6
1 changed files with 13 additions and 3 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

16
src/app/browser/components/button.tsx
View File

@ -15,17 +15,26 @@ function ButtonMac(props: {
const window_focused = useContext(WindowFocusedContext); const window_focused = useContext(WindowFocusedContext);
const accent_colour = useAccentColour(); const accent_colour = useAccentColour();
const [hovered, setMouseOver] = useState(false);
const onMouseOver = useCallback(() => setMouseOver(true), []);
const onMouseOut = useCallback(() => setMouseOver(false), []);
const [pressed, setPressIn] = useState(false); const [pressed, setPressIn] = useState(false);
const onPressIn = useCallback(() => setPressIn(true), []); const onPressIn = useCallback(() => setPressIn(true), []);
const onPressOut = useCallback(() => setPressIn(false), []); const onPressOut = useCallback(() => setPressIn(false), []);
const active = window_focused && (props.primary || pressed); const pressed_appearance = window_focused && pressed && hovered;
const active = window_focused && (props.primary || pressed_appearance);
return <Pressable return <Pressable
style={[ style={[
styles.button, styles.button,
active ? {backgroundColor: props.color ?? accent_colour} : null, active ? {backgroundColor: props.color ?? accent_colour} : null,
]} ]}
// @ts-expect-error react-native-web
onMouseOver={onMouseOver}
onMouseOut={onMouseOut}
onPress={props.onPress} onPress={props.onPress}
onPressIn={onPressIn} onPressIn={onPressIn}
onPressOut={onPressOut} onPressOut={onPressOut}
@ -33,7 +42,7 @@ function ButtonMac(props: {
<View style={[ <View style={[
styles.inner, styles.inner,
active ? styles.innerActive : null, active ? styles.innerActive : null,
active && pressed ? styles.innerPressed : null, active && pressed_appearance ? styles.innerPressed : null,
]}> ]}>
<Text style={styles.text}>{props.title}</Text> <Text style={styles.text}>{props.title}</Text>
</View> </View>
@ -91,6 +100,7 @@ function ButtonWindows(props: {
const [pressed, setPressIn] = useState(false); const [pressed, setPressIn] = useState(false);
const onPressIn = useCallback(() => setPressIn(true), []); const onPressIn = useCallback(() => setPressIn(true), []);
const onPressOut = useCallback(() => setPressIn(false), []); const onPressOut = useCallback(() => setPressIn(false), []);
const active = window_focused && (props.primary || pressed); const active = window_focused && (props.primary || pressed);
return <Pressable return <Pressable