react-native-nano-icons 0.1.0 → 0.1.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
CHANGED
|
@@ -56,13 +56,13 @@ The library uses an Expo Config Plugin to hook into the prebuild phase. This aut
|
|
|
56
56
|
|
|
57
57
|
The plugin accepts an object with an `iconSets` array, allowing you to generate multiple distinct fonts in a single build.
|
|
58
58
|
|
|
59
|
-
| Property | Type | Required
|
|
60
|
-
| :------------- | :------- |
|
|
61
|
-
| `inputDir` | `string` | **Yes**
|
|
62
|
-
| `fontFamily` | `string` | No
|
|
63
|
-
| `outputDir` | `string` | No
|
|
64
|
-
| `upm` | `number` | No
|
|
65
|
-
| `startUnicode` | `string` | No
|
|
59
|
+
| Property | Type | Required | Default | Description |
|
|
60
|
+
| :------------- | :------- | :------- | :------------- | :------------------------------------------------------------------------------------------------------------------------- |
|
|
61
|
+
| `inputDir` | `string` | **Yes** | — | Path to the directory containing your `.svg` files (e.g., `./assets/icons/ui`). |
|
|
62
|
+
| `fontFamily` | `string` | No | Folder Name | The name of the generated font family and file. If omitted, the name of the `inputDir` folder is used (e.g., `ui`). |
|
|
63
|
+
| `outputDir` | `string` | No | `../nanoicons` | Path where the `.ttf` and `.json` artifacts will be saved. Defaults to a sibling `nanoicons` folder relative to the input. |
|
|
64
|
+
| `upm` | `number` | No | `1024` | Units Per Em. Defines the resolution of the font grid. |
|
|
65
|
+
| `startUnicode` | `string` | No | `0xe900` | The starting Hex Unicode point for the first icon glyph. |
|
|
66
66
|
|
|
67
67
|
<details>
|
|
68
68
|
<summary>Default Dir Path Behavior</summary>
|
|
@@ -131,14 +131,14 @@ export default function App() {
|
|
|
131
131
|
return (
|
|
132
132
|
<>
|
|
133
133
|
// Renders the icon with its original multi-color layers from the SVG
|
|
134
|
-
<
|
|
134
|
+
<UserIcon name="avatar-1" size={32} />
|
|
135
135
|
|
|
136
136
|
// Overrides all color layers with the provided colors respectively
|
|
137
|
-
<
|
|
137
|
+
<UserIcon name="avatar-1" size={24} colorPalette={["blue", "#ffffff", "#fc2930"]} />
|
|
138
138
|
|
|
139
139
|
// Renders icon inline within a paragraph
|
|
140
140
|
<Text>
|
|
141
|
-
User <
|
|
141
|
+
User <UserIcon name="avatar-1" size={12} /> liked your photo!
|
|
142
142
|
</Text>
|
|
143
143
|
</>
|
|
144
144
|
);
|
|
@@ -3,7 +3,7 @@ export type IconSetConfig = {
|
|
|
3
3
|
/** Path to folder of SVG files (relative to project root). */
|
|
4
4
|
inputDir: string;
|
|
5
5
|
/** Font family name (used for TTF and glyphmap filenames). */
|
|
6
|
-
fontFamily
|
|
6
|
+
fontFamily?: string;
|
|
7
7
|
/** Path where .ttf and .glyphmap.json will be saved. Defaults to a sibling nanoicons folder relative to inputDir. */
|
|
8
8
|
outputDir?: string;
|
|
9
9
|
/** Units per em (default 1024). */
|
|
@@ -39,17 +39,18 @@ async function buildAllFonts(iconSets, projectRoot, options) {
|
|
|
39
39
|
for (let i = 0; i < iconSets.length; i++) {
|
|
40
40
|
const set = iconSets[i];
|
|
41
41
|
const inputDir = path_1.default.resolve(projectRoot, set.inputDir);
|
|
42
|
+
const fontFamily = set.fontFamily ?? path_1.default.basename(inputDir);
|
|
42
43
|
if (!fs_1.default.existsSync(inputDir)) {
|
|
43
44
|
throw new Error(`[react-native-nano-icons] Input directory does not exist: ${inputDir} (from "${set.inputDir}")`);
|
|
44
45
|
}
|
|
45
46
|
const outputDir = set.outputDir
|
|
46
47
|
? path_1.default.resolve(projectRoot, set.outputDir)
|
|
47
48
|
: path_1.default.join(path_1.default.dirname(inputDir), 'nanoicons');
|
|
48
|
-
const ttfPath = path_1.default.join(outputDir, `${
|
|
49
|
-
const glyphmapPath = path_1.default.join(outputDir, `${
|
|
49
|
+
const ttfPath = path_1.default.join(outputDir, `${fontFamily}.ttf`);
|
|
50
|
+
const glyphmapPath = path_1.default.join(outputDir, `${fontFamily}.glyphmap.json`);
|
|
50
51
|
const inputHash = (0, fingerPrint_js_1.getFingerprintSync)(inputDir);
|
|
51
|
-
if (shouldSkipGeneration(inputHash, outputDir,
|
|
52
|
-
results.push({ fontFamily
|
|
52
|
+
if (shouldSkipGeneration(inputHash, outputDir, fontFamily, logger)) {
|
|
53
|
+
results.push({ fontFamily, ttfPath, glyphmapPath });
|
|
53
54
|
continue;
|
|
54
55
|
}
|
|
55
56
|
if (fs_1.default.existsSync(ttfPath))
|
|
@@ -57,9 +58,9 @@ async function buildAllFonts(iconSets, projectRoot, options) {
|
|
|
57
58
|
if (fs_1.default.existsSync(glyphmapPath))
|
|
58
59
|
fs_1.default.unlinkSync(glyphmapPath);
|
|
59
60
|
allSkipped = false;
|
|
60
|
-
const tempDir = path_1.default.join(projectRoot, '.temp_layers',
|
|
61
|
+
const tempDir = path_1.default.join(projectRoot, '.temp_layers', fontFamily);
|
|
61
62
|
const config = {
|
|
62
|
-
fontFamily
|
|
63
|
+
fontFamily,
|
|
63
64
|
upm: set.upm ?? DEFAULT_UPM,
|
|
64
65
|
safeZone: set.safeZone ?? DEFAULT_SAFE_ZONE,
|
|
65
66
|
startUnicode: set.startUnicode !== undefined
|
|
@@ -68,10 +69,10 @@ async function buildAllFonts(iconSets, projectRoot, options) {
|
|
|
68
69
|
: set.startUnicode
|
|
69
70
|
: DEFAULT_START_UNICODE,
|
|
70
71
|
};
|
|
71
|
-
logger?.start(`Building ${
|
|
72
|
+
logger?.start(`Building ${fontFamily} (${i + 1}/${iconSets.length})…`);
|
|
72
73
|
const out = await (0, index_js_1.runPipeline)(config, { inputDir, outputDir, tempDir }, { logger, inputHash });
|
|
73
74
|
results.push({
|
|
74
|
-
fontFamily
|
|
75
|
+
fontFamily,
|
|
75
76
|
ttfPath: out.ttfPath,
|
|
76
77
|
glyphmapPath: out.glyphmapPath,
|
|
77
78
|
});
|
|
@@ -3,7 +3,7 @@ export type IconSetConfig = {
|
|
|
3
3
|
/** Path to folder of SVG files (relative to project root). */
|
|
4
4
|
inputDir: string;
|
|
5
5
|
/** Font family name (used for TTF and glyphmap filenames). */
|
|
6
|
-
fontFamily
|
|
6
|
+
fontFamily?: string;
|
|
7
7
|
/** Path where .ttf and .glyphmap.json will be saved. Defaults to a sibling nanoicons folder relative to inputDir. */
|
|
8
8
|
outputDir?: string;
|
|
9
9
|
/** Units per em (default 1024). */
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"build.d.ts","sourceRoot":"","sources":["../../../cli/build.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAG9C,MAAM,MAAM,aAAa,GAAG;IAC1B,8DAA8D;IAC9D,QAAQ,EAAE,MAAM,CAAC;IACjB,8DAA8D;IAC9D,UAAU,EAAE,MAAM,CAAC;
|
|
1
|
+
{"version":3,"file":"build.d.ts","sourceRoot":"","sources":["../../../cli/build.ts"],"names":[],"mappings":"AAGA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,aAAa,CAAC;AAG9C,MAAM,MAAM,aAAa,GAAG;IAC1B,8DAA8D;IAC9D,QAAQ,EAAE,MAAM,CAAC;IACjB,8DAA8D;IAC9D,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,qHAAqH;IACrH,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mCAAmC;IACnC,GAAG,CAAC,EAAE,MAAM,CAAC;IACb,sDAAsD;IACtD,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,iFAAiF;IACjF,YAAY,CAAC,EAAE,MAAM,GAAG,MAAM,CAAC;CAChC,CAAC;AAEF,MAAM,MAAM,SAAS,GAAG;IACtB,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,MAAM,CAAC;IAChB,YAAY,EAAE,MAAM,CAAC;CACtB,CAAC;AAkCF;;;;GAIG;AACH,wBAAsB,aAAa,CACjC,QAAQ,EAAE,aAAa,EAAE,EACzB,WAAW,EAAE,MAAM,EACnB,OAAO,CAAC,EAAE;IAAE,MAAM,CAAC,EAAE,UAAU,CAAA;CAAE,GAChC,OAAO,CAAC,SAAS,EAAE,CAAC,CAmEtB"}
|
package/package.json
CHANGED