forked from
jollywhoppers.com/witchsky.app
Bluesky app fork with some witchin' additions 💫
feat: add basic visual feedback on Button interactions (#708)
* feat: add basic visual feedback on Button interaction
* Use a more efficient approach to providing visual feedback
* Fix some lint issues left over from another PR
---------
Co-authored-by: Simek <gosimek@gmail.com>
authored by
Paul Frazee
Simek
and committed by
GitHub
562faa76
41f3a055
+20
-6
+16
-1
src/view/com/util/forms/Button.tsx
+16
-1
src/view/com/util/forms/Button.tsx
···
128
128
},
129
129
},
130
130
)
131
+
131
132
const onPressWrapped = React.useCallback(
132
133
(event: Event) => {
133
134
event.stopPropagation()
···
136
137
},
137
138
[onPress],
138
139
)
140
+
141
+
const getStyle = React.useCallback(
142
+
state => {
143
+
const arr = [typeOuterStyle, styles.outer, style]
144
+
if (state.pressed) {
145
+
arr.push({opacity: 0.6})
146
+
} else if (state.hovered) {
147
+
arr.push({opacity: 0.8})
148
+
}
149
+
return arr
150
+
},
151
+
[typeOuterStyle, style],
152
+
)
153
+
139
154
return (
140
155
<Pressable
141
-
style={[typeOuterStyle, styles.outer, style]}
156
+
style={getStyle}
142
157
onPress={onPressWrapped}
143
158
testID={testID}
144
159
accessibilityRole="button"