next-cloudinary 1.10.0 → 1.12.0

package/dist/next-cloudinary.umd.js

@@ -1,11 +1,12 @@
 (function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('next/image'), require('@cloudinary/url-gen'), require('react/jsx-runtime'), require('next/head'), require('next/script')) :
-  typeof define === 'function' && define.amd ? define(['exports', 'react', 'next/image', '@cloudinary/url-gen', 'react/jsx-runtime', 'next/head', 'next/script'], factory) :
-  (global = global || self, factory(global.nextCloudinary = {}, global.react, global.Image, global.urlGen, global.jsxRuntime, global.Head, global.Script));
-})(this, (function (exports, react, Image, urlGen, jsxRuntime, Head, Script) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('react'), require('next/image'), require('@cloudinary/url-gen'), require('next/package.json'), require('react/jsx-runtime'), require('next/head'), require('next/script')) :
+  typeof define === 'function' && define.amd ? define(['exports', 'react', 'next/image', '@cloudinary/url-gen', 'next/package.json', 'react/jsx-runtime', 'next/head', 'next/script'], factory) :
+  (global = global || self, factory(global.nextCloudinary = {}, global.react, global.Image, global.urlGen, global.nextPkg, global.jsxRuntime, global.Head, global.Script));
+})(this, (function (exports, react, Image, urlGen, nextPkg, jsxRuntime, Head, Script) {
   function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
   var Image__default = /*#__PURE__*/_interopDefaultLegacy(Image);
+  var nextPkg__default = /*#__PURE__*/_interopDefaultLegacy(nextPkg);
   var Head__default = /*#__PURE__*/_interopDefaultLegacy(Head);
   var Script__default = /*#__PURE__*/_interopDefaultLegacy(Script);
 
@@ -872,8 +873,56 @@
     plugin: plugin
   };
 
-  /**
-   * pollForProcessingImage
+  var NEXT_CLOUDINARY_ANALYTICS_ID = 'V';
+
+  var name = "next-cloudinary";
+  var version = "1.12.0";
+  var main = "dist/next-cloudinary.umd.js";
+  var module = "dist/next-cloudinary.module.js";
+  var source = "src/index.ts";
+  var types = "dist/index.d.ts";
+  var scripts = {
+  	build: "microbundle --no-compress --jsx React.createElement --jsxFragment React.Fragment --jsxImportSource react",
+  	dev: "microbundle watch --no-compress --jsx React.createElement --jsxFragment React.Fragment --jsxImportSource react",
+  	prepublishOnly: "cp ../README.md . && yarn build",
+  	postpublish: "rm ./README.md",
+  	test: "jest"
+  };
+  var dependencies = {
+  	"@cloudinary/url-gen": "^1.8.6"
+  };
+  var devDependencies = {
+  	"@babel/core": "^7.19.6",
+  	"@babel/preset-env": "^7.19.4",
+  	"@types/jest": "^29.2.0",
+  	"babel-jest": "^29.2.2",
+  	dotenv: "^16.0.3",
+  	jest: "^29.2.2",
+  	"jest-environment-jsdom": "^29.2.2",
+  	microbundle: "^0.15.1",
+  	"ts-jest": "^29.0.3",
+  	typescript: "^4.9.4"
+  };
+  var peerDependencies = {
+  	next: "^12 || ^13",
+  	react: "^17 || ^18"
+  };
+  var pkg = {
+  	name: name,
+  	version: version,
+  	main: main,
+  	module: module,
+  	"umd:main": "dist/next-cloudinary.umd.js",
+  	source: source,
+  	types: types,
+  	scripts: scripts,
+  	dependencies: dependencies,
+  	devDependencies: devDependencies,
+  	peerDependencies: peerDependencies
+  };
+
+  /**
+   * pollForProcessingImage
    */
 
   function _catch(body, recover) {
@@ -929,14 +978,11 @@
   removeBackgroundPlugin, croppingPlugin, effectsPlugin, overlaysPlugin, namedTransformationsPlugin, underlaysPlugin, zoompanPlugin,
   // Raw transformations needs to be last simply to make sure
   // it's always expected to applied the same way
-
   rawTransformationsPlugin];
   var cld;
-
-  /**
-   * constructCloudinaryUrl
+  /**
+   * constructCloudinaryUrl
    */
-
   function constructCloudinaryUrl(_ref) {
     var options = _ref.options,
       config = _ref.config;
@@ -944,50 +990,51 @@
       cld = new urlGen.Cloudinary(_extends({
         cloud: {
           cloudName: process.env.NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME
-        },
-        url: {
-          // Used to avoid issues with SSR particularly for the blurred placeholder
-          analytics: false
         }
       }, config));
     }
-    var publicId = getPublicId(options.src);
+    var publicId = getPublicId(options == null ? void 0 : options.src);
     var cldImage = cld.image(publicId);
     transformationPlugins.forEach(function (_ref2) {
       var plugin = _ref2.plugin;
+      // @ts-ignore
       var _ref3 = plugin({
           cldImage: cldImage,
           options: options
         }) || {},
         pluginOptions = _ref3.options;
-      if (pluginOptions != null && pluginOptions.format) {
+      if (pluginOptions != null && pluginOptions.format && options) {
         options.format = pluginOptions.format;
       }
-      if (pluginOptions != null && pluginOptions.width) {
+      if (pluginOptions != null && pluginOptions.width && options) {
         options.resize = {
           width: pluginOptions == null ? void 0 : pluginOptions.width
         };
       }
     });
-    if (options.resize) {
+    if (options != null && options.resize) {
       var _options$resize = options.resize,
         width = _options$resize.width,
         _options$resize$crop = _options$resize.crop,
         crop = _options$resize$crop === void 0 ? 'scale' : _options$resize$crop;
       cldImage.effect("c_" + crop + ",w_" + width);
     }
-    return cldImage.setDeliveryType(options.deliveryType || 'upload').format(options.format || 'auto').delivery("q_" + (options.quality || 'auto')).toURL();
+    return cldImage.setDeliveryType((options == null ? void 0 : options.deliveryType) || 'upload').format((options == null ? void 0 : options.format) || 'auto').delivery("q_" + ((options == null ? void 0 : options.quality) || 'auto')).toURL({
+      trackedAnalytics: {
+        sdkCode: NEXT_CLOUDINARY_ANALYTICS_ID,
+        sdkSemver: pkg.version,
+        techVersion: nextPkg__default["default"].version
+      }
+    });
   }
-
-  /**
-   * Retrieves the public id of a cloudiary image url. If no url is recognized it returns the parameter it self.
-   * If it's recognized that is a url and it's not possible to get the public id, it warns the user.
-   *
-   * @param {string} src The cloudiary url or public id.
-   *
-   * @return {string} The images public id
+  /**
+   * Retrieves the public id of a cloudiary image url. If no url is recognized it returns the parameter it self.
+   * If it's recognized that is a url and it's not possible to get the public id, it warns the user.
+   *
+   * @param {string} src The cloudiary url or public id.
+   *
+   * @return {string} The images public id
    */
-
   function getPublicId(src) {
     if (typeof src !== 'string') {
       throw new Error("Invalid src of type " + typeof src);
@@ -1007,11 +1054,9 @@
     }
     return src;
   }
-
-  /**
-   * createPlaceholderUrl
+  /**
+   * createPlaceholderUrl
    */
-
   function createPlaceholderUrl(_ref4) {
     var src = _ref4.src,
       _ref4$placeholder = _ref4.placeholder,
@@ -1064,8 +1109,8 @@
   }
 
   var CldImage = function CldImage(props) {
-    /**
-     * handleOnError
+    /**
+     * handleOnError
      */
     var handleOnError = function handleOnError(options) {
       try {
@@ -1091,10 +1136,11 @@
         CLD_OPTIONS.push(prop);
       });
     });
-
     // Construct the base Image component props by filtering out Cloudinary-specific props
-
-    var imageProps = {};
+    var imageProps = {
+      alt: props.alt,
+      src: props.src
+    };
     Object.keys(props).filter(function (key) {
       return !CLD_OPTIONS.includes(key);
     }).forEach(function (key) {
@@ -1106,16 +1152,13 @@
     var _useState = react.useState(defaultImgKey),
       imgKey = _useState[0],
       setImgKey = _useState[1];
-
     // Construct Cloudinary-specific props by looking for values for any of the supported prop keys
-
     var cldOptions = {};
     CLD_OPTIONS.forEach(function (key) {
       if (props[key]) {
         cldOptions[key] = props[key];
       }
     });
-
     // If we see a placeholder option, configure a Cloudinary-based URL.
     // The resulting image will always be blurred per Next.js, so we're
     // limited on options for placeholders.
@@ -1124,7 +1167,6 @@
     // an Image component prop as opposed to simply the URL
     //
     // https://nextjs.org/docs/api-reference/next/image#blurdataurl
-
     if (imageProps.placeholder) {
       var publicId = getPublicId(props.src);
       imageProps.blurDataURL = createPlaceholderUrl({
@@ -1137,7 +1179,8 @@
     }
     if (props.src && props.preserveTransformations) {
       var transformations = getTransformations(props.src, props.preserveTransformations);
-      imageProps.rawTransformations = [].concat(imageProps.rawTransformations, transformations);
+      var rawTransformations = imageProps.rawTransformations ? [].concat(imageProps.rawTransformations) : [];
+      imageProps.rawTransformations = [].concat(rawTransformations, transformations);
     }
     return /*#__PURE__*/jsxRuntime.jsx(Image__default["default"], _extends({}, imageProps, {
       loader: function loader(loaderOptions) {
@@ -1164,15 +1207,14 @@
       width: props.width || IMAGE_WIDTH,
       height: props.height || IMAGE_HEIGHT,
       crop: props.crop || 'fill',
-      gravity: props.gravity || 'center'
+      gravity: props.gravity || 'center',
+      alt: props.alt
     });
     var ogImageUrl = constructCloudinaryUrl({
       options: options
     });
-
     // 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",
@@ -1211,12 +1253,10 @@
     var cloudinary = react.useRef();
     var widget = react.useRef();
     var signed = !!signatureEndpoint;
-
-    /**
-     * generateSignature
-     * @description Makes a request to an endpoint to sign Cloudinary parameters as part of widget creation
+    /**
+     * generateSignature
+     * @description Makes a request to an endpoint to sign Cloudinary parameters as part of widget creation
      */
-
     function generateSignature(callback, paramsToSign) {
       fetch(signatureEndpoint, {
         method: "POST",
@@ -1230,19 +1270,16 @@
         callback(signature);
       });
     }
-
-    /**
-     * createWidget
-     * @description Creates a new instance of the Cloudinary widget and stores in a ref
+    /**
+     * createWidget
+     * @description Creates a new instance of the Cloudinary widget and stores in a ref
      */
-
     function createWidget() {
       var _cloudinary$current;
       // When creating a signed upload, you need to provide both your Cloudinary API Key
       // as well as a signature generator function that will sign any paramters
       // either on page load or during the upload process. Read more about signed uploads at:
       // https://cloudinary.com/documentation/upload_widget#signed_uploads
-
       var uploadOptions = _extends({
         cloudName: process.env.NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME,
         uploadPreset: uploadPreset || process.env.NEXT_PUBLIC_CLOUDINARY_UPLOAD_PRESET,
@@ -1250,13 +1287,12 @@
       }, options);
       if (signed) {
         uploadOptions.uploadSignature = generateSignature;
-
         // No need for apiSecret here because of api/sign-cloudinary-params
-
         if (!uploadOptions.apiKey) {
           return new Error("Signed Upload needs apiKey!");
         }
       }
+      // @ts-ignore
       return (_cloudinary$current = cloudinary.current) == null ? void 0 : _cloudinary$current.createUploadWidget(uploadOptions, function (error, result) {
         // The callback is a bit more chatty than failed or success so
         // only trigger when one of those are the case. You can additionally
@@ -1267,25 +1303,23 @@
         }
       });
     }
-
-    /**
-     * open
-     * @description When triggered, uses the current widget instance to open the upload modal
+    /**
+     * open
+     * @description When triggered, uses the current widget instance to open the upload modal
      */
-
     function open() {
       if (!(widget != null && widget.current)) {
         widget.current = createWidget();
       }
+      // @ts-ignore
       (widget == null ? void 0 : widget.current) && widget.current.open();
     }
-
-    /**
-     * handleOnLoad
-     * @description Stores the Cloudinary window instance to a ref when the widget script loads
+    /**
+     * handleOnLoad
+     * @description Stores the Cloudinary window instance to a ref when the widget script loads
      */
-
     function handleOnLoad() {
+      // @ts-ignore
       cloudinary.current = window.cloudinary;
     }
     return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {