@allthings/react-view
v2.0.0
Published
A fully flexed View component for React.
Downloads
3
Readme
react-view
A View
component heavily inspired by angular-material's layout.
Install
yarn add @allthings/react-view
Available properties
Property | Type | Possible values
--- | --- | ---
direction
| string | row
, column
alignH
| string | none
, start
, center
, end
, space-around
, space-between
alignV
| string | none
, start
, center
, end
, stretch
wrap
| string | inherit
, initial
, wrap
, nowrap
, wrap-reverse
fill
| bool | true
, false
flex
| string/int | none
, flex
, nogrow
, grow
, initial
, auto
, noshrink
, 5
, 10
, 15
, 20
, 25
, 30
, 35
, 40
, 45
, 50
, 55
, 60
, 65
, 70
, 75
, 80
, 95
, 90
, 100
, 33
, 66
Example usage
const styles = {
background: '#bada55',
padding: 10
}
const ExampleComponent = props => (
<View
direction="row"
alignH="center"
alignV="center"
wrap="wrap"
style={styles}
>
Hello World!
</View>
)