@lonik/oh-image 2.7.0 → 2.9.0

package/dist/cloudflare.d.ts

@@ -1,7 +1,7 @@
 import { n as ImageLoaderOptions } from "./types-BEgZ3W30.js";
-import "./index-C-1t5-gk.js";
+import "./index-CP-wkNzk.js";
 import { n as BaseLoaderOptions, t as BaseGlobalLoaderOptions } from "./base-loader-options-DCLkYppY.js";
-import * as react_jsx_runtime3 from "react/jsx-runtime";
+import * as react_jsx_runtime7 from "react/jsx-runtime";
 
 //#region src/loaders/cloudflare/cloudflare-options.d.ts
 type CloudflareTransforms = Partial<{
@@ -40,6 +40,6 @@ declare const useCloudflareContext: () => CloudflareGlobalOptions, CloudflareLoa
     ...props
   }: {
     children: React.ReactNode;
-  } & Partial<CloudflareGlobalOptions>) => react_jsx_runtime3.JSX.Element, useCloudflareLoader: (options?: CloudflareGlobalOptions | undefined) => (() => undefined) | ((imageOptions: ImageLoaderOptions) => string);
+  } & Partial<CloudflareGlobalOptions>) => react_jsx_runtime7.JSX.Element, useCloudflareLoader: (options?: CloudflareGlobalOptions | undefined) => (() => undefined) | ((imageOptions: ImageLoaderOptions) => string);
 //#endregion
 export { CloudflareGlobalOptions, CloudflareLoaderProvider, CloudflareOptions, CloudflareTransforms, useCloudflareContext, useCloudflareLoader };

package/dist/cloudinary.d.ts

@@ -1,5 +1,5 @@
 import { n as ImageLoaderOptions } from "./types-BEgZ3W30.js";
-import * as react_jsx_runtime2 from "react/jsx-runtime";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
 import { Cloudinary, CloudinaryImage } from "@cloudinary/url-gen";
 
 //#region src/loaders/cloudinary/cloudinary-options.d.ts
@@ -34,7 +34,7 @@ declare function CloudinaryLoaderProvider({
   children: React.ReactNode;
   transforms?: CloudinaryTransforms;
   placeholder?: CloudinaryTransforms;
-}): react_jsx_runtime2.JSX.Element;
+}): react_jsx_runtime0.JSX.Element;
 declare function useCloudinaryLoader(options?: CloudinaryLoaderHookOptions | CloudinaryTransforms): (imageOptions: ImageLoaderOptions) => string;
 declare const useCloudinaryContext: () => CloudinaryLoaderContext;
 //#endregion

package/dist/contentful.d.ts

@@ -1,7 +1,7 @@
 import { n as ImageLoaderOptions } from "./types-BEgZ3W30.js";
-import "./index-C-1t5-gk.js";
+import "./index-CP-wkNzk.js";
 import { n as BaseLoaderOptions, t as BaseGlobalLoaderOptions } from "./base-loader-options-DCLkYppY.js";
-import * as react_jsx_runtime8 from "react/jsx-runtime";
+import * as react_jsx_runtime3 from "react/jsx-runtime";
 
 //#region src/loaders/contentful/contentful-options.d.ts
 type ContentfulTransforms = Partial<{
@@ -39,6 +39,6 @@ declare const useContentfulContext: () => ContentfulGlobalOptions, ContentfulLoa
     ...props
   }: {
     children: React.ReactNode;
-  } & Partial<ContentfulGlobalOptions>) => react_jsx_runtime8.JSX.Element, useContentfulLoader: (options?: ContentfulGlobalOptions | undefined) => (() => undefined) | ((imageOptions: ImageLoaderOptions) => string);
+  } & Partial<ContentfulGlobalOptions>) => react_jsx_runtime3.JSX.Element, useContentfulLoader: (options?: ContentfulGlobalOptions | undefined) => (() => undefined) | ((imageOptions: ImageLoaderOptions) => string);
 //#endregion
 export { ContentfulGlobalOptions, ContentfulLoaderProvider, ContentfulOptions, ContentfulTransforms, useContentfulContext, useContentfulLoader };

package/dist/imgproxy.d.ts

@@ -1,7 +1,7 @@
 import { n as ImageLoaderOptions } from "./types-BEgZ3W30.js";
-import "./index-C-1t5-gk.js";
+import "./index-CP-wkNzk.js";
 import { n as BaseLoaderOptions, t as BaseGlobalLoaderOptions } from "./base-loader-options-DCLkYppY.js";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
+import * as react_jsx_runtime6 from "react/jsx-runtime";
 
 //#region src/loaders/imgproxy/imgproxy-options.d.ts
 type ResizeType = "fit" | "fill" | "fill-down" | "force" | "auto";
@@ -384,6 +384,6 @@ declare const useImgproxyContext: () => ImgproxyGlobalOptions, ImgproxyLoaderPro
     ...props
   }: {
     children: React.ReactNode;
-  } & Partial<ImgproxyGlobalOptions>) => react_jsx_runtime0.JSX.Element, useImgproxyLoader: (options?: ImgproxyGlobalOptions | undefined) => (() => undefined) | ((imageOptions: ImageLoaderOptions) => string);
+  } & Partial<ImgproxyGlobalOptions>) => react_jsx_runtime6.JSX.Element, useImgproxyLoader: (options?: ImgproxyGlobalOptions | undefined) => (() => undefined) | ((imageOptions: ImageLoaderOptions) => string);
 //#endregion
 export { ImgproxyGlobalOptions, ImgproxyLoaderProvider, ImgproxyOptions, ImgproxyTransforms, useImgproxyContext, useImgproxyLoader };

package/dist/{index-C-1t5-gk.d.ts → index-CP-wkNzk.d.ts}

@@ -1,11 +1,11 @@
 import { r as ImageProps, t as ImageLoader } from "./types-BEgZ3W30.js";
-import * as react_jsx_runtime6 from "react/jsx-runtime";
+import * as react_jsx_runtime1 from "react/jsx-runtime";
 
 //#region src/react/image.d.ts
-declare function Image(props: ImageProps): react_jsx_runtime6.JSX.Element;
+declare function Image(props: ImageProps): react_jsx_runtime1.JSX.Element;
 //#endregion
 //#region src/react/image-factory.d.ts
-declare function __imageFactory(defaultProps: any): (props: any) => react_jsx_runtime6.JSX.Element;
+declare function __imageFactory(defaultProps: any): (props: any) => react_jsx_runtime1.JSX.Element;
 //#endregion
 //#region src/react/use-img-loaded.d.ts
 /**
@@ -47,6 +47,6 @@ declare function ImageProvider({
   ...props
 }: {
   children: React.ReactNode;
-} & Partial<ImageContextValue>): react_jsx_runtime6.JSX.Element;
+} & Partial<ImageContextValue>): react_jsx_runtime1.JSX.Element;
 //#endregion
 export { Image as a, __imageFactory as i, useImageContext as n, useImgLoaded as r, ImageProvider as t };

package/dist/kontent.d.ts

@@ -1,7 +1,7 @@
 import { n as ImageLoaderOptions } from "./types-BEgZ3W30.js";
-import "./index-C-1t5-gk.js";
+import "./index-CP-wkNzk.js";
 import { n as BaseLoaderOptions, t as BaseGlobalLoaderOptions } from "./base-loader-options-DCLkYppY.js";
-import * as react_jsx_runtime7 from "react/jsx-runtime";
+import * as react_jsx_runtime8 from "react/jsx-runtime";
 
 //#region src/loaders/kontent/kontent-options.d.ts
 type KontentTransforms = Partial<{
@@ -44,6 +44,6 @@ declare const useKontentContext: () => KontentGlobalOptions, KontentLoaderProvid
     ...props
   }: {
     children: React.ReactNode;
-  } & Partial<KontentGlobalOptions>) => react_jsx_runtime7.JSX.Element, useKontentLoader: (options?: KontentGlobalOptions | undefined) => (() => undefined) | ((imageOptions: ImageLoaderOptions) => string);
+  } & Partial<KontentGlobalOptions>) => react_jsx_runtime8.JSX.Element, useKontentLoader: (options?: KontentGlobalOptions | undefined) => (() => undefined) | ((imageOptions: ImageLoaderOptions) => string);
 //#endregion
 export { KontentGlobalOptions, KontentLoaderProvider, KontentOptions, KontentTransforms, useKontentContext, useKontentLoader };

package/dist/netlify.d.ts

@@ -1,7 +1,7 @@
 import { n as ImageLoaderOptions } from "./types-BEgZ3W30.js";
-import "./index-C-1t5-gk.js";
+import "./index-CP-wkNzk.js";
 import { n as BaseLoaderOptions, t as BaseGlobalLoaderOptions } from "./base-loader-options-DCLkYppY.js";
-import * as react_jsx_runtime0 from "react/jsx-runtime";
+import * as react_jsx_runtime4 from "react/jsx-runtime";
 
 //#region src/loaders/netlify/netlify-options.d.ts
 type NetlifyTransforms = Partial<{
@@ -21,6 +21,6 @@ declare const useNetlifyContext: () => NetlifyGlobalOptions, NetlifyLoaderProvid
     ...props
   }: {
     children: React.ReactNode;
-  } & Partial<NetlifyGlobalOptions>) => react_jsx_runtime0.JSX.Element, useNetlifyLoader: (options?: NetlifyGlobalOptions | undefined) => (() => undefined) | ((imageOptions: ImageLoaderOptions) => string);
+  } & Partial<NetlifyGlobalOptions>) => react_jsx_runtime4.JSX.Element, useNetlifyLoader: (options?: NetlifyGlobalOptions | undefined) => (() => undefined) | ((imageOptions: ImageLoaderOptions) => string);
 //#endregion
 export { NetlifyGlobalOptions, NetlifyLoaderProvider, NetlifyOptions, NetlifyTransforms, useNetlifyContext, useNetlifyLoader };

package/dist/plugin.d.ts

@@ -2,7 +2,7 @@ import { FormatEnum } from "sharp";
 import { Plugin } from "vite";
 
 //#region src/plugin/types.d.ts
-interface PluginConfig extends Required<Pick<ImageOptions, "placeholder" | "breakpoints" | "format">> {
+interface PluginConfig extends Required<Pick<ImageOptions, "placeholder" | "breakpoints" | "format" | "quality">> {
   /** Directory name where processed images will be output during build */
   distDir: string;
 }
@@ -16,7 +16,7 @@ interface ImageOptions {
   /** Whether to generate a placeholder image for lazy loading */
   placeholder?: boolean;
   /** Breakpoints array - widths in pixels for responsive srcSet generation */
-  breakpoints?: number[];
+  breakpoints?: number[] | null;
   /** Blur the image */
   blur?: number | null;
   /** Flip the image vertically */
@@ -37,6 +37,8 @@ interface ImageOptions {
   normalize?: boolean | null;
   /** Apply threshold */
   threshold?: number | null;
+  /** Apply quality */
+  quality?: number | null;
 }
 //#endregion
 //#region src/plugin/plugin.d.ts

package/dist/plugin.js

@@ -18,6 +18,10 @@ function queryToOptions(processKey, uri) {
 		parseNumbers: true,
 		arrayFormat: "comma",
 		types: {
+			width: "number",
+			height: "number",
+			format: "string",
+			placeholder: "boolean",
 			breakpoints: "number[]",
 			blur: "number",
 			flip: "boolean",
@@ -28,7 +32,8 @@ function queryToOptions(processKey, uri) {
 			gamma: "number",
 			negate: "boolean",
 			normalize: "boolean",
-			threshold: "number"
+			threshold: "number",
+			quality: "number"
 		}
 	});
 	if (processKey in parsed) return {
@@ -39,7 +44,7 @@ function queryToOptions(processKey, uri) {
 	};
 	else return {
 		shouldProcess: false,
-		path,
+		path: "",
 		queryString: query
 	};
 }
@@ -121,7 +126,8 @@ function createImageEntries() {
 				gamma: entry.gamma,
 				negate: entry.negate,
 				normalize: entry.normalize,
-				threshold: entry.threshold
+				threshold: entry.threshold,
+				quality: entry.quality
 			};
 			this.set(identifier, mainEntry);
 		},
@@ -167,7 +173,7 @@ async function processImage(path, options) {
 		width: options.width ?? void 0,
 		height: options.height ?? void 0
 	});
-	if (options.format) processed = processed.toFormat(options.format);
+	if (options.format) processed = processed.toFormat(options.format, { quality: options.quality ?? void 0 });
 	if (options.blur) processed = processed.blur(options.blur);
 	if (options.flip) processed = processed.flip();
 	if (options.flop) processed = processed.flop();
@@ -284,7 +290,8 @@ function ohImage(options) {
 						gamma: mergedOptions.gamma,
 						negate: mergedOptions.negate,
 						normalize: mergedOptions.normalize,
-						threshold: mergedOptions.threshold
+						threshold: mergedOptions.threshold,
+						quality: mergedOptions.quality
 					});
 					const src = {
 						width: metadata.width,
@@ -328,7 +335,8 @@ function ohImage(options) {
 								gamma: mergedOptions.gamma,
 								negate: mergedOptions.negate,
 								normalize: mergedOptions.normalize,
-								threshold: mergedOptions.threshold
+								threshold: mergedOptions.threshold,
+								quality: mergedOptions.quality
 							});
 							srcSets.push(`${srcSetIdentifier} ${breakpoint}w`);
 						}

package/dist/react.d.ts

@@ -1,3 +1,3 @@
 import { n as ImageLoaderOptions, r as ImageProps, t as ImageLoader } from "./types-BEgZ3W30.js";
-import { a as Image, i as __imageFactory, n as useImageContext, r as useImgLoaded, t as ImageProvider } from "./index-C-1t5-gk.js";
+import { a as Image, i as __imageFactory, n as useImageContext, r as useImgLoaded, t as ImageProvider } from "./index-CP-wkNzk.js";
 export { Image, ImageLoader, ImageLoaderOptions, ImageProps, ImageProvider, __imageFactory, useImageContext, useImgLoaded };

package/dist/wordpress.d.ts

@@ -1,7 +1,7 @@
 import { n as ImageLoaderOptions } from "./types-BEgZ3W30.js";
-import "./index-C-1t5-gk.js";
+import "./index-CP-wkNzk.js";
 import { n as BaseLoaderOptions, t as BaseGlobalLoaderOptions } from "./base-loader-options-DCLkYppY.js";
-import * as react_jsx_runtime1 from "react/jsx-runtime";
+import * as react_jsx_runtime5 from "react/jsx-runtime";
 
 //#region src/loaders/wordpress/wordpress-options.d.ts
 type WordpressTransforms = Partial<{
@@ -31,6 +31,6 @@ declare const useWordpressContext: () => WordpressGlobalOptions, WordpressLoader
     ...props
   }: {
     children: React.ReactNode;
-  } & Partial<WordpressGlobalOptions>) => react_jsx_runtime1.JSX.Element, useWordpressLoader: (options?: WordpressGlobalOptions | undefined) => (() => undefined) | ((imageOptions: ImageLoaderOptions) => string);
+  } & Partial<WordpressGlobalOptions>) => react_jsx_runtime5.JSX.Element, useWordpressLoader: (options?: WordpressGlobalOptions | undefined) => (() => undefined) | ((imageOptions: ImageLoaderOptions) => string);
 //#endregion
 export { WordpressGlobalOptions, WordpressLoaderProvider, WordpressOptions, WordpressTransforms, useWordpressContext, useWordpressLoader };

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@lonik/oh-image",
   "type": "module",
-  "version": "2.7.0",
+  "version": "2.9.0",
   "description": "A React component library for optimized image handling.",
   "author": "Luka Onikadze <lukonik@gmail.com>",
   "license": "MIT",