({
flex,
gap,
alignHorizontal = 'start',
alignVertical = 'stretch',
width,
height,
padding,
margin,
backgroundColor,
children,
})
| 24 | }>; |
| 25 | |
| 26 | export const HStack: FC<Props> = ({ |
| 27 | flex, |
| 28 | gap, |
| 29 | alignHorizontal = 'start', |
| 30 | alignVertical = 'stretch', |
| 31 | width, |
| 32 | height, |
| 33 | padding, |
| 34 | margin, |
| 35 | backgroundColor, |
| 36 | children, |
| 37 | }) => ( |
| 38 | <View |
| 39 | style={[ |
| 40 | styles.base, |
| 41 | styles[`justify-${alignHorizontal}`], |
| 42 | styles[`align-${alignVertical}`], |
| 43 | { |
| 44 | flex, |
| 45 | gap, |
| 46 | width, |
| 47 | height, |
| 48 | paddingTop: padding?.top, |
| 49 | paddingRight: padding?.right, |
| 50 | paddingBottom: padding?.bottom, |
| 51 | paddingLeft: padding?.left, |
| 52 | marginTop: margin?.top, |
| 53 | marginRight: margin?.right, |
| 54 | marginBottom: margin?.bottom, |
| 55 | marginLeft: margin?.left, |
| 56 | backgroundColor, |
| 57 | }, |
| 58 | ]} |
| 59 | > |
| 60 | {children} |
| 61 | </View> |
| 62 | ); |
| 63 | |
| 64 | const styles = StyleSheet.create({ |
| 65 | base: { |
nothing calls this directly
no outgoing calls
no test coverage detected