Standardise around Yoga CSS and styled-system API

[macintoshhelper]

Support 100% of Yoga CSS API.

Support styled-system aliases with proposed system:

const useStyles = (styles) => {
  return useMemo(() => {
    const parsedStyles = parseStyles(styles);
    return StyleSheet.create(parsedStyles);
  }, styles);
};

const filterStyles = props => props.filter(prop => ['backgroundColor, 'color, 'fontSize'].includes(prop);
const filterProps = props => props.filter(prop => !['backgroundColor, 'color, 'fontSize'].includes(prop);

const Box = (props) => {
  const styles = filterStyles(props);
  const style = useStyles(styles);

  return <View style={style} {...filterProps(props)} />;
};

const mapping = {
  bg: backgroundColor,
  p: padding,
  pt: paddingTop,
  pb: paddingBottom,
  pl: paddingLeft,
  pr: paddingRight,
  m: margin,
  mt: marginTop,
  mb: marginBottom
// ...
};

const parseStylesheet = (styles) => {
  const parsedStyles = {};

  Object.entries(styles).forEach(([att, val]) => {
    if (mapping[att]) {
      parsedStyles[mapping[att]] = val;
    }
  });

  return parsedStyles;
}