next-cloudinary 1.10.0 → 1.11.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/components/CldImage/CldImage.d.ts +3 -0
- package/dist/components/CldOgImage/CldOgImage.d.ts +7 -0
- package/dist/components/CldUploadButton/CldUploadButton.d.ts +11 -0
- package/dist/components/CldUploadWidget/CldUploadWidget.d.ts +9 -0
- package/dist/index.d.ts +7 -0
- package/dist/lib/cloudinary.d.ts +45 -0
- package/dist/next-cloudinary.js +44 -61
- package/dist/next-cloudinary.js.map +1 -1
- package/dist/next-cloudinary.modern.mjs +44 -65
- package/dist/next-cloudinary.modern.mjs.map +1 -1
- package/dist/next-cloudinary.module.js +44 -61
- package/dist/next-cloudinary.module.js.map +1 -1
- package/dist/next-cloudinary.umd.js +44 -61
- package/dist/next-cloudinary.umd.js.map +1 -1
- package/package.json +6 -3
- package/tsconfig.json +26 -0
|
@@ -872,8 +872,8 @@
|
|
|
872
872
|
plugin: plugin
|
|
873
873
|
};
|
|
874
874
|
|
|
875
|
-
/**
|
|
876
|
-
* pollForProcessingImage
|
|
875
|
+
/**
|
|
876
|
+
* pollForProcessingImage
|
|
877
877
|
*/
|
|
878
878
|
|
|
879
879
|
function _catch(body, recover) {
|
|
@@ -929,14 +929,11 @@
|
|
|
929
929
|
removeBackgroundPlugin, croppingPlugin, effectsPlugin, overlaysPlugin, namedTransformationsPlugin, underlaysPlugin, zoompanPlugin,
|
|
930
930
|
// Raw transformations needs to be last simply to make sure
|
|
931
931
|
// it's always expected to applied the same way
|
|
932
|
-
|
|
933
932
|
rawTransformationsPlugin];
|
|
934
933
|
var cld;
|
|
935
|
-
|
|
936
|
-
|
|
937
|
-
* constructCloudinaryUrl
|
|
934
|
+
/**
|
|
935
|
+
* constructCloudinaryUrl
|
|
938
936
|
*/
|
|
939
|
-
|
|
940
937
|
function constructCloudinaryUrl(_ref) {
|
|
941
938
|
var options = _ref.options,
|
|
942
939
|
config = _ref.config;
|
|
@@ -951,43 +948,42 @@
|
|
|
951
948
|
}
|
|
952
949
|
}, config));
|
|
953
950
|
}
|
|
954
|
-
var publicId = getPublicId(options.src);
|
|
951
|
+
var publicId = getPublicId(options == null ? void 0 : options.src);
|
|
955
952
|
var cldImage = cld.image(publicId);
|
|
956
953
|
transformationPlugins.forEach(function (_ref2) {
|
|
957
954
|
var plugin = _ref2.plugin;
|
|
955
|
+
// @ts-ignore
|
|
958
956
|
var _ref3 = plugin({
|
|
959
957
|
cldImage: cldImage,
|
|
960
958
|
options: options
|
|
961
959
|
}) || {},
|
|
962
960
|
pluginOptions = _ref3.options;
|
|
963
|
-
if (pluginOptions != null && pluginOptions.format) {
|
|
961
|
+
if (pluginOptions != null && pluginOptions.format && options) {
|
|
964
962
|
options.format = pluginOptions.format;
|
|
965
963
|
}
|
|
966
|
-
if (pluginOptions != null && pluginOptions.width) {
|
|
964
|
+
if (pluginOptions != null && pluginOptions.width && options) {
|
|
967
965
|
options.resize = {
|
|
968
966
|
width: pluginOptions == null ? void 0 : pluginOptions.width
|
|
969
967
|
};
|
|
970
968
|
}
|
|
971
969
|
});
|
|
972
|
-
if (options.resize) {
|
|
970
|
+
if (options != null && options.resize) {
|
|
973
971
|
var _options$resize = options.resize,
|
|
974
972
|
width = _options$resize.width,
|
|
975
973
|
_options$resize$crop = _options$resize.crop,
|
|
976
974
|
crop = _options$resize$crop === void 0 ? 'scale' : _options$resize$crop;
|
|
977
975
|
cldImage.effect("c_" + crop + ",w_" + width);
|
|
978
976
|
}
|
|
979
|
-
return cldImage.setDeliveryType(options.deliveryType || 'upload').format(options.format || 'auto').delivery("q_" + (options.quality || 'auto')).toURL();
|
|
977
|
+
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();
|
|
980
978
|
}
|
|
981
|
-
|
|
982
|
-
|
|
983
|
-
*
|
|
984
|
-
*
|
|
985
|
-
*
|
|
986
|
-
*
|
|
987
|
-
*
|
|
988
|
-
* @return {string} The images public id
|
|
979
|
+
/**
|
|
980
|
+
* Retrieves the public id of a cloudiary image url. If no url is recognized it returns the parameter it self.
|
|
981
|
+
* If it's recognized that is a url and it's not possible to get the public id, it warns the user.
|
|
982
|
+
*
|
|
983
|
+
* @param {string} src The cloudiary url or public id.
|
|
984
|
+
*
|
|
985
|
+
* @return {string} The images public id
|
|
989
986
|
*/
|
|
990
|
-
|
|
991
987
|
function getPublicId(src) {
|
|
992
988
|
if (typeof src !== 'string') {
|
|
993
989
|
throw new Error("Invalid src of type " + typeof src);
|
|
@@ -1007,11 +1003,9 @@
|
|
|
1007
1003
|
}
|
|
1008
1004
|
return src;
|
|
1009
1005
|
}
|
|
1010
|
-
|
|
1011
|
-
|
|
1012
|
-
* createPlaceholderUrl
|
|
1006
|
+
/**
|
|
1007
|
+
* createPlaceholderUrl
|
|
1013
1008
|
*/
|
|
1014
|
-
|
|
1015
1009
|
function createPlaceholderUrl(_ref4) {
|
|
1016
1010
|
var src = _ref4.src,
|
|
1017
1011
|
_ref4$placeholder = _ref4.placeholder,
|
|
@@ -1064,8 +1058,8 @@
|
|
|
1064
1058
|
}
|
|
1065
1059
|
|
|
1066
1060
|
var CldImage = function CldImage(props) {
|
|
1067
|
-
/**
|
|
1068
|
-
* handleOnError
|
|
1061
|
+
/**
|
|
1062
|
+
* handleOnError
|
|
1069
1063
|
*/
|
|
1070
1064
|
var handleOnError = function handleOnError(options) {
|
|
1071
1065
|
try {
|
|
@@ -1091,10 +1085,11 @@
|
|
|
1091
1085
|
CLD_OPTIONS.push(prop);
|
|
1092
1086
|
});
|
|
1093
1087
|
});
|
|
1094
|
-
|
|
1095
1088
|
// Construct the base Image component props by filtering out Cloudinary-specific props
|
|
1096
|
-
|
|
1097
|
-
|
|
1089
|
+
var imageProps = {
|
|
1090
|
+
alt: props.alt,
|
|
1091
|
+
src: props.src
|
|
1092
|
+
};
|
|
1098
1093
|
Object.keys(props).filter(function (key) {
|
|
1099
1094
|
return !CLD_OPTIONS.includes(key);
|
|
1100
1095
|
}).forEach(function (key) {
|
|
@@ -1106,16 +1101,13 @@
|
|
|
1106
1101
|
var _useState = react.useState(defaultImgKey),
|
|
1107
1102
|
imgKey = _useState[0],
|
|
1108
1103
|
setImgKey = _useState[1];
|
|
1109
|
-
|
|
1110
1104
|
// Construct Cloudinary-specific props by looking for values for any of the supported prop keys
|
|
1111
|
-
|
|
1112
1105
|
var cldOptions = {};
|
|
1113
1106
|
CLD_OPTIONS.forEach(function (key) {
|
|
1114
1107
|
if (props[key]) {
|
|
1115
1108
|
cldOptions[key] = props[key];
|
|
1116
1109
|
}
|
|
1117
1110
|
});
|
|
1118
|
-
|
|
1119
1111
|
// If we see a placeholder option, configure a Cloudinary-based URL.
|
|
1120
1112
|
// The resulting image will always be blurred per Next.js, so we're
|
|
1121
1113
|
// limited on options for placeholders.
|
|
@@ -1124,7 +1116,6 @@
|
|
|
1124
1116
|
// an Image component prop as opposed to simply the URL
|
|
1125
1117
|
//
|
|
1126
1118
|
// https://nextjs.org/docs/api-reference/next/image#blurdataurl
|
|
1127
|
-
|
|
1128
1119
|
if (imageProps.placeholder) {
|
|
1129
1120
|
var publicId = getPublicId(props.src);
|
|
1130
1121
|
imageProps.blurDataURL = createPlaceholderUrl({
|
|
@@ -1137,7 +1128,8 @@
|
|
|
1137
1128
|
}
|
|
1138
1129
|
if (props.src && props.preserveTransformations) {
|
|
1139
1130
|
var transformations = getTransformations(props.src, props.preserveTransformations);
|
|
1140
|
-
imageProps.rawTransformations
|
|
1131
|
+
var rawTransformations = imageProps.rawTransformations ? [].concat(imageProps.rawTransformations) : [];
|
|
1132
|
+
imageProps.rawTransformations = [].concat(rawTransformations, transformations);
|
|
1141
1133
|
}
|
|
1142
1134
|
return /*#__PURE__*/jsxRuntime.jsx(Image__default["default"], _extends({}, imageProps, {
|
|
1143
1135
|
loader: function loader(loaderOptions) {
|
|
@@ -1164,15 +1156,14 @@
|
|
|
1164
1156
|
width: props.width || IMAGE_WIDTH,
|
|
1165
1157
|
height: props.height || IMAGE_HEIGHT,
|
|
1166
1158
|
crop: props.crop || 'fill',
|
|
1167
|
-
gravity: props.gravity || 'center'
|
|
1159
|
+
gravity: props.gravity || 'center',
|
|
1160
|
+
alt: props.alt
|
|
1168
1161
|
});
|
|
1169
1162
|
var ogImageUrl = constructCloudinaryUrl({
|
|
1170
1163
|
options: options
|
|
1171
1164
|
});
|
|
1172
|
-
|
|
1173
1165
|
// We need to include the tags within the Next.js Head component rather than
|
|
1174
1166
|
// direcly adding them inside of the Head otherwise we get unexpected results
|
|
1175
|
-
|
|
1176
1167
|
return /*#__PURE__*/jsxRuntime.jsxs(Head__default["default"], {
|
|
1177
1168
|
children: [/*#__PURE__*/jsxRuntime.jsx("meta", {
|
|
1178
1169
|
property: "og:image",
|
|
@@ -1211,12 +1202,10 @@
|
|
|
1211
1202
|
var cloudinary = react.useRef();
|
|
1212
1203
|
var widget = react.useRef();
|
|
1213
1204
|
var signed = !!signatureEndpoint;
|
|
1214
|
-
|
|
1215
|
-
|
|
1216
|
-
*
|
|
1217
|
-
* @description Makes a request to an endpoint to sign Cloudinary parameters as part of widget creation
|
|
1205
|
+
/**
|
|
1206
|
+
* generateSignature
|
|
1207
|
+
* @description Makes a request to an endpoint to sign Cloudinary parameters as part of widget creation
|
|
1218
1208
|
*/
|
|
1219
|
-
|
|
1220
1209
|
function generateSignature(callback, paramsToSign) {
|
|
1221
1210
|
fetch(signatureEndpoint, {
|
|
1222
1211
|
method: "POST",
|
|
@@ -1230,19 +1219,16 @@
|
|
|
1230
1219
|
callback(signature);
|
|
1231
1220
|
});
|
|
1232
1221
|
}
|
|
1233
|
-
|
|
1234
|
-
|
|
1235
|
-
*
|
|
1236
|
-
* @description Creates a new instance of the Cloudinary widget and stores in a ref
|
|
1222
|
+
/**
|
|
1223
|
+
* createWidget
|
|
1224
|
+
* @description Creates a new instance of the Cloudinary widget and stores in a ref
|
|
1237
1225
|
*/
|
|
1238
|
-
|
|
1239
1226
|
function createWidget() {
|
|
1240
1227
|
var _cloudinary$current;
|
|
1241
1228
|
// When creating a signed upload, you need to provide both your Cloudinary API Key
|
|
1242
1229
|
// as well as a signature generator function that will sign any paramters
|
|
1243
1230
|
// either on page load or during the upload process. Read more about signed uploads at:
|
|
1244
1231
|
// https://cloudinary.com/documentation/upload_widget#signed_uploads
|
|
1245
|
-
|
|
1246
1232
|
var uploadOptions = _extends({
|
|
1247
1233
|
cloudName: process.env.NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME,
|
|
1248
1234
|
uploadPreset: uploadPreset || process.env.NEXT_PUBLIC_CLOUDINARY_UPLOAD_PRESET,
|
|
@@ -1250,13 +1236,12 @@
|
|
|
1250
1236
|
}, options);
|
|
1251
1237
|
if (signed) {
|
|
1252
1238
|
uploadOptions.uploadSignature = generateSignature;
|
|
1253
|
-
|
|
1254
1239
|
// No need for apiSecret here because of api/sign-cloudinary-params
|
|
1255
|
-
|
|
1256
1240
|
if (!uploadOptions.apiKey) {
|
|
1257
1241
|
return new Error("Signed Upload needs apiKey!");
|
|
1258
1242
|
}
|
|
1259
1243
|
}
|
|
1244
|
+
// @ts-ignore
|
|
1260
1245
|
return (_cloudinary$current = cloudinary.current) == null ? void 0 : _cloudinary$current.createUploadWidget(uploadOptions, function (error, result) {
|
|
1261
1246
|
// The callback is a bit more chatty than failed or success so
|
|
1262
1247
|
// only trigger when one of those are the case. You can additionally
|
|
@@ -1267,25 +1252,23 @@
|
|
|
1267
1252
|
}
|
|
1268
1253
|
});
|
|
1269
1254
|
}
|
|
1270
|
-
|
|
1271
|
-
|
|
1272
|
-
* open
|
|
1273
|
-
* @description When triggered, uses the current widget instance to open the upload modal
|
|
1255
|
+
/**
|
|
1256
|
+
* open
|
|
1257
|
+
* @description When triggered, uses the current widget instance to open the upload modal
|
|
1274
1258
|
*/
|
|
1275
|
-
|
|
1276
1259
|
function open() {
|
|
1277
1260
|
if (!(widget != null && widget.current)) {
|
|
1278
1261
|
widget.current = createWidget();
|
|
1279
1262
|
}
|
|
1263
|
+
// @ts-ignore
|
|
1280
1264
|
(widget == null ? void 0 : widget.current) && widget.current.open();
|
|
1281
1265
|
}
|
|
1282
|
-
|
|
1283
|
-
|
|
1284
|
-
*
|
|
1285
|
-
* @description Stores the Cloudinary window instance to a ref when the widget script loads
|
|
1266
|
+
/**
|
|
1267
|
+
* handleOnLoad
|
|
1268
|
+
* @description Stores the Cloudinary window instance to a ref when the widget script loads
|
|
1286
1269
|
*/
|
|
1287
|
-
|
|
1288
1270
|
function handleOnLoad() {
|
|
1271
|
+
// @ts-ignore
|
|
1289
1272
|
cloudinary.current = window.cloudinary;
|
|
1290
1273
|
}
|
|
1291
1274
|
return /*#__PURE__*/jsxRuntime.jsxs(jsxRuntime.Fragment, {
|