react-native-nitro-image-pipeline 1.5.0 → 1.6.0
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 +56 -7
- package/android/src/main/java/com/margelo/nitro/nitroimagepipeline/HybridNitroImagePipeline.kt +27 -2
- package/ios/HybridNitroImagePipeline.swift +47 -9
- package/ios/PipelineImageLoader.swift +2 -2
- package/lib/commonjs/NativePipelineImage.js +2 -1
- package/lib/commonjs/NativePipelineImage.js.map +1 -1
- package/lib/commonjs/PipelineImage.js.map +1 -1
- package/lib/commonjs/index.js +13 -0
- package/lib/commonjs/index.js.map +1 -1
- package/lib/commonjs/resolveImageSource.js +89 -0
- package/lib/commonjs/resolveImageSource.js.map +1 -0
- package/lib/commonjs/useImage.js +8 -4
- package/lib/commonjs/useImage.js.map +1 -1
- package/lib/commonjs/usePipelineImageLoader.js +8 -3
- package/lib/commonjs/usePipelineImageLoader.js.map +1 -1
- package/lib/module/NativePipelineImage.js +2 -1
- package/lib/module/NativePipelineImage.js.map +1 -1
- package/lib/module/PipelineImage.js.map +1 -1
- package/lib/module/index.js +1 -0
- package/lib/module/index.js.map +1 -1
- package/lib/module/resolveImageSource.js +83 -0
- package/lib/module/resolveImageSource.js.map +1 -0
- package/lib/module/useImage.js +8 -4
- package/lib/module/useImage.js.map +1 -1
- package/lib/module/usePipelineImageLoader.js +8 -3
- package/lib/module/usePipelineImageLoader.js.map +1 -1
- package/lib/typescript/src/NativePipelineImage.d.ts +7 -2
- package/lib/typescript/src/NativePipelineImage.d.ts.map +1 -1
- package/lib/typescript/src/PipelineImage.d.ts +7 -2
- package/lib/typescript/src/PipelineImage.d.ts.map +1 -1
- package/lib/typescript/src/index.d.ts +1 -0
- package/lib/typescript/src/index.d.ts.map +1 -1
- package/lib/typescript/src/resolveImageSource.d.ts +56 -0
- package/lib/typescript/src/resolveImageSource.d.ts.map +1 -0
- package/lib/typescript/src/specs/nitro-image-toolkit.nitro.d.ts +12 -0
- package/lib/typescript/src/specs/nitro-image-toolkit.nitro.d.ts.map +1 -1
- package/lib/typescript/src/useImage.d.ts +10 -4
- package/lib/typescript/src/useImage.d.ts.map +1 -1
- package/lib/typescript/src/usePipelineImageLoader.d.ts +4 -2
- package/lib/typescript/src/usePipelineImageLoader.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/NativePipelineImage.tsx +8 -3
- package/src/PipelineImage.tsx +7 -2
- package/src/index.ts +5 -0
- package/src/resolveImageSource.ts +83 -0
- package/src/specs/nitro-image-toolkit.nitro.ts +12 -0
- package/src/useImage.ts +26 -15
- package/src/usePipelineImageLoader.ts +11 -3
package/lib/module/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["NativePipelineImage","NitroImagePipeline","PipelineImage","cornerRadiusForStyle","resizeForLayout","resizeForStyle","useImage","usePipelineImageLoader"],"sourceRoot":"../../src","sources":["index.ts"],"mappings":";;AAAA,SACEA,mBAAmB,QAGd,uBAAuB;AAC9B,SAASC,kBAAkB,QAAQ,sBAAsB;AACzD,SACEC,aAAa,QAGR,iBAAiB;AACxB,SACEC,oBAAoB,EACpBC,eAAe,EACfC,cAAc,QACT,kBAAkB;AAQzB,SAASC,QAAQ,QAAQ,YAAY;AACrC,SAASC,sBAAsB,QAAQ,0BAA0B","ignoreList":[]}
|
|
1
|
+
{"version":3,"names":["NativePipelineImage","NitroImagePipeline","PipelineImage","resolveImageUrl","UNREGISTERED_ASSET_URL","cornerRadiusForStyle","resizeForLayout","resizeForStyle","useImage","usePipelineImageLoader"],"sourceRoot":"../../src","sources":["index.ts"],"mappings":";;AAAA,SACEA,mBAAmB,QAGd,uBAAuB;AAC9B,SAASC,kBAAkB,QAAQ,sBAAsB;AACzD,SACEC,aAAa,QAGR,iBAAiB;AACxB,SAEEC,eAAe,EACfC,sBAAsB,QACjB,sBAAsB;AAC7B,SACEC,oBAAoB,EACpBC,eAAe,EACfC,cAAc,QACT,kBAAkB;AAQzB,SAASC,QAAQ,QAAQ,YAAY;AACrC,SAASC,sBAAsB,QAAQ,0BAA0B","ignoreList":[]}
|
|
@@ -0,0 +1,83 @@
|
|
|
1
|
+
"use strict";
|
|
2
|
+
|
|
3
|
+
import { Image as RNImage } from 'react-native';
|
|
4
|
+
|
|
5
|
+
/**
|
|
6
|
+
* What the pipeline can load: a URL string, or the id a `require()`d image
|
|
7
|
+
* asset evaluates to.
|
|
8
|
+
*
|
|
9
|
+
* As a string, `url` is passed to the native loader as-is. Accepted forms:
|
|
10
|
+
*
|
|
11
|
+
* - `https://` / `http://` — fetched over the network and cached on disk.
|
|
12
|
+
* - `file://` URLs and plain absolute paths (`/var/…/photo.jpg`) — read from
|
|
13
|
+
* the file system. The result is cached in memory only; there is nothing
|
|
14
|
+
* to gain from copying a local file into the disk cache.
|
|
15
|
+
* - Android also accepts `content://` URIs and, from a release build's
|
|
16
|
+
* resources, a bare drawable name — which is what `require()` resolves to
|
|
17
|
+
* there. iOS resolves `require()` to a `file://` URL into the app bundle.
|
|
18
|
+
*
|
|
19
|
+
* A `require('./photo.png')` is resolved with `Image.resolveAssetSource`, so
|
|
20
|
+
* it works the same in debug (streamed from Metro) and release (bundled).
|
|
21
|
+
*/
|
|
22
|
+
|
|
23
|
+
/**
|
|
24
|
+
* Turns an {@linkcode ImageSource} into the URL string the native pipeline
|
|
25
|
+
* loads: strings pass through unchanged, a `require()`d asset is resolved via
|
|
26
|
+
* `Image.resolveAssetSource` (the scale-matched variant, like `<Image>`).
|
|
27
|
+
*
|
|
28
|
+
* The components and hooks call this for you; use it when calling
|
|
29
|
+
* `NitroImagePipeline.loadImage`/`preLoadImage` directly with a `require()`.
|
|
30
|
+
* @throws If `source` is a number that is not a registered asset.
|
|
31
|
+
* @example
|
|
32
|
+
* ```ts
|
|
33
|
+
* const image = await NitroImagePipeline.loadImage(
|
|
34
|
+
* resolveImageUrl(require('./photo.png')),
|
|
35
|
+
* { blur: 4 },
|
|
36
|
+
* );
|
|
37
|
+
* ```
|
|
38
|
+
*/
|
|
39
|
+
export function resolveImageUrl(source) {
|
|
40
|
+
if (typeof source === 'string') {
|
|
41
|
+
return source;
|
|
42
|
+
}
|
|
43
|
+
const resolved = RNImage.resolveAssetSource(source);
|
|
44
|
+
if (resolved == null) {
|
|
45
|
+
throw new Error(`Not a registered image asset: require() id ${source}`);
|
|
46
|
+
}
|
|
47
|
+
return resolved.uri;
|
|
48
|
+
}
|
|
49
|
+
|
|
50
|
+
/**
|
|
51
|
+
* A URL no loader can resolve, standing in for a `require()` id that is not
|
|
52
|
+
* a registered asset. Its scheme has no fetcher on either platform, so the
|
|
53
|
+
* request fails at load time — the same way a missing file does — instead of
|
|
54
|
+
* throwing from a component's render.
|
|
55
|
+
*/
|
|
56
|
+
export const UNREGISTERED_ASSET_URL = 'unregistered-asset://';
|
|
57
|
+
|
|
58
|
+
/**
|
|
59
|
+
* {@linkcode resolveImageUrl} for code that runs during render: an
|
|
60
|
+
* unregistered `require()` id yields {@linkcode UNREGISTERED_ASSET_URL} (and
|
|
61
|
+
* a warning in development) rather than throwing.
|
|
62
|
+
*/
|
|
63
|
+
export function resolveImageUrlOrFallback(source) {
|
|
64
|
+
try {
|
|
65
|
+
return resolveImageUrl(source);
|
|
66
|
+
} catch (error) {
|
|
67
|
+
if (__DEV__) {
|
|
68
|
+
console.warn(`[react-native-nitro-image-pipeline] ${error.message}`);
|
|
69
|
+
}
|
|
70
|
+
return UNREGISTERED_ASSET_URL;
|
|
71
|
+
}
|
|
72
|
+
}
|
|
73
|
+
|
|
74
|
+
/**
|
|
75
|
+
* A stable, per-source `recyclingKey` for `<NativeNitroImage>`: the URL
|
|
76
|
+
* itself for strings, and a tag derived from the asset id for a `require()`
|
|
77
|
+
* (resolving it would cost an asset-registry lookup per render for nothing
|
|
78
|
+
* more than a distinct key).
|
|
79
|
+
*/
|
|
80
|
+
export function recyclingKeyFor(source) {
|
|
81
|
+
return typeof source === 'string' ? source : `asset:${source}`;
|
|
82
|
+
}
|
|
83
|
+
//# sourceMappingURL=resolveImageSource.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"names":["Image","RNImage","resolveImageUrl","source","resolved","resolveAssetSource","Error","uri","UNREGISTERED_ASSET_URL","resolveImageUrlOrFallback","error","__DEV__","console","warn","message","recyclingKeyFor"],"sourceRoot":"../../src","sources":["resolveImageSource.ts"],"mappings":";;AAAA,SAASA,KAAK,IAAIC,OAAO,QAAQ,cAAc;;AAE/C;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;;AAGA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,eAAeA,CAACC,MAAmB,EAAU;EAC3D,IAAI,OAAOA,MAAM,KAAK,QAAQ,EAAE;IAC9B,OAAOA,MAAM;EACf;EACA,MAAMC,QAAQ,GAAGH,OAAO,CAACI,kBAAkB,CAACF,MAAM,CAAC;EACnD,IAAIC,QAAQ,IAAI,IAAI,EAAE;IACpB,MAAM,IAAIE,KAAK,CAAC,8CAA8CH,MAAM,EAAE,CAAC;EACzE;EACA,OAAOC,QAAQ,CAACG,GAAG;AACrB;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,MAAMC,sBAAsB,GAAG,uBAAuB;;AAE7D;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,yBAAyBA,CAACN,MAAmB,EAAU;EACrE,IAAI;IACF,OAAOD,eAAe,CAACC,MAAM,CAAC;EAChC,CAAC,CAAC,OAAOO,KAAK,EAAE;IACd,IAAIC,OAAO,EAAE;MACXC,OAAO,CAACC,IAAI,CACV,uCAAwCH,KAAK,CAAWI,OAAO,EACjE,CAAC;IACH;IACA,OAAON,sBAAsB;EAC/B;AACF;;AAEA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASO,eAAeA,CAACZ,MAAmB,EAAU;EAC3D,OAAO,OAAOA,MAAM,KAAK,QAAQ,GAAGA,MAAM,GAAG,SAASA,MAAM,EAAE;AAChE","ignoreList":[]}
|
package/lib/module/useImage.js
CHANGED
|
@@ -2,12 +2,14 @@
|
|
|
2
2
|
|
|
3
3
|
import { useEffect, useRef, useState } from 'react';
|
|
4
4
|
import { NitroImagePipeline } from './NitroImagePipeline';
|
|
5
|
+
import { resolveImageUrl } from './resolveImageSource';
|
|
5
6
|
/**
|
|
6
|
-
* A hook to asynchronously load an image from the
|
|
7
|
-
*
|
|
7
|
+
* A hook to asynchronously load an image from `url` through the pipeline
|
|
8
|
+
* into memory.
|
|
8
9
|
* @example
|
|
9
10
|
* ```ts
|
|
10
|
-
* const { image, error } = useImage({
|
|
11
|
+
* const { image, error } = useImage({ url: 'https://example.com/photo.jpg' });
|
|
12
|
+
* const { image: logo } = useImage({ url: require('./logo.png') });
|
|
11
13
|
* ```
|
|
12
14
|
*/
|
|
13
15
|
export function useImage({
|
|
@@ -51,7 +53,9 @@ export function useImage({
|
|
|
51
53
|
if (enabled) {
|
|
52
54
|
(async () => {
|
|
53
55
|
try {
|
|
54
|
-
|
|
56
|
+
// Resolved inside the try so an unregistered `require()` id
|
|
57
|
+
// surfaces as the error state instead of throwing from the effect.
|
|
58
|
+
const result = await NitroImagePipeline.loadImage(resolveImageUrl(url), {
|
|
55
59
|
blur,
|
|
56
60
|
cornerRadius: isUniformRadius ? uniformRadius : {
|
|
57
61
|
topLeft,
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useEffect","useRef","useState","NitroImagePipeline","useImage","url","blur","cornerRadius","resize","cache","enabled","image","setImage","undefined","error","loadedUrlRef","isUniformRadius","uniformRadius","topLeft","topRight","bottomLeft","bottomRight","resizeWidth","width","resizeHeight","height","cancelled","current","result","loadImage","e","Error"],"sourceRoot":"../../src","sources":["useImage.ts"],"mappings":";;AAAA,SAASA,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AAGnD,SAASC,kBAAkB,QAAQ,sBAAsB;
|
|
1
|
+
{"version":3,"names":["useEffect","useRef","useState","NitroImagePipeline","resolveImageUrl","useImage","url","blur","cornerRadius","resize","cache","enabled","image","setImage","undefined","error","loadedUrlRef","isUniformRadius","uniformRadius","topLeft","topRight","bottomLeft","bottomRight","resizeWidth","width","resizeHeight","height","cancelled","current","result","loadImage","e","Error"],"sourceRoot":"../../src","sources":["useImage.ts"],"mappings":";;AAAA,SAASA,SAAS,EAAEC,MAAM,EAAEC,QAAQ,QAAQ,OAAO;AAGnD,SAASC,kBAAkB,QAAQ,sBAAsB;AACzD,SAA2BC,eAAe,QAAQ,sBAAsB;AAwBxE;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,QAAQA,CAAC;EACvBC,GAAG;EACHC,IAAI,GAAG,CAAC;EACRC,YAAY,GAAG,CAAC;EAChBC,MAAM;EACNC,KAAK;EACLC,OAAO,GAAG;AAmCZ,CAAC,EAAU;EACT,MAAM,CAACC,KAAK,EAAEC,QAAQ,CAAC,GAAGX,QAAQ,CAAS;IACzCU,KAAK,EAAEE,SAAS;IAChBC,KAAK,EAAED;EACT,CAAC,CAAC;EACF,MAAME,YAAY,GAAGf,MAAM,CAACK,GAAG,CAAC;;EAEhC;EACA;EACA,MAAMW,eAAe,GAAG,OAAOT,YAAY,KAAK,QAAQ;EACxD,MAAMU,aAAa,GAAGD,eAAe,GAAGT,YAAY,GAAG,CAAC;EACxD,MAAM;IACJW,OAAO,GAAG,CAAC;IACXC,QAAQ,GAAG,CAAC;IACZC,UAAU,GAAG,CAAC;IACdC,WAAW,GAAG;EAChB,CAAC,GAAGL,eAAe,GAAG,CAAC,CAAC,GAAGT,YAAY;EACvC,MAAMe,WAAW,GAAGd,MAAM,EAAEe,KAAK,IAAI,CAAC;EACtC,MAAMC,YAAY,GAAGhB,MAAM,EAAEiB,MAAM,IAAI,CAAC;EAExC1B,SAAS,CAAC,MAAM;IACd,IAAI2B,SAAS,GAAG,KAAK;IACrB;IACA;IACA;IACA,IAAIX,YAAY,CAACY,OAAO,KAAKtB,GAAG,EAAE;MAChCU,YAAY,CAACY,OAAO,GAAGtB,GAAG;MAC1BO,QAAQ,CAAC;QAAED,KAAK,EAAEE,SAAS;QAAEC,KAAK,EAAED;MAAU,CAAC,CAAC;IAClD;IAEA,IAAIH,OAAO,EAAE;MACX,CAAC,YAAY;QACX,IAAI;UACF;UACA;UACA,MAAMkB,MAAM,GAAG,MAAM1B,kBAAkB,CAAC2B,SAAS,CAC/C1B,eAAe,CAACE,GAAG,CAAC,EACpB;YACEC,IAAI;YACJC,YAAY,EAAES,eAAe,GACzBC,aAAa,GACb;cAAEC,OAAO;cAAEC,QAAQ;cAAEC,UAAU;cAAEC;YAAY,CAAC;YAClDb,MAAM,EACJc,WAAW,GAAG,CAAC,IAAIE,YAAY,GAAG,CAAC,GAC/B;cAAED,KAAK,EAAED,WAAW;cAAEG,MAAM,EAAED;YAAa,CAAC,GAC5CX,SAAS;YACfJ;UACF,CACF,CAAC;UAED,IAAI,CAACiB,SAAS,EAAE;YACdd,QAAQ,CAAC;cAAED,KAAK,EAAEiB,MAAM;cAAEd,KAAK,EAAED;YAAU,CAAC,CAAC;UAC/C;QACF,CAAC,CAAC,OAAOiB,CAAC,EAAE;UACV,MAAMhB,KAAK,GAAGgB,CAAC,YAAYC,KAAK,GAAGD,CAAC,GAAG,IAAIC,KAAK,CAAC,GAAGD,CAAC,EAAE,CAAC;UACxD,IAAI,CAACJ,SAAS,EAAE;YACdd,QAAQ,CAAC;cAAED,KAAK,EAAEE,SAAS;cAAEC,KAAK,EAAEA;YAAM,CAAC,CAAC;UAC9C;QACF;MACF,CAAC,EAAE,CAAC;IACN;IAEA,OAAO,MAAM;MACXY,SAAS,GAAG,IAAI;IAClB,CAAC;EACH,CAAC,EAAE,CACDrB,GAAG,EACHC,IAAI,EACJU,eAAe,EACfC,aAAa,EACbC,OAAO,EACPC,QAAQ,EACRC,UAAU,EACVC,WAAW,EACXC,WAAW,EACXE,YAAY,EACZf,KAAK,EACLC,OAAO,CACR,CAAC;EAEF,OAAOC,KAAK;AACd","ignoreList":[]}
|
|
@@ -2,8 +2,10 @@
|
|
|
2
2
|
|
|
3
3
|
import { useMemo } from 'react';
|
|
4
4
|
import { NitroImagePipeline } from './NitroImagePipeline';
|
|
5
|
+
import { resolveImageUrlOrFallback } from './resolveImageSource';
|
|
5
6
|
/**
|
|
6
|
-
* Creates (and memoizes) an {@linkcode ImageLoader} for `
|
|
7
|
+
* Creates (and memoizes) an {@linkcode ImageLoader} for `source` — a URL
|
|
8
|
+
* string or a `require()`d asset, see {@linkcode ImageSource} — to pass to
|
|
7
9
|
* `<NativeNitroImage image={...} />`. The view drives it entirely natively:
|
|
8
10
|
* the request starts when the view attaches — at the view's laid-out size,
|
|
9
11
|
* with no JS round trips — and is cancelled when it detaches. See
|
|
@@ -13,7 +15,7 @@ import { NitroImagePipeline } from './NitroImagePipeline';
|
|
|
13
15
|
* bitmap pixels); the screen scale is applied natively. Inline object
|
|
14
16
|
* literals are fine — options are compared by value, not identity.
|
|
15
17
|
*/
|
|
16
|
-
export function usePipelineImageLoader(
|
|
18
|
+
export function usePipelineImageLoader(source, options) {
|
|
17
19
|
// Split the options into primitives (like useImage does) so an inline
|
|
18
20
|
// literal — a new identity every render — doesn't recreate the loader;
|
|
19
21
|
// recreating it would re-trigger the native load.
|
|
@@ -32,6 +34,9 @@ export function usePipelineImageLoader(url, options) {
|
|
|
32
34
|
const resizeWidth = options?.resize?.width;
|
|
33
35
|
const resizeHeight = options?.resize?.height;
|
|
34
36
|
return useMemo(() => {
|
|
37
|
+
// Runs during render, so an unregistered `require()` id must not throw:
|
|
38
|
+
// it becomes a URL the native loader fails on at load time instead.
|
|
39
|
+
const url = resolveImageUrlOrFallback(source);
|
|
35
40
|
const cornerRadiusOption = isUniformRadius ? uniformRadius : hasCornerObject ? {
|
|
36
41
|
topLeft,
|
|
37
42
|
topRight,
|
|
@@ -60,6 +65,6 @@ export function usePipelineImageLoader(url, options) {
|
|
|
60
65
|
}
|
|
61
66
|
});
|
|
62
67
|
return loader;
|
|
63
|
-
}, [
|
|
68
|
+
}, [source, blur, cache, isUniformRadius, uniformRadius, hasCornerObject, topLeft, topRight, bottomLeft, bottomRight, resizeWidth, resizeHeight]);
|
|
64
69
|
}
|
|
65
70
|
//# sourceMappingURL=usePipelineImageLoader.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"names":["useMemo","NitroImagePipeline","usePipelineImageLoader","
|
|
1
|
+
{"version":3,"names":["useMemo","NitroImagePipeline","resolveImageUrlOrFallback","usePipelineImageLoader","source","options","blur","cache","cornerRadius","isUniformRadius","uniformRadius","hasCornerObject","undefined","topLeft","topRight","bottomLeft","bottomRight","resizeWidth","resize","width","resizeHeight","height","url","cornerRadiusOption","stableOptions","loader","createImageLoader","Object","defineProperty","enumerable","configurable","value"],"sourceRoot":"../../src","sources":["usePipelineImageLoader.ts"],"mappings":";;AAAA,SAASA,OAAO,QAAQ,OAAO;AAG/B,SAASC,kBAAkB,QAAQ,sBAAsB;AACzD,SAEEC,yBAAyB,QACpB,sBAAsB;AAM7B;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA;AACA,OAAO,SAASC,sBAAsBA,CACpCC,MAAmB,EACnBC,OAAqB,EACR;EACb;EACA;EACA;EACA,MAAMC,IAAI,GAAGD,OAAO,EAAEC,IAAI;EAC1B,MAAMC,KAAK,GAAGF,OAAO,EAAEE,KAAK;EAC5B,MAAMC,YAAY,GAAGH,OAAO,EAAEG,YAAY;EAC1C,MAAMC,eAAe,GAAG,OAAOD,YAAY,KAAK,QAAQ;EACxD,MAAME,aAAa,GAAGD,eAAe,GAAGD,YAAY,GAAG,CAAC;EACxD,MAAMG,eAAe,GAAG,CAACF,eAAe,IAAID,YAAY,KAAKI,SAAS;EACtE,MAAM;IACJC,OAAO,GAAG,CAAC;IACXC,QAAQ,GAAG,CAAC;IACZC,UAAU,GAAG,CAAC;IACdC,WAAW,GAAG;EAChB,CAAC,GAAGP,eAAe,IAAID,YAAY,KAAKI,SAAS,GAAG,CAAC,CAAC,GAAGJ,YAAY;EACrE,MAAMS,WAAW,GAAGZ,OAAO,EAAEa,MAAM,EAAEC,KAAK;EAC1C,MAAMC,YAAY,GAAGf,OAAO,EAAEa,MAAM,EAAEG,MAAM;EAE5C,OAAOrB,OAAO,CAAC,MAAM;IACnB;IACA;IACA,MAAMsB,GAAG,GAAGpB,yBAAyB,CAACE,MAAM,CAAC;IAC7C,MAAMmB,kBAAoD,GAAGd,eAAe,GACxEC,aAAa,GACbC,eAAe,GACb;MAAEE,OAAO;MAAEC,QAAQ;MAAEC,UAAU;MAAEC;IAAY,CAAC,GAC9CJ,SAAS;IACf,MAAMY,aAA0B,GAAG;MACjClB,IAAI;MACJC,KAAK;MACLC,YAAY,EAAEe,kBAAkB;MAChCL,MAAM,EACJD,WAAW,KAAKL,SAAS,IAAIQ,YAAY,KAAKR,SAAS,GACnD;QAAEO,KAAK,EAAEF,WAAW;QAAEI,MAAM,EAAED;MAAa,CAAC,GAC5CR;IACR,CAAC;IACD,MAAMa,MAAM,GAAGxB,kBAAkB,CAACyB,iBAAiB,CAACJ,GAAG,EAAEE,aAAa,CAAC;IACvE;IACA;IACA;IACAG,MAAM,CAACC,cAAc,CAACH,MAAM,EAAE,UAAU,EAAE;MACxCI,UAAU,EAAE,IAAI;MAChBC,YAAY,EAAE,IAAI;MAClBC,KAAK,EAAE;QAAET,GAAG;QAAEjB,OAAO,EAAEmB;MAAc;IACvC,CAAC,CAAC;IACF,OAAOC,MAAM;EACf,CAAC,EAAE,CACDrB,MAAM,EACNE,IAAI,EACJC,KAAK,EACLE,eAAe,EACfC,aAAa,EACbC,eAAe,EACfE,OAAO,EACPC,QAAQ,EACRC,UAAU,EACVC,WAAW,EACXC,WAAW,EACXG,YAAY,CACb,CAAC;AACJ","ignoreList":[]}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { type ComponentRef } from 'react';
|
|
2
2
|
import type { HostComponent } from 'react-native';
|
|
3
3
|
import { NativeNitroImage } from 'react-native-nitro-image';
|
|
4
|
+
import { type ImageSource } from './resolveImageSource';
|
|
4
5
|
import type { CacheOption, CornerRadii, ResizeOptions } from './specs/nitro-image-toolkit.nitro';
|
|
5
6
|
type ReactProps<T> = T extends HostComponent<infer P> ? P : never;
|
|
6
7
|
type NativeImageProps = ReactProps<typeof NativeNitroImage>;
|
|
@@ -11,8 +12,12 @@ type NativeImageProps = ReactProps<typeof NativeNitroImage>;
|
|
|
11
12
|
*/
|
|
12
13
|
export type NativePipelineImageRef = ComponentRef<typeof NativeNitroImage>;
|
|
13
14
|
export interface NativePipelineImageProps extends Omit<NativeImageProps, 'image'> {
|
|
14
|
-
/**
|
|
15
|
-
|
|
15
|
+
/**
|
|
16
|
+
* The image to load through the pipeline: a URL string (`https://`,
|
|
17
|
+
* `file://`, an absolute path) or a `require()`d asset — see
|
|
18
|
+
* {@linkcode ImageSource}.
|
|
19
|
+
*/
|
|
20
|
+
url: ImageSource;
|
|
16
21
|
/**
|
|
17
22
|
* Gaussian blur sigma in **points** (density-independent), like
|
|
18
23
|
* `PipelineImage`. Applied natively with the screen scale.
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"NativePipelineImage.d.ts","sourceRoot":"","sources":["../../../src/NativePipelineImage.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,YAAY,EAAc,MAAM,OAAO,CAAC;AACtD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAClD,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAG5D,OAAO,KAAK,EACV,WAAW,EACX,WAAW,EACX,aAAa,EACd,MAAM,mCAAmC,CAAC;AAG3C,KAAK,UAAU,CAAC,CAAC,IAAI,CAAC,SAAS,aAAa,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;AAClE,KAAK,gBAAgB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAE5D;;;;GAIG;AACH,MAAM,MAAM,sBAAsB,GAAG,YAAY,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAE3E,MAAM,WAAW,wBAAyB,SAAQ,IAAI,CACpD,gBAAgB,EAChB,OAAO,CACR;IACC
|
|
1
|
+
{"version":3,"file":"NativePipelineImage.d.ts","sourceRoot":"","sources":["../../../src/NativePipelineImage.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAE,KAAK,YAAY,EAAc,MAAM,OAAO,CAAC;AACtD,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,cAAc,CAAC;AAClD,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAG5D,OAAO,EAAE,KAAK,WAAW,EAAmB,MAAM,sBAAsB,CAAC;AACzE,OAAO,KAAK,EACV,WAAW,EACX,WAAW,EACX,aAAa,EACd,MAAM,mCAAmC,CAAC;AAG3C,KAAK,UAAU,CAAC,CAAC,IAAI,CAAC,SAAS,aAAa,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;AAClE,KAAK,gBAAgB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAE5D;;;;GAIG;AACH,MAAM,MAAM,sBAAsB,GAAG,YAAY,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAE3E,MAAM,WAAW,wBAAyB,SAAQ,IAAI,CACpD,gBAAgB,EAChB,OAAO,CACR;IACC;;;;OAIG;IACH,GAAG,EAAE,WAAW,CAAC;IACjB;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;;OAKG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,WAAW,CAAC;IACpC,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB;;;;OAIG;IACH,MAAM,CAAC,EAAE,aAAa,CAAC;CACxB;AAED;;;;;;;;;;;;;;;;;;;;;GAqBG;AACH,eAAO,MAAM,mBAAmB;;;;;4FA0B9B,CAAC"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
import { type ComponentRef } from 'react';
|
|
2
2
|
import { type HostComponent } from 'react-native';
|
|
3
3
|
import { type Image, NativeNitroImage } from 'react-native-nitro-image';
|
|
4
|
+
import type { ImageSource } from './resolveImageSource';
|
|
4
5
|
import type { CacheOption, CornerRadii } from './specs/nitro-image-toolkit.nitro';
|
|
5
6
|
type ReactProps<T> = T extends HostComponent<infer P> ? P : never;
|
|
6
7
|
type NativeImageProps = ReactProps<typeof NativeNitroImage>;
|
|
@@ -11,8 +12,12 @@ type NativeImageProps = ReactProps<typeof NativeNitroImage>;
|
|
|
11
12
|
*/
|
|
12
13
|
export type PipelineImageRef = ComponentRef<typeof NativeNitroImage>;
|
|
13
14
|
export interface PipelineImageProps extends Omit<NativeImageProps, 'image'> {
|
|
14
|
-
/**
|
|
15
|
-
|
|
15
|
+
/**
|
|
16
|
+
* The image to load through the pipeline: a URL string (`https://`,
|
|
17
|
+
* `file://`, an absolute path) or a `require()`d asset — see
|
|
18
|
+
* {@linkcode ImageSource}.
|
|
19
|
+
*/
|
|
20
|
+
url: ImageSource;
|
|
16
21
|
/**
|
|
17
22
|
* Gaussian blur sigma in **points** (density-independent). Unlike
|
|
18
23
|
* `useImage`/`loadImage`, where it is bitmap pixels, the component
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PipelineImage.d.ts","sourceRoot":"","sources":["../../../src/PipelineImage.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,YAAY,EAKlB,MAAM,OAAO,CAAC;AACf,OAAO,EACL,KAAK,aAAa,EAGnB,MAAM,cAAc,CAAC;AACtB,OAAO,EAAE,KAAK,KAAK,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAOxE,OAAO,KAAK,EACV,WAAW,EACX,WAAW,EAEZ,MAAM,mCAAmC,CAAC;AAG3C,KAAK,UAAU,CAAC,CAAC,IAAI,CAAC,SAAS,aAAa,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;AAClE,KAAK,gBAAgB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAE5D;;;;GAIG;AACH,MAAM,MAAM,gBAAgB,GAAG,YAAY,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAErE,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,gBAAgB,EAAE,OAAO,CAAC;IACzE
|
|
1
|
+
{"version":3,"file":"PipelineImage.d.ts","sourceRoot":"","sources":["../../../src/PipelineImage.tsx"],"names":[],"mappings":"AAAA,OAAO,EACL,KAAK,YAAY,EAKlB,MAAM,OAAO,CAAC;AACf,OAAO,EACL,KAAK,aAAa,EAGnB,MAAM,cAAc,CAAC;AACtB,OAAO,EAAE,KAAK,KAAK,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAOxE,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,sBAAsB,CAAC;AACxD,OAAO,KAAK,EACV,WAAW,EACX,WAAW,EAEZ,MAAM,mCAAmC,CAAC;AAG3C,KAAK,UAAU,CAAC,CAAC,IAAI,CAAC,SAAS,aAAa,CAAC,MAAM,CAAC,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC;AAClE,KAAK,gBAAgB,GAAG,UAAU,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAE5D;;;;GAIG;AACH,MAAM,MAAM,gBAAgB,GAAG,YAAY,CAAC,OAAO,gBAAgB,CAAC,CAAC;AAErE,MAAM,WAAW,kBAAmB,SAAQ,IAAI,CAAC,gBAAgB,EAAE,OAAO,CAAC;IACzE;;;;OAIG;IACH,GAAG,EAAE,WAAW,CAAC;IACjB;;;;;;OAMG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;;;;;;OASG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,WAAW,CAAC;IACpC,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB,0EAA0E;IAC1E,MAAM,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;IAChC,iCAAiC;IACjC,OAAO,CAAC,EAAE,CAAC,KAAK,EAAE,KAAK,KAAK,IAAI,CAAC;CAClC;AAqBD;;;;;;;;;;;;;;;;;;;;;;;;GAwBG;AACH,eAAO,MAAM,aAAa;;;;;4FAqEzB,CAAC"}
|
|
@@ -1,6 +1,7 @@
|
|
|
1
1
|
export { NativePipelineImage, type NativePipelineImageProps, type NativePipelineImageRef, } from './NativePipelineImage';
|
|
2
2
|
export { NitroImagePipeline } from './NitroImagePipeline';
|
|
3
3
|
export { PipelineImage, type PipelineImageProps, type PipelineImageRef, } from './PipelineImage';
|
|
4
|
+
export { type ImageSource, resolveImageUrl, UNREGISTERED_ASSET_URL, } from './resolveImageSource';
|
|
4
5
|
export { cornerRadiusForStyle, resizeForLayout, resizeForStyle, } from './resizeForStyle';
|
|
5
6
|
export type { CacheOption, CornerRadii, Options, ResizeOptions, ViewOptions, } from './specs/nitro-image-toolkit.nitro';
|
|
6
7
|
export { useImage } from './useImage';
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,mBAAmB,EACnB,KAAK,wBAAwB,EAC7B,KAAK,sBAAsB,GAC5B,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EACL,aAAa,EACb,KAAK,kBAAkB,EACvB,KAAK,gBAAgB,GACtB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EACL,oBAAoB,EACpB,eAAe,EACf,cAAc,GACf,MAAM,kBAAkB,CAAC;AAC1B,YAAY,EACV,WAAW,EACX,WAAW,EACX,OAAO,EACP,aAAa,EACb,WAAW,GACZ,MAAM,mCAAmC,CAAC;AAC3C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../src/index.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,mBAAmB,EACnB,KAAK,wBAAwB,EAC7B,KAAK,sBAAsB,GAC5B,MAAM,uBAAuB,CAAC;AAC/B,OAAO,EAAE,kBAAkB,EAAE,MAAM,sBAAsB,CAAC;AAC1D,OAAO,EACL,aAAa,EACb,KAAK,kBAAkB,EACvB,KAAK,gBAAgB,GACtB,MAAM,iBAAiB,CAAC;AACzB,OAAO,EACL,KAAK,WAAW,EAChB,eAAe,EACf,sBAAsB,GACvB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EACL,oBAAoB,EACpB,eAAe,EACf,cAAc,GACf,MAAM,kBAAkB,CAAC;AAC1B,YAAY,EACV,WAAW,EACX,WAAW,EACX,OAAO,EACP,aAAa,EACb,WAAW,GACZ,MAAM,mCAAmC,CAAC;AAC3C,OAAO,EAAE,QAAQ,EAAE,MAAM,YAAY,CAAC;AACtC,OAAO,EAAE,sBAAsB,EAAE,MAAM,0BAA0B,CAAC"}
|
|
@@ -0,0 +1,56 @@
|
|
|
1
|
+
/**
|
|
2
|
+
* What the pipeline can load: a URL string, or the id a `require()`d image
|
|
3
|
+
* asset evaluates to.
|
|
4
|
+
*
|
|
5
|
+
* As a string, `url` is passed to the native loader as-is. Accepted forms:
|
|
6
|
+
*
|
|
7
|
+
* - `https://` / `http://` — fetched over the network and cached on disk.
|
|
8
|
+
* - `file://` URLs and plain absolute paths (`/var/…/photo.jpg`) — read from
|
|
9
|
+
* the file system. The result is cached in memory only; there is nothing
|
|
10
|
+
* to gain from copying a local file into the disk cache.
|
|
11
|
+
* - Android also accepts `content://` URIs and, from a release build's
|
|
12
|
+
* resources, a bare drawable name — which is what `require()` resolves to
|
|
13
|
+
* there. iOS resolves `require()` to a `file://` URL into the app bundle.
|
|
14
|
+
*
|
|
15
|
+
* A `require('./photo.png')` is resolved with `Image.resolveAssetSource`, so
|
|
16
|
+
* it works the same in debug (streamed from Metro) and release (bundled).
|
|
17
|
+
*/
|
|
18
|
+
export type ImageSource = string | number;
|
|
19
|
+
/**
|
|
20
|
+
* Turns an {@linkcode ImageSource} into the URL string the native pipeline
|
|
21
|
+
* loads: strings pass through unchanged, a `require()`d asset is resolved via
|
|
22
|
+
* `Image.resolveAssetSource` (the scale-matched variant, like `<Image>`).
|
|
23
|
+
*
|
|
24
|
+
* The components and hooks call this for you; use it when calling
|
|
25
|
+
* `NitroImagePipeline.loadImage`/`preLoadImage` directly with a `require()`.
|
|
26
|
+
* @throws If `source` is a number that is not a registered asset.
|
|
27
|
+
* @example
|
|
28
|
+
* ```ts
|
|
29
|
+
* const image = await NitroImagePipeline.loadImage(
|
|
30
|
+
* resolveImageUrl(require('./photo.png')),
|
|
31
|
+
* { blur: 4 },
|
|
32
|
+
* );
|
|
33
|
+
* ```
|
|
34
|
+
*/
|
|
35
|
+
export declare function resolveImageUrl(source: ImageSource): string;
|
|
36
|
+
/**
|
|
37
|
+
* A URL no loader can resolve, standing in for a `require()` id that is not
|
|
38
|
+
* a registered asset. Its scheme has no fetcher on either platform, so the
|
|
39
|
+
* request fails at load time — the same way a missing file does — instead of
|
|
40
|
+
* throwing from a component's render.
|
|
41
|
+
*/
|
|
42
|
+
export declare const UNREGISTERED_ASSET_URL = "unregistered-asset://";
|
|
43
|
+
/**
|
|
44
|
+
* {@linkcode resolveImageUrl} for code that runs during render: an
|
|
45
|
+
* unregistered `require()` id yields {@linkcode UNREGISTERED_ASSET_URL} (and
|
|
46
|
+
* a warning in development) rather than throwing.
|
|
47
|
+
*/
|
|
48
|
+
export declare function resolveImageUrlOrFallback(source: ImageSource): string;
|
|
49
|
+
/**
|
|
50
|
+
* A stable, per-source `recyclingKey` for `<NativeNitroImage>`: the URL
|
|
51
|
+
* itself for strings, and a tag derived from the asset id for a `require()`
|
|
52
|
+
* (resolving it would cost an asset-registry lookup per render for nothing
|
|
53
|
+
* more than a distinct key).
|
|
54
|
+
*/
|
|
55
|
+
export declare function recyclingKeyFor(source: ImageSource): string;
|
|
56
|
+
//# sourceMappingURL=resolveImageSource.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"resolveImageSource.d.ts","sourceRoot":"","sources":["../../../src/resolveImageSource.ts"],"names":[],"mappings":"AAEA;;;;;;;;;;;;;;;;GAgBG;AACH,MAAM,MAAM,WAAW,GAAG,MAAM,GAAG,MAAM,CAAC;AAE1C;;;;;;;;;;;;;;;GAeG;AACH,wBAAgB,eAAe,CAAC,MAAM,EAAE,WAAW,GAAG,MAAM,CAS3D;AAED;;;;;GAKG;AACH,eAAO,MAAM,sBAAsB,0BAA0B,CAAC;AAE9D;;;;GAIG;AACH,wBAAgB,yBAAyB,CAAC,MAAM,EAAE,WAAW,GAAG,MAAM,CAWrE;AAED;;;;;GAKG;AACH,wBAAgB,eAAe,CAAC,MAAM,EAAE,WAAW,GAAG,MAAM,CAE3D"}
|
|
@@ -94,6 +94,13 @@ export interface NitroImagePipeline extends HybridObject<{
|
|
|
94
94
|
ios: 'swift';
|
|
95
95
|
android: 'kotlin';
|
|
96
96
|
}> {
|
|
97
|
+
/**
|
|
98
|
+
* Loads `url` through the pipeline. Besides `http(s)://`, `url` may be a
|
|
99
|
+
* `file://` URL or a plain absolute path (read from the file system, cached
|
|
100
|
+
* in memory only), a `data:` URL, or — on Android — a `content://` URI or
|
|
101
|
+
* the bare resource name a `require()` resolves to in a release build. Use
|
|
102
|
+
* `resolveImageUrl(require('./photo.png'))` to pass a bundled asset.
|
|
103
|
+
*/
|
|
97
104
|
loadImage(url: string, options?: Options): Promise<Image>;
|
|
98
105
|
/**
|
|
99
106
|
* Creates an {@linkcode ImageLoader} for `url` that a `<NativeNitroImage>`
|
|
@@ -108,6 +115,11 @@ export interface NitroImagePipeline extends HybridObject<{
|
|
|
108
115
|
* attaches, the load waits for its first layout.
|
|
109
116
|
*/
|
|
110
117
|
createImageLoader(url: string, options?: ViewOptions): ImageLoader;
|
|
118
|
+
/**
|
|
119
|
+
* Warms the disk cache with the download for `url`, without decoding it.
|
|
120
|
+
* Local sources (`file://`, paths, resources) have no download to warm it
|
|
121
|
+
* with and are a no-op.
|
|
122
|
+
*/
|
|
111
123
|
preLoadImage(url: string): Promise<void>;
|
|
112
124
|
preLoadImages(urls: string[]): Promise<void>;
|
|
113
125
|
/**
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"nitro-image-toolkit.nitro.d.ts","sourceRoot":"","sources":["../../../../src/specs/nitro-image-toolkit.nitro.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACnE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAE/D,MAAM,MAAM,WAAW,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAC;AAErD;;;GAGG;AACH,MAAM,WAAW,WAAW;IAC1B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED;;;;GAIG;AACH,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,MAAM,OAAO,GAAG;IACpB;;;;;;;;;;;OAWG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB;;;;;;;;;;;;;OAaG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,WAAW,CAAC;IACpC;;;;;;;OAOG;IACH,MAAM,CAAC,EAAE,aAAa,CAAC;CACxB,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,MAAM,WAAW,GAAG;IACxB;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,WAAW,CAAC;IACpC;;;;;OAKG;IACH,MAAM,CAAC,EAAE,aAAa,CAAC;CACxB,CAAC;AAEF,MAAM,WAAW,kBAAmB,SAAQ,YAAY,CAAC;IACvD,GAAG,EAAE,OAAO,CAAC;IACb,OAAO,EAAE,QAAQ,CAAC;CACnB,CAAC;IACA,SAAS,CAAC,GAAG,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC;IAC1D;;;;;;;;;;;OAWG;IACH,iBAAiB,CAAC,GAAG,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,WAAW,GAAG,WAAW,CAAC;IACnE,YAAY,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACzC,aAAa,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC7C;;;;OAIG;IACH,YAAY,CAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC;IAG3D;;;;;;;;OAQG;IACH,mBAAmB,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAEzC,UAAU,IAAI,OAAO,CAAC,IAAI,CAAC,CAAC;CAC7B"}
|
|
1
|
+
{"version":3,"file":"nitro-image-toolkit.nitro.d.ts","sourceRoot":"","sources":["../../../../src/specs/nitro-image-toolkit.nitro.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAE,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AACnE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,4BAA4B,CAAC;AAE/D,MAAM,MAAM,WAAW,GAAG,QAAQ,GAAG,MAAM,GAAG,MAAM,CAAC;AAErD;;;GAGG;AACH,MAAM,WAAW,WAAW;IAC1B,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,UAAU,CAAC,EAAE,MAAM,CAAC;IACpB,WAAW,CAAC,EAAE,MAAM,CAAC;CACtB;AAED;;;;GAIG;AACH,MAAM,WAAW,aAAa;IAC5B,KAAK,EAAE,MAAM,CAAC;IACd,MAAM,EAAE,MAAM,CAAC;CAChB;AAED,MAAM,MAAM,OAAO,GAAG;IACpB;;;;;;;;;;;OAWG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB;;;;;;;;;;;;;OAaG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,WAAW,CAAC;IACpC;;;;;;;OAOG;IACH,MAAM,CAAC,EAAE,aAAa,CAAC;CACxB,CAAC;AAEF;;;;;;;GAOG;AACH,MAAM,MAAM,WAAW,GAAG;IACxB;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB;;;;OAIG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,WAAW,CAAC;IACpC;;;;;OAKG;IACH,MAAM,CAAC,EAAE,aAAa,CAAC;CACxB,CAAC;AAEF,MAAM,WAAW,kBAAmB,SAAQ,YAAY,CAAC;IACvD,GAAG,EAAE,OAAO,CAAC;IACb,OAAO,EAAE,QAAQ,CAAC;CACnB,CAAC;IACA;;;;;;OAMG;IACH,SAAS,CAAC,GAAG,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,OAAO,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC;IAC1D;;;;;;;;;;;OAWG;IACH,iBAAiB,CAAC,GAAG,EAAE,MAAM,EAAE,OAAO,CAAC,EAAE,WAAW,GAAG,WAAW,CAAC;IACnE;;;;OAIG;IACH,YAAY,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IACzC,aAAa,CAAC,IAAI,EAAE,MAAM,EAAE,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;IAC7C;;;;OAIG;IACH,YAAY,CAAC,KAAK,EAAE,KAAK,EAAE,MAAM,EAAE,MAAM,GAAG,OAAO,CAAC,KAAK,CAAC,CAAC;IAG3D;;;;;;;;OAQG;IACH,mBAAmB,CAAC,KAAK,EAAE,MAAM,GAAG,IAAI,CAAC;IAEzC,UAAU,IAAI,OAAO,CAAC,IAAI,CAAC,CAAC;CAC7B"}
|
|
@@ -1,4 +1,5 @@
|
|
|
1
1
|
import type { Image } from 'react-native-nitro-image';
|
|
2
|
+
import { type ImageSource } from './resolveImageSource';
|
|
2
3
|
import type { CacheOption, CornerRadii, ResizeOptions } from './specs/nitro-image-toolkit.nitro';
|
|
3
4
|
type Result = {
|
|
4
5
|
image: undefined;
|
|
@@ -11,15 +12,20 @@ type Result = {
|
|
|
11
12
|
error: Error;
|
|
12
13
|
};
|
|
13
14
|
/**
|
|
14
|
-
* A hook to asynchronously load an image from the
|
|
15
|
-
*
|
|
15
|
+
* A hook to asynchronously load an image from `url` through the pipeline
|
|
16
|
+
* into memory.
|
|
16
17
|
* @example
|
|
17
18
|
* ```ts
|
|
18
|
-
* const { image, error } = useImage({
|
|
19
|
+
* const { image, error } = useImage({ url: 'https://example.com/photo.jpg' });
|
|
20
|
+
* const { image: logo } = useImage({ url: require('./logo.png') });
|
|
19
21
|
* ```
|
|
20
22
|
*/
|
|
21
23
|
export declare function useImage({ url, blur, cornerRadius, resize, cache, enabled, }: {
|
|
22
|
-
|
|
24
|
+
/**
|
|
25
|
+
* The image to load: a URL string (`https://`, `file://`, an absolute path)
|
|
26
|
+
* or a `require()`d asset — see {@linkcode ImageSource}.
|
|
27
|
+
*/
|
|
28
|
+
url: ImageSource;
|
|
23
29
|
/**
|
|
24
30
|
* Gaussian blur strength, as the standard deviation (sigma) of the blur in
|
|
25
31
|
* source-image pixels (of the resized bitmap when `resize` is set). Matches
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"useImage.d.ts","sourceRoot":"","sources":["../../../src/useImage.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAC;AAGtD,OAAO,KAAK,EACV,WAAW,EACX,WAAW,EACX,aAAa,EACd,MAAM,mCAAmC,CAAC;AAE3C,KAAK,MAAM,GAEP;IACE,KAAK,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,SAAS,CAAC;CAClB,GAED;IACE,KAAK,EAAE,KAAK,CAAC;IACb,KAAK,EAAE,SAAS,CAAC;CAClB,GAED;IACE,KAAK,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,KAAK,CAAC;CACd,CAAC;AAEN
|
|
1
|
+
{"version":3,"file":"useImage.d.ts","sourceRoot":"","sources":["../../../src/useImage.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,KAAK,EAAE,MAAM,0BAA0B,CAAC;AAGtD,OAAO,EAAE,KAAK,WAAW,EAAmB,MAAM,sBAAsB,CAAC;AACzE,OAAO,KAAK,EACV,WAAW,EACX,WAAW,EACX,aAAa,EACd,MAAM,mCAAmC,CAAC;AAE3C,KAAK,MAAM,GAEP;IACE,KAAK,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,SAAS,CAAC;CAClB,GAED;IACE,KAAK,EAAE,KAAK,CAAC;IACb,KAAK,EAAE,SAAS,CAAC;CAClB,GAED;IACE,KAAK,EAAE,SAAS,CAAC;IACjB,KAAK,EAAE,KAAK,CAAC;CACd,CAAC;AAEN;;;;;;;;GAQG;AACH,wBAAgB,QAAQ,CAAC,EACvB,GAAG,EACH,IAAQ,EACR,YAAgB,EAChB,MAAM,EACN,KAAK,EACL,OAAc,GACf,EAAE;IACD;;;OAGG;IACH,GAAG,EAAE,WAAW,CAAC;IACjB;;;;OAIG;IACH,IAAI,CAAC,EAAE,MAAM,CAAC;IACd;;;;;OAKG;IACH,YAAY,CAAC,EAAE,MAAM,GAAG,WAAW,CAAC;IACpC;;;;OAIG;IACH,MAAM,CAAC,EAAE,aAAa,CAAC;IACvB,KAAK,CAAC,EAAE,WAAW,CAAC;IACpB;;;;;;OAMG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;CACnB,GAAG,MAAM,CAiFT"}
|
|
@@ -1,7 +1,9 @@
|
|
|
1
1
|
import type { ImageLoader } from 'react-native-nitro-image';
|
|
2
|
+
import { type ImageSource } from './resolveImageSource';
|
|
2
3
|
import type { ViewOptions } from './specs/nitro-image-toolkit.nitro';
|
|
3
4
|
/**
|
|
4
|
-
* Creates (and memoizes) an {@linkcode ImageLoader} for `
|
|
5
|
+
* Creates (and memoizes) an {@linkcode ImageLoader} for `source` — a URL
|
|
6
|
+
* string or a `require()`d asset, see {@linkcode ImageSource} — to pass to
|
|
5
7
|
* `<NativeNitroImage image={...} />`. The view drives it entirely natively:
|
|
6
8
|
* the request starts when the view attaches — at the view's laid-out size,
|
|
7
9
|
* with no JS round trips — and is cancelled when it detaches. See
|
|
@@ -11,5 +13,5 @@ import type { ViewOptions } from './specs/nitro-image-toolkit.nitro';
|
|
|
11
13
|
* bitmap pixels); the screen scale is applied natively. Inline object
|
|
12
14
|
* literals are fine — options are compared by value, not identity.
|
|
13
15
|
*/
|
|
14
|
-
export declare function usePipelineImageLoader(
|
|
16
|
+
export declare function usePipelineImageLoader(source: ImageSource, options?: ViewOptions): ImageLoader;
|
|
15
17
|
//# sourceMappingURL=usePipelineImageLoader.d.ts.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePipelineImageLoader.d.ts","sourceRoot":"","sources":["../../../src/usePipelineImageLoader.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAG5D,OAAO,KAAK,EAEV,WAAW,EACZ,MAAM,mCAAmC,CAAC;AAE3C
|
|
1
|
+
{"version":3,"file":"usePipelineImageLoader.d.ts","sourceRoot":"","sources":["../../../src/usePipelineImageLoader.ts"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAE,WAAW,EAAE,MAAM,0BAA0B,CAAC;AAG5D,OAAO,EACL,KAAK,WAAW,EAEjB,MAAM,sBAAsB,CAAC;AAC9B,OAAO,KAAK,EAEV,WAAW,EACZ,MAAM,mCAAmC,CAAC;AAE3C;;;;;;;;;;;GAWG;AACH,wBAAgB,sBAAsB,CACpC,MAAM,EAAE,WAAW,EACnB,OAAO,CAAC,EAAE,WAAW,GACpB,WAAW,CA6Db"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "react-native-nitro-image-pipeline",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.6.0",
|
|
4
4
|
"description": "High-performance image loading, caching, and processing for React Native, built with Nitro Modules",
|
|
5
5
|
"main": "./lib/commonjs/index.js",
|
|
6
6
|
"module": "./lib/module/index.js",
|
|
@@ -3,6 +3,7 @@ import type { HostComponent } from 'react-native';
|
|
|
3
3
|
import { NativeNitroImage } from 'react-native-nitro-image';
|
|
4
4
|
|
|
5
5
|
import { cornerRadiusForStyle } from './resizeForStyle';
|
|
6
|
+
import { type ImageSource, recyclingKeyFor } from './resolveImageSource';
|
|
6
7
|
import type {
|
|
7
8
|
CacheOption,
|
|
8
9
|
CornerRadii,
|
|
@@ -24,8 +25,12 @@ export interface NativePipelineImageProps extends Omit<
|
|
|
24
25
|
NativeImageProps,
|
|
25
26
|
'image'
|
|
26
27
|
> {
|
|
27
|
-
/**
|
|
28
|
-
|
|
28
|
+
/**
|
|
29
|
+
* The image to load through the pipeline: a URL string (`https://`,
|
|
30
|
+
* `file://`, an absolute path) or a `require()`d asset — see
|
|
31
|
+
* {@linkcode ImageSource}.
|
|
32
|
+
*/
|
|
33
|
+
url: ImageSource;
|
|
29
34
|
/**
|
|
30
35
|
* Gaussian blur sigma in **points** (density-independent), like
|
|
31
36
|
* `PipelineImage`. Applied natively with the screen scale.
|
|
@@ -89,7 +94,7 @@ export const NativePipelineImage = forwardRef<
|
|
|
89
94
|
return (
|
|
90
95
|
<NativeNitroImage
|
|
91
96
|
// Before the spread so a caller-provided recyclingKey wins.
|
|
92
|
-
recyclingKey={url}
|
|
97
|
+
recyclingKey={recyclingKeyFor(url)}
|
|
93
98
|
{...viewProps}
|
|
94
99
|
ref={ref}
|
|
95
100
|
style={style}
|
package/src/PipelineImage.tsx
CHANGED
|
@@ -17,6 +17,7 @@ import {
|
|
|
17
17
|
resizeForLayout,
|
|
18
18
|
resizeForStyle,
|
|
19
19
|
} from './resizeForStyle';
|
|
20
|
+
import type { ImageSource } from './resolveImageSource';
|
|
20
21
|
import type {
|
|
21
22
|
CacheOption,
|
|
22
23
|
CornerRadii,
|
|
@@ -35,8 +36,12 @@ type NativeImageProps = ReactProps<typeof NativeNitroImage>;
|
|
|
35
36
|
export type PipelineImageRef = ComponentRef<typeof NativeNitroImage>;
|
|
36
37
|
|
|
37
38
|
export interface PipelineImageProps extends Omit<NativeImageProps, 'image'> {
|
|
38
|
-
/**
|
|
39
|
-
|
|
39
|
+
/**
|
|
40
|
+
* The image to load through the pipeline: a URL string (`https://`,
|
|
41
|
+
* `file://`, an absolute path) or a `require()`d asset — see
|
|
42
|
+
* {@linkcode ImageSource}.
|
|
43
|
+
*/
|
|
44
|
+
url: ImageSource;
|
|
40
45
|
/**
|
|
41
46
|
* Gaussian blur sigma in **points** (density-independent). Unlike
|
|
42
47
|
* `useImage`/`loadImage`, where it is bitmap pixels, the component
|
package/src/index.ts
CHANGED
|
@@ -9,6 +9,11 @@ export {
|
|
|
9
9
|
type PipelineImageProps,
|
|
10
10
|
type PipelineImageRef,
|
|
11
11
|
} from './PipelineImage';
|
|
12
|
+
export {
|
|
13
|
+
type ImageSource,
|
|
14
|
+
resolveImageUrl,
|
|
15
|
+
UNREGISTERED_ASSET_URL,
|
|
16
|
+
} from './resolveImageSource';
|
|
12
17
|
export {
|
|
13
18
|
cornerRadiusForStyle,
|
|
14
19
|
resizeForLayout,
|
|
@@ -0,0 +1,83 @@
|
|
|
1
|
+
import { Image as RNImage } from 'react-native';
|
|
2
|
+
|
|
3
|
+
/**
|
|
4
|
+
* What the pipeline can load: a URL string, or the id a `require()`d image
|
|
5
|
+
* asset evaluates to.
|
|
6
|
+
*
|
|
7
|
+
* As a string, `url` is passed to the native loader as-is. Accepted forms:
|
|
8
|
+
*
|
|
9
|
+
* - `https://` / `http://` — fetched over the network and cached on disk.
|
|
10
|
+
* - `file://` URLs and plain absolute paths (`/var/…/photo.jpg`) — read from
|
|
11
|
+
* the file system. The result is cached in memory only; there is nothing
|
|
12
|
+
* to gain from copying a local file into the disk cache.
|
|
13
|
+
* - Android also accepts `content://` URIs and, from a release build's
|
|
14
|
+
* resources, a bare drawable name — which is what `require()` resolves to
|
|
15
|
+
* there. iOS resolves `require()` to a `file://` URL into the app bundle.
|
|
16
|
+
*
|
|
17
|
+
* A `require('./photo.png')` is resolved with `Image.resolveAssetSource`, so
|
|
18
|
+
* it works the same in debug (streamed from Metro) and release (bundled).
|
|
19
|
+
*/
|
|
20
|
+
export type ImageSource = string | number;
|
|
21
|
+
|
|
22
|
+
/**
|
|
23
|
+
* Turns an {@linkcode ImageSource} into the URL string the native pipeline
|
|
24
|
+
* loads: strings pass through unchanged, a `require()`d asset is resolved via
|
|
25
|
+
* `Image.resolveAssetSource` (the scale-matched variant, like `<Image>`).
|
|
26
|
+
*
|
|
27
|
+
* The components and hooks call this for you; use it when calling
|
|
28
|
+
* `NitroImagePipeline.loadImage`/`preLoadImage` directly with a `require()`.
|
|
29
|
+
* @throws If `source` is a number that is not a registered asset.
|
|
30
|
+
* @example
|
|
31
|
+
* ```ts
|
|
32
|
+
* const image = await NitroImagePipeline.loadImage(
|
|
33
|
+
* resolveImageUrl(require('./photo.png')),
|
|
34
|
+
* { blur: 4 },
|
|
35
|
+
* );
|
|
36
|
+
* ```
|
|
37
|
+
*/
|
|
38
|
+
export function resolveImageUrl(source: ImageSource): string {
|
|
39
|
+
if (typeof source === 'string') {
|
|
40
|
+
return source;
|
|
41
|
+
}
|
|
42
|
+
const resolved = RNImage.resolveAssetSource(source);
|
|
43
|
+
if (resolved == null) {
|
|
44
|
+
throw new Error(`Not a registered image asset: require() id ${source}`);
|
|
45
|
+
}
|
|
46
|
+
return resolved.uri;
|
|
47
|
+
}
|
|
48
|
+
|
|
49
|
+
/**
|
|
50
|
+
* A URL no loader can resolve, standing in for a `require()` id that is not
|
|
51
|
+
* a registered asset. Its scheme has no fetcher on either platform, so the
|
|
52
|
+
* request fails at load time — the same way a missing file does — instead of
|
|
53
|
+
* throwing from a component's render.
|
|
54
|
+
*/
|
|
55
|
+
export const UNREGISTERED_ASSET_URL = 'unregistered-asset://';
|
|
56
|
+
|
|
57
|
+
/**
|
|
58
|
+
* {@linkcode resolveImageUrl} for code that runs during render: an
|
|
59
|
+
* unregistered `require()` id yields {@linkcode UNREGISTERED_ASSET_URL} (and
|
|
60
|
+
* a warning in development) rather than throwing.
|
|
61
|
+
*/
|
|
62
|
+
export function resolveImageUrlOrFallback(source: ImageSource): string {
|
|
63
|
+
try {
|
|
64
|
+
return resolveImageUrl(source);
|
|
65
|
+
} catch (error) {
|
|
66
|
+
if (__DEV__) {
|
|
67
|
+
console.warn(
|
|
68
|
+
`[react-native-nitro-image-pipeline] ${(error as Error).message}`,
|
|
69
|
+
);
|
|
70
|
+
}
|
|
71
|
+
return UNREGISTERED_ASSET_URL;
|
|
72
|
+
}
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
/**
|
|
76
|
+
* A stable, per-source `recyclingKey` for `<NativeNitroImage>`: the URL
|
|
77
|
+
* itself for strings, and a tag derived from the asset id for a `require()`
|
|
78
|
+
* (resolving it would cost an asset-registry lookup per render for nothing
|
|
79
|
+
* more than a distinct key).
|
|
80
|
+
*/
|
|
81
|
+
export function recyclingKeyFor(source: ImageSource): string {
|
|
82
|
+
return typeof source === 'string' ? source : `asset:${source}`;
|
|
83
|
+
}
|
|
@@ -100,6 +100,13 @@ export interface NitroImagePipeline extends HybridObject<{
|
|
|
100
100
|
ios: 'swift';
|
|
101
101
|
android: 'kotlin';
|
|
102
102
|
}> {
|
|
103
|
+
/**
|
|
104
|
+
* Loads `url` through the pipeline. Besides `http(s)://`, `url` may be a
|
|
105
|
+
* `file://` URL or a plain absolute path (read from the file system, cached
|
|
106
|
+
* in memory only), a `data:` URL, or — on Android — a `content://` URI or
|
|
107
|
+
* the bare resource name a `require()` resolves to in a release build. Use
|
|
108
|
+
* `resolveImageUrl(require('./photo.png'))` to pass a bundled asset.
|
|
109
|
+
*/
|
|
103
110
|
loadImage(url: string, options?: Options): Promise<Image>;
|
|
104
111
|
/**
|
|
105
112
|
* Creates an {@linkcode ImageLoader} for `url` that a `<NativeNitroImage>`
|
|
@@ -114,6 +121,11 @@ export interface NitroImagePipeline extends HybridObject<{
|
|
|
114
121
|
* attaches, the load waits for its first layout.
|
|
115
122
|
*/
|
|
116
123
|
createImageLoader(url: string, options?: ViewOptions): ImageLoader;
|
|
124
|
+
/**
|
|
125
|
+
* Warms the disk cache with the download for `url`, without decoding it.
|
|
126
|
+
* Local sources (`file://`, paths, resources) have no download to warm it
|
|
127
|
+
* with and are a no-op.
|
|
128
|
+
*/
|
|
117
129
|
preLoadImage(url: string): Promise<void>;
|
|
118
130
|
preLoadImages(urls: string[]): Promise<void>;
|
|
119
131
|
/**
|