react-native-nano-icons 0.1.7 → 0.1.8
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 +11 -11
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -1,9 +1,9 @@
|
|
|
1
1
|
<div align="center">
|
|
2
2
|
|
|
3
3
|
<picture>
|
|
4
|
-
<source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/software-mansion-labs/react-native-nano-icons/main/
|
|
5
|
-
<source media="(prefers-color-scheme: light)" srcset="https://raw.githubusercontent.com/software-mansion-labs/react-native-nano-icons/main/
|
|
6
|
-
<img alt="Nano Icons" src="https://raw.githubusercontent.com/software-mansion-labs/react-native-nano-icons/main/
|
|
4
|
+
<source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/software-mansion-labs/react-native-nano-icons/main/packages/react-native-nano-icons/docs/img/logo-nanoicons-inverted.svg">
|
|
5
|
+
<source media="(prefers-color-scheme: light)" srcset="https://raw.githubusercontent.com/software-mansion-labs/react-native-nano-icons/main/packages/react-native-nano-icons/docs/img/logo-nanoicons-default.svg">
|
|
6
|
+
<img alt="Nano Icons" src="https://raw.githubusercontent.com/software-mansion-labs/react-native-nano-icons/main/packages/react-native-nano-icons/docs/img/logo-nanoicons-default.svg">
|
|
7
7
|
</picture>
|
|
8
8
|
|
|
9
9
|
</div>
|
|
@@ -28,9 +28,9 @@ Drop your SVGs in a folder. Use them as a fully typed component by name.
|
|
|
28
28
|
That’s it 🔬⚡️
|
|
29
29
|
|
|
30
30
|
<picture>
|
|
31
|
-
<source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/software-mansion-labs/react-native-nano-icons/main/
|
|
32
|
-
<source media="(prefers-color-scheme: light)" srcset="https://raw.githubusercontent.com/software-mansion-labs/react-native-nano-icons/main/
|
|
33
|
-
<img alt="Nano Icons Platforms Showcase" src="https://raw.githubusercontent.com/software-mansion-labs/react-native-nano-icons/main/
|
|
31
|
+
<source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/software-mansion-labs/react-native-nano-icons/main/packages/react-native-nano-icons/docs/img/nano-icons-platforms-inverted.png">
|
|
32
|
+
<source media="(prefers-color-scheme: light)" srcset="https://raw.githubusercontent.com/software-mansion-labs/react-native-nano-icons/main/packages/react-native-nano-icons/docs/img/nano-icons-platforms-light.png">
|
|
33
|
+
<img alt="Nano Icons Platforms Showcase" src="https://raw.githubusercontent.com/software-mansion-labs/react-native-nano-icons/main/packages/react-native-nano-icons/docs/img/nano-icons-platforms-light.png">
|
|
34
34
|
</picture>
|
|
35
35
|
|
|
36
36
|
---
|
|
@@ -228,7 +228,7 @@ This makes the library well-suited for multicolor icons like country flags, bran
|
|
|
228
228
|
```
|
|
229
229
|
|
|
230
230
|
<div align="center">
|
|
231
|
-
<img alt="Multicolor icon example showing per-layer color overrides" src="https://raw.githubusercontent.com/software-mansion-labs/react-native-nano-icons/main/
|
|
231
|
+
<img alt="Multicolor icon example showing per-layer color overrides" src="https://raw.githubusercontent.com/software-mansion-labs/react-native-nano-icons/main/packages/react-native-nano-icons/docs/img/nano-icon-color-showcase.png" height="250">
|
|
232
232
|
</div>
|
|
233
233
|
<br>
|
|
234
234
|
|
|
@@ -264,7 +264,7 @@ We measured the average time to render a screen with identical set of 1,000 diff
|
|
|
264
264
|
> These libraries serve different primary purposes. `expo-image` is the go-to image library for photos and remote assets. `@expo/vector-icons` ships with many popular icon sets built in. `react-native-svg` handles the full SVG specification with fine-grained attribute control. We compare them here specifically on the use case of rendering many small, static icons.
|
|
265
265
|
|
|
266
266
|
<div align="center">
|
|
267
|
-
<img alt="Performance benchmark: time to render 1k icons" src="https://raw.githubusercontent.com/software-mansion-labs/react-native-nano-icons/main/
|
|
267
|
+
<img alt="Performance benchmark: time to render 1k icons" src="https://raw.githubusercontent.com/software-mansion-labs/react-native-nano-icons/main/packages/react-native-nano-icons/docs/img/nano-icons-benchmarks.png" width="900">
|
|
268
268
|
</div>
|
|
269
269
|
<br>
|
|
270
270
|
|
|
@@ -285,9 +285,9 @@ The chart shows time in milliseconds across three phases: **JS Thread** (JavaScr
|
|
|
285
285
|
## 🔧 Font Generation Pipeline
|
|
286
286
|
|
|
287
287
|
<picture>
|
|
288
|
-
<source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/software-mansion-labs/react-native-nano-icons/main/
|
|
289
|
-
<source media="(prefers-color-scheme: light)" srcset="https://raw.githubusercontent.com/software-mansion-labs/react-native-nano-icons/main/
|
|
290
|
-
<img alt="Nano Icons Pipeline" src="https://raw.githubusercontent.com/software-mansion-labs/react-native-nano-icons/main/
|
|
288
|
+
<source media="(prefers-color-scheme: dark)" srcset="https://raw.githubusercontent.com/software-mansion-labs/react-native-nano-icons/main/packages/react-native-nano-icons/docs/img/nano-icons-graph-inverted.png">
|
|
289
|
+
<source media="(prefers-color-scheme: light)" srcset="https://raw.githubusercontent.com/software-mansion-labs/react-native-nano-icons/main/packages/react-native-nano-icons/docs/img/nano-icons-graph-light.png">
|
|
290
|
+
<img alt="Nano Icons Pipeline" src="https://raw.githubusercontent.com/software-mansion-labs/react-native-nano-icons/main/packages/react-native-nano-icons/docs/img/nano-icons-graph-light.png">
|
|
291
291
|
</picture>
|
|
292
292
|
|
|
293
293
|
At build time, the pipeline processes your SVG directory through four stages:
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-native-nano-icons",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.8",
|
|
4
4
|
"description": "Use any svg as font. High-performance, build-time icon font generation and rendering for React Native & Expo.",
|
|
5
5
|
"react-native": "src/index.ts",
|
|
6
6
|
"source": "src/index.ts",
|