next-cloudinary 6.13.0 → 7.0.0-beta.2

package/dist/next-cloudinary.cjs.js

@@ -0,0 +1,165 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var CldImage = require('./CldImage-6cc29250.cjs.js');
+var Head = require('next/head');
+var cloudinaryLoader = require('./cloudinary-loader-b7898036.cjs.js');
+var jsxRuntime = require('react/jsx-runtime');
+var CldUploadButton = require('./CldUploadButton-db9b095b.cjs.js');
+var CldUploadWidget = require('./CldUploadWidget-496b6240.cjs.js');
+var CldVideoPlayer = require('./CldVideoPlayer-25af8fc2.cjs.js');
+var urlLoader = require('@cloudinary-util/url-loader');
+var cloudinary = require('./cloudinary-c07e74d7.cjs.js');
+require('next/package.json');
+
+function _interopDefault (e) { return e && e.__esModule ? e : { 'default': e }; }
+
+var CldImage__default = /*#__PURE__*/_interopDefault(CldImage);
+var Head__default = /*#__PURE__*/_interopDefault(Head);
+var CldUploadButton__default = /*#__PURE__*/_interopDefault(CldUploadButton);
+var CldUploadWidget__default = /*#__PURE__*/_interopDefault(CldUploadWidget);
+var CldVideoPlayer__default = /*#__PURE__*/_interopDefault(CldVideoPlayer);
+
+const OG_IMAGE_WIDTH = 1200;
+const OG_IMAGE_HEIGHT = 627;
+
+/**
+ * getCldImageUrl
+ */
+
+function getCldOgImageUrl(options) {
+  return cloudinaryLoader.getCldImageUrl({
+    ...options,
+    format: options.format || 'jpg',
+    width: options.width || OG_IMAGE_WIDTH,
+    height: options.height || OG_IMAGE_HEIGHT,
+    crop: options.crop || {
+      type: 'fill',
+      gravity: 'center',
+      source: true
+    }
+  });
+}
+
+const TWITTER_CARD = 'summary_large_image';
+const CldOgImage = ({
+  excludeTags = [],
+  twitterTitle,
+  keys = {},
+  ...props
+}) => {
+  const {
+    alt
+  } = props;
+
+  // We need to separately handle the width and the height to allow our user to pass in
+  // a custom value, but also we need to know this at the component level so that we can
+  // use it when rendering the meta tags
+
+  let {
+    width = OG_IMAGE_WIDTH,
+    height = OG_IMAGE_HEIGHT
+  } = props;
+
+  // Normalize the width and height
+
+  width = typeof width === 'string' ? parseInt(width) : width;
+  height = typeof height === 'string' ? parseInt(height) : height;
+
+  // Render the final URLs. We use two different format versions to deliver
+  // webp for Twitter as it supports it (and we can control with tags) where
+  // other platforms may not support webp, so we deliver jpg
+
+  const ogImageUrl = getCldOgImageUrl({
+    ...props,
+    width,
+    height
+  });
+  const twitterImageUrl = getCldOgImageUrl({
+    ...props,
+    width,
+    height,
+    format: props.format || 'webp'
+  });
+  const metaKeys = {
+    'og:image': 'og-image',
+    'og:image:secure_url': 'og-image-secureurl',
+    'og:image:width': 'og-image-width',
+    'og:image:height': 'og-image-height',
+    'og:image:alt': 'og-image-alt',
+    'twitter:title': 'twitter-title',
+    'twitter:card': 'twitter-card',
+    'twitter:image': 'twitter-image',
+    ...keys
+  };
+
+  // We need to include the tags within the Next.js Head component rather than
+  // direcly adding them inside of the Head otherwise we get unexpected results
+
+  return /*#__PURE__*/jsxRuntime.jsxs(Head__default["default"], {
+    children: [/*#__PURE__*/jsxRuntime.jsx("meta", {
+      property: "og:image",
+      content: ogImageUrl
+    }, metaKeys['og:image']), /*#__PURE__*/jsxRuntime.jsx("meta", {
+      property: "og:image:secure_url",
+      content: ogImageUrl
+    }, metaKeys['og:image:secure_url']), /*#__PURE__*/jsxRuntime.jsx("meta", {
+      property: "og:image:width",
+      content: `${width}`
+    }, metaKeys['og:image:width']), /*#__PURE__*/jsxRuntime.jsx("meta", {
+      property: "og:image:height",
+      content: `${height}`
+    }, metaKeys['og:image:height']), alt && /*#__PURE__*/jsxRuntime.jsx("meta", {
+      property: "og:image:alt",
+      content: alt
+    }, metaKeys['og:image:alt']), !excludeTags.includes('twitter:title') && /*#__PURE__*/jsxRuntime.jsx("meta", {
+      property: "twitter:title",
+      content: twitterTitle || ' '
+    }, metaKeys['twitter:title']), /*#__PURE__*/jsxRuntime.jsx("meta", {
+      property: "twitter:card",
+      content: TWITTER_CARD
+    }, metaKeys['twitter:card']), /*#__PURE__*/jsxRuntime.jsx("meta", {
+      property: "twitter:image",
+      content: twitterImageUrl
+    }, metaKeys['twitter:image'])]
+  });
+};
+
+/**
+ * getCldVideoUrl
+ */
+
+function getCldVideoUrl(options, config, analytics) {
+  return urlLoader.constructCloudinaryUrl({
+    options: {
+      assetType: 'video',
+      format: 'auto:video',
+      ...options
+    },
+    config: cloudinary.getCloudinaryConfig(config),
+    analytics: cloudinary.getCloudinaryAnalytics(analytics)
+  });
+}
+
+Object.defineProperty(exports, 'CldImage', {
+  enumerable: true,
+  get: function () { return CldImage__default["default"]; }
+});
+exports.cloudinaryLoader = cloudinaryLoader.cloudinaryLoader;
+exports.getCldImageUrl = cloudinaryLoader.getCldImageUrl;
+Object.defineProperty(exports, 'CldUploadButton', {
+  enumerable: true,
+  get: function () { return CldUploadButton__default["default"]; }
+});
+Object.defineProperty(exports, 'CldUploadWidget', {
+  enumerable: true,
+  get: function () { return CldUploadWidget__default["default"]; }
+});
+Object.defineProperty(exports, 'CldVideoPlayer', {
+  enumerable: true,
+  get: function () { return CldVideoPlayer__default["default"]; }
+});
+exports.CldOgImage = CldOgImage;
+exports.getCldOgImageUrl = getCldOgImageUrl;
+exports.getCldVideoUrl = getCldVideoUrl;

package/dist/next-cloudinary.cjs.mjs

@@ -0,0 +1,11 @@
+export {
+  CldImage,
+  CldOgImage,
+  CldUploadButton,
+  CldUploadWidget,
+  CldVideoPlayer,
+  cloudinaryLoader,
+  getCldImageUrl,
+  getCldOgImageUrl,
+  getCldVideoUrl
+} from "./next-cloudinary.cjs.js";

package/dist/next-cloudinary.esm.js

@@ -0,0 +1,134 @@
+export { default as CldImage } from './CldImage-37af4d37.esm.js';
+import Head from 'next/head';
+import { g as getCldImageUrl } from './cloudinary-loader-d86c263a.esm.js';
+export { c as cloudinaryLoader, g as getCldImageUrl } from './cloudinary-loader-d86c263a.esm.js';
+import { jsxs, jsx } from 'react/jsx-runtime';
+export { default as CldUploadButton } from './CldUploadButton-196b419b.esm.js';
+export { default as CldUploadWidget } from './CldUploadWidget-d1442bef.esm.js';
+export { default as CldVideoPlayer } from './CldVideoPlayer-d3572d86.esm.js';
+import { constructCloudinaryUrl } from '@cloudinary-util/url-loader';
+import { g as getCloudinaryConfig, a as getCloudinaryAnalytics } from './cloudinary-50fd58f7.esm.js';
+import 'next/package.json';
+
+const OG_IMAGE_WIDTH = 1200;
+const OG_IMAGE_HEIGHT = 627;
+
+/**
+ * getCldImageUrl
+ */
+
+function getCldOgImageUrl(options) {
+  return getCldImageUrl({
+    ...options,
+    format: options.format || 'jpg',
+    width: options.width || OG_IMAGE_WIDTH,
+    height: options.height || OG_IMAGE_HEIGHT,
+    crop: options.crop || {
+      type: 'fill',
+      gravity: 'center',
+      source: true
+    }
+  });
+}
+
+const TWITTER_CARD = 'summary_large_image';
+const CldOgImage = ({
+  excludeTags = [],
+  twitterTitle,
+  keys = {},
+  ...props
+}) => {
+  const {
+    alt
+  } = props;
+
+  // We need to separately handle the width and the height to allow our user to pass in
+  // a custom value, but also we need to know this at the component level so that we can
+  // use it when rendering the meta tags
+
+  let {
+    width = OG_IMAGE_WIDTH,
+    height = OG_IMAGE_HEIGHT
+  } = props;
+
+  // Normalize the width and height
+
+  width = typeof width === 'string' ? parseInt(width) : width;
+  height = typeof height === 'string' ? parseInt(height) : height;
+
+  // Render the final URLs. We use two different format versions to deliver
+  // webp for Twitter as it supports it (and we can control with tags) where
+  // other platforms may not support webp, so we deliver jpg
+
+  const ogImageUrl = getCldOgImageUrl({
+    ...props,
+    width,
+    height
+  });
+  const twitterImageUrl = getCldOgImageUrl({
+    ...props,
+    width,
+    height,
+    format: props.format || 'webp'
+  });
+  const metaKeys = {
+    'og:image': 'og-image',
+    'og:image:secure_url': 'og-image-secureurl',
+    'og:image:width': 'og-image-width',
+    'og:image:height': 'og-image-height',
+    'og:image:alt': 'og-image-alt',
+    'twitter:title': 'twitter-title',
+    'twitter:card': 'twitter-card',
+    'twitter:image': 'twitter-image',
+    ...keys
+  };
+
+  // We need to include the tags within the Next.js Head component rather than
+  // direcly adding them inside of the Head otherwise we get unexpected results
+
+  return /*#__PURE__*/jsxs(Head, {
+    children: [/*#__PURE__*/jsx("meta", {
+      property: "og:image",
+      content: ogImageUrl
+    }, metaKeys['og:image']), /*#__PURE__*/jsx("meta", {
+      property: "og:image:secure_url",
+      content: ogImageUrl
+    }, metaKeys['og:image:secure_url']), /*#__PURE__*/jsx("meta", {
+      property: "og:image:width",
+      content: `${width}`
+    }, metaKeys['og:image:width']), /*#__PURE__*/jsx("meta", {
+      property: "og:image:height",
+      content: `${height}`
+    }, metaKeys['og:image:height']), alt && /*#__PURE__*/jsx("meta", {
+      property: "og:image:alt",
+      content: alt
+    }, metaKeys['og:image:alt']), !excludeTags.includes('twitter:title') && /*#__PURE__*/jsx("meta", {
+      property: "twitter:title",
+      content: twitterTitle || ' '
+    }, metaKeys['twitter:title']), /*#__PURE__*/jsx("meta", {
+      property: "twitter:card",
+      content: TWITTER_CARD
+    }, metaKeys['twitter:card']), /*#__PURE__*/jsx("meta", {
+      property: "twitter:image",
+      content: twitterImageUrl
+    }, metaKeys['twitter:image'])]
+  });
+};
+
+/**
+ * getCldVideoUrl
+ */
+
+function getCldVideoUrl(options, config, analytics) {
+  return constructCloudinaryUrl({
+    options: {
+      assetType: 'video',
+      format: 'auto:video',
+      ...options
+    },
+    config: getCloudinaryConfig(config),
+    analytics: getCloudinaryAnalytics(analytics)
+  });
+}
+
+export { CldOgImage, getCldOgImageUrl, getCldVideoUrl };

package/package.json

@@ -1,26 +1,48 @@
 {
   "name": "next-cloudinary",
-  "version": "6.13.0",
+  "version": "7.0.0-beta.2",
   "license": "MIT",
-  "main": "./dist/index.js",
-  "module": "./dist/index.mjs",
-  "types": "./dist/index.d.ts",
-  "source": "src/index.ts",
+  "main": "dist/next-cloudinary.cjs.js",
+  "module": "dist/next-cloudinary.esm.js",
+  "exports": {
+    ".": {
+      "types": {
+        "import": "./dist/next-cloudinary.cjs.mjs",
+        "default": "./dist/next-cloudinary.cjs.js"
+      },
+      "module": "./dist/next-cloudinary.esm.js",
+      "import": "./dist/next-cloudinary.cjs.mjs",
+      "default": "./dist/next-cloudinary.cjs.js"
+    },
+    "./package.json": "./package.json",
+    "./cld-video-player.css": "./dist/cld-video-player.css",
+    "./dist/cld-video-player.css": "./dist/cld-video-player.css",
+    "./cloudinary_icon_for_black_bg.svg": "./dist/cloudinary_icon_for_black_bg.svg",
+    "./dist/cloudinary_icon_for_black_bg.svg": "./dist/cloudinary_icon_for_black_bg.svg",
+    "./cloudinary_icon_for_white_bg.svg": "./dist/cloudinary_icon_for_white_bg.svg",
+    "./dist/cloudinary_icon_for_white_bg.svg": "./dist/cloudinary_icon_for_white_bg.svg"
+  },
+  "types": "./dist/next-cloudinary.cjs.d.ts",
+  "files": [
+    "dist"
+  ],
   "dependencies": {
     "@cloudinary-util/types": "1.5.8",
     "@cloudinary-util/url-loader": "5.10.3",
-    "@cloudinary-util/util": "^3.3.2",
-    "@tsconfig/recommended": "^1.0.7"
+    "@cloudinary-util/util": "^3.3.2"
   },
   "devDependencies": {
     "@babel/core": "^7.25.2",
-    "@babel/preset-env": "^7.25.3",
+    "@babel/preset-env": "^7.25.4",
+    "@babel/preset-react": "^7.24.7",
+    "@babel/preset-typescript": "^7.24.7",
+    "@tsconfig/recommended": "^1.0.7",
     "@types/node": "^22.0.2",
     "@types/react": "^18.3.3",
     "@types/react-dom": "^18.3.0",
     "dotenv": "^16.4.5",
     "mkdirp": "^3.0.1",
-    "tsup": "^8.2.3",
+    "tsx": "^4.19.1",
     "typescript": "^5.5.4",
     "vitest": "^2.0.5"
   },
@@ -28,11 +50,27 @@
     "next": "^12 || ^13 || ^14 || >=15.0.0-rc",
     "react": "^17 || ^18 || >=19.0.0-beta"
   },
+  "preconstruct": {
+    "exports": {
+      "importConditionDefaultExport": "default",
+      "extra": {
+        "./cld-video-player.css": "./dist/cld-video-player.css",
+        "./dist/cld-video-player.css": "./dist/cld-video-player.css",
+        "./cloudinary_icon_for_black_bg.svg": "./dist/cloudinary_icon_for_black_bg.svg",
+        "./dist/cloudinary_icon_for_black_bg.svg": "./dist/cloudinary_icon_for_black_bg.svg",
+        "./cloudinary_icon_for_white_bg.svg": "./dist/cloudinary_icon_for_white_bg.svg",
+        "./dist/cloudinary_icon_for_white_bg.svg": "./dist/cloudinary_icon_for_white_bg.svg"
+      }
+    },
+    "___experimentalFlags_WILL_CHANGE_IN_PATCH": {
+      "importsConditions": true
+    }
+  },
   "scripts": {
-    "build": "tsup",
-    "dev": "tsup --watch",
+    "build": "preconstruct build && tsx scripts/copy-assets.ts",
+    "dev": "preconstruct watch",
     "test": "vitest run",
-    "test:app": "NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME=\"test\" pnpm build && cd tests/nextjs-app && npm install && npm run build",
+    "test:app": "NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME=\"test\" pnpm build && cd tests/nextjs-app && pnpm build",
     "test:watch": "vitest"
   }
 }

package/dist/index.d.mts

@@ -1,152 +0,0 @@
-import React, { MutableRefObject } from 'react';
-import { ImageProps } from 'next/image';
-import { ImageOptions, ConfigOptions, AnalyticsOptions, VideoOptions } from '@cloudinary-util/url-loader';
-import { CloudinaryUploadWidgetOptions, CloudinaryUploadWidgetError, CloudinaryUploadWidgetResults, CloudinaryUploadWidgetInstanceMethods, CloudinaryVideoPlayerOptions, CloudinaryVideoPlayer, CloudinaryVideoPlayerOptionsLogo } from '@cloudinary-util/types';
-export { CloudinaryUploadWidgetError, CloudinaryUploadWidgetInfo, CloudinaryUploadWidgetInstanceMethodCloseOptions, CloudinaryUploadWidgetInstanceMethodDestroyOptions, CloudinaryUploadWidgetInstanceMethodOpenOptions, CloudinaryUploadWidgetInstanceMethodUpdateOptions, CloudinaryUploadWidgetInstanceMethods, CloudinaryUploadWidgetOptions, CloudinaryUploadWidgetResults, CloudinaryUploadWidgetSources, CloudinaryVideoPlayer, CloudinaryVideoPlayerOptions, CloudinaryVideoPlayerOptionsColors, CloudinaryVideoPlayerOptionsLogo } from '@cloudinary-util/types';
-
-type CldImageProps = Omit<ImageProps, 'src' | 'quality'> & ImageOptions & {
-    config?: ConfigOptions;
-    src: string;
-    unoptimized?: boolean;
-};
-declare const CldImage: React.ForwardRefExoticComponent<Omit<ImageProps, "src" | "quality"> & ImageOptions & {
-    config?: ConfigOptions;
-    src: string;
-    unoptimized?: boolean;
-} & React.RefAttributes<HTMLImageElement>>;
-
-type CldOgImageProps = CldImageProps & {
-    excludeTags?: Array<string>;
-    keys?: object;
-    twitterTitle?: string;
-};
-declare const CldOgImage: ({ excludeTags, twitterTitle, keys, ...props }: CldOgImageProps) => React.JSX.Element;
-
-type CldUploadWidgetCloudinaryInstance = any;
-type CldUploadWidgetWidgetInstance = any;
-interface CldUploadWidgetProps {
-    children?: ({ cloudinary, widget, open, results, error }: CldUploadWidgetPropsChildren) => JSX.Element;
-    config?: ConfigOptions;
-    onError?: CldUploadEventCallbackError;
-    onOpen?: CldUploadEventCallbackWidgetOnly;
-    /**
-     * @deprecated use onSuccess instead
-     */
-    onUpload?: CldUploadEventCallbackNoOptions;
-    onAbort?: CldUploadEventCallback;
-    onBatchCancelled?: CldUploadEventCallback;
-    onClose?: CldUploadEventCallback;
-    onDisplayChanged?: CldUploadEventCallback;
-    onPublicId?: CldUploadEventCallback;
-    onQueuesEnd?: CldUploadEventCallback;
-    onQueuesStart?: CldUploadEventCallback;
-    onRetry?: CldUploadEventCallback;
-    onShowCompleted?: CldUploadEventCallback;
-    onSourceChanged?: CldUploadEventCallback;
-    onSuccess?: CldUploadEventCallback;
-    onTags?: CldUploadEventCallback;
-    onUploadAdded?: CldUploadEventCallback;
-    options?: CloudinaryUploadWidgetOptions;
-    signatureEndpoint?: URL | RequestInfo;
-    uploadPreset?: string;
-    onAbortAction?: CldUploadEventAction;
-    onBatchCancelledAction?: CldUploadEventAction;
-    onCloseAction?: CldUploadEventAction;
-    onDisplayChangedAction?: CldUploadEventAction;
-    onPublicIdAction?: CldUploadEventAction;
-    onQueuesEndAction?: CldUploadEventAction;
-    onQueuesStartAction?: CldUploadEventAction;
-    onRetryAction?: CldUploadEventAction;
-    onShowCompletedAction?: CldUploadEventAction;
-    onSourceChangedAction?: CldUploadEventAction;
-    onSuccessAction?: CldUploadEventAction;
-    onTagsAction?: CldUploadEventAction;
-    onUploadAddedAction?: CldUploadEventAction;
-}
-type CldUploadWidgetPropsChildren = {
-    cloudinary: CldUploadWidgetCloudinaryInstance;
-    widget: CldUploadWidgetWidgetInstance;
-    error?: CloudinaryUploadWidgetError;
-    isLoading?: boolean;
-    results?: CloudinaryUploadWidgetResults;
-} & CloudinaryUploadWidgetInstanceMethods;
-type CldUploadEventCallback = (results: CloudinaryUploadWidgetResults, widget: CldUploadEventCallbackWidget) => void;
-type CldUploadEventAction = (results: CloudinaryUploadWidgetResults) => void;
-type CldUploadEventCallbackNoOptions = (results: CloudinaryUploadWidgetResults, widget: CldUploadWidgetWidgetInstance) => void;
-type CldUploadEventCallbackWidgetOnly = (widget: CldUploadWidgetWidgetInstance) => void;
-type CldUploadEventCallbackError = (error: CloudinaryUploadWidgetError, widget: CldUploadEventCallbackWidget) => void;
-type CldUploadEventCallbackWidget = {
-    widget: CldUploadWidgetWidgetInstance;
-} & CloudinaryUploadWidgetInstanceMethods;
-
-declare const CldUploadWidget: ({ children, config, onError, onOpen, onUpload, options, signatureEndpoint, uploadPreset, ...props }: CldUploadWidgetProps) => React.JSX.Element;
-
-interface CldUploadButtonProps extends Omit<CldUploadWidgetProps, 'children'> {
-    className?: string;
-    children?: JSX.Element | string | Array<JSX.Element | string>;
-    onClick?: Function;
-}
-declare const CldUploadButton: ({ className, children, onClick, onError, onOpen, onUpload, onAbort, onBatchCancelled, onClose, onDisplayChanged, onPublicId, onQueuesEnd, onQueuesStart, onRetry, onShowCompleted, onSourceChanged, onSuccess, onTags, onUploadAdded, options, signatureEndpoint, uploadPreset, onAbortAction, onBatchCancelledAction, onCloseAction, onDisplayChangedAction, onPublicIdAction, onQueuesEndAction, onQueuesStartAction, onRetryAction, onShowCompletedAction, onSourceChangedAction, onSuccessAction, onTagsAction, onUploadAddedAction, ...props }: CldUploadButtonProps) => React.JSX.Element;
-
-/**
- * getCldImageUrl
- */
-type GetCldImageUrlOptions = ImageOptions;
-type GetCldImageUrlConfig = ConfigOptions;
-type GetCldImageUrlAnalytics = AnalyticsOptions;
-declare function getCldImageUrl(options: GetCldImageUrlOptions, config?: GetCldImageUrlConfig, analytics?: GetCldImageUrlAnalytics): string;
-
-/**
- * getCldVideoUrl
- */
-type GetCldVideoUrlOptions = VideoOptions;
-type GetCldVideoUrlConfig = ConfigOptions;
-type GetCldVideoUrlAnalytics = AnalyticsOptions;
-declare function getCldVideoUrl(options: GetCldVideoUrlOptions, config?: GetCldVideoUrlConfig, analytics?: GetCldVideoUrlAnalytics): string;
-
-type CldVideoPlayerProps = Omit<CloudinaryVideoPlayerOptions, "cloud_name" | "autoplayMode" | "publicId" | "secure" | "showLogo" | "logoImageUrl" | "logoOnclickUrl"> & {
-    className?: string;
-    config?: ConfigOptions;
-    id?: string;
-    logo?: boolean | CldVideoPlayerPropsLogo;
-    onDataLoad?: Function;
-    onError?: Function;
-    onMetadataLoad?: Function;
-    onPause?: Function;
-    onPlay?: Function;
-    onEnded?: Function;
-    playerRef?: MutableRefObject<CloudinaryVideoPlayer | null>;
-    poster?: string | GetCldImageUrlOptions | GetCldVideoUrlOptions;
-    src: string;
-    videoRef?: MutableRefObject<HTMLVideoElement | null>;
-    quality?: string | number;
-};
-interface CldVideoPlayerPropsLogo {
-    imageUrl?: CloudinaryVideoPlayerOptionsLogo['logoImageUrl'];
-    logo?: boolean;
-    onClickUrl?: CloudinaryVideoPlayerOptionsLogo['logoOnclickUrl'];
-}
-
-declare const CldVideoPlayer: (props: CldVideoPlayerProps) => React.JSX.Element;
-
-interface CloudinaryLoaderCldOptions {
-}
-interface CloudinaryLoaderLoaderOptions {
-    height?: string | number;
-    width?: string | number;
-}
-interface CloudinaryLoader {
-    loaderOptions: CloudinaryLoaderLoaderOptions;
-    imageProps: ImageProps;
-    cldOptions: CloudinaryLoaderCldOptions;
-    cldConfig?: object;
-}
-declare function cloudinaryLoader({ loaderOptions, imageProps, cldOptions, cldConfig }: CloudinaryLoader): string;
-
-/**
- * getCldImageUrl
- */
-type GetCldOgImageUrlOptions = GetCldImageUrlOptions;
-declare function getCldOgImageUrl(options: GetCldOgImageUrlOptions): string;
-
-export { CldImage, type CldImageProps, CldOgImage, type CldOgImageProps, CldUploadButton, type CldUploadButtonProps, CldUploadWidget, type CldUploadWidgetProps, type CldUploadWidgetPropsChildren, CldVideoPlayer, type CldVideoPlayerProps, type CldVideoPlayerPropsLogo, type CloudinaryLoader, type CloudinaryLoaderCldOptions, type CloudinaryLoaderLoaderOptions, type GetCldImageUrlAnalytics, type GetCldImageUrlConfig, type GetCldImageUrlOptions, type GetCldOgImageUrlOptions, type GetCldVideoUrlAnalytics, type GetCldVideoUrlConfig, type GetCldVideoUrlOptions, cloudinaryLoader, getCldImageUrl, getCldOgImageUrl, getCldVideoUrl };