npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

@react-pakistan/react-native-ui-collection

v2.9.2

Published

React Native UI Collection built upon React StoryBook

Downloads

50

Readme

📌 React Pakistan 🔥🔥🔥

React Pakistan is an OpenSource & Free Software (FOSS) platform, creating React software solutions for the global community. ⭐⭐⭐

📌 React Native UI Collection ✌

A generic to specific, UI/UX library for React Native apps, following modern approach by building your project's UI in isolation using state of the art Storybook along with React.

📌 Table of Contents 🚀

📌 Demo 🚀

Checkout React Native UI Collection

📌 Technology Stack 🚀

📌 Installation 🚀

  • Clone the repo
  • Cd into the project folder
  • Figure out which package manager you have on your system, then run following commands for their specific use cases.
  // to install dependencies
  yarn
  // to install pods
  yarn pod:install
  // to run app on iOS simulator
  yarn ios
  // to run app on Android simulator
  yarn android
  // to run all tests locally
  yarn test

OR

  // to install dependencies
  npm
  // to install pods
  npm run pod:install
  // to run app on iOS simulator
  npm run ios
  // to run app on Android simulator
  npm run android
  // to run all tests locally
  npm test

📌 Usage 🚀

Add React Native UI Collection to your project.

  yarn add @react-pakistan/react-native-ui-collection

OR

  npm install @react-pakistan/react-native-ui-collection

Add React Native UI Collection base theme to your project.

  yarn add @react-pakistan/util-react-native-functions

OR

  npm install @react-pakistan/util-react-native-functions

Refer to React Pakistan Docs for detail usage docs.

📌 Styles 🚀

Styled Components are employed to maintain and update theme for this project. Please consider adding Styled Component Provider wrapper to the entry point of your application, following is the sample code. You could either use the default theme as shown below or wire your custom theme object instead.

  import { ThemeProvider } from 'styled-components';
  import { theme } from '@react-pakistan/util-react-native-functions';

  <ThemeProvider theme={theme}>
    <App />
  </ThemeProvider>

📌 Tested 🚀

We aim to achieve 100% coverage and we shall...

React Commons Collection Badge Branches React Commons Collection Badge Functions React Commons Collection Badge Lines React Commons Collection Badge Statements

Should you like this project and would like to see more coming in future, please consider giving a ⭐ on Github project repo.

📌 Contributors 🚀

Thanks goes to these wonderful people (emoji key):

| Contributors | GitHub | Emoji | | ------------- |:-------------:|:-----:| | | Taimoor Khan | 🎨🤔🚧📆👀⚠️ |

📌 Other Libraries from ReactPakistan 🚀

📌 Support 🚀

If you need any help or have any question, please feel free to join ReactPakistan community at React Pakistan Slack.

📌 Contact 🚀

I can be reachable via Taimoor Web or else should you wish to send over an expression of your interest to contribute towards ReactPakistan, please shoot an email.

📌 Buy me Coffee 🚀