@umituz/react-native-loading 1.2.1 → 1.2.2
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/package.json +4 -5
- package/README.md +0 -111
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@umituz/react-native-loading",
|
|
3
|
-
"version": "1.2.
|
|
3
|
+
"version": "1.2.2",
|
|
4
4
|
"description": "Loading states and animations for React Native apps with breathing animations, skeleton loaders, and state management hooks",
|
|
5
5
|
"main": "./src/index.ts",
|
|
6
6
|
"types": "./src/index.ts",
|
|
@@ -28,15 +28,14 @@
|
|
|
28
28
|
"url": "https://github.com/umituz/react-native-loading"
|
|
29
29
|
},
|
|
30
30
|
"peerDependencies": {
|
|
31
|
-
"@umituz/react-native-design-system": "
|
|
31
|
+
"@umituz/react-native-design-system": "latest",
|
|
32
32
|
"react": ">=18.2.0",
|
|
33
33
|
"react-native": ">=0.74.0"
|
|
34
34
|
},
|
|
35
35
|
"devDependencies": {
|
|
36
36
|
"@types/react": "^18.2.45",
|
|
37
37
|
"@types/react-native": "^0.73.0",
|
|
38
|
-
"@umituz/react-native-design-system": "
|
|
39
|
-
"@umituz/react-native-design-system-theme": "latest",
|
|
38
|
+
"@umituz/react-native-design-system": "latest",
|
|
40
39
|
"react": "^18.2.0",
|
|
41
40
|
"react-native": "^0.74.0",
|
|
42
41
|
"typescript": "^5.3.3",
|
|
@@ -50,4 +49,4 @@
|
|
|
50
49
|
"README.md",
|
|
51
50
|
"LICENSE"
|
|
52
51
|
]
|
|
53
|
-
}
|
|
52
|
+
}
|
package/README.md
DELETED
|
@@ -1,111 +0,0 @@
|
|
|
1
|
-
# @umituz/react-native-loading
|
|
2
|
-
|
|
3
|
-
Loading states and animations for React Native apps with breathing animations, skeleton loaders, and state management hooks.
|
|
4
|
-
|
|
5
|
-
## Installation
|
|
6
|
-
|
|
7
|
-
```bash
|
|
8
|
-
npm install @umituz/react-native-loading
|
|
9
|
-
```
|
|
10
|
-
|
|
11
|
-
## Peer Dependencies
|
|
12
|
-
|
|
13
|
-
- `react` >= 18.2.0
|
|
14
|
-
- `react-native` >= 0.74.0
|
|
15
|
-
- `@umituz/react-native-design-system` >= 1.5.0
|
|
16
|
-
|
|
17
|
-
## Features
|
|
18
|
-
|
|
19
|
-
- ✅ Breathing animation loading state (meditation-inspired)
|
|
20
|
-
- ✅ Skeleton loaders with shimmer effect
|
|
21
|
-
- ✅ Loading state management hooks
|
|
22
|
-
- ✅ App-specific emoji presets
|
|
23
|
-
- ✅ Configurable sizes and patterns
|
|
24
|
-
|
|
25
|
-
## Usage
|
|
26
|
-
|
|
27
|
-
### Basic Loading State
|
|
28
|
-
|
|
29
|
-
```typescript
|
|
30
|
-
import { LoadingState, useLoading } from '@umituz/react-native-loading';
|
|
31
|
-
|
|
32
|
-
const MyScreen = () => {
|
|
33
|
-
const { isLoading, startLoading, stopLoading } = useLoading();
|
|
34
|
-
|
|
35
|
-
return (
|
|
36
|
-
<View>
|
|
37
|
-
{isLoading ? (
|
|
38
|
-
<LoadingState message="Loading..." />
|
|
39
|
-
) : (
|
|
40
|
-
<Content />
|
|
41
|
-
)}
|
|
42
|
-
</View>
|
|
43
|
-
);
|
|
44
|
-
};
|
|
45
|
-
```
|
|
46
|
-
|
|
47
|
-
### Skeleton Loader
|
|
48
|
-
|
|
49
|
-
```typescript
|
|
50
|
-
import { SkeletonLoader, useLoading } from '@umituz/react-native-loading';
|
|
51
|
-
|
|
52
|
-
const ListScreen = () => {
|
|
53
|
-
const { isLoading } = useLoading();
|
|
54
|
-
|
|
55
|
-
return (
|
|
56
|
-
<View>
|
|
57
|
-
{isLoading ? (
|
|
58
|
-
<SkeletonLoader pattern="list" count={5} />
|
|
59
|
-
) : (
|
|
60
|
-
<FlatList data={data} />
|
|
61
|
-
)}
|
|
62
|
-
</View>
|
|
63
|
-
);
|
|
64
|
-
};
|
|
65
|
-
```
|
|
66
|
-
|
|
67
|
-
### With Async Wrapper
|
|
68
|
-
|
|
69
|
-
```typescript
|
|
70
|
-
import { LoadingState, useLoading } from '@umituz/react-native-loading';
|
|
71
|
-
|
|
72
|
-
const DataScreen = () => {
|
|
73
|
-
const { isLoading, loadingMessage, withLoading } = useLoading();
|
|
74
|
-
|
|
75
|
-
const loadData = () => withLoading(
|
|
76
|
-
fetchData(),
|
|
77
|
-
'Loading data...'
|
|
78
|
-
);
|
|
79
|
-
|
|
80
|
-
return (
|
|
81
|
-
<View>
|
|
82
|
-
{isLoading && <LoadingState message={loadingMessage} />}
|
|
83
|
-
<Button onPress={loadData}>Load</Button>
|
|
84
|
-
</View>
|
|
85
|
-
);
|
|
86
|
-
};
|
|
87
|
-
```
|
|
88
|
-
|
|
89
|
-
## API
|
|
90
|
-
|
|
91
|
-
### Components
|
|
92
|
-
|
|
93
|
-
- `LoadingState`: Main loading component with breathing animation
|
|
94
|
-
- `SkeletonLoader`: Skeleton loader with shimmer effect
|
|
95
|
-
|
|
96
|
-
### Hooks
|
|
97
|
-
|
|
98
|
-
- `useLoading()`: Main loading state management hook
|
|
99
|
-
- `useSimpleLoading()`: Simplified loading hook
|
|
100
|
-
|
|
101
|
-
### Utilities
|
|
102
|
-
|
|
103
|
-
- `LOADING_EMOJIS`: App-specific emoji presets
|
|
104
|
-
- `SIZE_CONFIGS`: Size configuration presets
|
|
105
|
-
- `SKELETON_PATTERNS`: Skeleton loader patterns
|
|
106
|
-
- `LoadingUtils`: Utility functions for loading states
|
|
107
|
-
|
|
108
|
-
## License
|
|
109
|
-
|
|
110
|
-
MIT
|
|
111
|
-
|