Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/Groszczu/use-auto-focus-inputs
Single react-native hook to manage auto focus of TextInput
https://github.com/Groszczu/use-auto-focus-inputs
auto-focus hooks react-native textinput
Last synced: 3 months ago
JSON representation
Single react-native hook to manage auto focus of TextInput
- Host: GitHub
- URL: https://github.com/Groszczu/use-auto-focus-inputs
- Owner: Groszczu
- License: mit
- Created: 2021-08-05T09:41:51.000Z (over 3 years ago)
- Default Branch: main
- Last Pushed: 2022-11-30T02:26:38.000Z (about 2 years ago)
- Last Synced: 2024-10-30T01:39:50.463Z (4 months ago)
- Topics: auto-focus, hooks, react-native, textinput
- Language: TypeScript
- Homepage: https://www.npmjs.com/package/use-auto-focus-inputs
- Size: 4.32 MB
- Stars: 40
- Watchers: 2
- Forks: 1
- Open Issues: 1
-
Metadata Files:
- Readme: README.md
- Changelog: CHANGELOG.md
- License: LICENSE
Awesome Lists containing this project
README
# use-auto-focus-inputs
Single react-native hook to manage auto focus of text inputs
[![GitHub stars](https://img.shields.io/github/stars/Groszczu/use-auto-focus-inputs?style=social)](https://github.com/Groszczu/use-auto-focus-inputs/)
[![GitHub CI](https://github.com/Groszczu/use-auto-focus-inputs/actions/workflows/release.yml/badge.svg)](https://github.com/Groszczu/use-auto-focus-inputs/actions?query=workflow%3A%22release%22)
![Version](https://img.shields.io/github/package-json/v/Groszczu/use-auto-focus-inputs)
[![Minizipped size](https://img.shields.io/bundlephobia/minzip/use-auto-focus-inputs)](https://bundlephobia.com/package/[email protected])
[![contributions welcome](https://img.shields.io/badge/contributions-welcome-brightgreen.svg)](https://github.com/Groszczu/use-auto-focus-inputs/issues)## Features
- One, headless hook
- Written with Typescipt
- Integration with UI libraries
- No extra dependencies## Install
npm install use-auto-focus-inputs
## Quickstart
```jsx
import * as React from 'react';
import {TextInput, View} from 'react-native';
import useAutoFocusInputs from 'use-auto-focus-inputs';function App() {
const [firstName, setFirstName] = React.useState('');
const [lastName, setLastName] = React.useState('');
const [email, setEmail] = React.useState('');const getAutoFocusableInputProps = useAutoFocusInputs();
return (
);
}
```## Demo
![]()
Check out example project on
[expo snack](https://snack.expo.dev/@groszczu/use-auto-focus-inputs).## Contribution
Suggestions and PR-s are welcome!