@@ -25,59 +25,56 @@ export default function PostActionButton({
2525 const { theme } = useTheme ( ) ;
2626
2727 return (
28- < Pressable
29- { ...props }
30- style = { [
31- Atoms . flex_1 ,
32- Atoms . flex_row ,
33- Atoms . outline_none ,
34- Atoms . items_center ,
35- ] }
36- hitSlop = { 8 }
37- >
38- { ( { pressed, hovered } ) => {
39- const highlighted = hovered || pressed ;
40- return (
41- < >
42- < View
43- style = { [
44- Atoms . p_xs ,
45- Atoms . rounded_full ,
46- // overflow:hidden forces a rounded clip on native - without it a
47- // background applied on press (rather than at mount, like the
48- // active state) renders with square corners.
49- Atoms . overflow_hidden ,
50- {
51- backgroundColor : highlighted
52- ? withHexOpacity ( theme . palette [ color ] , '14' )
53- : active
54- ? withHexOpacity ( theme . palette [ color ] , '28' )
55- : 'transparent' ,
56- } ,
57- ] }
58- >
59- < Ionicons
60- name = { icon }
61- size = { 16 }
62- color = {
63- active || highlighted
64- ? theme . palette [ color ]
65- : theme . palette . neutral_500
66- }
67- />
68- </ View >
69- { count !== undefined ? (
70- < Text
71- variant = "small"
72- color = "neutral_500"
73- style = { { minWidth : 28 , lineHeight : 16 } }
28+ < View style = { [ Atoms . flex_1 , Atoms . flex_row , Atoms . justify_start ] } >
29+ < Pressable
30+ { ...props }
31+ style = { [ Atoms . flex_row , Atoms . outline_none , Atoms . items_center ] }
32+ hitSlop = { 8 }
33+ >
34+ { ( { pressed, hovered } ) => {
35+ const highlighted = hovered || pressed ;
36+ return (
37+ < >
38+ < View
39+ style = { [
40+ Atoms . p_xs ,
41+ Atoms . rounded_full ,
42+ // overflow:hidden forces a rounded clip on native - without it a
43+ // background applied on press (rather than at mount, like the
44+ // active state) renders with square corners.
45+ Atoms . overflow_hidden ,
46+ {
47+ backgroundColor : highlighted
48+ ? withHexOpacity ( theme . palette [ color ] , '14' )
49+ : active
50+ ? withHexOpacity ( theme . palette [ color ] , '28' )
51+ : 'transparent' ,
52+ } ,
53+ ] }
7454 >
75- { count ? String ( count ) : ' ' }
76- </ Text >
77- ) : null }
78- </ >
79- ) ;
80- } }
81- </ Pressable >
55+ < Ionicons
56+ name = { icon }
57+ size = { 16 }
58+ color = {
59+ active || highlighted
60+ ? theme . palette [ color ]
61+ : theme . palette . neutral_500
62+ }
63+ />
64+ </ View >
65+ { count !== undefined ? (
66+ < Text
67+ variant = "small"
68+ color = "neutral_500"
69+ style = { { minWidth : 28 , lineHeight : 16 } }
70+ >
71+ { count ? String ( count ) : ' ' }
72+ </ Text >
73+ ) : null }
74+ </ >
75+ ) ;
76+ } }
77+ </ Pressable >
78+ </ View >
8279 ) ;
8380}
0 commit comments