open-index/open-npm huggingface dataset:
npm package: @hariombangari/react-components
Description: A collection of reusable React components
Author: hariombangari
Latest version: 0.0.2

# Vite React Component Library Starter

This is a starter template for creating React component libraries using Vite. It includes a robust set of features to help you develop, test, and build your library efficiently.

## Features

- React: A JavaScript library for web and native user interfaces.
- TypeScript: A strongly typed superset of JavaScript.
- Tailwind: A utility-first CSS framework.
- Storybook: A frontend workshop for building UI components and pages in isolation.
- Vite: A next generation frontend tooling that runs and builds your library incredibly fast.
- Vitest: A next generation testing framework.
- ESLint: A tool that finds and fixes problems in your code.
- Prettier: A code formatter.
- Husky: A pre-commit hook.
- Github Action: A tool that deploys your Storybook to GitHub page automatically.

## Get Started

1. Clone this repository
2. Install dependencies using `pnpm i` (or `npm i` if you like)

## Scripts

- `dev`: Starts the local Storybook server, use this to develop and preview your components.
- `test`: Runs all your tests with vitest.
- `test:watch`: Runs tests in watch mode.
- `build`: Builds your Storybook as a static web application.
- `build:lib`: Builds your component library with Vite.
- `lint`: Runs ESLint.
- `format`: Formats your code with Prettier.

## License

MIT
npm package: @haripriya.kalamata/loginscreen
Description: A react native component for LoginPage
Author: Haripriya
Latest version: 1.0.4

# listscreen
react native login screen

Usage
------------------
<h3>Example</h3>

<pre>
import LoginScreen from '@haripriya.kalamata/loginscreen';  
</pre>

    
        
       <LoginScreen    
             backend_fetch_link='your-url'
          />
         
 
 Check out the <a href="https://snack.expo.io/rkPagvsWB">example project</a> for more examples.
 
 Props
 -----
 <table border="1" width="500">
<tr>
<th>props</th>
<th>description</th>
<th>default</th>
<th>example</th>
</tr>  
<tr>
<td>name</td>
<td>this name will display as title</td>
<td>-</td>
<td>name='Estatse'</td>
</tr>
<tr>
<td>background_image_url</td>
<td>this name will set a background image for screen</td>
<td>-</td>
<td>background_image_url= {{uri: 'https://aboutreact.com/wp-content/uploads/2018/08/8f17765c523f5b75f3dc60ae145e9df7.jpg',}}</td>
</tr>
<tr>
<td>logo_source</td>
<td>this name will set a logo for screen</td>
<td>-</td>
<td>logo_source={require("<example.png>")} </td>
</tr>
</table>
           
      
License
-------
The library is released under the MIT licence. For more information see <code>LICENSE</code>.
npm package: @haripriya.kalamata/tiny
Description: A react native component with search option in list
Author: Haripriya
Latest version: 6.0.1

example
-------
<pre>

import React from 'react';
import { Text, View, StyleSheet } from 'react-native';
import ListSearch from '@haripriya.kalamata/tiny';

export default class App extends React.Component {
   constructor(props) {
    super(props)
  }
render() {
    return ( 
    </pre>
     <View style={styles.container}>
       <ListSearch    
             list_json_url = 'https://api.myjson.com/bins/1cjvh3'                  
                              /*save the json with name myjson & 
                              searchable item key as title */
             displayItems={({ item }) => <Text>{item.title},{item.email}</Text>}
             uniqueKey={({ name }, index) => name} 
          />
      </View>   
   <pre>
    );
  }
}

const styles = StyleSheet.create({
  container: {
    flex: 1,
    justifyContent: 'center',
    backgroundColor: '#ecf0f1',
    padding: 8,
  },
});

</pre>