@morfeo/native

!Morfeo logo

morfeo is a framework-agnostic set of tools that will help you to build your next design system based on a single source of truth: the theme.

---

Documentation | API | Contributing | 

---

@morfeo/native package is brings to React Native the morfeo's eco system

Installation

with npm:

``bash
npm install @morfeo/native
`

or yarn:

`bash
yarn add @morfeo/native
`

Usage

Just like @morfeo/react, the API of this package is the same as @morfeo/hooks, the main differences between @morfeo/react and @morfeo/native are related to how the parsers converts style objects to valid style for React Native, for example in @morfeo/native there you cannot use any pseudo element/class and shadows output is different (shadowOffset, shadowColor, shadowOpacity and shadowRadius instead of boxShadow)

`tsx
import { View, ViewProps } from 'react-native';
import { useStyle, Style } from '@morfeo/native';

type Props = Omit & {
style?: Style;
};

const CustomView: React.FC = ({ ...props, style }) => {
const parsedStyle = useStyle(style);
return ;
};

const App = () => {
return (
style={{
bg: 'primary',
px: 'm',
corner: 's',
shadow: 'strong',
}}
/>
);
};
``