@umituz/react-native-design-system 4.27.6 → 4.27.7
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
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@umituz/react-native-design-system",
|
|
3
|
-
"version": "4.27.
|
|
3
|
+
"version": "4.27.7",
|
|
4
4
|
"description": "Universal design system for React Native apps - Consolidated package with atoms, molecules, organisms, theme, typography, responsive, safe area, exception, infinite scroll, UUID, image, timezone, offline, onboarding, and loading utilities - TanStack persistence and expo-image-manipulator now lazy loaded",
|
|
5
5
|
"main": "./src/index.ts",
|
|
6
6
|
"types": "./dist/index.d.ts",
|
|
@@ -1,46 +0,0 @@
|
|
|
1
|
-
---
|
|
2
|
-
description: Sets up or updates the @umituz/react-native-design-system package in a React Native app with its components and tokens.
|
|
3
|
-
---
|
|
4
|
-
|
|
5
|
-
# Design System Setup Skill
|
|
6
|
-
|
|
7
|
-
When this workflow/skill is invoked, follow these explicit instructions to configure `@umituz/react-native-design-system`.
|
|
8
|
-
|
|
9
|
-
## Step 1: Check and Update `package.json`
|
|
10
|
-
- Analyze the project's `package.json`.
|
|
11
|
-
- Check if `@umituz/react-native-design-system` exists.
|
|
12
|
-
- If missing: Install with `npm install @umituz/react-native-design-system`.
|
|
13
|
-
- If outdated: Update it to the latest version.
|
|
14
|
-
|
|
15
|
-
## Step 2: Install Required Peer Dependencies
|
|
16
|
-
The design system heavily relies on Expo modules, Gesture Handler, and core UI dependencies. Check & install missing peer dependencies (use `npx expo install` for Expo packages):
|
|
17
|
-
- `expo-font`, `expo-asset`, `expo-haptics`, `expo-clipboard`, `expo-device`, `expo-network`, `expo-secure-store`
|
|
18
|
-
- `react-native-gesture-handler`
|
|
19
|
-
- `react-native-safe-area-context`
|
|
20
|
-
- `react-native-svg`
|
|
21
|
-
- `@gorhom/portal` (if used in app)
|
|
22
|
-
- `@tanstack/react-query` & `zustand`
|
|
23
|
-
|
|
24
|
-
// turbo
|
|
25
|
-
## Step 3: Native Setup (If bare React Native)
|
|
26
|
-
If the project structure indicates an iOS build folder is present, run:
|
|
27
|
-
```bash
|
|
28
|
-
cd ios && pod install
|
|
29
|
-
```
|
|
30
|
-
|
|
31
|
-
## Step 4: Setup Initialization & Boilerplate
|
|
32
|
-
- Locate the main entry point (e.g., `App.tsx`, `app/_layout.tsx`, or a primary wrapper).
|
|
33
|
-
- Wrap the app with `DesignSystemProvider`.
|
|
34
|
-
- **CRITICAL NOTE:** DO NOT use barrel imports (direct `@umituz/react-native-design-system`). Use sub-path imports instead.
|
|
35
|
-
```typescript
|
|
36
|
-
import { DesignSystemProvider } from '@umituz/react-native-design-system/theme';
|
|
37
|
-
|
|
38
|
-
// Inside App Root
|
|
39
|
-
<DesignSystemProvider>
|
|
40
|
-
{children}
|
|
41
|
-
</DesignSystemProvider>
|
|
42
|
-
```
|
|
43
|
-
- If fonts need to be loaded, ensure the app's loading phase properly waits for `expo-font` before rendering the main UI.
|
|
44
|
-
|
|
45
|
-
## Step 5: Summary
|
|
46
|
-
Output what was done: the packages updated, peer dependencies installed, and files modified to inject the `DesignSystemProvider`.
|