@tradly/asset 1.0.9 → 1.0.11

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.
@@ -20,19 +20,18 @@ function _arrayLikeToArray(r, a) { (null == a || a > r.length) && (a = r.length)
20
20
  function _iterableToArrayLimit(r, l) { var t = null == r ? null : "undefined" != typeof Symbol && r[Symbol.iterator] || r["@@iterator"]; if (null != t) { var e, n, i, u, a = [], f = !0, o = !1; try { if (i = (t = t.call(r)).next, 0 === l) { if (Object(t) !== t) return; f = !1; } else for (; !(f = (e = i.call(t)).done) && (a.push(e.value), a.length !== l); f = !0); } catch (r) { o = !0, n = r; } finally { try { if (!f && null != t.return && (u = t.return(), Object(u) !== u)) return; } finally { if (o) throw n; } } return a; } }
21
21
  function _arrayWithHoles(r) { if (Array.isArray(r)) return r; } // Helper: compress image on the client before upload
22
22
  // - Downscale to fit within maxWidth/maxHeight.
23
- // - Convert PNG to JPEG by default so quality applies (PNG ignores quality).
23
+ // - Convert raster images (JPEG/PNG, etc.) to WebP for better compression.
24
24
  // - Skip SVG (vector) to avoid degradation.
25
25
  var compressImage = function compressImage(file) {
26
26
  var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
27
27
  _ref$maxWidth = _ref.maxWidth,
28
- maxWidth = _ref$maxWidth === void 0 ? 1300 : _ref$maxWidth,
28
+ maxWidth = _ref$maxWidth === void 0 ? 1600 : _ref$maxWidth,
29
29
  _ref$maxHeight = _ref.maxHeight,
30
- maxHeight = _ref$maxHeight === void 0 ? 1300 : _ref$maxHeight,
30
+ maxHeight = _ref$maxHeight === void 0 ? 1600 : _ref$maxHeight,
31
31
  _ref$quality = _ref.quality,
32
- quality = _ref$quality === void 0 ? 0.85 : _ref$quality,
33
- _ref$convertPngToJpeg = _ref.convertPngToJpeg,
34
- convertPngToJpeg = _ref$convertPngToJpeg === void 0 ? false : _ref$convertPngToJpeg;
35
- console.log("compressImage", file, maxWidth, maxHeight, quality, convertPngToJpeg);
32
+ quality = _ref$quality === void 0 ? 1 : _ref$quality,
33
+ _ref$convertToWebp = _ref.convertToWebp,
34
+ convertToWebp = _ref$convertToWebp === void 0 ? true : _ref$convertToWebp;
36
35
  return new Promise(function (resolve) {
37
36
  // Non-image or SVG: skip compression to avoid losing vector quality
38
37
  if (!file.type.startsWith("image/") || file.type === "image/svg+xml") {
@@ -62,8 +61,10 @@ var compressImage = function compressImage(file) {
62
61
  }
63
62
  ctx.drawImage(img, 0, 0, targetWidth, targetHeight);
64
63
 
65
- // Use JPEG for PNG to allow lossy compression (optional)
66
- var targetType = file.type === "image/png" && convertPngToJpeg ? "image/jpeg" : file.type;
64
+ // Prefer WebP for raster images to reduce size (where supported)
65
+ // Keep original type for GIF to avoid breaking animation.
66
+ var isRaster = file.type === "image/jpeg" || file.type === "image/jpg" || file.type === "image/png" || file.type === "image/webp" || file.type === "image/heic" || file.type === "image/heif";
67
+ var targetType = convertToWebp && isRaster && file.type !== "image/gif" ? "image/webp" : file.type;
67
68
  canvas.toBlob(function (blob) {
68
69
  if (!blob) {
69
70
  resolve(file);
@@ -137,9 +138,9 @@ var FileUpload = function FileUpload(_ref2) {
137
138
  _context.n = 2;
138
139
  return Promise.all(fileList.map(function (file) {
139
140
  return compressImage(file, {
140
- maxWidth: 1300,
141
- maxHeight: 1300,
142
- quality: 0.85
141
+ maxWidth: 1600,
142
+ maxHeight: 1600,
143
+ quality: 1
143
144
  });
144
145
  }));
145
146
  case 2:
@@ -13,20 +13,19 @@ import { CameraIcon } from "./Icons";
13
13
 
14
14
  // Helper: compress image on the client before upload
15
15
  // - Downscale to fit within maxWidth/maxHeight.
16
- // - Convert PNG to JPEG by default so quality applies (PNG ignores quality).
16
+ // - Convert raster images (JPEG/PNG, etc.) to WebP for better compression.
17
17
  // - Skip SVG (vector) to avoid degradation.
18
18
  import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
19
19
  var compressImage = function compressImage(file) {
20
20
  var _ref = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : {},
21
21
  _ref$maxWidth = _ref.maxWidth,
22
- maxWidth = _ref$maxWidth === void 0 ? 1300 : _ref$maxWidth,
22
+ maxWidth = _ref$maxWidth === void 0 ? 1600 : _ref$maxWidth,
23
23
  _ref$maxHeight = _ref.maxHeight,
24
- maxHeight = _ref$maxHeight === void 0 ? 1300 : _ref$maxHeight,
24
+ maxHeight = _ref$maxHeight === void 0 ? 1600 : _ref$maxHeight,
25
25
  _ref$quality = _ref.quality,
26
- quality = _ref$quality === void 0 ? 0.85 : _ref$quality,
27
- _ref$convertPngToJpeg = _ref.convertPngToJpeg,
28
- convertPngToJpeg = _ref$convertPngToJpeg === void 0 ? false : _ref$convertPngToJpeg;
29
- console.log("compressImage", file, maxWidth, maxHeight, quality, convertPngToJpeg);
26
+ quality = _ref$quality === void 0 ? 1 : _ref$quality,
27
+ _ref$convertToWebp = _ref.convertToWebp,
28
+ convertToWebp = _ref$convertToWebp === void 0 ? true : _ref$convertToWebp;
30
29
  return new Promise(function (resolve) {
31
30
  // Non-image or SVG: skip compression to avoid losing vector quality
32
31
  if (!file.type.startsWith("image/") || file.type === "image/svg+xml") {
@@ -56,8 +55,10 @@ var compressImage = function compressImage(file) {
56
55
  }
57
56
  ctx.drawImage(img, 0, 0, targetWidth, targetHeight);
58
57
 
59
- // Use JPEG for PNG to allow lossy compression (optional)
60
- var targetType = file.type === "image/png" && convertPngToJpeg ? "image/jpeg" : file.type;
58
+ // Prefer WebP for raster images to reduce size (where supported)
59
+ // Keep original type for GIF to avoid breaking animation.
60
+ var isRaster = file.type === "image/jpeg" || file.type === "image/jpg" || file.type === "image/png" || file.type === "image/webp" || file.type === "image/heic" || file.type === "image/heif";
61
+ var targetType = convertToWebp && isRaster && file.type !== "image/gif" ? "image/webp" : file.type;
61
62
  canvas.toBlob(function (blob) {
62
63
  if (!blob) {
63
64
  resolve(file);
@@ -131,9 +132,9 @@ var FileUpload = function FileUpload(_ref2) {
131
132
  _context.n = 2;
132
133
  return Promise.all(fileList.map(function (file) {
133
134
  return compressImage(file, {
134
- maxWidth: 1300,
135
- maxHeight: 1300,
136
- quality: 0.85
135
+ maxWidth: 1600,
136
+ maxHeight: 1600,
137
+ quality: 1
137
138
  });
138
139
  }));
139
140
  case 2:
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@tradly/asset",
3
- "version": "1.0.9",
3
+ "version": "1.0.11",
4
4
  "description": "A reusable media gallery component for uploading and selecting images, videos, and files with Tradly authentication",
5
5
  "main": "dist/index.js",
6
6
  "module": "dist/esm/index.js",