jazz-tools 0.16.6 → 0.17.0

package/src/tools/coValues/extensions/imageDef.ts

@@ -3,58 +3,12 @@ import { Loaded, coFileStreamDefiner, coMapDefiner } from "../../internal.js";
 
 // avoiding circularity by using the standalone definers instead of `co`
 const ImageDefinitionBase = coMapDefiner({
+  original: coFileStreamDefiner(),
   originalSize: z.tuple([z.number(), z.number()]),
   placeholderDataURL: z.string().optional(),
+  progressive: z.boolean(),
 }).catchall(coFileStreamDefiner());
 
 /** @category Media */
-export const ImageDefinition = Object.assign({}, ImageDefinitionBase, {
-  highestResAvailable(
-    imageDef: ImageDefinition,
-    options?: {
-      maxWidth?: number;
-      targetWidth?: number;
-    },
-  ) {
-    const resolutions = Object.keys(imageDef).filter((key) =>
-      key.match(/^\d+x\d+$/),
-    ) as `${number}x${number}`[];
-
-    let maxWidth = options?.maxWidth;
-
-    if (options?.targetWidth) {
-      const targetWidth = options.targetWidth;
-      const widths = resolutions.map((res) => Number(res.split("x")[0]));
-
-      maxWidth = Math.min(...widths.filter((w) => w >= targetWidth));
-    }
-
-    const validResolutions = resolutions.filter(
-      (key) => maxWidth === undefined || Number(key.split("x")[0]) <= maxWidth,
-    ) as `${number}x${number}`[];
-
-    // Sort the resolutions by width, smallest to largest
-    validResolutions.sort((a, b) => {
-      const aWidth = Number(a.split("x")[0]);
-      const bWidth = Number(b.split("x")[0]);
-      return aWidth - bWidth; // Sort smallest to largest
-    });
-
-    let highestAvailableResolution: `${number}x${number}` | undefined;
-
-    for (const resolution of validResolutions) {
-      if (imageDef[resolution] && imageDef[resolution]?.getChunks()) {
-        highestAvailableResolution = resolution;
-      }
-    }
-
-    // Return the highest complete resolution if we found one
-    return (
-      highestAvailableResolution && {
-        res: highestAvailableResolution,
-        stream: imageDef[highestAvailableResolution]!,
-      }
-    );
-  },
-});
+export const ImageDefinition = ImageDefinitionBase;
 export type ImageDefinition = Loaded<typeof ImageDefinition>;

package/src/tools/implementation/zodSchema/schemaTypes/FileStreamSchema.ts

@@ -42,6 +42,12 @@ export class FileStreamSchema implements CoreFileStreamSchema {
     return this.coValueClass.createFromBlob(blob, options);
   }
 
+  createFromArrayBuffer(
+    ...args: Parameters<typeof FileStream.createFromArrayBuffer>
+  ) {
+    return this.coValueClass.createFromArrayBuffer(...args);
+  }
+
   loadAsBlob(
     id: string,
     options?: {

package/src/tools/tests/coMap.record.test.ts

@@ -8,8 +8,7 @@ import {
   test,
   vi,
 } from "vitest";
-import { Group, co, z } from "../exports.js";
-import { InstanceOrPrimitiveOfSchema } from "../implementation/zodSchema/typeConverters/InstanceOrPrimitiveOfSchema.js";
+import { FileStream, Group, co, z } from "../exports.js";
 import { Loaded } from "../implementation/zodSchema/zodSchema.js";
 import { Account } from "../index.js";
 import { createJazzTestAccount, setupJazzTestSync } from "../testing.js";
@@ -373,6 +372,8 @@ describe("CoMap.Record", async () => {
       type: "repro",
       name: "John",
       image: co.image().create({
+        original: FileStream.create(),
+        progressive: false,
         originalSize: [1920, 1080],
       }),
     });

package/src/tools/tests/coOptional.test.ts

@@ -1,5 +1,5 @@
 import { beforeEach, describe, expect, test } from "vitest";
-import { CoPlainText, co, z } from "../exports.js";
+import { CoPlainText, FileStream, co, z } from "../exports.js";
 import { createJazzTestAccount, setupJazzTestSync } from "../testing.js";
 
 describe("co.optional", () => {
@@ -69,6 +69,8 @@ describe("co.optional", () => {
     schema.fileStream = Schema.shape.fileStream.innerType.create();
     schema.image = Schema.shape.image.innerType.create({
       originalSize: [1920, 1080],
+      original: FileStream.create(),
+      progressive: false,
     });
     schema.record = Schema.shape.record.innerType.create({ field: "hello" });
     schema.map = Schema.shape.map.innerType.create({ field: "hello" });

package/tsconfig.json

@@ -21,6 +21,7 @@
     "src/**/*.ts",
     "./src/**/*.js",
     "./src/**/*.ts",
+    "./src/**/*.tsx",
     "./src/**/*.svelte"
   ],
   "exclude": ["./node_modules"]

package/tsup.config.ts

@@ -29,9 +29,11 @@ export default defineConfig([
   {
     ...cfg,
     entry: {
-      index: "src/browser-media-images/index.ts",
+      index: "src/media/index.ts",
+      "index.browser": "src/media/index.browser.ts",
+      "index.native": "src/media/index.native.ts",
     },
-    outDir: "dist/browser-media-images",
+    outDir: "dist/media",
   },
   {
     ...cfg,
@@ -121,13 +123,6 @@ export default defineConfig([
     },
     outDir: "dist/react-native-core",
   },
-  {
-    ...cfg,
-    entry: {
-      index: "src/react-native-media-images/index.ts",
-    },
-    outDir: "dist/react-native-media-images",
-  },
   {
     ...cfg,
     entry: {

package/vitest.config.ts

@@ -1,9 +1,22 @@
+import { svelte } from "@sveltejs/vite-plugin-svelte";
+import { svelteTesting } from "@testing-library/svelte/vite";
 import { defineProject } from "vitest/config";
 
 export default defineProject({
+  plugins: [
+    svelte(),
+    svelteTesting({
+      resolveBrowser: false,
+    }),
+  ],
+  resolve: {
+    // 'browser' for Svelte Testing Library
+    // 'node' for "msw/node"
+    conditions: ["browser", "node"],
+  },
   test: {
     name: "jazz-tools",
-    include: ["src/**/*.test.{js,ts,svelte}"],
+    include: ["src/**/*.test.{js,ts,tsx,svelte}"],
     typecheck: {
       enabled: true,
       checker: "tsc",

package/dist/browser-media-images/index.d.ts

@@ -1,9 +0,0 @@
-import { Account, Group, ImageDefinition, Loaded } from "jazz-tools";
-/** @category Image creation */
-export declare function createImage(imageBlobOrFile: Blob | File, options?: {
-    owner?: Group | Account;
-    maxSize?: 256 | 1024 | 2048;
-}): Promise<Loaded<typeof ImageDefinition, {
-    $each: true;
-}>>;
-//# sourceMappingURL=index.d.ts.map

package/dist/browser-media-images/index.d.ts.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../src/browser-media-images/index.ts"],"names":[],"mappings":"AACA,OAAO,EACL,OAAO,EAEP,KAAK,EACL,eAAe,EACf,MAAM,EACP,MAAM,YAAY,CAAC;AAKpB,+BAA+B;AAC/B,wBAAsB,WAAW,CAC/B,eAAe,EAAE,IAAI,GAAG,IAAI,EAC5B,OAAO,CAAC,EAAE;IACR,KAAK,CAAC,EAAE,KAAK,GAAG,OAAO,CAAC;IACxB,OAAO,CAAC,EAAE,GAAG,GAAG,IAAI,GAAG,IAAI,CAAC;CAC7B,GACA,OAAO,CAAC,MAAM,CAAC,OAAO,eAAe,EAAE;IAAE,KAAK,EAAE,IAAI,CAAA;CAAE,CAAC,CAAC,CA8C1D"}

package/dist/browser-media-images/index.js

@@ -1,72 +0,0 @@
-// src/browser-media-images/index.ts
-import ImageBlobReduce from "image-blob-reduce";
-import {
-  FileStream,
-  ImageDefinition
-} from "jazz-tools";
-import Pica from "pica";
-var reducer;
-async function createImage(imageBlobOrFile, options) {
-  const { width: originalWidth, height: originalHeight } = await getImageSize(imageBlobOrFile);
-  const highestDimension = Math.max(originalWidth, originalHeight);
-  const resizes = [256, 1024, 2048, highestDimension].filter((s) => s <= (options?.maxSize ?? highestDimension)).toSorted((a, b) => a - b);
-  const { width: finalWidth, height: finalHeight } = getNewDimensions(
-    originalWidth,
-    originalHeight,
-    resizes.at(-1)
-  );
-  const imageDefinition = ImageDefinition.create(
-    { originalSize: [finalWidth, finalHeight] },
-    options?.owner
-  );
-  const owner = imageDefinition._owner;
-  imageDefinition.placeholderDataURL = await getPlaceholderBase64(imageBlobOrFile);
-  for (let size of resizes) {
-    const { width, height } = getNewDimensions(
-      originalWidth,
-      originalHeight,
-      size
-    );
-    const image = await resize(imageBlobOrFile, width, height);
-    const binaryStream = await FileStream.createFromBlob(image, owner);
-    imageDefinition[`${width}x${height}`] = binaryStream;
-  }
-  return imageDefinition;
-}
-async function getImageSize(imageBlobOrFile) {
-  const { width, height } = await new Promise((resolve, reject) => {
-    const img = new Image();
-    img.onload = () => {
-      resolve({ width: img.width, height: img.height });
-      URL.revokeObjectURL(img.src);
-    };
-    img.onerror = () => {
-      reject(new Error("Failed to load image"));
-      URL.revokeObjectURL(img.src);
-    };
-    img.src = URL.createObjectURL(imageBlobOrFile);
-  });
-  return { width, height };
-}
-async function getPlaceholderBase64(imageBlobOrFile) {
-  if (!reducer) {
-    reducer = new ImageBlobReduce({ pica: new Pica() });
-  }
-  const canvas = await reducer.toCanvas(imageBlobOrFile, { max: 8 });
-  return canvas.toDataURL("image/png");
-}
-async function resize(imageBlobOrFile, width, height) {
-  if (!reducer) {
-    reducer = new ImageBlobReduce({ pica: new Pica() });
-  }
-  return reducer.toBlob(imageBlobOrFile, { max: Math.max(width, height) });
-}
-var getNewDimensions = (originalWidth, originalHeight, maxSize) => {
-  const width = originalWidth > originalHeight ? maxSize : Math.round(maxSize * (originalWidth / originalHeight));
-  const height = originalHeight > originalWidth ? maxSize : Math.round(maxSize * (originalHeight / originalWidth));
-  return { width, height };
-};
-export {
-  createImage
-};
-//# sourceMappingURL=index.js.map

package/dist/browser-media-images/index.js.map

@@ -1 +0,0 @@
-{"version":3,"sources":["../../src/browser-media-images/index.ts"],"sourcesContent":["import ImageBlobReduce from \"image-blob-reduce\";\nimport {\n  Account,\n  FileStream,\n  Group,\n  ImageDefinition,\n  Loaded,\n} from \"jazz-tools\";\nimport Pica from \"pica\";\n\nlet reducer: ImageBlobReduce.ImageBlobReduce | undefined;\n\n/** @category Image creation */\nexport async function createImage(\n  imageBlobOrFile: Blob | File,\n  options?: {\n    owner?: Group | Account;\n    maxSize?: 256 | 1024 | 2048;\n  },\n): Promise<Loaded<typeof ImageDefinition, { $each: true }>> {\n  // Get the original size of the image\n  const { width: originalWidth, height: originalHeight } =\n    await getImageSize(imageBlobOrFile);\n\n  const highestDimension = Math.max(originalWidth, originalHeight);\n\n  // Calculate the sizes to resize the image to\n  const resizes = [256, 1024, 2048, highestDimension]\n    .filter((s) => s <= (options?.maxSize ?? highestDimension))\n    .toSorted((a, b) => a - b);\n\n  // Get the highest resolution to use as final original size\n  // In case of options.maxSize, it's not the originalWidth/Height\n  const { width: finalWidth, height: finalHeight } = getNewDimensions(\n    originalWidth,\n    originalHeight,\n    resizes.at(-1)!,\n  );\n\n  const imageDefinition = ImageDefinition.create(\n    { originalSize: [finalWidth, finalHeight] },\n    options?.owner,\n  );\n  const owner = imageDefinition._owner;\n\n  // Placeholder 8x8\n  imageDefinition.placeholderDataURL =\n    await getPlaceholderBase64(imageBlobOrFile);\n\n  // Resizes for progressive loading\n  for (let size of resizes) {\n    // Calculate width and height respecting the aspect ratio\n    const { width, height } = getNewDimensions(\n      originalWidth,\n      originalHeight,\n      size,\n    );\n\n    const image = await resize(imageBlobOrFile, width, height);\n\n    const binaryStream = await FileStream.createFromBlob(image, owner);\n    imageDefinition[`${width}x${height}`] = binaryStream;\n  }\n\n  return imageDefinition;\n}\n\nasync function getImageSize(\n  imageBlobOrFile: Blob | File,\n): Promise<{ width: number; height: number }> {\n  const { width, height } = await new Promise<{\n    width: number;\n    height: number;\n  }>((resolve, reject) => {\n    const img = new Image();\n    img.onload = () => {\n      resolve({ width: img.width, height: img.height });\n      URL.revokeObjectURL(img.src);\n    };\n    img.onerror = () => {\n      reject(new Error(\"Failed to load image\"));\n      URL.revokeObjectURL(img.src);\n    };\n    img.src = URL.createObjectURL(imageBlobOrFile);\n  });\n\n  return { width, height };\n}\n\nasync function getPlaceholderBase64(\n  imageBlobOrFile: Blob | File,\n): Promise<string> {\n  // Inizialize Reducer here to not have module side effects\n  if (!reducer) {\n    reducer = new ImageBlobReduce({ pica: new Pica() });\n  }\n\n  const canvas = await reducer.toCanvas(imageBlobOrFile, { max: 8 });\n  return canvas.toDataURL(\"image/png\");\n}\n\nasync function resize(\n  imageBlobOrFile: Blob | File,\n  width: number,\n  height: number,\n): Promise<Blob> {\n  // Inizialize Reducer here to not have module side effects\n  if (!reducer) {\n    reducer = new ImageBlobReduce({ pica: new Pica() });\n  }\n\n  return reducer.toBlob(imageBlobOrFile, { max: Math.max(width, height) });\n}\n\nconst getNewDimensions = (\n  originalWidth: number,\n  originalHeight: number,\n  maxSize: number,\n) => {\n  const width =\n    originalWidth > originalHeight\n      ? maxSize\n      : Math.round(maxSize * (originalWidth / originalHeight));\n\n  const height =\n    originalHeight > originalWidth\n      ? maxSize\n      : Math.round(maxSize * (originalHeight / originalWidth));\n\n  return { width, height };\n};\n"],"mappings":";AAAA,OAAO,qBAAqB;AAC5B;AAAA,EAEE;AAAA,EAEA;AAAA,OAEK;AACP,OAAO,UAAU;AAEjB,IAAI;AAGJ,eAAsB,YACpB,iBACA,SAI0D;AAE1D,QAAM,EAAE,OAAO,eAAe,QAAQ,eAAe,IACnD,MAAM,aAAa,eAAe;AAEpC,QAAM,mBAAmB,KAAK,IAAI,eAAe,cAAc;AAG/D,QAAM,UAAU,CAAC,KAAK,MAAM,MAAM,gBAAgB,EAC/C,OAAO,CAAC,MAAM,MAAM,SAAS,WAAW,iBAAiB,EACzD,SAAS,CAAC,GAAG,MAAM,IAAI,CAAC;AAI3B,QAAM,EAAE,OAAO,YAAY,QAAQ,YAAY,IAAI;AAAA,IACjD;AAAA,IACA;AAAA,IACA,QAAQ,GAAG,EAAE;AAAA,EACf;AAEA,QAAM,kBAAkB,gBAAgB;AAAA,IACtC,EAAE,cAAc,CAAC,YAAY,WAAW,EAAE;AAAA,IAC1C,SAAS;AAAA,EACX;AACA,QAAM,QAAQ,gBAAgB;AAG9B,kBAAgB,qBACd,MAAM,qBAAqB,eAAe;AAG5C,WAAS,QAAQ,SAAS;AAExB,UAAM,EAAE,OAAO,OAAO,IAAI;AAAA,MACxB;AAAA,MACA;AAAA,MACA;AAAA,IACF;AAEA,UAAM,QAAQ,MAAM,OAAO,iBAAiB,OAAO,MAAM;AAEzD,UAAM,eAAe,MAAM,WAAW,eAAe,OAAO,KAAK;AACjE,oBAAgB,GAAG,KAAK,IAAI,MAAM,EAAE,IAAI;AAAA,EAC1C;AAEA,SAAO;AACT;AAEA,eAAe,aACb,iBAC4C;AAC5C,QAAM,EAAE,OAAO,OAAO,IAAI,MAAM,IAAI,QAGjC,CAAC,SAAS,WAAW;AACtB,UAAM,MAAM,IAAI,MAAM;AACtB,QAAI,SAAS,MAAM;AACjB,cAAQ,EAAE,OAAO,IAAI,OAAO,QAAQ,IAAI,OAAO,CAAC;AAChD,UAAI,gBAAgB,IAAI,GAAG;AAAA,IAC7B;AACA,QAAI,UAAU,MAAM;AAClB,aAAO,IAAI,MAAM,sBAAsB,CAAC;AACxC,UAAI,gBAAgB,IAAI,GAAG;AAAA,IAC7B;AACA,QAAI,MAAM,IAAI,gBAAgB,eAAe;AAAA,EAC/C,CAAC;AAED,SAAO,EAAE,OAAO,OAAO;AACzB;AAEA,eAAe,qBACb,iBACiB;AAEjB,MAAI,CAAC,SAAS;AACZ,cAAU,IAAI,gBAAgB,EAAE,MAAM,IAAI,KAAK,EAAE,CAAC;AAAA,EACpD;AAEA,QAAM,SAAS,MAAM,QAAQ,SAAS,iBAAiB,EAAE,KAAK,EAAE,CAAC;AACjE,SAAO,OAAO,UAAU,WAAW;AACrC;AAEA,eAAe,OACb,iBACA,OACA,QACe;AAEf,MAAI,CAAC,SAAS;AACZ,cAAU,IAAI,gBAAgB,EAAE,MAAM,IAAI,KAAK,EAAE,CAAC;AAAA,EACpD;AAEA,SAAO,QAAQ,OAAO,iBAAiB,EAAE,KAAK,KAAK,IAAI,OAAO,MAAM,EAAE,CAAC;AACzE;AAEA,IAAM,mBAAmB,CACvB,eACA,gBACA,YACG;AACH,QAAM,QACJ,gBAAgB,iBACZ,UACA,KAAK,MAAM,WAAW,gBAAgB,eAAe;AAE3D,QAAM,SACJ,iBAAiB,gBACb,UACA,KAAK,MAAM,WAAW,iBAAiB,cAAc;AAE3D,SAAO,EAAE,OAAO,OAAO;AACzB;","names":[]}