@gluestack-ui/nativewind-utils v1.0.14
@gluestack-ui/nativewind-utils
A utility function package for @gluestack-ui/nativewind
Installation
To install the component, run the following command in your terminal. This will add the component to your project's dependencies and allow you to use it in your project.
npx install @gluestack-ui/nativewind-utils
Usage
// import the tva
import { tva } from '@gluestack-ui/nativewind-utils';
// Understanding the API
const buttonStyle = tva({
base: 'bg-primary-500',
variants: {
size: {
lg: 'w-6 h-6',
md: 'w-5 h-5',
sm: 'w-4 h-4',
},
},
});
const buttonText = tva({
base: 'text-white',
parentVariants: {
size: {
lg: 'text-lg',
md: 'text-md',
sm: 'text-sm',
},
},
});
// Using the in component
export default ({ size, ...props }) => (
<Pressable className={buttonStyle({ size })} {...props}>
<Text className={buttonText({ parentVariants: { size } })}>
Hello World!
</Text>
</Pressable>
);
11 hours ago
11 hours ago
8 days ago
13 days ago
14 days ago
14 days ago
14 days ago
14 days ago
14 days ago
14 days ago
14 days ago
14 days ago
15 days ago
15 days ago
15 days ago
15 days ago
15 days ago
15 days ago
15 days ago
15 days ago
15 days ago
15 days ago
15 days ago
15 days ago
15 days ago
15 days ago
15 days ago
15 days ago
15 days ago
15 days ago
15 days ago
15 days ago
15 days ago
16 days ago
16 days ago
16 days ago
16 days ago
16 days ago
15 days ago
1 month ago
1 month ago
1 month ago
1 month ago
1 month ago
1 month ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
2 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago
3 months ago