@impulse-ui-native/primitives 2.0.0 → 2.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 +41 -0
- package/package.json +6 -6
package/README.md
ADDED
|
@@ -0,0 +1,41 @@
|
|
|
1
|
+
# @impulse-ui-native/primitives
|
|
2
|
+
|
|
3
|
+
Token-aware React Native building blocks used directly by applications and by the higher-level Impulse UI Native packages.
|
|
4
|
+
|
|
5
|
+
## Installation
|
|
6
|
+
|
|
7
|
+
```sh
|
|
8
|
+
pnpm add @impulse-ui-native/primitives
|
|
9
|
+
```
|
|
10
|
+
|
|
11
|
+
Render primitives inside `ThemeProvider` from `@impulse-ui-native/theme`.
|
|
12
|
+
|
|
13
|
+
## Main exports
|
|
14
|
+
|
|
15
|
+
- `View` adds theme spacing, dimensions, flex, borders, colors, and shadow props to React Native's view.
|
|
16
|
+
- `SafeAreaView` maps safe-area edges to the theme spacing scale.
|
|
17
|
+
- `Typography` exposes named text presets such as `DisplayLarge`, `Title1`, `Body`, `Caption`, and `Code`.
|
|
18
|
+
- `Button`, `IconButton`, `Pressable`, and `Tag` provide themed interaction primitives.
|
|
19
|
+
- `Control` is a compound control system with `Provider`, `Root`, `Label`, `Container`, `Addon`, `Input`, `Placeholder`, `Value`, `Loader`, and `Error` parts.
|
|
20
|
+
- `createPreset` creates reusable themed typography presets.
|
|
21
|
+
- Public prop types describe every primitive and control part.
|
|
22
|
+
|
|
23
|
+
## Example
|
|
24
|
+
|
|
25
|
+
```tsx
|
|
26
|
+
import { Button, Tag, Typography, View } from "@impulse-ui-native/primitives";
|
|
27
|
+
|
|
28
|
+
export function ProfileSummary() {
|
|
29
|
+
return (
|
|
30
|
+
<View gap="md" padding="lg">
|
|
31
|
+
<Typography.Title3>Profile</Typography.Title3>
|
|
32
|
+
<Tag label="Active" color="success" />
|
|
33
|
+
<Button variant="filled" onPress={() => {}}>
|
|
34
|
+
Continue
|
|
35
|
+
</Button>
|
|
36
|
+
</View>
|
|
37
|
+
);
|
|
38
|
+
}
|
|
39
|
+
```
|
|
40
|
+
|
|
41
|
+
Use the compound `Control` when building a custom field that should share the same label, addon, error, size, and variant behavior as `Input` and `Select`.
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@impulse-ui-native/primitives",
|
|
3
|
-
"version": "2.0.
|
|
3
|
+
"version": "2.0.1",
|
|
4
4
|
"source": "src/index.ts",
|
|
5
5
|
"module": "dist/index.js",
|
|
6
6
|
"types": "dist/index.d.mts",
|
|
@@ -18,9 +18,9 @@
|
|
|
18
18
|
"LICENSE"
|
|
19
19
|
],
|
|
20
20
|
"dependencies": {
|
|
21
|
-
"@impulse-ui-native/theme": "2.0.
|
|
22
|
-
"@impulse-ui-native/core": "2.0.
|
|
23
|
-
"@impulse-ui-native/icon": "2.0.
|
|
21
|
+
"@impulse-ui-native/theme": "2.0.1",
|
|
22
|
+
"@impulse-ui-native/core": "2.0.1",
|
|
23
|
+
"@impulse-ui-native/icon": "2.0.1"
|
|
24
24
|
},
|
|
25
25
|
"devDependencies": {
|
|
26
26
|
"@types/react": "~19.2.14",
|
|
@@ -31,8 +31,8 @@
|
|
|
31
31
|
"react-native-safe-area-context": "~5.6.0",
|
|
32
32
|
"typescript": "~5.9.2",
|
|
33
33
|
"@impulse-ui-native/prettier-config": "1.0.0",
|
|
34
|
-
"@impulse-ui-native/
|
|
35
|
-
"@impulse-ui-native/
|
|
34
|
+
"@impulse-ui-native/tsconfig": "1.0.0",
|
|
35
|
+
"@impulse-ui-native/eslint-config": "1.0.0"
|
|
36
36
|
},
|
|
37
37
|
"peerDependencies": {
|
|
38
38
|
"react": ">=18",
|