@akbeniwal/react-native-hooks 1.0.0 → 1.0.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +19 -19
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
# react-native-hooks ⚡
|
|
1
|
+
# @akbeniwal/react-native-hooks ⚡
|
|
2
2
|
|
|
3
3
|
A high-performance, lightweight, and type-safe collection of **16 custom React Native hooks** optimized for performance, memory-leak prevention, and smooth 60fps UX.
|
|
4
4
|
|
|
@@ -17,9 +17,9 @@ A high-performance, lightweight, and type-safe collection of **16 custom React N
|
|
|
17
17
|
## Installation 📦
|
|
18
18
|
|
|
19
19
|
```bash
|
|
20
|
-
npm install react-native-hooks
|
|
20
|
+
npm install @akbeniwal/react-native-hooks
|
|
21
21
|
# or
|
|
22
|
-
yarn add react-native-hooks
|
|
22
|
+
yarn add @akbeniwal/react-native-hooks
|
|
23
23
|
```
|
|
24
24
|
|
|
25
25
|
---
|
|
@@ -51,7 +51,7 @@ yarn add react-native-hooks
|
|
|
51
51
|
|
|
52
52
|
### useAppState
|
|
53
53
|
```tsx
|
|
54
|
-
import { useAppState } from 'react-native-hooks';
|
|
54
|
+
import { useAppState } from '@akbeniwal/react-native-hooks';
|
|
55
55
|
|
|
56
56
|
const appState = useAppState({
|
|
57
57
|
onForeground: () => console.log('App entered foreground!'),
|
|
@@ -61,7 +61,7 @@ const appState = useAppState({
|
|
|
61
61
|
|
|
62
62
|
### useBackHandler
|
|
63
63
|
```tsx
|
|
64
|
-
import { useBackHandler } from 'react-native-hooks';
|
|
64
|
+
import { useBackHandler } from '@akbeniwal/react-native-hooks';
|
|
65
65
|
|
|
66
66
|
useBackHandler(() => {
|
|
67
67
|
// Return true to prevent default back action
|
|
@@ -75,7 +75,7 @@ useBackHandler(() => {
|
|
|
75
75
|
|
|
76
76
|
### useClipboard
|
|
77
77
|
```tsx
|
|
78
|
-
import { useClipboard } from 'react-native-hooks';
|
|
78
|
+
import { useClipboard } from '@akbeniwal/react-native-hooks';
|
|
79
79
|
|
|
80
80
|
const [clipboardData, setString] = useClipboard({
|
|
81
81
|
onCopy: (text) => console.log(`Copied "${text}" to clipboard!`),
|
|
@@ -84,7 +84,7 @@ const [clipboardData, setString] = useClipboard({
|
|
|
84
84
|
|
|
85
85
|
### useCountdown
|
|
86
86
|
```tsx
|
|
87
|
-
import { useCountdown } from 'react-native-hooks';
|
|
87
|
+
import { useCountdown } from '@akbeniwal/react-native-hooks';
|
|
88
88
|
|
|
89
89
|
const { seconds, isActive, start, pause, reset } = useCountdown({
|
|
90
90
|
initialSeconds: 60,
|
|
@@ -95,7 +95,7 @@ const { seconds, isActive, start, pause, reset } = useCountdown({
|
|
|
95
95
|
|
|
96
96
|
### useDebounce
|
|
97
97
|
```tsx
|
|
98
|
-
import { useDebounce } from 'react-native-hooks';
|
|
98
|
+
import { useDebounce } from '@akbeniwal/react-native-hooks';
|
|
99
99
|
|
|
100
100
|
const [searchQuery, setSearchQuery] = useState('');
|
|
101
101
|
const debouncedQuery = useDebounce(searchQuery, 500, (value) => {
|
|
@@ -105,7 +105,7 @@ const debouncedQuery = useDebounce(searchQuery, 500, (value) => {
|
|
|
105
105
|
|
|
106
106
|
### useKeyboard
|
|
107
107
|
```tsx
|
|
108
|
-
import { useKeyboard } from 'react-native-hooks';
|
|
108
|
+
import { useKeyboard } from '@akbeniwal/react-native-hooks';
|
|
109
109
|
|
|
110
110
|
const { keyboardShown, keyboardHeight } = useKeyboard({
|
|
111
111
|
onShow: (height) => console.log(`Keyboard visible with height: ${height}`),
|
|
@@ -115,7 +115,7 @@ const { keyboardShown, keyboardHeight } = useKeyboard({
|
|
|
115
115
|
|
|
116
116
|
### useNetworkStatus
|
|
117
117
|
```tsx
|
|
118
|
-
import { useNetworkStatus } from 'react-native-hooks';
|
|
118
|
+
import { useNetworkStatus } from '@akbeniwal/react-native-hooks';
|
|
119
119
|
|
|
120
120
|
const {
|
|
121
121
|
isConnected,
|
|
@@ -134,7 +134,7 @@ const {
|
|
|
134
134
|
|
|
135
135
|
### usePrevious
|
|
136
136
|
```tsx
|
|
137
|
-
import { usePrevious } from 'react-native-hooks';
|
|
137
|
+
import { usePrevious } from '@akbeniwal/react-native-hooks';
|
|
138
138
|
|
|
139
139
|
const [count, setCount] = useState(0);
|
|
140
140
|
const prevCount = usePrevious(count); // returns count from previous render
|
|
@@ -142,14 +142,14 @@ const prevCount = usePrevious(count); // returns count from previous render
|
|
|
142
142
|
|
|
143
143
|
### useThrottle
|
|
144
144
|
```tsx
|
|
145
|
-
import { useThrottle } from 'react-native-hooks';
|
|
145
|
+
import { useThrottle } from '@akbeniwal/react-native-hooks';
|
|
146
146
|
|
|
147
147
|
const throttledScrollY = useThrottle(scrollY, 100);
|
|
148
148
|
```
|
|
149
149
|
|
|
150
150
|
### useToggle
|
|
151
151
|
```tsx
|
|
152
|
-
import { useToggle } from 'react-native-hooks';
|
|
152
|
+
import { useToggle } from '@akbeniwal/react-native-hooks';
|
|
153
153
|
|
|
154
154
|
const [isModalOpen, toggleModal] = useToggle(false, {
|
|
155
155
|
onTrue: () => console.log('Modal Opened'),
|
|
@@ -159,7 +159,7 @@ const [isModalOpen, toggleModal] = useToggle(false, {
|
|
|
159
159
|
|
|
160
160
|
### useAfterInteractions
|
|
161
161
|
```tsx
|
|
162
|
-
import { useAfterInteractions } from 'react-native-hooks';
|
|
162
|
+
import { useAfterInteractions } from '@akbeniwal/react-native-hooks';
|
|
163
163
|
|
|
164
164
|
const interactionsFinished = useAfterInteractions(() => {
|
|
165
165
|
loadExpensiveChartData();
|
|
@@ -168,7 +168,7 @@ const interactionsFinished = useAfterInteractions(() => {
|
|
|
168
168
|
|
|
169
169
|
### useLayout
|
|
170
170
|
```tsx
|
|
171
|
-
import { useLayout } from 'react-native-hooks';
|
|
171
|
+
import { useLayout } from '@akbeniwal/react-native-hooks';
|
|
172
172
|
import { View } from 'react-native';
|
|
173
173
|
|
|
174
174
|
const [layout, onLayout] = useLayout({
|
|
@@ -180,7 +180,7 @@ return <View onLayout={onLayout} />;
|
|
|
180
180
|
|
|
181
181
|
### useDoubleTapToExit
|
|
182
182
|
```tsx
|
|
183
|
-
import { useDoubleTapToExit } from 'react-native-hooks';
|
|
183
|
+
import { useDoubleTapToExit } from '@akbeniwal/react-native-hooks';
|
|
184
184
|
|
|
185
185
|
// Setup on Android
|
|
186
186
|
useDoubleTapToExit('Press back button again to exit the app.');
|
|
@@ -188,7 +188,7 @@ useDoubleTapToExit('Press back button again to exit the app.');
|
|
|
188
188
|
|
|
189
189
|
### useDeviceOrientation
|
|
190
190
|
```tsx
|
|
191
|
-
import { useDeviceOrientation } from 'react-native-hooks';
|
|
191
|
+
import { useDeviceOrientation } from '@akbeniwal/react-native-hooks';
|
|
192
192
|
|
|
193
193
|
const orientation = useDeviceOrientation((currentOrientation) => {
|
|
194
194
|
console.log('Orientation changed to:', currentOrientation);
|
|
@@ -197,7 +197,7 @@ const orientation = useDeviceOrientation((currentOrientation) => {
|
|
|
197
197
|
|
|
198
198
|
### useInterval
|
|
199
199
|
```tsx
|
|
200
|
-
import { useInterval } from 'react-native-hooks';
|
|
200
|
+
import { useInterval } from '@akbeniwal/react-native-hooks';
|
|
201
201
|
|
|
202
202
|
useInterval(() => {
|
|
203
203
|
// Increments or processes state safely without stale closures
|
|
@@ -207,7 +207,7 @@ useInterval(() => {
|
|
|
207
207
|
|
|
208
208
|
### useTimeout
|
|
209
209
|
```tsx
|
|
210
|
-
import { useTimeout } from 'react-native-hooks';
|
|
210
|
+
import { useTimeout } from '@akbeniwal/react-native-hooks';
|
|
211
211
|
|
|
212
212
|
useTimeout(() => {
|
|
213
213
|
dismissBanner();
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@akbeniwal/react-native-hooks",
|
|
3
|
-
"version": "1.0.
|
|
3
|
+
"version": "1.0.1",
|
|
4
4
|
"description": "A high-performance collection of React Native hooks optimized for performance, memory safety and developer experience.",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|