@metaobjectsdev/runtime-web 0.18.0 → 0.19.0-rc.1
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/canvas-to-jpeg-blob.d.ts +2 -0
- package/dist/canvas-to-jpeg-blob.d.ts.map +1 -0
- package/dist/canvas-to-jpeg-blob.js +6 -0
- package/dist/canvas-to-jpeg-blob.js.map +1 -0
- package/dist/image-adapter.d.ts +20 -0
- package/dist/image-adapter.d.ts.map +1 -0
- package/dist/image-adapter.js +2 -0
- package/dist/image-adapter.js.map +1 -0
- package/dist/index.d.ts +3 -0
- package/dist/index.d.ts.map +1 -1
- package/dist/index.js +2 -0
- package/dist/index.js.map +1 -1
- package/dist/reencode-jpeg.d.ts +3 -0
- package/dist/reencode-jpeg.d.ts.map +1 -0
- package/dist/reencode-jpeg.js +18 -0
- package/dist/reencode-jpeg.js.map +1 -0
- package/package.json +2 -2
- package/src/canvas-to-jpeg-blob.ts +9 -0
- package/src/image-adapter.ts +16 -0
- package/src/index.ts +3 -0
- package/src/reencode-jpeg.ts +17 -0
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"canvas-to-jpeg-blob.d.ts","sourceRoot":"","sources":["../src/canvas-to-jpeg-blob.ts"],"names":[],"mappings":"AAAA,wBAAgB,gBAAgB,CAAC,MAAM,EAAE,iBAAiB,EAAE,OAAO,SAAM,GAAG,OAAO,CAAC,IAAI,CAAC,CAQxF"}
|
|
@@ -0,0 +1,6 @@
|
|
|
1
|
+
export function canvasToJpegBlob(canvas, quality = 0.9) {
|
|
2
|
+
return new Promise((resolve, reject) => {
|
|
3
|
+
canvas.toBlob((blob) => (blob ? resolve(blob) : reject(new Error("toBlob returned null"))), "image/jpeg", quality);
|
|
4
|
+
});
|
|
5
|
+
}
|
|
6
|
+
//# sourceMappingURL=canvas-to-jpeg-blob.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"canvas-to-jpeg-blob.js","sourceRoot":"","sources":["../src/canvas-to-jpeg-blob.ts"],"names":[],"mappings":"AAAA,MAAM,UAAU,gBAAgB,CAAC,MAAyB,EAAE,OAAO,GAAG,GAAG;IACvE,OAAO,IAAI,OAAO,CAAO,CAAC,OAAO,EAAE,MAAM,EAAE,EAAE;QAC3C,MAAM,CAAC,MAAM,CACX,CAAC,IAAI,EAAE,EAAE,CAAC,CAAC,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,IAAI,CAAC,CAAC,CAAC,CAAC,MAAM,CAAC,IAAI,KAAK,CAAC,sBAAsB,CAAC,CAAC,CAAC,EAC5E,YAAY,EACZ,OAAO,CACR,CAAC;IACJ,CAAC,CAAC,CAAC;AACL,CAAC"}
|
|
@@ -0,0 +1,20 @@
|
|
|
1
|
+
/** The upload/serve seam a consumer implements for <ImageUpload>. The library ships
|
|
2
|
+
* no concrete adapter — the app supplies one (see docs). `store` is an opaque
|
|
3
|
+
* namespace hint from view.image's @store attr, not infrastructure. */
|
|
4
|
+
export interface ImageUploadAdapter {
|
|
5
|
+
upload(blob: Blob, opts: {
|
|
6
|
+
store?: string;
|
|
7
|
+
}): Promise<{
|
|
8
|
+
key: string;
|
|
9
|
+
}>;
|
|
10
|
+
imageUrl(key: string): string;
|
|
11
|
+
}
|
|
12
|
+
/** view.image's declared attrs, resolved into props for <ImageUpload>. */
|
|
13
|
+
export interface ImageMeta {
|
|
14
|
+
aspectRatio?: number;
|
|
15
|
+
maxEdge?: number;
|
|
16
|
+
store?: string;
|
|
17
|
+
accept?: string[];
|
|
18
|
+
maxBytes?: number;
|
|
19
|
+
}
|
|
20
|
+
//# sourceMappingURL=image-adapter.d.ts.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"image-adapter.d.ts","sourceRoot":"","sources":["../src/image-adapter.ts"],"names":[],"mappings":"AAAA;;wEAEwE;AACxE,MAAM,WAAW,kBAAkB;IACjC,MAAM,CAAC,IAAI,EAAE,IAAI,EAAE,IAAI,EAAE;QAAE,KAAK,CAAC,EAAE,MAAM,CAAA;KAAE,GAAG,OAAO,CAAC;QAAE,GAAG,EAAE,MAAM,CAAA;KAAE,CAAC,CAAC;IACvE,QAAQ,CAAC,GAAG,EAAE,MAAM,GAAG,MAAM,CAAC;CAC/B;AAED,0EAA0E;AAC1E,MAAM,WAAW,SAAS;IACxB,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,MAAM,CAAC,EAAE,MAAM,EAAE,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"image-adapter.js","sourceRoot":"","sources":["../src/image-adapter.ts"],"names":[],"mappings":""}
|
package/dist/index.d.ts
CHANGED
|
@@ -3,4 +3,7 @@ export { buildFilterQs } from "./filter-qs.js";
|
|
|
3
3
|
export type { EntityFetcher, GridConfig } from "./fetcher.js";
|
|
4
4
|
export { buildGrid } from "./grid-from-metadata.js";
|
|
5
5
|
export type { MetaColumn, MetaGrid } from "./grid-from-metadata.js";
|
|
6
|
+
export { canvasToJpegBlob } from "./canvas-to-jpeg-blob.js";
|
|
7
|
+
export { reencodeJpeg } from "./reencode-jpeg.js";
|
|
8
|
+
export type { ImageUploadAdapter, ImageMeta } from "./image-adapter.js";
|
|
6
9
|
//# sourceMappingURL=index.d.ts.map
|
package/dist/index.d.ts.map
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAC7E,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,YAAY,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC9D,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AACpD,YAAY,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAC7E,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAC/C,YAAY,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,cAAc,CAAC;AAC9D,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AACpD,YAAY,EAAE,UAAU,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AACpE,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC;AAClD,YAAY,EAAE,kBAAkB,EAAE,SAAS,EAAE,MAAM,oBAAoB,CAAC"}
|
package/dist/index.js
CHANGED
|
@@ -2,4 +2,6 @@
|
|
|
2
2
|
export { formatCurrency, parseCurrency, minorUnitsFor } from "./currency.js";
|
|
3
3
|
export { buildFilterQs } from "./filter-qs.js";
|
|
4
4
|
export { buildGrid } from "./grid-from-metadata.js";
|
|
5
|
+
export { canvasToJpegBlob } from "./canvas-to-jpeg-blob.js";
|
|
6
|
+
export { reencodeJpeg } from "./reencode-jpeg.js";
|
|
5
7
|
//# 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,sDAAsD;AACtD,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAC7E,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAE/C,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC"}
|
|
1
|
+
{"version":3,"file":"index.js","sourceRoot":"","sources":["../src/index.ts"],"names":[],"mappings":"AAAA,sDAAsD;AACtD,OAAO,EAAE,cAAc,EAAE,aAAa,EAAE,aAAa,EAAE,MAAM,eAAe,CAAC;AAC7E,OAAO,EAAE,aAAa,EAAE,MAAM,gBAAgB,CAAC;AAE/C,OAAO,EAAE,SAAS,EAAE,MAAM,yBAAyB,CAAC;AAEpD,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAC5D,OAAO,EAAE,YAAY,EAAE,MAAM,oBAAoB,CAAC"}
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"reencode-jpeg.d.ts","sourceRoot":"","sources":["../src/reencode-jpeg.ts"],"names":[],"mappings":"AAEA,wFAAwF;AACxF,wBAAsB,YAAY,CAAC,IAAI,EAAE,IAAI,GAAG,IAAI,EAAE,OAAO,SAAO,GAAG,OAAO,CAAC,IAAI,CAAC,CAanF"}
|
|
@@ -0,0 +1,18 @@
|
|
|
1
|
+
import { canvasToJpegBlob } from "./canvas-to-jpeg-blob.js";
|
|
2
|
+
/** Whole-image re-encode to JPEG (down-scaled to maxEdge, EXIF stripped via canvas). */
|
|
3
|
+
export async function reencodeJpeg(file, maxEdge = 2000) {
|
|
4
|
+
const bitmap = await createImageBitmap(file, { imageOrientation: "from-image" });
|
|
5
|
+
const scale = Math.min(1, maxEdge / Math.max(bitmap.width, bitmap.height));
|
|
6
|
+
const width = Math.round(bitmap.width * scale);
|
|
7
|
+
const height = Math.round(bitmap.height * scale);
|
|
8
|
+
const canvas = document.createElement("canvas");
|
|
9
|
+
canvas.width = width;
|
|
10
|
+
canvas.height = height;
|
|
11
|
+
const ctx = canvas.getContext("2d");
|
|
12
|
+
if (!ctx)
|
|
13
|
+
throw new Error("canvas 2d context unavailable");
|
|
14
|
+
ctx.drawImage(bitmap, 0, 0, width, height);
|
|
15
|
+
bitmap.close();
|
|
16
|
+
return canvasToJpegBlob(canvas, 0.9);
|
|
17
|
+
}
|
|
18
|
+
//# sourceMappingURL=reencode-jpeg.js.map
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
{"version":3,"file":"reencode-jpeg.js","sourceRoot":"","sources":["../src/reencode-jpeg.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,gBAAgB,EAAE,MAAM,0BAA0B,CAAC;AAE5D,wFAAwF;AACxF,MAAM,CAAC,KAAK,UAAU,YAAY,CAAC,IAAiB,EAAE,OAAO,GAAG,IAAI;IAClE,MAAM,MAAM,GAAG,MAAM,iBAAiB,CAAC,IAAI,EAAE,EAAE,gBAAgB,EAAE,YAAY,EAAE,CAAC,CAAC;IACjF,MAAM,KAAK,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,EAAE,OAAO,GAAG,IAAI,CAAC,GAAG,CAAC,MAAM,CAAC,KAAK,EAAE,MAAM,CAAC,MAAM,CAAC,CAAC,CAAC;IAC3E,MAAM,KAAK,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,KAAK,GAAG,KAAK,CAAC,CAAC;IAC/C,MAAM,MAAM,GAAG,IAAI,CAAC,KAAK,CAAC,MAAM,CAAC,MAAM,GAAG,KAAK,CAAC,CAAC;IACjD,MAAM,MAAM,GAAG,QAAQ,CAAC,aAAa,CAAC,QAAQ,CAAC,CAAC;IAChD,MAAM,CAAC,KAAK,GAAG,KAAK,CAAC;IACrB,MAAM,CAAC,MAAM,GAAG,MAAM,CAAC;IACvB,MAAM,GAAG,GAAG,MAAM,CAAC,UAAU,CAAC,IAAI,CAAC,CAAC;IACpC,IAAI,CAAC,GAAG;QAAE,MAAM,IAAI,KAAK,CAAC,+BAA+B,CAAC,CAAC;IAC3D,GAAG,CAAC,SAAS,CAAC,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,KAAK,EAAE,MAAM,CAAC,CAAC;IAC3C,MAAM,CAAC,KAAK,EAAE,CAAC;IACf,OAAO,gBAAgB,CAAC,MAAM,EAAE,GAAG,CAAC,CAAC;AACvC,CAAC"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@metaobjectsdev/runtime-web",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.19.0-rc.1",
|
|
4
4
|
"description": "Pure framework-agnostic browser core for metaobjects: currency, filter URL serialization, fetcher contract types.",
|
|
5
5
|
"type": "module",
|
|
6
6
|
"main": "./dist/index.js",
|
|
@@ -45,7 +45,7 @@
|
|
|
45
45
|
"access": "public"
|
|
46
46
|
},
|
|
47
47
|
"dependencies": {
|
|
48
|
-
"@metaobjectsdev/metadata": "0.
|
|
48
|
+
"@metaobjectsdev/metadata": "0.19.0-rc.1",
|
|
49
49
|
"qs": "^6.13.0"
|
|
50
50
|
},
|
|
51
51
|
"devDependencies": {
|
|
@@ -0,0 +1,9 @@
|
|
|
1
|
+
export function canvasToJpegBlob(canvas: HTMLCanvasElement, quality = 0.9): Promise<Blob> {
|
|
2
|
+
return new Promise<Blob>((resolve, reject) => {
|
|
3
|
+
canvas.toBlob(
|
|
4
|
+
(blob) => (blob ? resolve(blob) : reject(new Error("toBlob returned null"))),
|
|
5
|
+
"image/jpeg",
|
|
6
|
+
quality,
|
|
7
|
+
);
|
|
8
|
+
});
|
|
9
|
+
}
|
|
@@ -0,0 +1,16 @@
|
|
|
1
|
+
/** The upload/serve seam a consumer implements for <ImageUpload>. The library ships
|
|
2
|
+
* no concrete adapter — the app supplies one (see docs). `store` is an opaque
|
|
3
|
+
* namespace hint from view.image's @store attr, not infrastructure. */
|
|
4
|
+
export interface ImageUploadAdapter {
|
|
5
|
+
upload(blob: Blob, opts: { store?: string }): Promise<{ key: string }>;
|
|
6
|
+
imageUrl(key: string): string;
|
|
7
|
+
}
|
|
8
|
+
|
|
9
|
+
/** view.image's declared attrs, resolved into props for <ImageUpload>. */
|
|
10
|
+
export interface ImageMeta {
|
|
11
|
+
aspectRatio?: number;
|
|
12
|
+
maxEdge?: number;
|
|
13
|
+
store?: string;
|
|
14
|
+
accept?: string[];
|
|
15
|
+
maxBytes?: number;
|
|
16
|
+
}
|
package/src/index.ts
CHANGED
|
@@ -4,3 +4,6 @@ export { buildFilterQs } from "./filter-qs.js";
|
|
|
4
4
|
export type { EntityFetcher, GridConfig } from "./fetcher.js";
|
|
5
5
|
export { buildGrid } from "./grid-from-metadata.js";
|
|
6
6
|
export type { MetaColumn, MetaGrid } from "./grid-from-metadata.js";
|
|
7
|
+
export { canvasToJpegBlob } from "./canvas-to-jpeg-blob.js";
|
|
8
|
+
export { reencodeJpeg } from "./reencode-jpeg.js";
|
|
9
|
+
export type { ImageUploadAdapter, ImageMeta } from "./image-adapter.js";
|
|
@@ -0,0 +1,17 @@
|
|
|
1
|
+
import { canvasToJpegBlob } from "./canvas-to-jpeg-blob.js";
|
|
2
|
+
|
|
3
|
+
/** Whole-image re-encode to JPEG (down-scaled to maxEdge, EXIF stripped via canvas). */
|
|
4
|
+
export async function reencodeJpeg(file: File | Blob, maxEdge = 2000): Promise<Blob> {
|
|
5
|
+
const bitmap = await createImageBitmap(file, { imageOrientation: "from-image" });
|
|
6
|
+
const scale = Math.min(1, maxEdge / Math.max(bitmap.width, bitmap.height));
|
|
7
|
+
const width = Math.round(bitmap.width * scale);
|
|
8
|
+
const height = Math.round(bitmap.height * scale);
|
|
9
|
+
const canvas = document.createElement("canvas");
|
|
10
|
+
canvas.width = width;
|
|
11
|
+
canvas.height = height;
|
|
12
|
+
const ctx = canvas.getContext("2d");
|
|
13
|
+
if (!ctx) throw new Error("canvas 2d context unavailable");
|
|
14
|
+
ctx.drawImage(bitmap, 0, 0, width, height);
|
|
15
|
+
bitmap.close();
|
|
16
|
+
return canvasToJpegBlob(canvas, 0.9);
|
|
17
|
+
}
|