@react-native-vector-icons/common 12.0.1 → 12.1.0

package/lib/typescript/module/src/dynamicLoading/dynamic-loading-setting.d.ts

@@ -6,11 +6,19 @@ type ExpoFontLoaderModule = {
     getLoadedFonts: () => string[];
     loadAsync: (fontFamilyAlias: string, fileUri: string) => Promise<void>;
 };
+type ExpoFontUtilsModule = {
+    renderToImageAsync: (glyph: string, options: {
+        fontFamily?: string;
+        size?: number;
+        color?: number;
+    }) => Promise<string>;
+};
 declare global {
     interface ExpoGlobal {
         modules: {
             ExpoAsset?: ExpoAssetModule;
             ExpoFontLoader?: ExpoFontLoaderModule;
+            ExpoFontUtils?: ExpoFontUtilsModule;
         };
     }
     var expo: ExpoGlobal | undefined;
@@ -21,6 +29,13 @@ type ExpoGlobalType = {
         ExpoFontLoader: ExpoFontLoaderModule;
     };
 };
+export declare function getIsRenderToImageSupported(globalObj: any): globalObj is {
+    expo: {
+        modules: {
+            ExpoFontUtils: ExpoFontUtilsModule;
+        };
+    };
+};
 export declare function assertExpoModulesPresent(globalObj: unknown): asserts globalObj is {
     expo: ExpoGlobalType;
 };

package/lib/typescript/module/src/dynamicLoading/dynamic-loading-setting.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"dynamic-loading-setting.d.ts","sourceRoot":"","sources":["../../../../../src/dynamicLoading/dynamic-loading-setting.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAE1C,KAAK,eAAe,GAAG;IAGrB,aAAa,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,SAAS,EAAE,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC,MAAM,CAAC,CAAC;CACzF,CAAC;AAEF,KAAK,oBAAoB,GAAG;IAG1B,cAAc,EAAE,MAAM,MAAM,EAAE,CAAC;IAC/B,SAAS,EAAE,CAAC,eAAe,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CACxE,CAAC;AAEF,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,UAAU;QAClB,OAAO,EAAE;YACP,SAAS,CAAC,EAAE,eAAe,CAAC;YAC5B,cAAc,CAAC,EAAE,oBAAoB,CAAC;SACvC,CAAC;KACH;IAGD,IAAI,IAAI,EAAE,UAAU,GAAG,SAAS,CAAC;CAClC;AAED,KAAK,cAAc,GAAG;IACpB,OAAO,EAAE;QACP,SAAS,EAAE,eAAe,CAAC;QAC3B,cAAc,EAAE,oBAAoB,CAAC;KACtC,CAAC;CACH,CAAC;AAcF,wBAAgB,wBAAwB,CAAC,SAAS,EAAE,OAAO,GAAG,OAAO,CAAC,SAAS,IAAI;IAAE,IAAI,EAAE,cAAc,CAAA;CAAE,CAI1G;AAQD,eAAO,MAAM,yBAAyB,eAAiC,CAAC;AAExE;;;;;;;KAOK;AACL,eAAO,MAAM,wBAAwB,GAAI,OAAO,OAAO,KAAG,OAczD,CAAC;AAEF;;KAEK;AACL,eAAO,MAAM,uBAAuB,eAAkC,CAAC;AAEvE,KAAK,aAAa,GAAG,CAAC,IAAI,EAAE;IAC1B,KAAK,EAAE,KAAK,CAAC;IACb,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,UAAU,CAAC;CACxB,KAAK,IAAI,CAAC;AAIX;;KAEK;AACL,eAAO,MAAM,8BAA8B,GAAI,UAAU,aAAa,SAErE,CAAC;AAEF,eAAO,MAAM,gBAAgB,iCAAoC,CAAC"}
+{"version":3,"file":"dynamic-loading-setting.d.ts","sourceRoot":"","sources":["../../../../../src/dynamicLoading/dynamic-loading-setting.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,SAAS,CAAC;AAE1C,KAAK,eAAe,GAAG;IAGrB,aAAa,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,EAAE,MAAM,GAAG,SAAS,EAAE,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC,MAAM,CAAC,CAAC;CACzF,CAAC;AAEF,KAAK,oBAAoB,GAAG;IAG1B,cAAc,EAAE,MAAM,MAAM,EAAE,CAAC;IAC/B,SAAS,EAAE,CAAC,eAAe,EAAE,MAAM,EAAE,OAAO,EAAE,MAAM,KAAK,OAAO,CAAC,IAAI,CAAC,CAAC;CACxE,CAAC;AAEF,KAAK,mBAAmB,GAAG;IACzB,kBAAkB,EAAE,CAClB,KAAK,EAAE,MAAM,EACb,OAAO,EAAE;QACP,UAAU,CAAC,EAAE,MAAM,CAAC;QACpB,IAAI,CAAC,EAAE,MAAM,CAAC;QACd,KAAK,CAAC,EAAE,MAAM,CAAC;KAChB,KACE,OAAO,CAAC,MAAM,CAAC,CAAC;CACtB,CAAC;AAEF,OAAO,CAAC,MAAM,CAAC;IACb,UAAU,UAAU;QAClB,OAAO,EAAE;YACP,SAAS,CAAC,EAAE,eAAe,CAAC;YAC5B,cAAc,CAAC,EAAE,oBAAoB,CAAC;YACtC,aAAa,CAAC,EAAE,mBAAmB,CAAC;SACrC,CAAC;KACH;IAGD,IAAI,IAAI,EAAE,UAAU,GAAG,SAAS,CAAC;CAClC;AAED,KAAK,cAAc,GAAG;IACpB,OAAO,EAAE;QACP,SAAS,EAAE,eAAe,CAAC;QAC3B,cAAc,EAAE,oBAAoB,CAAC;KACtC,CAAC;CACH,CAAC;AAeF,wBAAgB,2BAA2B,CAAC,SAAS,EAAE,GAAG,GAAG,SAAS,IAAI;IACxE,IAAI,EAAE;QACJ,OAAO,EAAE;YACP,aAAa,EAAE,mBAAmB,CAAC;SACpC,CAAC;KACH,CAAC;CACH,CAEA;AAED,wBAAgB,wBAAwB,CAAC,SAAS,EAAE,OAAO,GAAG,OAAO,CAAC,SAAS,IAAI;IAAE,IAAI,EAAE,cAAc,CAAA;CAAE,CAI1G;AAQD,eAAO,MAAM,yBAAyB,eAAiC,CAAC;AAExE;;;;;;;KAOK;AACL,eAAO,MAAM,wBAAwB,GAAI,OAAO,OAAO,KAAG,OAczD,CAAC;AAEF;;KAEK;AACL,eAAO,MAAM,uBAAuB,eAAkC,CAAC;AAEvE,KAAK,aAAa,GAAG,CAAC,IAAI,EAAE;IAAE,KAAK,EAAE,KAAK,CAAC;IAAC,UAAU,EAAE,MAAM,CAAC;IAAC,UAAU,EAAE,UAAU,CAAA;CAAE,KAAK,IAAI,CAAC;AAIlG;;KAEK;AACL,eAAO,MAAM,8BAA8B,GAAI,UAAU,aAAa,SAErE,CAAC;AAEF,eAAO,MAAM,gBAAgB,iCAAoC,CAAC"}

package/lib/typescript/module/src/get-image-library.d.ts

@@ -1,2 +1,5 @@
-export declare const ensureGetImageAvailable: () => typeof import("@react-native-vector-icons/get-image");
+export declare const ensureGetImageAvailable: () => typeof import("@react-native-vector-icons/get-image") | {
+    getImageForFont: (fontReference: string, glyph: string, size: number, color: number) => Promise<string>;
+    getImageForFontSync: () => never;
+};
 //# sourceMappingURL=get-image-library.d.ts.map

package/lib/typescript/module/src/get-image-library.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"get-image-library.d.ts","sourceRoot":"","sources":["../../../../src/get-image-library.ts"],"names":[],"mappings":"AAUA,eAAO,MAAM,uBAAuB,6DAUnC,CAAC"}
+{"version":3,"file":"get-image-library.d.ts","sourceRoot":"","sources":["../../../../src/get-image-library.ts"],"names":[],"mappings":"AAiBA,eAAO,MAAM,uBAAuB;qCAQS,MAAM,SAAS,MAAM,QAAQ,MAAM,SAAS,MAAM;;CAgB9F,CAAC"}

package/lib/typescript/module/src/get-image-source.d.ts

@@ -0,0 +1,11 @@
+import type { TextStyle } from 'react-native';
+import type createIconSourceCache from './create-icon-source-cache';
+export declare const getImageSourceSync: (imageSourceCache: ReturnType<typeof createIconSourceCache>, fontReference: string, glyph: string, size?: number, color?: TextStyle["color"]) => {
+    uri: string;
+    scale: number;
+};
+export declare const getImageSource: (imageSourceCache: ReturnType<typeof createIconSourceCache>, fontReference: string, glyph: string, size?: number, color?: TextStyle["color"]) => Promise<{
+    uri: string;
+    scale: number;
+}>;
+//# sourceMappingURL=get-image-source.d.ts.map

package/lib/typescript/module/src/get-image-source.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"get-image-source.d.ts","sourceRoot":"","sources":["../../../../src/get-image-source.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,SAAS,EAAE,MAAM,cAAc,CAAC;AAG9C,OAAO,KAAK,qBAAqB,MAAM,4BAA4B,CAAC;AAIpE,eAAO,MAAM,kBAAkB,GAC7B,kBAAkB,UAAU,CAAC,OAAO,qBAAqB,CAAC,EAC1D,eAAe,MAAM,EACrB,OAAO,MAAM,EACb,aAAwB,EACxB,QAAO,SAAS,CAAC,OAAO,CAAsB;;;CA2B/C,CAAC;AAEF,eAAO,MAAM,cAAc,GACzB,kBAAkB,UAAU,CAAC,OAAO,qBAAqB,CAAC,EAC1D,eAAe,MAAM,EACrB,OAAO,MAAM,EACb,aAAwB,EACxB,QAAO,SAAS,CAAC,OAAO,CAAsB;;;EA2B/C,CAAC"}

package/lib/typescript/module/src/index.d.ts

@@ -1,4 +1,5 @@
-export { createIconSet, DEFAULT_ICON_SIZE, DEFAULT_ICON_COLOR } from './create-icon-set';
-export type { IconProps, CreateIconSetOptions } from './create-icon-set';
-export { setDynamicLoadingEnabled, isDynamicLoadingEnabled, isDynamicLoadingSupported, setDynamicLoadingErrorCallback, } from './dynamicLoading/dynamic-loading-setting';
+export type { CreateIconSetOptions, IconProps } from './create-icon-set';
+export { createIconSet } from './create-icon-set';
+export { DEFAULT_ICON_COLOR, DEFAULT_ICON_SIZE } from './defaults';
+export { isDynamicLoadingEnabled, isDynamicLoadingSupported, setDynamicLoadingEnabled, setDynamicLoadingErrorCallback, } from './dynamicLoading/dynamic-loading-setting';
 //# sourceMappingURL=index.d.ts.map

package/lib/typescript/module/src/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,aAAa,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,MAAM,mBAAmB,CAAC;AACzF,YAAY,EAAE,SAAS,EAAE,oBAAoB,EAAE,MAAM,mBAAmB,CAAC;AACzE,OAAO,EACL,wBAAwB,EACxB,uBAAuB,EACvB,yBAAyB,EACzB,8BAA8B,GAC/B,MAAM,0CAA0C,CAAC"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAE,oBAAoB,EAAE,SAAS,EAAE,MAAM,mBAAmB,CAAC;AACzE,OAAO,EAAE,aAAa,EAAE,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAE,kBAAkB,EAAE,iBAAiB,EAAE,MAAM,YAAY,CAAC;AACnE,OAAO,EACL,uBAAuB,EACvB,yBAAyB,EACzB,wBAAwB,EACxB,8BAA8B,GAC/B,MAAM,0CAA0C,CAAC"}

package/lib/typescript/module/src/scripts/common.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"common.d.ts","sourceRoot":"","sources":["../../../../../src/scripts/common.ts"],"names":[],"mappings":"AA6CA,eAAO,MAAM,YAAY,GAAI,qBAAqB,MAAM,aAMvD,CAAC"}
+{"version":3,"file":"common.d.ts","sourceRoot":"","sources":["../../../../../src/scripts/common.ts"],"names":[],"mappings":"AA8CA,eAAO,MAAM,YAAY,GAAI,qBAAqB,MAAM,aAMvD,CAAC"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@react-native-vector-icons/common",
-  "version": "12.0.1",
+  "version": "12.1.0",
   "description": "Customizable Icons for React Native with support for image source and full styling.",
   "source": "./src/index.tsx",
   "main": "./lib/commonjs/index.js",
@@ -76,7 +76,7 @@
   },
   "devDependencies": {
     "@types/plist": "^3.0.5",
-    "@types/react": "^18.3.18",
+    "@types/react": "^19.0.12",
     "del-cli": "^6.0.0",
     "onchange": "^7.1.0",
     "react-native-builder-bob": "^0.35.2",
@@ -85,7 +85,7 @@
   "peerDependencies": {
     "react": "*",
     "react-native": "*",
-    "@react-native-vector-icons/get-image": "^12.0.1"
+    "@react-native-vector-icons/get-image": "^12.1.0"
   },
   "peerDependenciesMeta": {
     "@react-native-vector-icons/get-image": {

package/src/create-icon-set.tsx

@@ -1,17 +1,14 @@
 // eslint-disable-next-line import/no-extraneous-dependencies
 import React, { forwardRef, type Ref, useEffect } from 'react';
-
 // eslint-disable-next-line import/no-extraneous-dependencies
-import { PixelRatio, Platform, Text, type TextProps, type TextStyle, processColor } from 'react-native';
+import { Platform, Text, type TextProps, type TextStyle } from 'react-native';
 
 import createIconSourceCache from './create-icon-source-cache';
+import { DEFAULT_ICON_COLOR, DEFAULT_ICON_SIZE } from './defaults';
 import { dynamicLoader } from './dynamicLoading/dynamic-font-loading';
 import { isDynamicLoadingEnabled } from './dynamicLoading/dynamic-loading-setting';
 import type { FontSource } from './dynamicLoading/types';
-import { ensureGetImageAvailable } from './get-image-library';
-
-export const DEFAULT_ICON_SIZE = 12;
-export const DEFAULT_ICON_COLOR = 'black';
+import { getImageSource as getImageSourceImpl, getImageSourceSync as getImageSourceSyncImpl } from './get-image-source';
 
 type ValueData = { uri: string; scale: number };
 type GetImageSourceSyncIconFunc<GM> = (name: GM, size?: number, color?: TextStyle['color']) => ValueData | undefined;
@@ -65,7 +62,11 @@ export function createIconSet<GM extends Record<string, number>>(
 ): IconComponent<GM> {
   const { postScriptName, fontFileName, fontStyle } =
     typeof postScriptNameOrOptions === 'string'
-      ? { postScriptName: postScriptNameOrOptions, fontFileName: fontFileNameParam, fontStyle: fontStyleParam }
+      ? {
+          postScriptName: postScriptNameOrOptions,
+          fontFileName: fontFileNameParam,
+          fontStyle: fontStyleParam,
+        }
       : postScriptNameOrOptions;
 
   const fontBasename = fontFileName ? fontFileName.replace(/\.(otf|ttf)$/, '') : postScriptName;
@@ -83,13 +84,13 @@ export function createIconSet<GM extends Record<string, number>>(
   };
 
   const resolveGlyph = (name: keyof GM) => {
-    const glyph = glyphMap[name] || '?';
+    const glyph = glyphMap[name];
 
     if (typeof glyph === 'number') {
       return String.fromCodePoint(glyph);
     }
 
-    return glyph;
+    return '?';
   };
 
   const Icon = ({
@@ -153,69 +154,15 @@ export function createIconSet<GM extends Record<string, number>>(
 
   const imageSourceCache = createIconSourceCache();
 
-  const getImageSourceSync = (
-    name: keyof GM,
-    size = DEFAULT_ICON_SIZE,
-    color: TextStyle['color'] = DEFAULT_ICON_COLOR,
-  ) => {
-    const NativeIconAPI = ensureGetImageAvailable();
-
-    const glyph = resolveGlyph(name);
-    const processedColor = processColor(color);
-    const cacheKey = `${glyph}:${size}:${String(processedColor)}`;
-
-    if (imageSourceCache.has(cacheKey)) {
-      // FIXME: Should this check if it's an error and throw it again?
-      return imageSourceCache.get(cacheKey);
-    }
-
-    try {
-      const imagePath = NativeIconAPI.getImageForFontSync(
-        fontReference,
-        glyph,
-        size,
-        processedColor as number, // FIXME what if a non existant colour was passed in?
-      );
-      const value = { uri: imagePath, scale: PixelRatio.get() };
-      imageSourceCache.setValue(cacheKey, value);
-      return value;
-    } catch (error) {
-      imageSourceCache.setError(cacheKey, error as Error);
-      throw error;
+  const getImageSource: GetImageSourceIconFunc<keyof GM> = async (name, size, color) => {
+    if (typeof postScriptNameOrOptions === 'object' && typeof postScriptNameOrOptions.fontSource !== 'undefined') {
+      await dynamicLoader.loadFontAsync(fontReference, postScriptNameOrOptions.fontSource);
     }
+    return getImageSourceImpl(imageSourceCache, fontReference, resolveGlyph(name), size, color);
   };
 
-  const getImageSource = async (
-    name: keyof GM,
-    size = DEFAULT_ICON_SIZE,
-    color: TextStyle['color'] = DEFAULT_ICON_COLOR,
-  ) => {
-    const NativeIconAPI = ensureGetImageAvailable();
-
-    const glyph = resolveGlyph(name);
-    const processedColor = processColor(color);
-    const cacheKey = `${glyph}:${size}:${String(processedColor)}`;
-
-    if (imageSourceCache.has(cacheKey)) {
-      // FIXME: Should this check if it's an error and throw it again?
-      return imageSourceCache.get(cacheKey);
-    }
-
-    try {
-      const imagePath = await NativeIconAPI.getImageForFont(
-        fontReference,
-        glyph,
-        size,
-        processedColor as number, // FIXME what if a non existant colour was passed in?
-      );
-      const value = { uri: imagePath, scale: PixelRatio.get() };
-      imageSourceCache.setValue(cacheKey, value);
-      return value;
-    } catch (error) {
-      imageSourceCache.setError(cacheKey, error as Error);
-      throw error;
-    }
-  };
+  const getImageSourceSync: GetImageSourceSyncIconFunc<keyof GM> = (name, size, color) =>
+    getImageSourceSyncImpl(imageSourceCache, fontReference, resolveGlyph(name), size, color);
 
   const IconNamespace = Object.assign(WrappedIcon, {
     getImageSource,

package/src/create-icon-source-cache.ts

@@ -12,8 +12,6 @@ export default function createIconSourceCache() {
 
   const setError = (key: string, error: Error) => cache.set(key, { type: TYPE_ERROR, data: error });
 
-  const has = (key: string) => cache.has(key);
-
   const get = (key: string) => {
     const value = cache.get(key);
     if (!value) {
@@ -27,5 +25,5 @@ export default function createIconSourceCache() {
     return data;
   };
 
-  return { setValue, setError, has, get };
+  return { setValue, setError, get };
 }

package/src/defaults.ts

@@ -0,0 +1,2 @@
+export const DEFAULT_ICON_SIZE = 12;
+export const DEFAULT_ICON_COLOR = 'black';

package/src/dynamicLoading/dynamic-font-loading.ts

@@ -1,3 +1,5 @@
+import { Image } from 'react-native';
+
 /*
  * The following imports are always present when react native is installed
  * in the future, more explicit apis will be exposed by the core, including typings
@@ -5,7 +7,7 @@
 // @ts-expect-error missing types
 // eslint-disable-next-line import/no-extraneous-dependencies,import/no-unresolved
 import { getAssetByID } from '@react-native/assets-registry/registry';
-import { Image } from 'react-native';
+
 import { assertExpoModulesPresent, getErrorCallback } from './dynamic-loading-setting';
 import type { DynamicLoader, FontSource } from './types';
 

package/src/dynamicLoading/dynamic-loading-setting.ts

@@ -13,11 +13,23 @@ type ExpoFontLoaderModule = {
   loadAsync: (fontFamilyAlias: string, fileUri: string) => Promise<void>;
 };
 
+type ExpoFontUtilsModule = {
+  renderToImageAsync: (
+    glyph: string,
+    options: {
+      fontFamily?: string;
+      size?: number;
+      color?: number;
+    },
+  ) => Promise<string>;
+};
+
 declare global {
   interface ExpoGlobal {
     modules: {
       ExpoAsset?: ExpoAssetModule;
       ExpoFontLoader?: ExpoFontLoaderModule;
+      ExpoFontUtils?: ExpoFontUtilsModule;
     };
   }
 
@@ -44,6 +56,17 @@ function getIsDynamicLoadingSupported(globalObj: any): globalObj is {
   );
 }
 
+// biome-ignore lint/suspicious/noExplicitAny: this is used internally with globalThis
+export function getIsRenderToImageSupported(globalObj: any): globalObj is {
+  expo: {
+    modules: {
+      ExpoFontUtils: ExpoFontUtilsModule;
+    };
+  };
+} {
+  return globalObj?.expo && typeof globalObj.expo.modules?.ExpoFontUtils?.renderToImageAsync === 'function';
+}
+
 export function assertExpoModulesPresent(globalObj: unknown): asserts globalObj is { expo: ExpoGlobalType } {
   if (!getIsDynamicLoadingSupported(globalObj)) {
     throw new Error('Dynamic font loading for Expo is not available.');
@@ -87,11 +110,7 @@ export const setDynamicLoadingEnabled = (value: boolean): boolean => {
  * */
 export const isDynamicLoadingEnabled = () => dynamicFontLoadingEnabled;
 
-type ErrorCallback = (args: {
-  error: Error;
-  fontFamily: string;
-  fontSource: FontSource;
-}) => void;
+type ErrorCallback = (args: { error: Error; fontFamily: string; fontSource: FontSource }) => void;
 
 let dynamicLoadingErrorCallback: undefined | ErrorCallback;
 

package/src/get-image-library.ts

@@ -1,3 +1,5 @@
+import { getIsRenderToImageSupported } from './dynamicLoading/dynamic-loading-setting';
+
 // eslint-disable-next-line import/no-mutable-exports
 let NativeIconAPI: typeof import('@react-native-vector-icons/get-image') | null = null;
 
@@ -5,17 +7,36 @@ try {
   // eslint-disable-next-line global-require,import/no-extraneous-dependencies,@typescript-eslint/no-require-imports
   NativeIconAPI = require('@react-native-vector-icons/get-image');
 } catch {
-  // No warning at this stage
+  // if this fails, it's likely due to:
+  // "Invariant Violation: TurboModuleRegistry.getEnforcing(...): 'VectorIcons' could not be found. ..."
+  // No warning at this stage.
 }
 
+const globalRef = globalThis;
+const hasExpoRenderToImage = getIsRenderToImageSupported(globalRef);
+
 export const ensureGetImageAvailable = () => {
-  if (!NativeIconAPI) {
-    throw new Error(
-      'Could not import @react-native-vector-icons/get-image, did you install it? It is required for getImageSource*',
-    );
+  if (NativeIconAPI) {
+    NativeIconAPI.ensureNativeModuleAvailable();
+    return NativeIconAPI;
   }
-
-  NativeIconAPI.ensureNativeModuleAvailable();
-
-  return NativeIconAPI;
+  if (hasExpoRenderToImage) {
+    const { ExpoFontUtils } = globalRef.expo.modules;
+    return {
+      getImageForFont: async (fontReference: string, glyph: string, size: number, color: number) =>
+        ExpoFontUtils.renderToImageAsync(glyph, {
+          fontFamily: fontReference,
+          size,
+          color,
+        }),
+      getImageForFontSync: () => {
+        throw new Error(
+          'You attempted to call `getImageForFontSync`. Expo dev client with `@react-native-vector-icons/get-image` installed is required for this. Alternatively, call `getImageForFont` or generate the image yourself and bundle it with the app.',
+        );
+      },
+    };
+  }
+  throw new Error(
+    'Error in getImageSource / getImageSourceSync: You need to either (1) install `@react-native-vector-icons/get-image` or (2) use Expo SDK 53+ (Expo dev client or Expo Go). Check your setup and rebuild the app.',
+  );
 };

package/src/get-image-source.ts

@@ -0,0 +1,74 @@
+import type { TextStyle } from 'react-native';
+import { PixelRatio, processColor } from 'react-native';
+
+import type createIconSourceCache from './create-icon-source-cache';
+import { DEFAULT_ICON_COLOR, DEFAULT_ICON_SIZE } from './defaults';
+import { ensureGetImageAvailable } from './get-image-library';
+
+export const getImageSourceSync = (
+  imageSourceCache: ReturnType<typeof createIconSourceCache>,
+  fontReference: string,
+  glyph: string,
+  size = DEFAULT_ICON_SIZE,
+  color: TextStyle['color'] = DEFAULT_ICON_COLOR,
+) => {
+  const NativeIconAPI = ensureGetImageAvailable();
+
+  const processedColor = processColor(color);
+  const cacheKey = `${glyph}:${size}:${String(processedColor)}`;
+
+  const maybeCachedValue = imageSourceCache.get(cacheKey);
+  if (maybeCachedValue !== undefined) {
+    // FIXME: Should this check if it's an error and throw it again?
+    return maybeCachedValue;
+  }
+
+  try {
+    const imagePath = NativeIconAPI.getImageForFontSync(
+      fontReference,
+      glyph,
+      size,
+      processedColor as number, // FIXME what if a non existent colour was passed in?
+    );
+    const value = { uri: imagePath, scale: PixelRatio.get() };
+    imageSourceCache.setValue(cacheKey, value);
+    return value;
+  } catch (error) {
+    imageSourceCache.setError(cacheKey, error as Error);
+    throw error;
+  }
+};
+
+export const getImageSource = async (
+  imageSourceCache: ReturnType<typeof createIconSourceCache>,
+  fontReference: string,
+  glyph: string,
+  size = DEFAULT_ICON_SIZE,
+  color: TextStyle['color'] = DEFAULT_ICON_COLOR,
+) => {
+  const NativeIconAPI = ensureGetImageAvailable();
+
+  const processedColor = processColor(color);
+  const cacheKey = `${glyph}:${size}:${String(processedColor)}`;
+
+  const maybeCachedValue = imageSourceCache.get(cacheKey);
+  if (maybeCachedValue !== undefined) {
+    // FIXME: Should this check if it's an error and throw it again?
+    return maybeCachedValue;
+  }
+
+  try {
+    const imagePath = await NativeIconAPI.getImageForFont(
+      fontReference,
+      glyph,
+      size,
+      processedColor as number, // FIXME what if a non existent colour was passed in?
+    );
+    const value = { uri: imagePath, scale: PixelRatio.get() };
+    imageSourceCache.setValue(cacheKey, value);
+    return value;
+  } catch (error) {
+    imageSourceCache.setError(cacheKey, error as Error);
+    throw error;
+  }
+};

package/src/index.ts

@@ -1,8 +1,9 @@
-export { createIconSet, DEFAULT_ICON_SIZE, DEFAULT_ICON_COLOR } from './create-icon-set';
-export type { IconProps, CreateIconSetOptions } from './create-icon-set';
+export type { CreateIconSetOptions, IconProps } from './create-icon-set';
+export { createIconSet } from './create-icon-set';
+export { DEFAULT_ICON_COLOR, DEFAULT_ICON_SIZE } from './defaults';
 export {
-  setDynamicLoadingEnabled,
   isDynamicLoadingEnabled,
   isDynamicLoadingSupported,
+  setDynamicLoadingEnabled,
   setDynamicLoadingErrorCallback,
 } from './dynamicLoading/dynamic-loading-setting';

package/src/scripts/common.ts

@@ -1,5 +1,6 @@
 import fs from 'node:fs';
 import path from 'node:path';
+
 import { resolveNodeModuleDir } from '@react-native-community/cli-tools';
 
 const getPackageJson = (filename: string) => {

package/src/scripts/updatePlist.ts

@@ -3,6 +3,7 @@
 
 import fs from 'node:fs';
 import * as path from 'node:path';
+
 import pc from 'picocolors';
 import * as plist from 'plist';
 

package/android/generated/android/app/build/generated/source/codegen/java/com/facebook/fbreact/specs/NativeVectorIconsSpec.java

@@ -1,42 +0,0 @@
-
-/**
- * This code was generated by [react-native-codegen](https://www.npmjs.com/package/react-native-codegen).
- *
- * Do not edit this file as changes may cause incorrect behavior and will be lost
- * once the code is regenerated.
- *
- * @generated by codegen project: GenerateModuleJavaSpec.js
- *
- * @nolint
- */
-
-package com.facebook.fbreact.specs;
-
-import com.facebook.proguard.annotations.DoNotStrip;
-import com.facebook.react.bridge.Promise;
-import com.facebook.react.bridge.ReactApplicationContext;
-import com.facebook.react.bridge.ReactContextBaseJavaModule;
-import com.facebook.react.bridge.ReactMethod;
-import com.facebook.react.turbomodule.core.interfaces.TurboModule;
-import javax.annotation.Nonnull;
-
-public abstract class NativeVectorIconsSpec extends ReactContextBaseJavaModule implements TurboModule {
-  public static final String NAME = "VectorIcons";
-
-  public NativeVectorIconsSpec(ReactApplicationContext reactContext) {
-    super(reactContext);
-  }
-
-  @Override
-  public @Nonnull String getName() {
-    return NAME;
-  }
-
-  @ReactMethod
-  @DoNotStrip
-  public abstract void getImageForFont(String fontFamilyName, String glyph, double fontSize, double color, Promise promise);
-
-  @ReactMethod(isBlockingSynchronousMethod = true)
-  @DoNotStrip
-  public abstract String getImageForFontSync(String fontFamilyName, String glyph, double fontSize, double color);
-}

package/android/generated/android/app/build/generated/source/codegen/jni/CMakeLists.txt

@@ -1,36 +0,0 @@
-# Copyright (c) Meta Platforms, Inc. and affiliates.
-#
-# This source code is licensed under the MIT license found in the
-# LICENSE file in the root directory of this source tree.
-
-cmake_minimum_required(VERSION 3.13)
-set(CMAKE_VERBOSE_MAKEFILE on)
-
-file(GLOB react_codegen_SRCS CONFIGURE_DEPENDS *.cpp react/renderer/components/RNVectorIconsSpec/*.cpp)
-
-add_library(
-  react_codegen_RNVectorIconsSpec
-  OBJECT
-  ${react_codegen_SRCS}
-)
-
-target_include_directories(react_codegen_RNVectorIconsSpec PUBLIC . react/renderer/components/RNVectorIconsSpec)
-
-target_link_libraries(
-  react_codegen_RNVectorIconsSpec
-  fbjni
-  jsi
-  # We need to link different libraries based on whether we are building rncore or not, that's necessary
-  # because we want to break a circular dependency between react_codegen_rncore and reactnative
-  reactnative
-)
-
-target_compile_options(
-  react_codegen_RNVectorIconsSpec
-  PRIVATE
-  -DLOG_TAG=\"ReactNative\"
-  -fexceptions
-  -frtti
-  -std=c++20
-  -Wall
-)

package/android/generated/android/app/build/generated/source/codegen/jni/RNVectorIconsSpec-generated.cpp

@@ -1,38 +0,0 @@
-
-/**
- * This code was generated by [react-native-codegen](https://www.npmjs.com/package/react-native-codegen).
- *
- * Do not edit this file as changes may cause incorrect behavior and will be lost
- * once the code is regenerated.
- *
- * @generated by codegen project: GenerateModuleJniCpp.js
- */
-
-#include "RNVectorIconsSpec.h"
-
-namespace facebook::react {
-
-static facebook::jsi::Value __hostFunction_NativeVectorIconsSpecJSI_getImageForFont(facebook::jsi::Runtime& rt, TurboModule &turboModule, const facebook::jsi::Value* args, size_t count) {
-  static jmethodID cachedMethodId = nullptr;
-  return static_cast<JavaTurboModule &>(turboModule).invokeJavaMethod(rt, PromiseKind, "getImageForFont", "(Ljava/lang/String;Ljava/lang/String;DDLcom/facebook/react/bridge/Promise;)V", args, count, cachedMethodId);
-}
-
-static facebook::jsi::Value __hostFunction_NativeVectorIconsSpecJSI_getImageForFontSync(facebook::jsi::Runtime& rt, TurboModule &turboModule, const facebook::jsi::Value* args, size_t count) {
-  static jmethodID cachedMethodId = nullptr;
-  return static_cast<JavaTurboModule &>(turboModule).invokeJavaMethod(rt, StringKind, "getImageForFontSync", "(Ljava/lang/String;Ljava/lang/String;DD)Ljava/lang/String;", args, count, cachedMethodId);
-}
-
-NativeVectorIconsSpecJSI::NativeVectorIconsSpecJSI(const JavaTurboModule::InitParams &params)
-  : JavaTurboModule(params) {
-  methodMap_["getImageForFont"] = MethodMetadata {4, __hostFunction_NativeVectorIconsSpecJSI_getImageForFont};
-  methodMap_["getImageForFontSync"] = MethodMetadata {4, __hostFunction_NativeVectorIconsSpecJSI_getImageForFontSync};
-}
-
-std::shared_ptr<TurboModule> RNVectorIconsSpec_ModuleProvider(const std::string &moduleName, const JavaTurboModule::InitParams &params) {
-  if (moduleName == "VectorIcons") {
-    return std::make_shared<NativeVectorIconsSpecJSI>(params);
-  }
-  return nullptr;
-}
-
-} // namespace facebook::react

package/android/generated/android/app/build/generated/source/codegen/jni/RNVectorIconsSpec.h

@@ -1,31 +0,0 @@
-
-/**
- * This code was generated by [react-native-codegen](https://www.npmjs.com/package/react-native-codegen).
- *
- * Do not edit this file as changes may cause incorrect behavior and will be lost
- * once the code is regenerated.
- *
- * @generated by codegen project: GenerateModuleJniH.js
- */
-
-#pragma once
-
-#include <ReactCommon/JavaTurboModule.h>
-#include <ReactCommon/TurboModule.h>
-#include <jsi/jsi.h>
-
-namespace facebook::react {
-
-/**
- * JNI C++ class for module 'NativeVectorIcons'
- */
-class JSI_EXPORT NativeVectorIconsSpecJSI : public JavaTurboModule {
-public:
-  NativeVectorIconsSpecJSI(const JavaTurboModule::InitParams &params);
-};
-
-
-JSI_EXPORT
-std::shared_ptr<TurboModule> RNVectorIconsSpec_ModuleProvider(const std::string &moduleName, const JavaTurboModule::InitParams &params);
-
-} // namespace facebook::react