react-native-nano-icons 0.1.8 → 0.2.0

package/lib/typescript/src/loadDynamicFont.d.ts

@@ -0,0 +1,28 @@
+/**
+ * Runtime registration of dynamically-linked (`l:"d"`) fonts.
+ */
+type FontStatus = 'loading' | 'ready' | 'error';
+export declare function getFontStatus(family: string): FontStatus | undefined;
+/** A font source: a require()'d module, an { uri }, or a path/uri string. */
+export type FontSource = number | string | {
+    uri: string;
+};
+export declare function resolveFontUri(font: unknown): string;
+/**
+ * Register `font` under `family`. Concurrent calls share one in-flight load.
+ * Once settled, a later call retries after an error or no-ops if already
+ * registered — unless `opts.force` re-registers (used by the explicit `loadFont`).
+ */
+export declare function loadDynamicFont(family: string, font: unknown, opts?: {
+    force?: boolean;
+}): Promise<void>;
+/**
+ * Subscribe a component to a family's load state. Returns `true` while a managed
+ * font is still loading (so the icon should hide), `false` otherwise (ready,
+ * errored, or not managed by us).
+ */
+export declare function useDynamicFontPending(managed: boolean, family: string): boolean;
+/** Test-only: reset module state between tests. */
+export declare function __resetDynamicFontsForTests(): void;
+export {};
+//# sourceMappingURL=loadDynamicFont.d.ts.map

package/lib/typescript/src/loadDynamicFont.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"loadDynamicFont.d.ts","sourceRoot":"","sources":["../../../src/loadDynamicFont.ts"],"names":[],"mappings":"AAIA;;GAEG;AAEH,KAAK,UAAU,GAAG,SAAS,GAAG,OAAO,GAAG,OAAO,CAAC;AAehD,wBAAgB,aAAa,CAAC,MAAM,EAAE,MAAM,GAAG,UAAU,GAAG,SAAS,CAEpE;AAED,6EAA6E;AAC7E,MAAM,MAAM,UAAU,GAAG,MAAM,GAAG,MAAM,GAAG;IAAE,GAAG,EAAE,MAAM,CAAA;CAAE,CAAC;AAE3D,wBAAgB,cAAc,CAAC,IAAI,EAAE,OAAO,GAAG,MAAM,CAqBpD;AAmCD;;;;GAIG;AACH,wBAAgB,eAAe,CAC7B,MAAM,EAAE,MAAM,EACd,IAAI,EAAE,OAAO,EACb,IAAI,CAAC,EAAE;IAAE,KAAK,CAAC,EAAE,OAAO,CAAA;CAAE,GACzB,OAAO,CAAC,IAAI,CAAC,CAuCf;AAED;;;;GAIG;AACH,wBAAgB,qBAAqB,CACnC,OAAO,EAAE,OAAO,EAChB,MAAM,EAAE,MAAM,GACb,OAAO,CAUT;AAED,mDAAmD;AACnD,wBAAgB,2BAA2B,IAAI,IAAI,CAIlD"}

package/lib/typescript/src/specs/NanoIconViewNativeComponent.d.ts

@@ -1,13 +1,14 @@
-import type { CodegenTypes as CT, ViewProps } from 'react-native';
+import type { ViewProps } from 'react-native';
+import type { Float, Int32 } from '../const/codegenPrimitives';
 export interface NativeProps extends ViewProps {
     fontFamily: string;
-    codepoints: ReadonlyArray<CT.Int32>;
-    colors: ReadonlyArray<CT.Int32>;
-    fontSize: CT.Float;
-    advanceWidth: CT.Int32;
-    unitsPerEm: CT.Int32;
-    iconWidth: CT.Float;
-    iconHeight: CT.Float;
+    codepoints: ReadonlyArray<Int32>;
+    colors: ReadonlyArray<Int32>;
+    fontSize: Float;
+    advanceWidth: Int32;
+    unitsPerEm: Int32;
+    iconWidth: Float;
+    iconHeight: Float;
 }
 declare const _default: import("react-native/types_generated/Libraries/Utilities/codegenNativeComponent").NativeComponentType<NativeProps>;
 export default _default;

package/lib/typescript/src/specs/NanoIconViewNativeComponent.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"NanoIconViewNativeComponent.d.ts","sourceRoot":"","sources":["../../../../src/specs/NanoIconViewNativeComponent.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,YAAY,IAAI,EAAE,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAElE,MAAM,WAAW,WAAY,SAAQ,SAAS;IAC5C,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,aAAa,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;IACpC,MAAM,EAAE,aAAa,CAAC,EAAE,CAAC,KAAK,CAAC,CAAC;IAChC,QAAQ,EAAE,EAAE,CAAC,KAAK,CAAC;IACnB,YAAY,EAAE,EAAE,CAAC,KAAK,CAAC;IACvB,UAAU,EAAE,EAAE,CAAC,KAAK,CAAC;IACrB,SAAS,EAAE,EAAE,CAAC,KAAK,CAAC;IACpB,UAAU,EAAE,EAAE,CAAC,KAAK,CAAC;CACtB;;AAED,wBAAmE"}
+{"version":3,"file":"NanoIconViewNativeComponent.d.ts","sourceRoot":"","sources":["../../../../src/specs/NanoIconViewNativeComponent.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAC9C,OAAO,KAAK,EAAE,KAAK,EAAE,KAAK,EAAE,MAAM,4BAA4B,CAAC;AAE/D,MAAM,WAAW,WAAY,SAAQ,SAAS;IAC5C,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC;IACjC,MAAM,EAAE,aAAa,CAAC,KAAK,CAAC,CAAC;IAC7B,QAAQ,EAAE,KAAK,CAAC;IAChB,YAAY,EAAE,KAAK,CAAC;IACpB,UAAU,EAAE,KAAK,CAAC;IAClB,SAAS,EAAE,KAAK,CAAC;IACjB,UAAU,EAAE,KAAK,CAAC;CACnB;;AAED,wBAAmE"}

package/lib/typescript/src/specs/NativeNanoIconsFontLoader.d.ts

@@ -0,0 +1,8 @@
+import type { TurboModule } from 'react-native';
+export interface Spec extends TurboModule {
+    /** Pass glyphMap.m.f as `family`. On iOS it must also match the TTF's embedded PostScript/full name. */
+    registerFont(family: string, uri: string): Promise<boolean>;
+}
+declare const _default: Spec | null | undefined;
+export default _default;
+//# sourceMappingURL=NativeNanoIconsFontLoader.d.ts.map

package/lib/typescript/src/specs/NativeNanoIconsFontLoader.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"NativeNanoIconsFontLoader.d.ts","sourceRoot":"","sources":["../../../../src/specs/NativeNanoIconsFontLoader.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,cAAc,CAAC;AAGhD,MAAM,WAAW,IAAK,SAAQ,WAAW;IACvC,wGAAwG;IACxG,YAAY,CAAC,MAAM,EAAE,MAAM,EAAE,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC,OAAO,CAAC,CAAC;CAC7D;;AAID,wBAAoE"}

package/lib/typescript/src/types.d.ts

@@ -11,9 +11,15 @@ export type IconProps<Name> = {
     accessible?: boolean;
     accessibilityLabel?: string;
     accessibilityRole?: AccessibilityRole;
+    accessibilityElementsHidden?: boolean;
+    importantForAccessibility?: 'auto' | 'yes' | 'no' | 'no-hide-descendants';
     ref?: Ref<ViewRef>;
     testID?: string;
 };
-export type IconComponent<GM extends NanoGlyphMapInput> = React.FC<IconProps<keyof GM['i']>>;
+export type IconComponent<GM extends NanoGlyphMapInput> = React.FC<IconProps<keyof GM['i']>> & {
+    loadFont: (font?: number | string | {
+        uri: string;
+    }) => Promise<void>;
+};
 export {};
 //# sourceMappingURL=types.d.ts.map

package/lib/typescript/src/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,KAAK,EACV,iBAAiB,EACjB,UAAU,EACV,IAAI,EACJ,SAAS,EACV,MAAM,cAAc,CAAC;AACtB,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAEtD,KAAK,OAAO,GAAG,YAAY,CAAC,OAAO,IAAI,CAAC,CAAC;AAEzC,MAAM,MAAM,SAAS,CAAC,IAAI,IAAI;IAC5B,IAAI,EAAE,IAAI,CAAC;IACX,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,UAAU,GAAG,UAAU,EAAE,CAAC;IAClC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IACtC,GAAG,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,aAAa,CAAC,EAAE,SAAS,iBAAiB,IAAI,KAAK,CAAC,EAAE,CAChE,SAAS,CAAC,MAAM,EAAE,CAAC,GAAG,CAAC,CAAC,CACzB,CAAC"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../src/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,YAAY,EAAE,GAAG,EAAE,MAAM,OAAO,CAAC;AAC/C,OAAO,KAAK,EACV,iBAAiB,EACjB,UAAU,EACV,IAAI,EACJ,SAAS,EACV,MAAM,cAAc,CAAC;AACtB,OAAO,KAAK,EAAE,iBAAiB,EAAE,MAAM,cAAc,CAAC;AAEtD,KAAK,OAAO,GAAG,YAAY,CAAC,OAAO,IAAI,CAAC,CAAC;AAEzC,MAAM,MAAM,SAAS,CAAC,IAAI,IAAI;IAC5B,IAAI,EAAE,IAAI,CAAC;IACX,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,UAAU,GAAG,UAAU,EAAE,CAAC;IAClC,gBAAgB,CAAC,EAAE,OAAO,CAAC;IAC3B,KAAK,CAAC,EAAE,SAAS,CAAC;IAClB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,kBAAkB,CAAC,EAAE,MAAM,CAAC;IAC5B,iBAAiB,CAAC,EAAE,iBAAiB,CAAC;IACtC,2BAA2B,CAAC,EAAE,OAAO,CAAC;IACtC,yBAAyB,CAAC,EAAE,MAAM,GAAG,KAAK,GAAG,IAAI,GAAG,qBAAqB,CAAC;IAC1E,GAAG,CAAC,EAAE,GAAG,CAAC,OAAO,CAAC,CAAC;IACnB,MAAM,CAAC,EAAE,MAAM,CAAC;CACjB,CAAC;AAEF,MAAM,MAAM,aAAa,CAAC,EAAE,SAAS,iBAAiB,IAAI,KAAK,CAAC,EAAE,CAChE,SAAS,CAAC,MAAM,EAAE,CAAC,GAAG,CAAC,CAAC,CACzB,GAAG;IACF,QAAQ,EAAE,CAAC,IAAI,CAAC,EAAE,MAAM,GAAG,MAAM,GAAG;QAAE,GAAG,EAAE,MAAM,CAAA;KAAE,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CACvE,CAAC"}

package/lib/typescript/src/utils/glyphRuntime.d.ts

@@ -0,0 +1,18 @@
+import type { ColorValue } from 'react-native';
+import type { NanoGlyphMapInput, GlyphEntry } from '../core/types';
+/** Default icon size (px) shared by every platform renderer. */
+export declare const DEFAULT_ICON_SIZE = 12;
+/**
+ * Look up a glyph entry by name, falling back to a single '?' layer
+ * (codepoint 63) sized to the font's em when the name is unknown.
+ */
+export declare function resolveGlyphEntry<GM extends NanoGlyphMapInput>(glyphMap: GM, name: keyof GM['i']): GlyphEntry;
+/** A memoized codepoint -> string converter, scoped per icon set. */
+export declare function createCharCache(): (codepoint: number) => string;
+/**
+ * Build a per-layer color resolver for one render: an explicit per-index
+ * color wins, else the last supplied palette color spills onto remaining
+ * layers, else the glyph's own source color, else black.
+ */
+export declare function createLayerColorResolver(color: ColorValue | ColorValue[] | undefined): (index: number, srcColor: string | undefined) => ColorValue;
+//# sourceMappingURL=glyphRuntime.d.ts.map

package/lib/typescript/src/utils/glyphRuntime.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"glyphRuntime.d.ts","sourceRoot":"","sources":["../../../../src/utils/glyphRuntime.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC/C,OAAO,KAAK,EAAE,iBAAiB,EAAE,UAAU,EAAE,MAAM,eAAe,CAAC;AAEnE,gEAAgE;AAChE,eAAO,MAAM,iBAAiB,KAAK,CAAC;AAEpC;;;GAGG;AACH,wBAAgB,iBAAiB,CAAC,EAAE,SAAS,iBAAiB,EAC5D,QAAQ,EAAE,EAAE,EACZ,IAAI,EAAE,MAAM,EAAE,CAAC,GAAG,CAAC,GAClB,UAAU,CAKZ;AAED,qEAAqE;AACrE,wBAAgB,eAAe,IAAI,CAAC,SAAS,EAAE,MAAM,KAAK,MAAM,CAU/D;AAED;;;;GAIG;AACH,wBAAgB,wBAAwB,CACtC,KAAK,EAAE,UAAU,GAAG,UAAU,EAAE,GAAG,SAAS,GAC3C,CAAC,KAAK,EAAE,MAAM,EAAE,QAAQ,EAAE,MAAM,GAAG,SAAS,KAAK,UAAU,CAK7D"}

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "react-native-nano-icons",
-  "version": "0.1.8",
-  "description": "Use any svg as font. High-performance, build-time icon font generation and rendering for React Native & Expo.",
+  "version": "0.2.0",
+  "description": "High-performance icon rendering for React Native & Expo.",
   "react-native": "src/index.ts",
   "source": "src/index.ts",
   "bin": "lib/commonjs/scripts/cli.js",
@@ -37,23 +37,26 @@
   },
   "dependencies": {
     "@expo/config-plugins": ">=9.0.0",
+    "@xmldom/xmldom": "^0.9.10",
     "chalk": "^5.6.2",
     "fonteditor-core": "^2.6.3",
-    "jsdom": "^28.1.0",
     "ora": "^9.3.0",
     "pathkit-wasm": "^1.0.0",
     "plist": "^3.0.5",
     "pyodide": "^0.29.3",
     "svg2ttf": "^6.0.3",
-    "svgicons2svgfont": "^15.0.1",
     "xcode": "^3.0.1"
   },
   "peerDependencies": {
+    "@expo/config": ">=9.0.0",
     "expo": "*",
     "react": "*",
     "react-native": "*"
   },
   "peerDependenciesMeta": {
+    "@expo/config": {
+      "optional": true
+    },
     "@expo/config-plugins": {
       "optional": true
     },
@@ -164,7 +167,7 @@
   },
   "codegenConfig": {
     "name": "RNNanoIconsSpec",
-    "type": "components",
+    "type": "all",
     "jsSrcsDir": "./src/specs",
     "android": {
       "javaPackageName": "com.nanoicons"

package/plugin/src/types.ts

@@ -14,6 +14,14 @@ export interface IconSetConfig {
   safeZone?: number;
   /** First Unicode codepoint for glyphs (default 0xe900). Hex string or number. */
   startUnicode?: number | string;
+  /**
+   * Delivery mode for the generated TTF. Defaults to `'static'`.
+   *
+   * - `'static'`: TTF is bundled into the native app.
+   * - `'dynamic'`: TTF is excluded from native bundling - the host app is responsible for
+   *   delivering it (e.g. via OTA) and registering it under the same font family name.
+   */
+  linking?: 'static' | 'dynamic';
 }
 
 /**
@@ -30,4 +38,5 @@ export interface BuiltFont {
   fontFamily: string;
   ttfPath: string;
   glyphmapPath: string;
+  linking: 'static' | 'dynamic';
 }

package/plugin/src/withNanoIconsFontLinking.ts

@@ -11,9 +11,15 @@ import { getOrBuildFonts } from './buildFonts.js';
 import type { IconSetConfig } from './types.js';
 
 const ANDROID_ASSETS_FONTS_DIR = 'app/src/main/assets/fonts';
+const IOS_FONTS_GROUP = 'Resources';
 
 /**
  * Add TTFs to the iOS project (Resources group + UIAppFonts in Info.plist).
+ *
+ * Copies each .ttf into ios/<projectName>/Resources/ on every prebuild so that
+ * Xcode's incremental build reliably picks up updated glyph data. Referencing
+ * the .ttf via a relative path outside ios/ leaves stale fonts in the .app
+ * bundle when only the file contents change.
  */
 export function withNanoIconsIos(
   config: Parameters<typeof withXcodeProject>[0],
@@ -24,16 +30,27 @@ export function withNanoIconsIos(
       config.modRequest.projectRoot,
       iconSets
     );
-    if (!built?.length) return config;
-    const ttfPaths = built.map((b) => b.ttfPath);
+    const bundled = built?.filter((b) => b.linking !== 'dynamic') ?? [];
+    if (!bundled.length) return config;
     const project = config.modResults;
     const platformProjectRoot = config.modRequest.platformProjectRoot;
-    IOSConfig.XcodeUtils.ensureGroupRecursively(project, 'Resources');
-    for (const fontPath of ttfPaths) {
-      const relativePath = path.relative(platformProjectRoot, fontPath);
+    const projectName =
+      config.modRequest.projectName ??
+      IOSConfig.XcodeUtils.getProjectName(config.modRequest.projectRoot);
+    const fontsDir = path.join(
+      platformProjectRoot,
+      projectName,
+      IOS_FONTS_GROUP
+    );
+    await fs.mkdir(fontsDir, { recursive: true });
+    IOSConfig.XcodeUtils.ensureGroupRecursively(project, IOS_FONTS_GROUP);
+    for (const { ttfPath } of bundled) {
+      const dest = path.join(fontsDir, path.basename(ttfPath));
+      await fs.copyFile(ttfPath, dest);
+      const relativePath = path.relative(platformProjectRoot, dest);
       IOSConfig.XcodeUtils.addResourceFileToGroup({
         filepath: relativePath,
-        groupName: 'Resources',
+        groupName: IOS_FONTS_GROUP,
         project,
         isBuildFile: true,
         verbose: true,
@@ -49,8 +66,9 @@ export function withNanoIconsIos(
         config.modRequest.projectRoot,
         iconSets
       );
-      if (!built?.length) return config;
-      const ttfPaths = built.map((b) => b.ttfPath);
+      const bundled = built?.filter((b) => b.linking !== 'dynamic') ?? [];
+      if (!bundled.length) return config;
+      const ttfPaths = bundled.map((b) => b.ttfPath);
       const existingFonts = getUIAppFonts(config.modResults);
       const fontList = ttfPaths.map((f) => path.basename(f));
       const allFonts = [...existingFonts, ...fontList];
@@ -88,13 +106,14 @@ export function withNanoIconsAndroid(
         config.modRequest.projectRoot,
         iconSets
       );
-      if (!built?.length) return config;
+      const bundled = built?.filter((b) => b.linking !== 'dynamic') ?? [];
+      if (!bundled.length) return config;
       const fontsDir = path.join(
         config.modRequest.platformProjectRoot,
         ANDROID_ASSETS_FONTS_DIR
       );
       await fs.mkdir(fontsDir, { recursive: true });
-      for (const b of built) {
+      for (const b of bundled) {
         const filename = path.basename(b.ttfPath);
         const dest = path.join(fontsDir, filename);
         await fs.copyFile(b.ttfPath, dest);

package/react-native-nano-icons.podspec

@@ -10,7 +10,7 @@ Pod::Spec.new do |s|
   s.license      = package["license"]
   s.author       = package["author"]
   s.source       = { :git => package["repository"], :tag => "#{s.version}" }
-  s.platforms    = { :ios => "15.1" }
+  s.platforms    = { :ios => "15.1", :tvos => "15.1" }
   s.source_files = "ios/**/*.{h,m,mm,cpp}"
   s.requires_arc = true
 

package/scripts/cli.ts

@@ -1,26 +1,29 @@
 #!/usr/bin/env node
 /**
- * Bare React Native workflow: build icon fonts and link them into the native project.
- *
- * Run from your app root: npx react-native-nano-icons [--verbose] [--path <dir>]
- *
- * Reads .nanoicons.json (same shape as Expo plugin options) so Expo and bare apps
- * share one config format.
+ * Run from your app root: npx react-native-nano-icons [--verbose] [--path <dir>] [--dynamic] [--app-config]
  *
  * Flags:
- *   --verbose        Show per-SVG processing details and pipeline timing
- *   --path <dir>     Directory containing .nanoicons.json (default: cwd)
+ *   --verbose          Show per-SVG processing details and pipeline timing
+ *   --path <dir>       Directory containing .nanoicons.json (default: cwd)
+ *   --dynamic          Rebuild only icon sets with linking: 'dynamic'. Skips native linking —
+ *                      use this for OTA font regeneration without running expo prebuild.
+ *   --app-config       Read config from Expo app config (app.json / app.config.js / app.config.ts)
+ *                      instead of .nanoicons.json. Must be combined with --dynamic.
  */
 import path from 'node:path';
 import {
   createOraLogger,
   loadNanoIconsConfig,
+  loadDynamicIconSets,
+  loadDynamicSetsFromAppConfig,
   buildAllFonts,
   linkBare,
 } from '../cli/index.js';
 
 async function main(): Promise<void> {
   const verbose = process.argv.includes('--verbose');
+  const dynamic = process.argv.includes('--dynamic');
+  const appConfig = process.argv.includes('--app-config');
   const level = verbose ? 'verbose' : 'normal';
 
   const pathIdx = process.argv.indexOf('--path');
@@ -31,9 +34,26 @@ async function main(): Promise<void> {
       : projectRoot;
 
   const logger = await createOraLogger(level);
-  const config = loadNanoIconsConfig(configRoot);
-  const built = await buildAllFonts(config.iconSets, projectRoot, { logger });
-  await linkBare(projectRoot, built, logger);
+
+  if (dynamic) {
+    const source = appConfig ? 'Expo app config' : '.nanoicons.json';
+    logger.start(`Reading dynamic icon sets from ${source}...`);
+
+    const dynamicIconSets = appConfig
+      ? loadDynamicSetsFromAppConfig(projectRoot)
+      : loadDynamicIconSets(configRoot);
+
+    logger.succeed(
+      `Found ${dynamicIconSets.length} dynamic icon set(s) — skipping native linking.`
+    );
+
+    await buildAllFonts(dynamicIconSets, projectRoot, { logger });
+  } else {
+    const config = loadNanoIconsConfig(configRoot);
+    const built = await buildAllFonts(config.iconSets, projectRoot, { logger });
+
+    await linkBare(projectRoot, built, logger);
+  }
 }
 
 main().catch((err: unknown) => {

package/src/const/codegenPrimitives.ts

@@ -0,0 +1,14 @@
+// Local numeric aliases for RN codegen TS spec parsing.
+//
+// RN 0.79 and lower's codegen resolves any TSTypeAliasDeclaration found in the spec
+// file back to its original RHS before the array-element handler runs — so a
+// local `type Int32 = CodegenTypes.Int32` still presents as a TSQualifiedName
+// inside ReadonlyArray<> and trips "Unknown prop type ... TSTypeReference".
+// Imported identifiers are NOT tracked in the codegen's known-types map, so
+// importing `Int32` / `Float` from here leaves a bare identifier that matches
+// the primitive-type branch (`case 'Int32'` / `case 'Float'`).
+//
+// These are pure number aliases at runtime; RN codegen only cares about the
+// identifier name.
+export type Int32 = number;
+export type Float = number;

package/src/core/font/compile.ts

@@ -79,8 +79,7 @@ export async function compileTtfFromGlyphs(opts: {
   const { glyphs, outTtfPath, fontName, upm, ascent, descent } = opts;
   const lineGap = opts.lineGap ?? 0;
 
-  if (glyphs.length === 0)
-    throw new Error('No glyphs to compile');
+  if (glyphs.length === 0) throw new Error('No glyphs to compile');
 
   const svgFontString = buildSvgFontXml({
     fontName,

package/src/core/pipeline/config.ts

@@ -5,6 +5,7 @@ export type PipelineConfig = {
   upm: number;
   safeZone: number;
   startUnicode: number;
+  linking: 'static' | 'dynamic';
 };
 
 export type PipelinePaths = {

package/src/core/pipeline/managers.ts

@@ -22,9 +22,8 @@ export class PathKitManager {
     const PathKitInit = require('pathkit-wasm/bin/pathkit.js') as (
       opts: unknown
     ) => any;
-    const pathkitJsPath = require.resolve(
-      'pathkit-wasm/bin/pathkit.js'
-    ) as string;
+    const pathkitJsPath =
+      require.resolve('pathkit-wasm/bin/pathkit.js') as string;
     const pathkitBinDir = path.dirname(pathkitJsPath);
     const pathkitWasmPath = path.join(pathkitBinDir, 'pathkit.wasm');
 
@@ -74,14 +73,10 @@ export class PyodideManager {
     await py.loadPackage(['micropip', 'lxml'], { messageCallback: () => {} });
 
     // Resolve local picosvg wheel path for offline-first installation.
-    const picosvgWhlDir = path.join(
-      getPackageRoot(),
-      'src',
-      'core',
-      'shims'
+    const picosvgWhlDir = path.join(getPackageRoot(), 'src', 'core', 'shims');
+    const picosvgWhl = (await fs.readdir(picosvgWhlDir)).find(
+      (f) => f.startsWith('picosvg-') && f.endsWith('.whl')
     );
-    const picosvgWhl = (await fs.readdir(picosvgWhlDir))
-      .find((f) => f.startsWith('picosvg-') && f.endsWith('.whl'));
     const localWhlUrl = picosvgWhl
       ? `file://${path.join(picosvgWhlDir, picosvgWhl)}`
       : null;

package/src/core/pipeline/run.ts

@@ -23,10 +23,7 @@ import {
 } from '../svg/svg_dom.js';
 import { computePlacement, transformPathForFont } from '../svg/layers.js';
 import { convertEvenoddToWinding } from '../svg/svg_pathops.js';
-import type {
-  GlyphLayer,
-  NanoGlyphMap,
-} from '../types.js';
+import type { GlyphLayer, NanoGlyphMap } from '../types.js';
 import type { NanoLogger } from '../types.js';
 
 export type PipelineResult = {
@@ -38,7 +35,12 @@ export type PipelineResult = {
 // Same-color path merging
 // ---------------------------------------------------------------------------
 
-type ParsedPath = { d: string; fill: string | null; fillRule?: 'evenodd'; noMerge?: boolean };
+type ParsedPath = {
+  d: string;
+  fill: string | null;
+  fillRule?: 'evenodd';
+  noMerge?: boolean;
+};
 
 /**
  * Concatenate multiple SVG path `d` strings into a single compound path.
@@ -132,6 +134,7 @@ export async function runPipeline(
       u: config.upm,
       z: config.safeZone,
       s: config.startUnicode,
+      ...(config.linking === 'dynamic' ? { l: 'd' as const } : {}),
     },
     i: {},
   };
@@ -184,7 +187,9 @@ export async function runPipeline(
     }
     for (const p of parsed.paths) {
       if (p.fillRule === 'evenodd') {
-        logger?.info(`  ↻ Converting evenodd path to nonzero winding in "${file}"`);
+        logger?.info(
+          `  ↻ Converting evenodd path to nonzero winding in "${file}"`
+        );
         p.d = convertEvenoddToWinding(PathKit, p.d);
         delete p.fillRule;
         (p as ParsedPath).noMerge = true;

package/src/core/svg/layers.ts

@@ -54,12 +54,12 @@ export async function writeLayerSvg(opts: {
 
   const layerSvg = `
     <svg viewBox="0 0 ${opts.adv} ${
-    opts.upm
-  }" xmlns="http://www.w3.org/2000/svg">
+      opts.upm
+    }" xmlns="http://www.w3.org/2000/svg">
       <rect width="${opts.adv}" height="${opts.upm}" fill="none" />
       <g transform="translate(${opts.xOff}, ${opts.yOff}) scale(${
-    opts.scale
-  }) translate(${-opts.vx}, ${-opts.vy})">
+        opts.scale
+      }) translate(${-opts.vx}, ${-opts.vy})">
         <path d="${opts.d}" fill="black" />
       </g>
     </svg>`.trim();

package/src/core/svg/svg_dom.ts

@@ -1,4 +1,4 @@
-import { JSDOM } from 'jsdom';
+import { DOMParser, type Element } from '@xmldom/xmldom';
 import { parseColor } from '../../utils/parse';
 
 export type ParsedFlatSvg = {
@@ -8,7 +8,7 @@ export type ParsedFlatSvg = {
 
 // if the fill is implicit, walk ancestors for the first explicit fill value
 function resolveInheritedFill(el: Element): string {
-  let current: Element | null = el.parentElement;
+  let current = el.parentElement;
   while (current !== null) {
     const fill = current.getAttribute('fill');
     if (fill !== null && fill !== 'inherit') return fill;
@@ -89,30 +89,27 @@ export function parseFlattenedSvg(
   flattenedSvg: string,
   options?: { onSanitize?: (original: string) => void }
 ): ParsedFlatSvg {
-  const dom = new JSDOM(flattenedSvg);
-  const doc = dom.window.document;
+  const doc = new DOMParser().parseFromString(flattenedSvg, 'image/svg+xml');
+  const svgEl = doc.documentElement;
 
-  const svgEl = doc.querySelector('svg');
   const viewBoxRaw = svgEl
     ?.getAttribute('viewBox')
     ?.split(/\s+/)
     .map(Number) ?? [0, 0, 100, 100];
 
   const viewBox: [number, number, number, number] =
-    viewBoxRaw.length === 4 && viewBoxRaw.every((n) => Number.isFinite(n))
+    viewBoxRaw.length === 4 && viewBoxRaw.every(Number.isFinite)
       ? [viewBoxRaw[0]!, viewBoxRaw[1]!, viewBoxRaw[2]!, viewBoxRaw[3]!]
       : [0, 0, 100, 100];
 
-  const pathEls = Array.from(doc.querySelectorAll('path'));
+  const pathEls = svgEl ? Array.from(svgEl.getElementsByTagName('path')) : [];
 
   const paths = pathEls
     .map(parsePath)
     .filter((p) => p.d.trim() !== '')
     .map((p) => {
       const { d, sanitized } = sanitizePathData(p.d);
-      if (sanitized) {
-        options?.onSanitize?.(p.d);
-      }
+      if (sanitized) options?.onSanitize?.(p.d);
       return { ...p, d };
     });
 
@@ -134,6 +131,12 @@ export function validateSvg(content: string): SvgValidation {
   if (/<filter[\s>]/i.test(content)) {
     return { valid: false, reason: '<filter> is not supported yet' };
   }
+  if (/<image[\s>]/i.test(content)) {
+    return {
+      valid: false,
+      reason: 'embedded raster <image> is not supported yet',
+    };
+  }
   return { valid: true };
 }
 
@@ -150,18 +153,20 @@ export function extractOriginalEvenoddDs(svgContent: string): string[] {
     return [];
   }
 
-  const dom = new JSDOM(svgContent, { contentType: 'image/svg+xml' });
-  const doc = dom.window.document;
-  const results: string[] = [];
-
-  const pathEls = doc.querySelectorAll(
-    'path[fill-rule="evenodd"], path[clip-rule="evenodd"]'
+  const doc = new DOMParser().parseFromString(svgContent, 'image/svg+xml');
+
+  return Array.from(doc.getElementsByTagName('path')).reduce<string[]>(
+    (acc, el) => {
+      const isEvenOdd =
+        el.getAttribute('fill-rule') === 'evenodd' ||
+        el.getAttribute('clip-rule') === 'evenodd';
+      if (!isEvenOdd) return acc;
+      const d = el.getAttribute('d');
+      if (d !== null && d !== '') acc.push(d);
+      return acc;
+    },
+    []
   );
-  for (const el of pathEls) {
-    const d = el.getAttribute('d');
-    if (d) results.push(d);
-  }
-  return results;
 }
 
 /**
@@ -187,5 +192,3 @@ export function preprocessSvg(content: string): string {
   if (/xmlns\s*=/.test(content)) return content;
   return content.replace(/<svg\b/, '<svg xmlns="http://www.w3.org/2000/svg"');
 }
-
-