@webstudio-is/image 0.179.0 → 0.182.0

package/lib/index.js

@@ -71,6 +71,14 @@ var getInt = (value) => {
 };
 var DEFAULT_SIZES = "(min-width: 1280px) 50vw, 100vw";
 var DEFAULT_QUALITY = 80;
+var UrlCanParse = (url) => {
+  try {
+    new URL(url);
+    return true;
+  } catch {
+    return false;
+  }
+};
 var getImageAttributes = (props) => {
   const width = getInt(props.width);
   const quality = Math.max(
@@ -88,7 +96,9 @@ var getImageAttributes = (props) => {
         loader: props.loader
       });
     }
-    const resAttrs = { src: props.src };
+    const resAttrs = {
+      src: UrlCanParse(props.src) ? props.src : props.loader({ src: props.src, format: "raw" })
+    };
     if (props.srcSet != null) {
       resAttrs.srcSet = props.srcSet;
     }
@@ -183,15 +193,17 @@ var createImageLoader = (loaderOptions) => (props) => {
   } catch {
     return src;
   }
-  resultUrl.searchParams.set("width", width.toString());
-  resultUrl.searchParams.set("quality", quality.toString());
-  resultUrl.searchParams.set("format", format ?? "auto");
-  if (props.format !== "raw" && props.height != null) {
-    resultUrl.searchParams.set("height", props.height.toString());
-  }
-  if (props.format !== "raw" && props.fit != null) {
-    resultUrl.searchParams.set("fit", props.fit);
+  if (format !== "raw") {
+    resultUrl.searchParams.set("width", width.toString());
+    resultUrl.searchParams.set("quality", quality.toString());
+    if (props.height != null) {
+      resultUrl.searchParams.set("height", props.height.toString());
+    }
+    if (props.fit != null) {
+      resultUrl.searchParams.set("fit", props.fit);
+    }
   }
+  resultUrl.searchParams.set("format", format ?? "auto");
   resultUrl.pathname = joinPath(resultUrl.pathname, encodePathFragment(src));
   if (resultUrl.href.startsWith(NON_EXISTING_DOMAIN)) {
     return `${resultUrl.pathname}?${resultUrl.searchParams.toString()}`;
@@ -200,6 +212,7 @@ var createImageLoader = (loaderOptions) => (props) => {
 };
 export {
   Image,
+  UrlCanParse,
   allSizes,
   createImageLoader,
   getImageAttributes,

package/lib/types/image-optimize.d.ts

@@ -96,6 +96,10 @@ export type ImageLoader = (props: {
     format: "raw";
 }) => string;
 export declare const allSizes: number[];
+/**
+ * URL.canParse(props.src)
+ */
+export declare const UrlCanParse: (url: string) => boolean;
 export declare const getImageAttributes: (props: {
     src: string | undefined;
     srcSet: string | undefined;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@webstudio-is/image",
-  "version": "0.179.0",
+  "version": "0.182.0",
   "description": "Image optimization",
   "author": "Webstudio <github@webstudio.is>",
   "homepage": "https://webstudio.is",