@lonik/oh-image 2.1.2 → 2.2.0

package/dist/base-loader-options-C1EZVxmE.d.ts

@@ -0,0 +1,13 @@
+//#region src/loaders/base-loader-options.d.ts
+interface BaseLoaderOptions<T> {
+  path?: string;
+  transforms?: T;
+}
+interface BaseGlobalLoaderOptions<T> extends BaseLoaderOptions<T> {
+  placeholder?: T;
+}
+interface BaseLoaderTransforms {
+  [futureKey: string]: any;
+}
+//#endregion
+export { BaseLoaderOptions as n, BaseLoaderTransforms as r, BaseGlobalLoaderOptions as t };

package/dist/client.d.ts

@@ -1,17 +1,31 @@
-interface ImageSrc {
-  /** Original width of the source image in pixels */
-  width: number;
-  /** Original height of the source image in pixels */
-  height: number;
-  /** URL to the placeholder image (if placeholder was enabled) */
-  placeholderUrl?: string;
-  /** Array of responsive image sources at different breakpoints */
-  srcSets: string;
-  /** URL to the main processed image */
-  src: string;
-}
+declare module "*&oh" {
+  export interface StaticImageProps extends Partial<
+    Pick<
+      ImgHTMLAttributes<HTMLImageElement>,
+      | "fetchPriority"
+      | "decoding"
+      | "loading"
+      | "srcSet"
+      | "className"
+      | "sizes"
+      | "style"
+    >
+  > {
+    /** Alternative text for the image, required for accessibility. Use an empty string for decorative images. */
+    alt: string;
+
+    /** Configures the Image component to load the image immediately. */
+    priority?: boolean;
+
+    /**
+     * Sets the image to "fill mode", which eliminates the height/width requirement and adds
+     * styles such that the image fills its containing element.
+     */
+    fill?: boolean;
+
+    breakpoints?: number[];
+  }
 
-declare module "*?oh" {
-  const imageSrc: any;
-  export default imageSrc;
+  const component: React.FC<StaticImageProps>;
+  export default component;
 }

package/dist/cloudflare.d.ts

@@ -0,0 +1,40 @@
+import { s as ImageLoaderOptions } from "./index-DG8i2dGY.js";
+import { n as BaseLoaderOptions, r as BaseLoaderTransforms, t as BaseGlobalLoaderOptions } from "./base-loader-options-C1EZVxmE.js";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/loaders/cloudflare/cloudflare-options.d.ts
+type CloudflareTransforms = BaseLoaderTransforms & Partial<{
+  anim?: boolean;
+  background?: string;
+  blur?: number;
+  brightness?: number;
+  compression?: boolean;
+  contrast?: number;
+  dpr?: number;
+  dprs?: number[];
+  fit?: "scale-down" | "contain" | "cover" | "crop" | "pad";
+  format?: "auto" | "avif" | "webp" | "json";
+  gamma?: number;
+  gravity?: "auto" | "left" | "right" | "top" | "bottom" | string;
+  height?: number;
+  width?: number;
+  widths?: number[];
+  maxWidth?: number;
+  metadata?: "keep" | "copyright" | "none";
+  quality?: number;
+  rotate?: number;
+  sharpen?: number;
+  trim?: string;
+}>;
+type CloudflareOptions = BaseLoaderOptions<CloudflareTransforms>;
+type CloudflareGlobalOptions = BaseGlobalLoaderOptions<CloudflareTransforms>;
+//#endregion
+//#region src/loaders/cloudflare/cloudflare-loader.d.ts
+declare const useCloudflareContext: () => CloudflareGlobalOptions, CloudflareLoaderProvider: ({
+    children,
+    ...props
+  }: {
+    children: React.ReactNode;
+  } & Partial<CloudflareGlobalOptions>) => react_jsx_runtime0.JSX.Element, useCloudflareLoader: (options?: CloudflareGlobalOptions | undefined) => (() => undefined) | ((imageOptions: ImageLoaderOptions) => string);
+//#endregion
+export { CloudflareGlobalOptions, CloudflareLoaderProvider, CloudflareOptions, CloudflareTransforms, useCloudflareContext, useCloudflareLoader };

package/dist/cloudflare.js

@@ -0,0 +1,16 @@
+import { t as loaderFactory } from "./loader-factory-dkIeg239.js";
+
+//#region src/loaders/cloudflare/cloudflare-loader.tsx
+const { useLoaderContext: useCloudflareContext, LoaderProvider: CloudflareLoaderProvider, useLoader: useCloudflareLoader } = loaderFactory({
+	transforms: { format: "auto" },
+	placeholder: {
+		quality: 10,
+		format: "auto"
+	}
+}, {
+	optionSeparator: "=",
+	paramSeparator: ","
+}, ({ path, params, imageOptions }) => `${path}/cdn-cgi/image/${params}/${imageOptions.src}`);
+
+//#endregion
+export { CloudflareLoaderProvider, useCloudflareContext, useCloudflareLoader };

package/dist/cloudinary.d.ts

@@ -0,0 +1,111 @@
+import { s as ImageLoaderOptions } from "./index-DG8i2dGY.js";
+import { n as BaseLoaderOptions, r as BaseLoaderTransforms, t as BaseGlobalLoaderOptions } from "./base-loader-options-C1EZVxmE.js";
+import * as react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/loaders/cloudinary/cloudinary-options.d.ts
+type BACKGROUND_MODE = "border" | "predominant" | "border_contrast" | "predominant_contrast" | "predominant_gradient" | "predominant_gradient_contrast" | "border_gradient" | "border_gradient_contrast";
+type ANGLE_MODE = "vflip" | "hflip" | "ignore" | "auto_right" | "auto_left";
+type CROP_MODE = "auto" | "auto_pad" | "crop" | "fill" | "fill_pad" | "fit" | "imagga_crop" | "imagga_scale" | "lfill" | "limit" | "lpad" | "mfit" | "mpad" | "pad" | "scale" | "thumb";
+type COLOR_SPACE = "sRGB" | "tinysrgb" | "cmyk" | "no_cmyk" | "keep_cmyk" | "truecolor";
+type ART_FILTER = "al_dente" | "athena" | "audrey" | "aurora" | "daguerre" | "eucalyptus" | "fes" | "frost" | "hairspray" | "hokusai" | "incognito" | "linen" | "peacock" | "primavera" | "quartz" | "red_rock" | "refresh" | "sizzle" | "sonnet" | "ukulele" | "zorro";
+type FORMAT_TYPE = "3ds" | "ai" | "avif" | "bmp" | "bw" | "djvu" | "dng" | "eps" | "fbx" | "flif" | "gif" | "glb" | "gltf" | "heif" | "heic" | "ico" | "indd" | "jp2" | "jpg" | "jpeg" | "jxl" | "obj" | "pdf" | "ply" | "png" | "psd" | "raw" | "svg" | "tga" | "tif" | "tiff" | "u3ma" | "usdz" | "wdp" | "webp";
+type CloudinaryTransforms = BaseLoaderTransforms & Partial<{
+  a?: number | ANGLE_MODE | string;
+  mode?: string;
+  ar?: string | number;
+  b?: string;
+  b_auto?: {
+    mode: BACKGROUND_MODE;
+    number: number;
+    direction: string;
+    color: string;
+  };
+  b_gen_fill?: {
+    prompt: string;
+    seed: number;
+  };
+  bl?: string;
+  bo?: string;
+  c?: CROP_MODE;
+  co?: string;
+  cs?: COLOR_SPACE;
+  d?: string;
+  dl?: number | string;
+  dn?: number;
+  dpr?: number | "auto";
+  du?: number | string;
+  e?: string;
+  e_accelerate?: number | boolean;
+  e_adv_redeye?: boolean;
+  anti_removal?: number | boolean;
+  art?: ART_FILTER;
+  e_art?: ART_FILTER;
+  e_auto_brightness?: boolean | number;
+  e_auto_color?: boolean | number;
+  e_auto_contrast?: boolean | number;
+  e_auto_enhance?: boolean | number;
+  e_background_removal?: boolean | string;
+  e_blur?: number | boolean;
+  e_blur_faces?: number | boolean;
+  e_blur_region?: number | boolean;
+  e_brightness?: number | boolean;
+  e_cartoonify?: number | string;
+  e_colorize?: number | boolean;
+  e_contrast?: number | boolean;
+  e_distort?: string;
+  e_drop_shadow?: number | string;
+  e_gamma?: number | boolean;
+  e_gradient_fade?: number | boolean;
+  e_grayscale?: boolean;
+  e_hue?: number | boolean;
+  e_improve?: boolean | string;
+  e_make_transparent?: number | string;
+  e_negate?: boolean;
+  e_oil_paint?: number | boolean;
+  e_pixelate?: number | boolean;
+  e_pixelate_faces?: number | boolean;
+  e_pixelate_region?: number | boolean;
+  e_redeye?: boolean;
+  e_saturation?: number | boolean;
+  e_screen?: boolean;
+  e_sepia?: number | boolean;
+  e_shadow?: number | string;
+  e_sharpen?: number | boolean;
+  e_shear?: string;
+  e_simulate_colorblind?: string;
+  e_tint?: string;
+  e_trim?: number | string;
+  e_unsharp_mask?: number | string;
+  e_vectorize?: number | string;
+  e_vignette?: number | boolean;
+  e_volume_mute?: boolean;
+  eo?: number | string;
+  f?: FORMAT_TYPE;
+  fl?: string | string[];
+  g?: string;
+  h?: number;
+  l?: string;
+  o?: number | string;
+  p?: string;
+  pg?: number | string;
+  q?: number | "auto" | string;
+  r?: number | "max" | string;
+  so?: number | string;
+  u?: string;
+  w?: number;
+  x?: number | string;
+  y?: number | string;
+  z?: number;
+}>;
+type CloudinaryOptions = BaseLoaderOptions<CloudinaryTransforms>;
+type CloudinaryGlobalOptions = BaseGlobalLoaderOptions<CloudinaryTransforms>;
+//#endregion
+//#region src/loaders/cloudinary/cloudinary-loader.d.ts
+declare const useCloudinaryContext: () => CloudinaryGlobalOptions, CloudinaryLoaderProvider: ({
+    children,
+    ...props
+  }: {
+    children: React.ReactNode;
+  } & Partial<CloudinaryGlobalOptions>) => react_jsx_runtime0.JSX.Element, useCloudinaryLoader: (options?: CloudinaryGlobalOptions | undefined) => (() => undefined) | ((imageOptions: ImageLoaderOptions) => string);
+//#endregion
+export { CloudinaryGlobalOptions, CloudinaryLoaderProvider, CloudinaryOptions, CloudinaryTransforms, useCloudinaryContext, useCloudinaryLoader };

package/dist/cloudinary.js

@@ -0,0 +1,76 @@
+import { t as loaderFactory } from "./loader-factory-dkIeg239.js";
+
+//#region src/loaders/cloudinary/cloudinary-loader.tsx
+function customResolver(key, value) {
+	if (typeof value === "boolean") return value ? key : void 0;
+	return `${key}:${value}`;
+}
+const { useLoaderContext: useCloudinaryContext, LoaderProvider: CloudinaryLoaderProvider, useLoader: useCloudinaryLoader } = loaderFactory({
+	transforms: { f: "webp" },
+	placeholder: {
+		q: 10,
+		f: "webp"
+	}
+}, {
+	optionSeparator: "_",
+	paramSeparator: ",",
+	widthKey: "w",
+	heightKey: "h",
+	orders: {
+		b_auto: [
+			"mode",
+			"number",
+			"direction",
+			"color"
+		],
+		b_gen_fill: ["prompt", "seed"]
+	},
+	customResolver: {
+		art: customResolver,
+		e_accelerate: customResolver,
+		e_adv_redeye: customResolver,
+		e_art: customResolver,
+		e_auto_brightness: customResolver,
+		e_auto_color: customResolver,
+		e_auto_contrast: customResolver,
+		e_auto_enhance: customResolver,
+		e_background_removal: customResolver,
+		e_blur: customResolver,
+		e_blur_faces: customResolver,
+		e_blur_region: customResolver,
+		e_brightness: customResolver,
+		e_cartoonify: customResolver,
+		e_colorize: customResolver,
+		e_contrast: customResolver,
+		e_distort: customResolver,
+		e_drop_shadow: customResolver,
+		e_gamma: customResolver,
+		e_gradient_fade: customResolver,
+		e_grayscale: customResolver,
+		e_hue: customResolver,
+		e_improve: customResolver,
+		e_make_transparent: customResolver,
+		e_negate: customResolver,
+		e_oil_paint: customResolver,
+		e_pixelate: customResolver,
+		e_pixelate_faces: customResolver,
+		e_pixelate_region: customResolver,
+		e_redeye: customResolver,
+		e_saturation: customResolver,
+		e_screen: customResolver,
+		e_sepia: customResolver,
+		e_shadow: customResolver,
+		e_sharpen: customResolver,
+		e_shear: customResolver,
+		e_simulate_colorblind: customResolver,
+		e_tint: customResolver,
+		e_trim: customResolver,
+		e_unsharp_mask: customResolver,
+		e_vectorize: customResolver,
+		e_vignette: customResolver,
+		e_volume_mute: customResolver
+	}
+}, ({ path, params, imageOptions }) => `${path}/image/upload/${params}/${imageOptions.src}`);
+
+//#endregion
+export { CloudinaryLoaderProvider, useCloudinaryContext, useCloudinaryLoader };

package/dist/imgproxy.d.ts

@@ -0,0 +1,376 @@
+import { s as ImageLoaderOptions } from "./index-DG8i2dGY.js";
+import { n as BaseLoaderOptions, r as BaseLoaderTransforms, t as BaseGlobalLoaderOptions } from "./base-loader-options-C1EZVxmE.js";
+import * as react_jsx_runtime1 from "react/jsx-runtime";
+
+//#region src/loaders/imgproxy/imgproxy-options.d.ts
+type ResizeType = "fit" | "fill" | "fill-down" | "force" | "auto";
+type ResizeAlgorithm = "nearest" | "linear" | "cubic" | "lanczos2" | "lanczos3";
+type GravityType = "no" | "so" | "ea" | "we" | "noea" | "nowe" | "soea" | "sowe" | "ce";
+interface ResizeOptions {
+  resizing_type?: ResizeType;
+  width?: number;
+  height?: number;
+  enlarge?: boolean;
+  extend?: boolean;
+}
+interface SizeOptions {
+  width?: number;
+  height?: number;
+  enlarge?: boolean;
+  extend?: boolean;
+}
+interface ExtendOptions {
+  extend?: boolean;
+  gravity?: GravityType;
+}
+interface GravityOptions {
+  type: GravityType;
+  x_offset?: number;
+  y_offset?: number;
+}
+interface CropOptions {
+  width: number;
+  height: number;
+  gravity?: GravityType;
+}
+interface TrimOptions {
+  threshold: number;
+  color?: string;
+  equal_hor?: boolean;
+  equal_ver?: boolean;
+}
+interface PaddingOptions {
+  top?: number;
+  right?: number;
+  bottom?: number;
+  left?: number;
+}
+interface BackgroundOptions {
+  r: number;
+  g: number;
+  b: number;
+}
+interface AdjustOptions {
+  brightness?: number;
+  contrast?: number;
+  saturation?: number;
+}
+interface BlurDetectionsOptions {
+  sigma: number;
+  class_names: string[];
+}
+interface DrawDetectionsOptions {
+  draw: boolean;
+  class_names: string[];
+}
+interface WatermarkOptions {
+  opacity: number;
+  position?: GravityType | "re";
+  x_offset?: number;
+  y_offset?: number;
+  scale?: number;
+}
+interface WatermarkSizeOptions {
+  width: number;
+  height: number;
+}
+interface UnsharpeningOptions {
+  mode?: string;
+  weight?: number;
+  dividor?: number;
+}
+interface AutoqualityOptions {
+  method?: string;
+  target?: number;
+  min_quality?: number;
+  max_quality?: number;
+  allowed_error?: number;
+}
+interface JpegOptions {
+  progressive?: boolean;
+  no_subsample?: boolean;
+  trellis_quant?: boolean;
+  overshoot_deringing?: boolean;
+  optimize_scans?: boolean;
+  quant_table?: number;
+}
+interface PngOptions {
+  interlaced?: boolean;
+  quantize?: boolean;
+  quantization_colors?: number;
+}
+type ImgproxyTransforms = BaseLoaderTransforms & Partial<{
+  /**
+   * Defines the resizing type, width, height, enlarge, and extend.
+   * All arguments are optional and can be omitted to use their default values.
+   */
+  resize?: ResizeOptions;
+  /**
+   * Defines the width, height, enlarge, and extend.
+   * All arguments are optional and can be omitted to use their default values.
+   */
+  size?: SizeOptions;
+  /**
+   * Defines how imgproxy will resize the source image.
+   * Default: fit
+   */
+  resizing_type?: ResizeType;
+  /**
+   * Defines the algorithm that imgproxy will use for resizing.
+   * Default: lanczos3
+   */
+  resizing_algorithm?: ResizeAlgorithm;
+  /**
+   * Defines the width of the resulting image.
+   * Default: 0
+   */
+  width?: number;
+  /**
+   * Defines the height of the resulting image.
+   * Default: 0
+   */
+  height?: number;
+  /**
+   * Defines the minimum width of the resulting image.
+   * Default: 0
+   */
+  "min-width"?: number;
+  /**
+   * Defines the minimum height of the resulting image.
+   * Default: 0
+   */
+  "min-height"?: number;
+  /**
+   * When set, imgproxy will multiply the image dimensions according to these factors.
+   * Default: 1
+   */
+  zoom?: number | {
+    x: number;
+    y: number;
+  };
+  /**
+   * When set, imgproxy will multiply the image dimensions according to this factor for HiDPI (Retina) devices.
+   * Default: 1
+   */
+  dpr?: number;
+  /**
+   * When set to true, imgproxy will enlarge the image if it is smaller than the given size.
+   * Default: false
+   */
+  enlarge?: boolean;
+  /**
+   * When set to true, imgproxy will extend the image if it is smaller than the given size.
+   * Can also specify gravity.
+   * Default: false:ce:0:0
+   */
+  extend?: boolean | ExtendOptions;
+  /**
+   * When imgproxy needs to cut some parts of the image, it is guided by the gravity option.
+   * Default: ce:0:0
+   */
+  gravity?: GravityOptions;
+  /**
+   * Defines an area of the image to be processed (crop before resize).
+   */
+  crop?: CropOptions;
+  /**
+   * Removes surrounding background.
+   */
+  trim?: TrimOptions;
+  /**
+   * Defines padding size.
+   */
+  padding?: PaddingOptions;
+  /**
+   * When set to true, imgproxy will automatically rotate images based on the EXIF Orientation parameter.
+   */
+  auto_rotate?: boolean;
+  /**
+   * Rotates the image on the specified angle.
+   * Default: 0
+   */
+  rotate?: number;
+  /**
+   * When set, imgproxy will fill the resulting image background with the specified color.
+   * Default: disabled
+   */
+  background?: string | BackgroundOptions;
+  /**
+   * Adds an alpha channel to background.
+   * Default: 1
+   */
+  background_alpha?: number;
+  /**
+   * Defines the brightness, contrast, and saturation.
+   */
+  adjust?: AdjustOptions;
+  /**
+   * When set, imgproxy will adjust brightness of the resulting image.
+   * Default: 0
+   */
+  brightness?: number;
+  /**
+   * When set, imgproxy will adjust the contrast of the resulting image.
+   * Default: 1
+   */
+  contrast?: number;
+  /**
+   * When set, imgproxy will adjust saturation of the resulting image.
+   * Default: 1
+   */
+  saturation?: number;
+  /**
+   * When set, imgproxy will apply a gaussian blur filter to the resulting image.
+   * Default: disabled
+   */
+  blur?: number;
+  /**
+   * When set, imgproxy will apply the sharpen filter to the resulting image.
+   * Default: disabled
+   */
+  sharpen?: number;
+  /**
+   * When set, imgproxy will apply the pixelate filter to the resulting image.
+   * Default: disabled
+   */
+  pixelate?: number;
+  /**
+   * Allows redefining unsharpening options.
+   */
+  unsharpening?: UnsharpeningOptions;
+  /**
+   * imgproxy detects objects of the provided classes and blurs them.
+   */
+  blur_detections?: BlurDetectionsOptions;
+  /**
+   * When draw is set to true, imgproxy detects objects of the provided classes and draws their bounding boxes.
+   */
+  draw_detections?: DrawDetectionsOptions;
+  /**
+   * Places a watermark on the processed image.
+   * Default: disabled
+   */
+  watermark?: WatermarkOptions;
+  /**
+   * When set, imgproxy will use the image from the specified URL as a watermark.
+   * Default: blank
+   */
+  watermark_url?: string;
+  /**
+   * When set, imgproxy will generate an image from the provided text and use it as a watermark.
+   * Default: blank
+   */
+  watermark_text?: string;
+  /**
+   * Defines the desired width and height of the watermark.
+   * Default: 0:0
+   */
+  watermark_size?: WatermarkSizeOptions;
+  /**
+   * When set, imgproxy will prepend a <style> node with the provided content to the <svg> node.
+   * Default: blank
+   */
+  style?: string;
+  /**
+   * When set to true, imgproxy will strip the metadata (EXIF, IPTC, etc.) on JPEG and WebP output images.
+   */
+  strip_metadata?: boolean;
+  /**
+   * When set to true, imgproxy will not remove copyright info while stripping metadata.
+   */
+  keep_copyright?: boolean;
+  /**
+   * When set to true, imgproxy will transform the embedded color profile (ICC) to sRGB and remove it from the image.
+   */
+  strip_color_profile?: boolean;
+  /**
+   * When set to true and the source image has an embedded thumbnail, imgproxy will always use the embedded thumbnail.
+   */
+  enforce_thumbnail?: boolean;
+  /**
+   * When set to true, imgproxy will return attachment in the Content-Disposition header.
+   */
+  return_attachment?: boolean;
+  /**
+   * Redefines quality of the resulting image, as a percentage.
+   * Default: 0
+   */
+  quality?: number;
+  /**
+   * Adds or redefines IMGPROXY_FORMAT_QUALITY values.
+   */
+  format_quality?: Record<string, number>;
+  /**
+   * Redefines autoquality settings.
+   */
+  autoquality?: AutoqualityOptions;
+  /**
+   * When set, imgproxy automatically degrades the quality of the image until the image size is under the specified amount of bytes.
+   * Default: 0
+   */
+  max_bytes?: number;
+  /**
+   * Allows redefining JPEG saving options.
+   */
+  jpeg_options?: JpegOptions;
+  /**
+   * Allows redefining PNG saving options.
+   */
+  png_options?: PngOptions;
+  /**
+   * Specifies the resulting image format.
+   * Default: jpg
+   */
+  format?: string;
+  /**
+   * When a source image supports pagination or animation, this option allows specifying the page to use it on.
+   * Default: 0
+   */
+  page?: number;
+  /**
+   * Allows redefining IMGPROXY_VIDEO_THUMBNAIL_SECOND config.
+   */
+  video_thumbnail_second?: number;
+  /**
+   * You can use a custom fallback image by specifying its URL.
+   * Default: blank
+   */
+  fallback_image_url?: string;
+  /**
+   * When set, imgproxy will skip the processing of the listed formats.
+   * Default: empty
+   */
+  skip_processing?: string[];
+  /**
+   * Cache buster doesn't affect image processing but its changing allows for bypassing the CDN, proxy server and browser cache.
+   * Default: empty
+   */
+  cachebuster?: string;
+  /**
+   * When set, imgproxy will check the provided unix timestamp and return 404 when expired.
+   * Default: empty
+   */
+  expires?: number;
+  /**
+   * Defines a filename for the Content-Disposition header.
+   * Default: empty
+   */
+  filename?: string;
+  /**
+   * Defines a list of presets to be used by imgproxy.
+   * Default: empty
+   */
+  preset?: string[];
+}>;
+type ImgproxyOptions = BaseLoaderOptions<ImgproxyTransforms>;
+type ImgproxyGlobalOptions = BaseGlobalLoaderOptions<ImgproxyTransforms>;
+//#endregion
+//#region src/loaders/imgproxy/imgproxy-loader.d.ts
+declare const useImgproxyContext: () => ImgproxyGlobalOptions, ImgproxyLoaderProvider: ({
+    children,
+    ...props
+  }: {
+    children: React.ReactNode;
+  } & Partial<ImgproxyGlobalOptions>) => react_jsx_runtime1.JSX.Element, useImgproxyLoader: (options?: ImgproxyGlobalOptions | undefined) => (() => undefined) | ((imageOptions: ImageLoaderOptions) => string);
+//#endregion
+export { ImgproxyGlobalOptions, ImgproxyLoaderProvider, ImgproxyOptions, ImgproxyTransforms, useImgproxyContext, useImgproxyLoader };