@pixzle/react 0.1.1 → 0.1.3
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 +26 -30
- package/dist/PixzleImage.d.ts +6 -2
- package/dist/PixzleImage.js +26 -9
- package/dist/PixzleImage.js.map +1 -1
- package/dist/index.d.ts +0 -2
- package/dist/index.js +0 -2
- package/dist/index.js.map +1 -1
- package/dist/usePixzleImage.d.ts +2 -1
- package/dist/usePixzleImage.js +9 -17
- package/dist/usePixzleImage.js.map +1 -1
- package/package.json +3 -3
- package/dist/PixzleImages.d.ts +0 -23
- package/dist/PixzleImages.js +0 -39
- package/dist/PixzleImages.js.map +0 -1
- package/dist/usePixzleImages.d.ts +0 -24
- package/dist/usePixzleImages.js +0 -72
- package/dist/usePixzleImages.js.map +0 -1
- package/dist/utils.d.ts +0 -6
- package/dist/utils.js +0 -27
- package/dist/utils.js.map +0 -1
package/README.md
CHANGED
|
@@ -27,6 +27,32 @@ const MyComponentWithManifest = () => {
|
|
|
27
27
|
);
|
|
28
28
|
};
|
|
29
29
|
|
|
30
|
+
// Using manifest URL (with multiple images)
|
|
31
|
+
const MyComponentWithMultipleImages = () => {
|
|
32
|
+
return (
|
|
33
|
+
<>
|
|
34
|
+
{/* #1 */}
|
|
35
|
+
<PixzleImage
|
|
36
|
+
manifest="https://example.com/manifest.json"
|
|
37
|
+
image="https://example.com/fragment1.png"
|
|
38
|
+
// imageIndex={0}
|
|
39
|
+
/>
|
|
40
|
+
{/* #2 */}
|
|
41
|
+
<PixzleImage
|
|
42
|
+
manifest="https://example.com/manifest.json"
|
|
43
|
+
image="https://example.com/fragment2.png"
|
|
44
|
+
imageIndex={1}
|
|
45
|
+
/>
|
|
46
|
+
{/* #3 */}
|
|
47
|
+
<PixzleImage
|
|
48
|
+
manifest="https://example.com/manifest.json"
|
|
49
|
+
image="https://example.com/fragment3.png"
|
|
50
|
+
imageIndex={2}
|
|
51
|
+
/>
|
|
52
|
+
</>
|
|
53
|
+
);
|
|
54
|
+
};
|
|
55
|
+
|
|
30
56
|
// Using manifest data
|
|
31
57
|
const MyComponentWithManifestData = () => {
|
|
32
58
|
return (
|
|
@@ -49,33 +75,3 @@ const MyComponent = () => {
|
|
|
49
75
|
);
|
|
50
76
|
};
|
|
51
77
|
```
|
|
52
|
-
|
|
53
|
-
---
|
|
54
|
-
|
|
55
|
-
### PixzleImages
|
|
56
|
-
|
|
57
|
-
Multiple images restoration component using manifest.
|
|
58
|
-
|
|
59
|
-
```tsx
|
|
60
|
-
import { PixzleImages } from '@pixzle/react';
|
|
61
|
-
|
|
62
|
-
const MyGallery = () => {
|
|
63
|
-
return (
|
|
64
|
-
<PixzleImages
|
|
65
|
-
images={[
|
|
66
|
-
'https://example.com/fragment1.png',
|
|
67
|
-
'https://example.com/fragment2.png',
|
|
68
|
-
]}
|
|
69
|
-
manifest="https://example.com/manifest.json"
|
|
70
|
-
>
|
|
71
|
-
{({ sources }) => (
|
|
72
|
-
<div>
|
|
73
|
-
{sources.map((src, i) => (
|
|
74
|
-
<img key={i} src={src} />
|
|
75
|
-
))}
|
|
76
|
-
</div>
|
|
77
|
-
)}
|
|
78
|
-
</PixzleImages>
|
|
79
|
-
);
|
|
80
|
-
};
|
|
81
|
-
```
|
package/dist/PixzleImage.d.ts
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
import React from "react";
|
|
2
2
|
import { type UsePixzleImageProps } from "./usePixzleImage";
|
|
3
|
-
interface PixzleImageBaseProps extends Omit<React.
|
|
3
|
+
interface PixzleImageBaseProps extends Omit<React.CanvasHTMLAttributes<HTMLCanvasElement>, "onError"> {
|
|
4
4
|
/**
|
|
5
5
|
* Element to render while the image is being restored.
|
|
6
6
|
*/
|
|
@@ -18,7 +18,11 @@ interface PixzleImageBaseProps extends Omit<React.ImgHTMLAttributes<HTMLImageEle
|
|
|
18
18
|
* Callback called when an error occurs during image restoration.
|
|
19
19
|
*/
|
|
20
20
|
onError?: (error: Error) => void;
|
|
21
|
+
/**
|
|
22
|
+
* Alternative text for the image.
|
|
23
|
+
*/
|
|
24
|
+
alt?: string;
|
|
21
25
|
}
|
|
22
26
|
export type PixzleImageProps = PixzleImageBaseProps & UsePixzleImageProps;
|
|
23
|
-
export declare const PixzleImage: React.ForwardRefExoticComponent<PixzleImageProps & React.RefAttributes<
|
|
27
|
+
export declare const PixzleImage: React.ForwardRefExoticComponent<PixzleImageProps & React.RefAttributes<HTMLCanvasElement | null>>;
|
|
24
28
|
export {};
|
package/dist/PixzleImage.js
CHANGED
|
@@ -40,8 +40,26 @@ const usePixzleImage_1 = require("./usePixzleImage");
|
|
|
40
40
|
exports.PixzleImage = react_1.default.forwardRef((props, ref) => {
|
|
41
41
|
const { image, alt = "", fallback = null, errorFallback = null, protected: isProtected = true, onError,
|
|
42
42
|
// Extract variant-specific props to exclude from imgProps
|
|
43
|
-
blockSize: _blockSize, seed: _seed, imageInfo: _imageInfo, manifest: _manifest, manifestData: _manifestData, ...
|
|
44
|
-
const {
|
|
43
|
+
blockSize: _blockSize, seed: _seed, imageInfo: _imageInfo, manifest: _manifest, manifestData: _manifestData, imageIndex: _imageIndex, ...canvasProps } = props;
|
|
44
|
+
const { bitmap, isLoading, error } = (0, usePixzleImage_1.usePixzleImage)({
|
|
45
|
+
...props,
|
|
46
|
+
});
|
|
47
|
+
const internalCanvasRef = (0, react_1.useRef)(null);
|
|
48
|
+
(0, react_1.useImperativeHandle)(ref, () => internalCanvasRef.current);
|
|
49
|
+
(0, react_1.useEffect)(() => {
|
|
50
|
+
if (bitmap && internalCanvasRef.current) {
|
|
51
|
+
const canvas = internalCanvasRef.current;
|
|
52
|
+
if (canvas.width !== bitmap.width)
|
|
53
|
+
canvas.width = bitmap.width;
|
|
54
|
+
if (canvas.height !== bitmap.height)
|
|
55
|
+
canvas.height = bitmap.height;
|
|
56
|
+
const ctx = canvas.getContext("2d");
|
|
57
|
+
if (ctx) {
|
|
58
|
+
ctx.clearRect(0, 0, canvas.width, canvas.height);
|
|
59
|
+
ctx.drawImage(bitmap, 0, 0);
|
|
60
|
+
}
|
|
61
|
+
}
|
|
62
|
+
}, [bitmap]);
|
|
45
63
|
(0, react_1.useEffect)(() => {
|
|
46
64
|
if (error) {
|
|
47
65
|
console.error("PixzleImage restoration error:", error);
|
|
@@ -56,18 +74,17 @@ exports.PixzleImage = react_1.default.forwardRef((props, ref) => {
|
|
|
56
74
|
}
|
|
57
75
|
return null;
|
|
58
76
|
}
|
|
59
|
-
if (isLoading || !
|
|
77
|
+
if (isLoading || !bitmap) {
|
|
60
78
|
return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: fallback });
|
|
61
79
|
}
|
|
62
|
-
|
|
63
|
-
return ((0, jsx_runtime_1.jsx)("img", { ref: ref, src: src, alt: alt, ...imgProps, onContextMenu: (e) => {
|
|
80
|
+
return ((0, jsx_runtime_1.jsx)("canvas", { ref: internalCanvasRef, role: "img", "aria-label": alt, ...canvasProps, onContextMenu: (e) => {
|
|
64
81
|
if (isProtected)
|
|
65
82
|
e.preventDefault();
|
|
66
|
-
|
|
83
|
+
canvasProps.onContextMenu?.(e);
|
|
67
84
|
}, onDragStart: (e) => {
|
|
68
85
|
if (isProtected)
|
|
69
86
|
e.preventDefault();
|
|
70
|
-
|
|
87
|
+
canvasProps.onDragStart?.(e);
|
|
71
88
|
}, style: {
|
|
72
89
|
...(isProtected
|
|
73
90
|
? {
|
|
@@ -76,8 +93,8 @@ exports.PixzleImage = react_1.default.forwardRef((props, ref) => {
|
|
|
76
93
|
WebkitTouchCallout: "none",
|
|
77
94
|
}
|
|
78
95
|
: {}),
|
|
79
|
-
...
|
|
80
|
-
} }));
|
|
96
|
+
...canvasProps.style,
|
|
97
|
+
}, children: alt }));
|
|
81
98
|
});
|
|
82
99
|
exports.PixzleImage.displayName = "PixzleImage";
|
|
83
100
|
//# sourceMappingURL=PixzleImage.js.map
|
package/dist/PixzleImage.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"PixzleImage.js","sourceRoot":"","sources":["../src/PixzleImage.tsx"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,+
|
|
1
|
+
{"version":3,"file":"PixzleImage.js","sourceRoot":"","sources":["../src/PixzleImage.tsx"],"names":[],"mappings":"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"}
|
package/dist/index.d.ts
CHANGED
package/dist/index.js
CHANGED
|
@@ -16,6 +16,4 @@ var __exportStar = (this && this.__exportStar) || function(m, exports) {
|
|
|
16
16
|
Object.defineProperty(exports, "__esModule", { value: true });
|
|
17
17
|
__exportStar(require("./PixzleImage"), exports);
|
|
18
18
|
__exportStar(require("./usePixzleImage"), exports);
|
|
19
|
-
__exportStar(require("./PixzleImages"), exports);
|
|
20
|
-
__exportStar(require("./usePixzleImages"), exports);
|
|
21
19
|
//# sourceMappingURL=index.js.map
|
package/dist/index.js.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,gDAA8B;AAC9B,mDAAiC
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;AAAA,gDAA8B;AAC9B,mDAAiC"}
|
package/dist/usePixzleImage.d.ts
CHANGED
|
@@ -9,6 +9,7 @@ export interface UsePixzleImageExplicitProps {
|
|
|
9
9
|
image: string | Blob;
|
|
10
10
|
manifest?: never;
|
|
11
11
|
manifestData?: never;
|
|
12
|
+
imageIndex?: never;
|
|
12
13
|
}
|
|
13
14
|
/**
|
|
14
15
|
* Props for usePixzleImage hook with manifest URL
|
|
@@ -38,7 +39,7 @@ export interface UsePixzleImageManifestDataProps {
|
|
|
38
39
|
}
|
|
39
40
|
export type UsePixzleImageProps = UsePixzleImageExplicitProps | UsePixzleImageManifestUrlProps | UsePixzleImageManifestDataProps;
|
|
40
41
|
export interface UsePixzleImageResult {
|
|
41
|
-
|
|
42
|
+
bitmap: ImageBitmap | undefined;
|
|
42
43
|
isLoading: boolean;
|
|
43
44
|
error: Error | null;
|
|
44
45
|
}
|
package/dist/usePixzleImage.js
CHANGED
|
@@ -36,7 +36,6 @@ Object.defineProperty(exports, "__esModule", { value: true });
|
|
|
36
36
|
exports.usePixzleImage = void 0;
|
|
37
37
|
const browser_1 = __importStar(require("@pixzle/browser"));
|
|
38
38
|
const react_1 = require("react");
|
|
39
|
-
const utils_1 = require("./utils");
|
|
40
39
|
function isExplicitProps(props) {
|
|
41
40
|
return "blockSize" in props && props.blockSize !== undefined;
|
|
42
41
|
}
|
|
@@ -47,7 +46,7 @@ function isManifestDataProps(props) {
|
|
|
47
46
|
return "manifestData" in props && props.manifestData !== undefined;
|
|
48
47
|
}
|
|
49
48
|
const usePixzleImage = (props) => {
|
|
50
|
-
const [
|
|
49
|
+
const [bitmap, setBitmap] = (0, react_1.useState)(undefined);
|
|
51
50
|
const [error, setError] = (0, react_1.useState)(null);
|
|
52
51
|
const [isLoading, setIsLoading] = (0, react_1.useState)(true);
|
|
53
52
|
const { image } = props;
|
|
@@ -99,16 +98,11 @@ const usePixzleImage = (props) => {
|
|
|
99
98
|
seed: resolvedSeed,
|
|
100
99
|
imageInfo: resolvedImageInfo,
|
|
101
100
|
});
|
|
102
|
-
if (!active)
|
|
101
|
+
if (!active) {
|
|
102
|
+
restoredBitmap.close();
|
|
103
103
|
return;
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
return;
|
|
107
|
-
setSrc((prev) => {
|
|
108
|
-
if (prev)
|
|
109
|
-
URL.revokeObjectURL(prev);
|
|
110
|
-
return url;
|
|
111
|
-
});
|
|
104
|
+
}
|
|
105
|
+
setBitmap(restoredBitmap);
|
|
112
106
|
setIsLoading(false);
|
|
113
107
|
}
|
|
114
108
|
catch (err) {
|
|
@@ -123,15 +117,13 @@ const usePixzleImage = (props) => {
|
|
|
123
117
|
active = false;
|
|
124
118
|
};
|
|
125
119
|
}, [blockSize, seed, imageInfo, image, manifest, manifestData, imageIndex]);
|
|
126
|
-
// Cleanup
|
|
120
|
+
// Cleanup bitmap on unmount or change
|
|
127
121
|
(0, react_1.useEffect)(() => {
|
|
128
122
|
return () => {
|
|
129
|
-
|
|
130
|
-
URL.revokeObjectURL(src);
|
|
131
|
-
}
|
|
123
|
+
bitmap?.close();
|
|
132
124
|
};
|
|
133
|
-
}, [
|
|
134
|
-
return {
|
|
125
|
+
}, [bitmap]);
|
|
126
|
+
return { bitmap, isLoading, error };
|
|
135
127
|
};
|
|
136
128
|
exports.usePixzleImage = usePixzleImage;
|
|
137
129
|
//# sourceMappingURL=usePixzleImage.js.map
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"usePixzleImage.js","sourceRoot":"","sources":["../src/usePixzleImage.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAA,2DAAwD;AAExD,iCAA4C;
|
|
1
|
+
{"version":3,"file":"usePixzleImage.js","sourceRoot":"","sources":["../src/usePixzleImage.ts"],"names":[],"mappings":"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"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@pixzle/react",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.3",
|
|
4
4
|
"description": "React components for pixzle",
|
|
5
5
|
"main": "dist/index.js",
|
|
6
6
|
"types": "dist/index.d.ts",
|
|
@@ -34,8 +34,8 @@
|
|
|
34
34
|
"access": "public"
|
|
35
35
|
},
|
|
36
36
|
"dependencies": {
|
|
37
|
-
"@pixzle/
|
|
38
|
-
"@pixzle/
|
|
37
|
+
"@pixzle/browser": "0.1.3",
|
|
38
|
+
"@pixzle/core": "0.1.3"
|
|
39
39
|
},
|
|
40
40
|
"peerDependencies": {
|
|
41
41
|
"react": ">=16.8.0",
|
package/dist/PixzleImages.d.ts
DELETED
|
@@ -1,23 +0,0 @@
|
|
|
1
|
-
import type { ManifestData } from "@pixzle/core";
|
|
2
|
-
import type React from "react";
|
|
3
|
-
import { type UsePixzleImagesResult } from "./usePixzleImages";
|
|
4
|
-
export type PixzleImagesChildrenProps = Pick<UsePixzleImagesResult, "sources" | "isLoading" | "error" | "progress">;
|
|
5
|
-
export interface PixzleImagesProps {
|
|
6
|
-
/** Image sources - URLs or Blobs */
|
|
7
|
-
images: (string | Blob)[];
|
|
8
|
-
/** Manifest URL */
|
|
9
|
-
manifest?: string;
|
|
10
|
-
/** Manifest data object (alternative to manifest) */
|
|
11
|
-
manifestData?: ManifestData;
|
|
12
|
-
/** Render function for restored images */
|
|
13
|
-
children: (props: PixzleImagesChildrenProps) => React.ReactNode;
|
|
14
|
-
/** Fallback while loading */
|
|
15
|
-
fallback?: React.ReactNode;
|
|
16
|
-
/** Error fallback */
|
|
17
|
-
errorFallback?: React.ReactNode | ((error: Error) => React.ReactNode);
|
|
18
|
-
/** Error callback */
|
|
19
|
-
onError?: (error: Error) => void;
|
|
20
|
-
/** Load complete callback */
|
|
21
|
-
onLoad?: (sources: string[]) => void;
|
|
22
|
-
}
|
|
23
|
-
export declare const PixzleImages: React.FC<PixzleImagesProps>;
|
package/dist/PixzleImages.js
DELETED
|
@@ -1,39 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.PixzleImages = void 0;
|
|
4
|
-
const jsx_runtime_1 = require("react/jsx-runtime");
|
|
5
|
-
const react_1 = require("react");
|
|
6
|
-
const usePixzleImages_1 = require("./usePixzleImages");
|
|
7
|
-
const PixzleImages = ({ images, manifest, manifestData, children, fallback = null, errorFallback = null, onError, onLoad, }) => {
|
|
8
|
-
const { sources, isLoading, error, progress } = (0, usePixzleImages_1.usePixzleImages)({
|
|
9
|
-
images,
|
|
10
|
-
manifest,
|
|
11
|
-
manifestData,
|
|
12
|
-
});
|
|
13
|
-
(0, react_1.useEffect)(() => {
|
|
14
|
-
if (error) {
|
|
15
|
-
console.error("PixzleImages restoration error:", error);
|
|
16
|
-
onError?.(error);
|
|
17
|
-
}
|
|
18
|
-
}, [error, onError]);
|
|
19
|
-
(0, react_1.useEffect)(() => {
|
|
20
|
-
if (!isLoading && sources.length > 0 && !error) {
|
|
21
|
-
onLoad?.(sources);
|
|
22
|
-
}
|
|
23
|
-
}, [isLoading, sources, error, onLoad]);
|
|
24
|
-
if (error) {
|
|
25
|
-
if (errorFallback) {
|
|
26
|
-
return ((0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: typeof errorFallback === "function"
|
|
27
|
-
? errorFallback(error)
|
|
28
|
-
: errorFallback }));
|
|
29
|
-
}
|
|
30
|
-
return null;
|
|
31
|
-
}
|
|
32
|
-
if (isLoading) {
|
|
33
|
-
return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: fallback });
|
|
34
|
-
}
|
|
35
|
-
return (0, jsx_runtime_1.jsx)(jsx_runtime_1.Fragment, { children: children({ sources, isLoading, error, progress }) });
|
|
36
|
-
};
|
|
37
|
-
exports.PixzleImages = PixzleImages;
|
|
38
|
-
exports.PixzleImages.displayName = "PixzleImages";
|
|
39
|
-
//# sourceMappingURL=PixzleImages.js.map
|
package/dist/PixzleImages.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"PixzleImages.js","sourceRoot":"","sources":["../src/PixzleImages.tsx"],"names":[],"mappings":";;;;AAEA,iCAAkC;AAClC,uDAAgF;AA0BzE,MAAM,YAAY,GAAgC,CAAC,EACxD,MAAM,EACN,QAAQ,EACR,YAAY,EACZ,QAAQ,EACR,QAAQ,GAAG,IAAI,EACf,aAAa,GAAG,IAAI,EACpB,OAAO,EACP,MAAM,GACP,EAAE,EAAE;IACH,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,EAAE,GAAG,IAAA,iCAAe,EAAC;QAC9D,MAAM;QACN,QAAQ;QACR,YAAY;KACb,CAAC,CAAC;IAEH,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,KAAK,EAAE,CAAC;YACV,OAAO,CAAC,KAAK,CAAC,iCAAiC,EAAE,KAAK,CAAC,CAAC;YACxD,OAAO,EAAE,CAAC,KAAK,CAAC,CAAC;QACnB,CAAC;IACH,CAAC,EAAE,CAAC,KAAK,EAAE,OAAO,CAAC,CAAC,CAAC;IAErB,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,IAAI,CAAC,SAAS,IAAI,OAAO,CAAC,MAAM,GAAG,CAAC,IAAI,CAAC,KAAK,EAAE,CAAC;YAC/C,MAAM,EAAE,CAAC,OAAO,CAAC,CAAC;QACpB,CAAC;IACH,CAAC,EAAE,CAAC,SAAS,EAAE,OAAO,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC,CAAC;IAExC,IAAI,KAAK,EAAE,CAAC;QACV,IAAI,aAAa,EAAE,CAAC;YAClB,OAAO,CACL,2DACG,OAAO,aAAa,KAAK,UAAU;oBAClC,CAAC,CAAC,aAAa,CAAC,KAAK,CAAC;oBACtB,CAAC,CAAC,aAAa,GAChB,CACJ,CAAC;QACJ,CAAC;QACD,OAAO,IAAI,CAAC;IACd,CAAC;IAED,IAAI,SAAS,EAAE,CAAC;QACd,OAAO,2DAAG,QAAQ,GAAI,CAAC;IACzB,CAAC;IAED,OAAO,2DAAG,QAAQ,CAAC,EAAE,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,QAAQ,EAAE,CAAC,GAAI,CAAC;AAClE,CAAC,CAAC;AA/CW,QAAA,YAAY,gBA+CvB;AAEF,oBAAY,CAAC,WAAW,GAAG,cAAc,CAAC"}
|
|
@@ -1,24 +0,0 @@
|
|
|
1
|
-
import type { ManifestData } from "@pixzle/core";
|
|
2
|
-
export interface UsePixzleImagesProps {
|
|
3
|
-
/** Image sources - URLs or Blobs */
|
|
4
|
-
images: (string | Blob)[];
|
|
5
|
-
/** Manifest URL */
|
|
6
|
-
manifest?: string;
|
|
7
|
-
/** Manifest data object (alternative to manifest) */
|
|
8
|
-
manifestData?: ManifestData;
|
|
9
|
-
/** Whether to auto-start restoration */
|
|
10
|
-
autoRestore?: boolean;
|
|
11
|
-
}
|
|
12
|
-
export interface UsePixzleImagesResult {
|
|
13
|
-
/** Restored image URLs (object URLs) */
|
|
14
|
-
sources: string[];
|
|
15
|
-
/** Loading state */
|
|
16
|
-
isLoading: boolean;
|
|
17
|
-
/** Error if restoration failed */
|
|
18
|
-
error: Error | null;
|
|
19
|
-
/** Progress (0-1) */
|
|
20
|
-
progress: number;
|
|
21
|
-
/** Manually trigger restoration */
|
|
22
|
-
restore: () => Promise<void>;
|
|
23
|
-
}
|
|
24
|
-
export declare const usePixzleImages: ({ images, manifest, manifestData, autoRestore, }: UsePixzleImagesProps) => UsePixzleImagesResult;
|
package/dist/usePixzleImages.js
DELETED
|
@@ -1,72 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
var __importDefault = (this && this.__importDefault) || function (mod) {
|
|
3
|
-
return (mod && mod.__esModule) ? mod : { "default": mod };
|
|
4
|
-
};
|
|
5
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
6
|
-
exports.usePixzleImages = void 0;
|
|
7
|
-
const browser_1 = __importDefault(require("@pixzle/browser"));
|
|
8
|
-
const react_1 = require("react");
|
|
9
|
-
const utils_1 = require("./utils");
|
|
10
|
-
const usePixzleImages = ({ images, manifest, manifestData, autoRestore = true, }) => {
|
|
11
|
-
const [sources, setSources] = (0, react_1.useState)([]);
|
|
12
|
-
const [error, setError] = (0, react_1.useState)(null);
|
|
13
|
-
const [isLoading, setIsLoading] = (0, react_1.useState)(false);
|
|
14
|
-
const [progress, setProgress] = (0, react_1.useState)(0);
|
|
15
|
-
const sourcesRef = (0, react_1.useRef)([]);
|
|
16
|
-
// Keep ref in sync with sources state
|
|
17
|
-
(0, react_1.useEffect)(() => {
|
|
18
|
-
sourcesRef.current = sources;
|
|
19
|
-
}, [sources]);
|
|
20
|
-
const restore = (0, react_1.useCallback)(async () => {
|
|
21
|
-
if (!images.length)
|
|
22
|
-
return;
|
|
23
|
-
if (!manifest && !manifestData)
|
|
24
|
-
return;
|
|
25
|
-
setIsLoading(true);
|
|
26
|
-
setError(null);
|
|
27
|
-
setProgress(0);
|
|
28
|
-
try {
|
|
29
|
-
const restoredBitmaps = await browser_1.default.restore({
|
|
30
|
-
images,
|
|
31
|
-
manifest,
|
|
32
|
-
manifestData,
|
|
33
|
-
});
|
|
34
|
-
const urls = [];
|
|
35
|
-
for (let i = 0; i < restoredBitmaps.length; i++) {
|
|
36
|
-
const bitmap = restoredBitmaps[i];
|
|
37
|
-
const url = await (0, utils_1.imageBitmapToBlobUrl)(bitmap);
|
|
38
|
-
urls.push(url);
|
|
39
|
-
setProgress((i + 1) / restoredBitmaps.length);
|
|
40
|
-
}
|
|
41
|
-
// Cleanup old URLs
|
|
42
|
-
setSources((prev) => {
|
|
43
|
-
for (const url of prev) {
|
|
44
|
-
URL.revokeObjectURL(url);
|
|
45
|
-
}
|
|
46
|
-
return urls;
|
|
47
|
-
});
|
|
48
|
-
}
|
|
49
|
-
catch (err) {
|
|
50
|
-
setError(err instanceof Error ? err : new Error(String(err)));
|
|
51
|
-
}
|
|
52
|
-
finally {
|
|
53
|
-
setIsLoading(false);
|
|
54
|
-
}
|
|
55
|
-
}, [images, manifest, manifestData]);
|
|
56
|
-
(0, react_1.useEffect)(() => {
|
|
57
|
-
if (autoRestore) {
|
|
58
|
-
restore();
|
|
59
|
-
}
|
|
60
|
-
}, [restore, autoRestore]);
|
|
61
|
-
// Cleanup URLs on unmount
|
|
62
|
-
(0, react_1.useEffect)(() => {
|
|
63
|
-
return () => {
|
|
64
|
-
for (const url of sourcesRef.current) {
|
|
65
|
-
URL.revokeObjectURL(url);
|
|
66
|
-
}
|
|
67
|
-
};
|
|
68
|
-
}, []);
|
|
69
|
-
return { sources, isLoading, error, progress, restore };
|
|
70
|
-
};
|
|
71
|
-
exports.usePixzleImages = usePixzleImages;
|
|
72
|
-
//# sourceMappingURL=usePixzleImages.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"usePixzleImages.js","sourceRoot":"","sources":["../src/usePixzleImages.ts"],"names":[],"mappings":"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"}
|
package/dist/utils.d.ts
DELETED
package/dist/utils.js
DELETED
|
@@ -1,27 +0,0 @@
|
|
|
1
|
-
"use strict";
|
|
2
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
3
|
-
exports.imageBitmapToBlobUrl = imageBitmapToBlobUrl;
|
|
4
|
-
/**
|
|
5
|
-
* Convert an ImageBitmap to a Blob URL
|
|
6
|
-
* @param bitmap The ImageBitmap to convert
|
|
7
|
-
* @returns Promise resolving to a Blob URL string
|
|
8
|
-
*/
|
|
9
|
-
async function imageBitmapToBlobUrl(bitmap) {
|
|
10
|
-
const canvas = document.createElement("canvas");
|
|
11
|
-
canvas.width = bitmap.width;
|
|
12
|
-
canvas.height = bitmap.height;
|
|
13
|
-
const ctx = canvas.getContext("2d");
|
|
14
|
-
if (!ctx)
|
|
15
|
-
throw new Error("Could not get 2D context");
|
|
16
|
-
ctx.drawImage(bitmap, 0, 0);
|
|
17
|
-
const blob = await new Promise((resolve, reject) => {
|
|
18
|
-
canvas.toBlob((b) => {
|
|
19
|
-
if (b)
|
|
20
|
-
resolve(b);
|
|
21
|
-
else
|
|
22
|
-
reject(new Error("Failed to create blob"));
|
|
23
|
-
});
|
|
24
|
-
});
|
|
25
|
-
return URL.createObjectURL(blob);
|
|
26
|
-
}
|
|
27
|
-
//# sourceMappingURL=utils.js.map
|
package/dist/utils.js.map
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"utils.js","sourceRoot":"","sources":["../src/utils.ts"],"names":[],"mappings":";;AAKA,oDAmBC;AAxBD;;;;GAIG;AACI,KAAK,UAAU,oBAAoB,CACxC,MAAmB;IAEnB,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IAChD,MAAM,CAAC,KAAK,GAAG,MAAM,CAAC,KAAK,CAAC;IAC5B,MAAM,CAAC,MAAM,GAAG,MAAM,CAAC,MAAM,CAAC;IAC9B,MAAM,GAAG,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;IACpC,IAAI,CAAC,GAAG;QAAE,MAAM,IAAI,KAAK,CAAC,0BAA0B,CAAC,CAAC;IAEtD,GAAG,CAAC,SAAS,CAAC,MAAM,EAAE,CAAC,EAAE,CAAC,CAAC,CAAC;IAE5B,MAAM,IAAI,GAAG,MAAM,IAAI,OAAO,CAAO,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;QACvD,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC,EAAE,EAAE;YAClB,IAAI,CAAC;gBAAE,OAAO,CAAC,CAAC,CAAC,CAAC;;gBACb,MAAM,CAAC,IAAI,KAAK,CAAC,uBAAuB,CAAC,CAAC,CAAC;QAClD,CAAC,CAAC,CAAC;IACL,CAAC,CAAC,CAAC;IAEH,OAAO,GAAG,CAAC,eAAe,CAAC,IAAI,CAAC,CAAC;AACnC,CAAC"}
|