React Native UI Components

React Native Stuff is a mobile-first, accessible component library for building a consistent design system across android & iOS.Its collection of high-quality UI components for React Native mobile apps.

Table of Contents

• Introduction
• Motivation
• Features
• Dependencies
• Installation
• Components
• Properties
• Contributors
• Contact
• License

1.Introduction?

A collection of high-quality UI components for React Native mobile apps, designed to help you build amazing apps quickly and easily. This package provides both basic and advanced components, including buttons, inputs, forms, navigation, and more.

2.Motivation

"Empowering developers with reusable components and streamlining their workflow" "Building a library of commonly used components to save time and effort for the community" "Making a lasting impact on the React Native ecosystem by sharing your skills and knowledge" "Improving consistency and reliability in projects by using a centralized library of components" "Being a part of something greater and contributing to the growth and success of the React Native community".

3.Features

Available for Mobiles

React-Native-Stuff 1.0 is powered by ittechxpert so you can build consistent UIs across Web, Android and iOS.

Responsiveness Made Easy

Instead of manually adding responsiveness, React-Native-Stuff 1.0 allows you to provide object and array values to add responsive styles.

Highly Personalizable

Highly Personalizable is one of the core elements of React Native Stuff. You can customise your app theme and component styles to your development used content.

4.Dependencies

React Native Bare, Expo Cli

5.Installation

yarn add react-native-stuff
&
npm i react-native-stuff

6.Components

React-Native-Stuff 1.0 is a Intro component library with nearly 5 basic components.

7.Properties

Btn

import React from "react";
import { StyleSheet } from "react-native";
import Btn from "react-native-stuff";

const Login = () => {
  return (
    <>
      <Btn BgColor="warning" title={"Login"} />
    </>
  );
};

| Property | Type | Description | | ------------- | --------- | ----------------------------- | | onPress | any | Make any Event fire | | disabled | boolean | Make your Btn disabled or nor | | buttonStyle | any | Style your Btn | | textStyle | any | Style your Btn's text | | title | any | Show your title |

Default Props

| Property | Type | Description | | ---------- | --------- | ----------- | | disabled | boolean | false |

Badge

import React from "react";
import { StyleSheet } from "react-native";
import Badge from "react-native-stuff";

const Login = () => {
  return (
    <>
      <Badge fillBg={false} Boundry={"success"} description={"New Feature"} />
    </>
  );
};

| Property | Type | Description | | ------------- | --------- | ----------------------- | | boundry | string | only if fillBg is false | | fillBg | boolean | Show BGColor or nor | | description | any | Description for badge | | badgeStyle | any | Style your Badge | | textStyle | any | Style your Badge's text | | BgColor | String | Direct BgColor change |

Default Props

| Property | Type | Description | | -------- | --------- | ----------- | | fillBg | boolean | true |

8.Contributors

Code Contributors

This project exists thanks to all the people who contribute.

9.Contact

• Linkdin: Follow us on Linkdin
• YouTube: Subscribe to our channel
• Twitter: Follow us on Twitter

10.License

This project is licensed under the MIT License - see the Licenses file for details.