@css-ui/rn

styld props react-native components support alias

Usage

import React from 'react'
import {View, Text, Button, SearchBar} from '@css-ui/rn'

const App = () => {
  return (
    <View flex={1} bg="black" alignItems="center">
      <SearchBar onSearch={text => console.log(text)}/>
      <Text color="white" fontSize="22">Welcome to @css-ui/nr </Text>
      <Button 
        bg="blue"
        color="red"
        fontSize="22"
        border="5px solid green"
        size="150"
        borderRadius="10"
        onPress={() => console.log('PRESS')}
      >
      Press Me
      </Button>
    </View>
  )
}

export default App

##Alias

bg : backgroundColor
m  : margin
mt : marginTop
mr : marginRight
mb : marginBottom
ml : marginLeft
mx : marginX
my : marginY
p  : padding
pt : paddingTop
pr : paddingRight
pb : paddingBottom
pl : paddingLeft
px : paddingX
py : paddingY

##Context wrap your App inside a context and useValue() inside your components

<Context value={{state, dispatch}}>
   <YourRootApp />
</Context>
//your component
const YourComponent = () => {
  const { state, dispatch} = useValue()
  return (<Text>{state.data}</Text>)
}