next-cloudinary 0.0.1 → 0.0.2

package/dist/next-cloudinary.js

@@ -1,5 +1,5 @@
-var urlGen = require('@cloudinary/url-gen');
 var Image = require('next/image');
+var urlGen = require('@cloudinary/url-gen');
 var jsxRuntime = require('react/jsx-runtime');
 
 function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
@@ -38,13 +38,51 @@ function _objectWithoutPropertiesLoose(source, excluded) {
   return target;
 }
 
-var _excluded = ["effects", "removeBackground"];
+var primary = {
+  gravity: {
+    qualifier: 'g'
+  },
+  crop: {
+    qualifier: 'c'
+  },
+  width: {
+    qualifier: 'w'
+  },
+  height: {
+    qualifier: 'h'
+  }
+};
+var position = {
+  x: {
+    qualifier: 'x'
+  },
+  y: {
+    qualifier: 'y'
+  },
+  gravity: {
+    qualifier: 'g'
+  }
+};
+var text = {
+  color: {
+    qualifier: 'co',
+    location: 'primary'
+  },
+  fontFamily: {},
+  fontSize: {},
+  fontWeight: {},
+  textDecoration: {},
+  letterSpacing: {
+    qualifier: 'letter_spacing'
+  }
+};
+
+var _excluded$1 = ["publicId", "type", "position", "text", "effects"];
 var cld = new urlGen.Cloudinary({
   cloud: {
     cloudName: process.env.NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME
   }
 });
-
 function cloudinaryLoader(options, cldOptions) {
   var src = options.src,
       width = options.width,
@@ -52,30 +90,141 @@ function cloudinaryLoader(options, cldOptions) {
       format = _options$format === void 0 ? 'auto' : _options$format,
       _options$quality = options.quality,
       quality = _options$quality === void 0 ? 'auto' : _options$quality;
-  var _cldOptions$effects = cldOptions.effects,
-      effects = _cldOptions$effects === void 0 ? [] : _cldOptions$effects,
+  var _cldOptions$overlays = cldOptions.overlays,
+      overlays = _cldOptions$overlays === void 0 ? [] : _cldOptions$overlays,
       _cldOptions$removeBac = cldOptions.removeBackground,
-      removeBackground = _cldOptions$removeBac === void 0 ? false : _cldOptions$removeBac;
+      removeBackground = _cldOptions$removeBac === void 0 ? false : _cldOptions$removeBac,
+      _cldOptions$underlays = cldOptions.underlays,
+      underlays = _cldOptions$underlays === void 0 ? [] : _cldOptions$underlays;
   var cldImage = cld.image(src);
 
   if (removeBackground) {
     cldImage.effect('e_background_removal');
-  }
+  } // Adding overlays and underlays allows you to compose your image
+  // by using layering with overlays appearing on top of and udnerlays
+  // appearing below your base image layer
+  //
+  // Learn more: https://cloudinary.com/documentation/layers
+
+
+  var layers = [].concat(overlays.map(function (overlay) {
+    return _extends({}, overlay, {
+      type: 'overlay'
+    });
+  }), underlays.map(function (underlay) {
+    return _extends({}, underlay, {
+      type: 'underlay'
+    });
+  }));
+  layers.forEach(function (_ref) {
+    var publicId = _ref.publicId,
+        type = _ref.type,
+        position$1 = _ref.position,
+        text$1 = _ref.text,
+        _ref$effects = _ref.effects,
+        layerEffects = _ref$effects === void 0 ? [] : _ref$effects,
+        options = _objectWithoutPropertiesLoose(_ref, _excluded$1);
+
+    var hasPublicId = typeof publicId === 'string';
+    var hasText = typeof text$1 === 'object';
+    var hasPosition = typeof position$1 === 'object';
+
+    if (!hasPublicId && !hasText) {
+      console.warn(type + " is missing Public ID or Text");
+      return;
+    } // Determine the qualifier for the type of layer
+
+
+    var typeQualifier;
+
+    if (type === 'overlay') {
+      typeQualifier = 'l';
+    } else if (type === 'underlay') {
+      typeQualifier = 'u';
+    } // Start to construct the transformation string using text or the public ID
+    // if it's image-based
 
-  effects.forEach(function (effect) {
-    return cldImage.effect(effect);
+
+    var layerTransformation;
+
+    if (hasText) {
+      layerTransformation = typeQualifier + "_text";
+    } else {
+      layerTransformation = typeQualifier + "_" + publicId.replace(/\//g, ':');
+    } // Begin organizing transformations based on what it is and the location
+    // it needs to be placed in the URL
+
+
+    var primary$1 = [];
+    var applied = []; // Gemeral options
+
+    Object.keys(options).forEach(function (key) {
+      if (!primary[key]) return;
+      var qualifier = primary[key].qualifier;
+      primary$1.push(qualifier + "_" + options[key]);
+    }); // Layer effects
+
+    layerEffects.forEach(function (effect) {
+      Object.keys(effect).forEach(function (key) {
+        if (!primary[key]) return;
+        var qualifier = primary[key].qualifier;
+        primary$1.push(qualifier + "_" + effect[key]);
+      });
+    }); // Text styling
+
+    if (hasText) {
+      var textTransformations = [];
+      Object.keys(text$1).forEach(function (key) {
+        if (!text[key]) return;
+        var _qualifiersText$key = text[key],
+            qualifier = _qualifiersText$key.qualifier,
+            location = _qualifiersText$key.location;
+
+        if (location === 'primary') {
+          primary$1.push(qualifier + "_" + text$1[key]);
+        } else {
+          textTransformations.push(text$1[key]);
+        }
+      });
+      layerTransformation = layerTransformation + ":" + textTransformations.join('_') + ":" + text$1.text;
+    } // Positioning
+
+
+    if (hasPosition) {
+      Object.keys(position$1).forEach(function (key) {
+        if (!position[key]) return;
+        var qualifier = position[key].qualifier;
+        applied.push(qualifier + "_" + position$1[key]);
+      });
+    } // Add all primary transformations
+
+
+    layerTransformation = layerTransformation + "," + primary$1.join(','); // Add all applied transformations
+
+    layerTransformation = layerTransformation + "/fl_layer_apply";
+
+    if (applied.length > 0) {
+      layerTransformation = layerTransformation + "," + applied.join(',');
+    } // Finally add it to the image
+
+
+    cldImage.addTransformation(layerTransformation);
   });
   return cldImage.resize("c_limit,w_" + width).format(format).delivery("q_" + quality).toURL();
 }
 
+var _excluded = ["overlays", "removeBackground", "underlays"];
+
 var CldImage = function CldImage(_ref) {
-  var effects = _ref.effects,
+  var overlays = _ref.overlays,
       removeBackground = _ref.removeBackground,
+      underlays = _ref.underlays,
       props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   var cldOptions = {
-    effects: effects,
-    removeBackground: removeBackground
+    overlays: overlays,
+    removeBackground: removeBackground,
+    underlays: underlays
   };
   return /*#__PURE__*/jsxRuntime.jsx(Image__default["default"], _extends({}, props, {
     loader: function loader(options) {
@@ -85,4 +234,8 @@ var CldImage = function CldImage(_ref) {
 };
 
 exports.CldImage = CldImage;
+exports.cloudinaryLoader = cloudinaryLoader;
+exports.position = position;
+exports.primary = primary;
+exports.text = text;
 //# sourceMappingURL=next-cloudinary.js.map

package/dist/next-cloudinary.js.map

@@ -1 +1 @@
-{"version":3,"file":"next-cloudinary.js","sources":["../src/components/CldImage/CldImage.js"],"sourcesContent":["import { Cloudinary } from '@cloudinary/url-gen';\nimport Image from 'next/image';\n\nconst cld = new Cloudinary({\n  cloud: {\n    cloudName: process.env.NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME\n  }\n});\n\nfunction cloudinaryLoader(options, cldOptions) {\n  const {\n    src,\n    width,\n    format = 'auto',\n    quality = 'auto'\n  } = options;\n\n  const {\n    effects = [],\n    removeBackground = false\n  } = cldOptions;\n\n  const cldImage = cld.image(src);\n\n  if ( removeBackground ) {\n    cldImage.effect('e_background_removal');\n  }\n\n  effects.forEach(effect => cldImage.effect(effect));\n\n  return cldImage.resize(`c_limit,w_${width}`).format(format).delivery(`q_${quality}`).toURL();\n}\n\nconst CldImage = ({ effects, removeBackground, ...props }) => {\n  const cldOptions = {\n    effects,\n    removeBackground\n  };\n  return <Image {...props} loader={(options) => cloudinaryLoader(options, cldOptions)} />\n}\n\nexport default CldImage;"],"names":["cld","Cloudinary","cloud","cloudName","process","env","NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME","cloudinaryLoader","options","cldOptions","src","width","format","quality","effects","removeBackground","cldImage","image","effect","forEach","resize","delivery","toURL","CldImage","props","_jsx","Image"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA,IAAMA,GAAG,GAAG,IAAIC,iBAAJ,CAAe;AACzBC,EAAAA,KAAK,EAAE;AACLC,IAAAA,SAAS,EAAEC,OAAO,CAACC,GAAR,CAAYC,iCAAAA;AADlB,GAAA;AADkB,CAAf,CAAZ,CAAA;;AAMA,SAASC,gBAAT,CAA0BC,OAA1B,EAAmCC,UAAnC,EAA+C;AAC7C,EAAA,IACEC,GADF,GAKIF,OALJ,CACEE,GADF;AAAA,MAEEC,KAFF,GAKIH,OALJ,CAEEG,KAFF;MAKIH,eAAAA,GAAAA,OALJ,CAGEI,MAHF;MAGEA,MAHF,gCAGW,MAHX,GAAA,eAAA;MAKIJ,gBAAAA,GAAAA,OALJ,CAIEK,OAJF;MAIEA,OAJF,iCAIY,MAJZ,GAAA,gBAAA,CAAA;EAOA,IAGIJ,mBAAAA,GAAAA,UAHJ,CACEK,OADF;MACEA,OADF,oCACY,EADZ,GAAA,mBAAA;MAGIL,qBAAAA,GAAAA,UAHJ,CAEEM,gBAFF;MAEEA,gBAFF,sCAEqB,KAFrB,GAAA,qBAAA,CAAA;AAKA,EAAA,IAAMC,QAAQ,GAAGhB,GAAG,CAACiB,KAAJ,CAAUP,GAAV,CAAjB,CAAA;;AAEA,EAAA,IAAKK,gBAAL,EAAwB;IACtBC,QAAQ,CAACE,MAAT,CAAgB,sBAAhB,CAAA,CAAA;AACD,GAAA;;AAEDJ,EAAAA,OAAO,CAACK,OAAR,CAAgB,UAAAD,MAAM,EAAA;AAAA,IAAA,OAAIF,QAAQ,CAACE,MAAT,CAAgBA,MAAhB,CAAJ,CAAA;GAAtB,CAAA,CAAA;AAEA,EAAA,OAAOF,QAAQ,CAACI,MAAT,CAAA,YAAA,GAA6BT,KAA7B,CAAsCC,CAAAA,MAAtC,CAA6CA,MAA7C,EAAqDS,QAArD,CAAA,IAAA,GAAmER,OAAnE,CAAA,CAA8ES,KAA9E,EAAP,CAAA;AACD,CAAA;;AAED,IAAMC,QAAQ,GAAG,SAAXA,QAAW,CAA6C,IAAA,EAAA;EAAA,IAA1CT,OAA0C,QAA1CA,OAA0C;MAAjCC,gBAAiC,QAAjCA,gBAAiC;AAAA,MAAZS,KAAY,GAAA,6BAAA,CAAA,IAAA,EAAA,SAAA,CAAA,CAAA;;AAC5D,EAAA,IAAMf,UAAU,GAAG;AACjBK,IAAAA,OAAO,EAAPA,OADiB;AAEjBC,IAAAA,gBAAgB,EAAhBA,gBAAAA;GAFF,CAAA;EAIA,oBAAOU,cAAA,CAACC,yBAAD,EAAA,QAAA,CAAA,EAAA,EAAWF,KAAX,EAAA;IAAkB,MAAM,EAAE,gBAAChB,OAAD,EAAA;AAAA,MAAA,OAAaD,gBAAgB,CAACC,OAAD,EAAUC,UAAV,CAA7B,CAAA;AAAA,KAAA;GAAjC,CAAA,CAAA,CAAA;AACD;;;;"}
+{"version":3,"file":"next-cloudinary.js","sources":["../src/constants/qualifiers.js","../src/loaders/cloudinary-loader.js","../src/components/CldImage/CldImage.js"],"sourcesContent":["export const primary = {\n  gravity: {\n    qualifier: 'g'\n  },\n  crop: {\n    qualifier: 'c'\n  },\n  width: {\n    qualifier: 'w'\n  },\n  height: {\n    qualifier: 'h'\n  }\n};\n\nexport const position = {\n  x: {\n    qualifier: 'x'\n  },\n  y: {\n    qualifier: 'y'\n  },\n  gravity: {\n    qualifier: 'g'\n  },\n}\n\nexport const text = {\n  color: {\n    qualifier: 'co',\n    location: 'primary'\n  },\n  fontFamily: {\n  },\n  fontSize: {\n  },\n  fontWeight: {\n  },\n  textDecoration: {\n  },\n  letterSpacing: {\n    qualifier: 'letter_spacing'\n  }\n}","import { Cloudinary } from '@cloudinary/url-gen';\n\nimport {\n  primary as qualifiersPrimary,\n  text as qualifiersText,\n  position as qualifiersPosition\n} from '../constants/qualifiers';\n\nconst cld = new Cloudinary({\n  cloud: {\n    cloudName: process.env.NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME\n  }\n});\n\nexport function cloudinaryLoader(options, cldOptions) {\n  const {\n    src,\n    width,\n    format = 'auto',\n    quality = 'auto',\n  } = options;\n\n  const {\n    overlays = [],\n    effects = [],\n    removeBackground = false,\n    underlays = []\n  } = cldOptions;\n\n  const cldImage = cld.image(src);\n\n  if ( removeBackground ) {\n    cldImage.effect('e_background_removal');\n  }\n\n  // Adding overlays and underlays allows you to compose your image\n  // by using layering with overlays appearing on top of and udnerlays\n  // appearing below your base image layer\n  //\n  // Learn more: https://cloudinary.com/documentation/layers\n\n  const layers = [\n    ...overlays.map(overlay => ({ ...overlay, type: 'overlay' })),\n    ...underlays.map(underlay => ({ ...underlay, type: 'underlay' })),\n  ];\n\n  layers.forEach(({ publicId, type, position, text, effects: layerEffects = [], ...options }) => {\n    const hasPublicId = typeof publicId === 'string';\n    const hasText = typeof text === 'object';\n    const hasPosition = typeof position === 'object';\n\n    if ( !hasPublicId && !hasText ) {\n      console.warn(`${type} is missing Public ID or Text`);\n      return;\n    }\n\n    // Determine the qualifier for the type of layer\n\n    let typeQualifier;\n\n    if ( type === 'overlay' ) {\n      typeQualifier = 'l';\n    } else if ( type === 'underlay' ) {\n      typeQualifier = 'u';\n    }\n\n    // Start to construct the transformation string using text or the public ID\n    // if it's image-based\n\n    let layerTransformation;\n\n    if ( hasText ) {\n      layerTransformation = `${typeQualifier}_text`;\n    } else {\n      layerTransformation = `${typeQualifier}_${publicId.replace(/\\//g, ':')}`;\n    }\n\n    // Begin organizing transformations based on what it is and the location\n    // it needs to be placed in the URL\n\n    const primary = [];\n    const applied = [];\n\n    // Gemeral options\n\n    Object.keys(options).forEach(key => {\n      if ( !qualifiersPrimary[key] ) return;\n      const { qualifier } = qualifiersPrimary[key];\n      primary.push(`${qualifier}_${options[key]}`);\n    });\n\n    // Layer effects\n\n    layerEffects.forEach(effect => {\n      Object.keys(effect).forEach(key => {\n        if ( !qualifiersPrimary[key] ) return;\n        const { qualifier } = qualifiersPrimary[key];\n        primary.push(`${qualifier}_${effect[key]}`);\n      });\n    });\n\n    // Text styling\n\n    if ( hasText ) {\n      const textTransformations = [];\n\n      Object.keys(text).forEach(key => {\n        if ( !qualifiersText[key] ) return;\n\n        const { qualifier, location } = qualifiersText[key];\n\n        if ( location === 'primary' ) {\n          primary.push(`${qualifier}_${text[key]}`);\n        } else {\n          textTransformations.push(text[key]);\n        }\n      });\n\n      layerTransformation = `${layerTransformation}:${textTransformations.join('_')}:${text.text}`\n    }\n\n    // Positioning\n\n    if ( hasPosition ) {\n      Object.keys(position).forEach(key => {\n        if ( !qualifiersPosition[key] ) return;\n\n        const { qualifier } = qualifiersPosition[key];\n\n        applied.push(`${qualifier}_${position[key]}`);\n      });\n    }\n\n    // Add all primary transformations\n\n    layerTransformation = `${layerTransformation},${primary.join(',')}`;\n\n    // Add all applied transformations\n\n    layerTransformation = `${layerTransformation}/fl_layer_apply`;\n\n    if ( applied.length > 0 ) {\n      layerTransformation = `${layerTransformation},${applied.join(',')}`;\n    }\n\n    // Finally add it to the image\n\n    cldImage.addTransformation(layerTransformation);\n  });\n\n  return cldImage.resize(`c_limit,w_${width}`).format(format).delivery(`q_${quality}`).toURL();\n}","\nimport Image from 'next/image';\n\nimport { cloudinaryLoader } from '../../loaders/cloudinary-loader';\n\nconst CldImage = ({ overlays, removeBackground, underlays, ...props }) => {\n  const cldOptions = {\n    overlays,\n    removeBackground,\n    underlays,\n  };\n  return <Image {...props} loader={(options) => cloudinaryLoader(options, cldOptions)} />\n}\n\nexport default CldImage;"],"names":["primary","gravity","qualifier","crop","width","height","position","x","y","text","color","location","fontFamily","fontSize","fontWeight","textDecoration","letterSpacing","cld","Cloudinary","cloud","cloudName","process","env","NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME","cloudinaryLoader","options","cldOptions","src","format","quality","overlays","removeBackground","underlays","cldImage","image","effect","layers","map","overlay","type","underlay","forEach","publicId","effects","layerEffects","_excluded","hasPublicId","hasText","hasPosition","console","warn","typeQualifier","layerTransformation","replace","applied","Object","keys","key","qualifiersPrimary","push","textTransformations","qualifiersText","join","qualifiersPosition","length","addTransformation","resize","delivery","toURL","CldImage","props","_jsx","Image"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAAO,IAAMA,OAAO,GAAG;AACrBC,EAAAA,OAAO,EAAE;AACPC,IAAAA,SAAS,EAAE,GAAA;GAFQ;AAIrBC,EAAAA,IAAI,EAAE;AACJD,IAAAA,SAAS,EAAE,GAAA;GALQ;AAOrBE,EAAAA,KAAK,EAAE;AACLF,IAAAA,SAAS,EAAE,GAAA;GARQ;AAUrBG,EAAAA,MAAM,EAAE;AACNH,IAAAA,SAAS,EAAE,GAAA;AADL,GAAA;AAVa,EAAhB;AAeA,IAAMI,QAAQ,GAAG;AACtBC,EAAAA,CAAC,EAAE;AACDL,IAAAA,SAAS,EAAE,GAAA;GAFS;AAItBM,EAAAA,CAAC,EAAE;AACDN,IAAAA,SAAS,EAAE,GAAA;GALS;AAOtBD,EAAAA,OAAO,EAAE;AACPC,IAAAA,SAAS,EAAE,GAAA;AADJ,GAAA;AAPa,EAAjB;AAYA,IAAMO,IAAI,GAAG;AAClBC,EAAAA,KAAK,EAAE;AACLR,IAAAA,SAAS,EAAE,IADN;AAELS,IAAAA,QAAQ,EAAE,SAAA;GAHM;AAKlBC,EAAAA,UAAU,EAAE,EALM;AAOlBC,EAAAA,QAAQ,EAAE,EAPQ;AASlBC,EAAAA,UAAU,EAAE,EATM;AAWlBC,EAAAA,cAAc,EAAE,EAXE;AAalBC,EAAAA,aAAa,EAAE;AACbd,IAAAA,SAAS,EAAE,gBAAA;AADE,GAAA;AAbG;;;ACnBpB,IAAMe,GAAG,GAAG,IAAIC,iBAAJ,CAAe;AACzBC,EAAAA,KAAK,EAAE;AACLC,IAAAA,SAAS,EAAEC,OAAO,CAACC,GAAR,CAAYC,iCAAAA;AADlB,GAAA;AADkB,CAAf,CAAZ,CAAA;AAMO,SAASC,gBAAT,CAA0BC,OAA1B,EAAmCC,UAAnC,EAA+C;AACpD,EAAA,IACEC,GADF,GAKIF,OALJ,CACEE,GADF;AAAA,MAEEvB,KAFF,GAKIqB,OALJ,CAEErB,KAFF;MAKIqB,eAAAA,GAAAA,OALJ,CAGEG,MAHF;MAGEA,MAHF,gCAGW,MAHX,GAAA,eAAA;MAKIH,gBAAAA,GAAAA,OALJ,CAIEI,OAJF;MAIEA,OAJF,iCAIY,MAJZ,GAAA,gBAAA,CAAA;EAYIH,IAAAA,oBAAAA,GAAAA,UALJ,CACEI,QADF,CAAA;MACEA,QADF,qCACa,EADb,GAAA,oBAAA,CAAA;MAKIJ,qBAAAA,GAAAA,UALJ,CAGEK,gBAHF,CAAA;MAGEA,gBAHF,sCAGqB,KAHrB,GAAA,qBAAA,CAAA;MAKIL,qBAAAA,GAAAA,UALJ,CAIEM,SAJF,CAAA;MAIEA,SAJF,sCAIc,EAJd,GAAA,sBAAA;AAOA,EAAA,IAAMC,QAAQ,GAAGhB,GAAG,CAACiB,KAAJ,CAAUP,GAAV,CAAjB,CAAA;;AAEA,EAAA,IAAKI,gBAAL,EAAwB;IACtBE,QAAQ,CAACE,MAAT,CAAgB,sBAAhB,CAAA,CAAA;AACD,GAnBmD;AAsBpD;AACA;AACA;AACA;;;AAEA,EAAA,IAAMC,MAAM,GACPN,EAAAA,CAAAA,MAAAA,CAAAA,QAAQ,CAACO,GAAT,CAAa,UAAAC,OAAO,EAAA;AAAA,IAAA,OAAA,QAAA,CAAA,EAAA,EAAUA,OAAV,EAAA;AAAmBC,MAAAA,IAAI,EAAE,SAAA;AAAzB,KAAA,CAAA,CAAA;AAAA,GAApB,CADO,EAEPP,SAAS,CAACK,GAAV,CAAc,UAAAG,QAAQ,EAAA;AAAA,IAAA,OAAA,QAAA,CAAA,EAAA,EAAUA,QAAV,EAAA;AAAoBD,MAAAA,IAAI,EAAE,UAAA;AAA1B,KAAA,CAAA,CAAA;AAAA,GAAtB,CAFO,CAAZ,CAAA;EAKAH,MAAM,CAACK,OAAP,CAAe,UAAgF,IAAA,EAAA;IAAA,IAA7EC,QAA6E,QAA7EA,QAA6E;QAAnEH,IAAmE,QAAnEA,IAAmE;QAA7DjC,UAA6D,QAA7DA,QAA6D;QAAnDG,MAAmD,QAAnDA,IAAmD;AAAA,QAAA,YAAA,GAAA,IAAA,CAA7CkC,OAA6C;QAApCC,YAAoC,6BAArB,EAAqB,GAAA,YAAA;AAAA,QAAdnB,OAAc,GAAA,6BAAA,CAAA,IAAA,EAAAoB,WAAA,CAAA,CAAA;;AAC7F,IAAA,IAAMC,WAAW,GAAG,OAAOJ,QAAP,KAAoB,QAAxC,CAAA;AACA,IAAA,IAAMK,OAAO,GAAG,OAAOtC,MAAP,KAAgB,QAAhC,CAAA;AACA,IAAA,IAAMuC,WAAW,GAAG,OAAO1C,UAAP,KAAoB,QAAxC,CAAA;;AAEA,IAAA,IAAK,CAACwC,WAAD,IAAgB,CAACC,OAAtB,EAAgC;MAC9BE,OAAO,CAACC,IAAR,CAAgBX,IAAhB,GAAA,+BAAA,CAAA,CAAA;AACA,MAAA,OAAA;AACD,KAR4F;;;AAY7F,IAAA,IAAIY,aAAJ,CAAA;;IAEA,IAAKZ,IAAI,KAAK,SAAd,EAA0B;AACxBY,MAAAA,aAAa,GAAG,GAAhB,CAAA;AACD,KAFD,MAEO,IAAKZ,IAAI,KAAK,UAAd,EAA2B;AAChCY,MAAAA,aAAa,GAAG,GAAhB,CAAA;AACD,KAlB4F;AAqB7F;;;AAEA,IAAA,IAAIC,mBAAJ,CAAA;;AAEA,IAAA,IAAKL,OAAL,EAAe;MACbK,mBAAmB,GAAMD,aAAN,GAAnB,OAAA,CAAA;AACD,KAFD,MAEO;MACLC,mBAAmB,GAAMD,aAAN,GAAA,GAAA,GAAuBT,QAAQ,CAACW,OAAT,CAAiB,KAAjB,EAAwB,GAAxB,CAA1C,CAAA;AACD,KA7B4F;AAgC7F;;;IAEA,IAAMrD,SAAO,GAAG,EAAhB,CAAA;AACA,IAAA,IAAMsD,OAAO,GAAG,EAAhB,CAnC6F;;IAuC7FC,MAAM,CAACC,IAAP,CAAY/B,OAAZ,EAAqBgB,OAArB,CAA6B,UAAAgB,GAAG,EAAI;AAClC,MAAA,IAAK,CAACC,OAAiB,CAACD,GAAD,CAAvB,EAA+B,OAAA;AAC/B,MAAA,IAAQvD,SAAR,GAAsBwD,OAAiB,CAACD,GAAD,CAAvC,CAAQvD,SAAR,CAAA;MACAF,SAAO,CAAC2D,IAAR,CAAgBzD,SAAhB,SAA6BuB,OAAO,CAACgC,GAAD,CAApC,CAAA,CAAA;AACD,KAJD,EAvC6F;;AA+C7Fb,IAAAA,YAAY,CAACH,OAAb,CAAqB,UAAAN,MAAM,EAAI;MAC7BoB,MAAM,CAACC,IAAP,CAAYrB,MAAZ,EAAoBM,OAApB,CAA4B,UAAAgB,GAAG,EAAI;AACjC,QAAA,IAAK,CAACC,OAAiB,CAACD,GAAD,CAAvB,EAA+B,OAAA;AAC/B,QAAA,IAAQvD,SAAR,GAAsBwD,OAAiB,CAACD,GAAD,CAAvC,CAAQvD,SAAR,CAAA;QACAF,SAAO,CAAC2D,IAAR,CAAgBzD,SAAhB,SAA6BiC,MAAM,CAACsB,GAAD,CAAnC,CAAA,CAAA;OAHF,CAAA,CAAA;AAKD,KAND,EA/C6F;;AAyD7F,IAAA,IAAKV,OAAL,EAAe;MACb,IAAMa,mBAAmB,GAAG,EAA5B,CAAA;MAEAL,MAAM,CAACC,IAAP,CAAY/C,MAAZ,EAAkBgC,OAAlB,CAA0B,UAAAgB,GAAG,EAAI;AAC/B,QAAA,IAAK,CAACI,IAAc,CAACJ,GAAD,CAApB,EAA4B,OAAA;QAE5B,IAAgCI,mBAAAA,GAAAA,IAAc,CAACJ,GAAD,CAA9C;YAAQvD,SAAR,uBAAQA,SAAR;YAAmBS,QAAnB,uBAAmBA,QAAnB,CAAA;;QAEA,IAAKA,QAAQ,KAAK,SAAlB,EAA8B;UAC5BX,SAAO,CAAC2D,IAAR,CAAgBzD,SAAhB,SAA6BO,MAAI,CAACgD,GAAD,CAAjC,CAAA,CAAA;AACD,SAFD,MAEO;AACLG,UAAAA,mBAAmB,CAACD,IAApB,CAAyBlD,MAAI,CAACgD,GAAD,CAA7B,CAAA,CAAA;AACD,SAAA;OATH,CAAA,CAAA;AAYAL,MAAAA,mBAAmB,GAAMA,mBAAN,GAA6BQ,GAAAA,GAAAA,mBAAmB,CAACE,IAApB,CAAyB,GAAzB,CAA7B,GAAA,GAAA,GAA8DrD,MAAI,CAACA,IAAtF,CAAA;AACD,KAzE4F;;;AA6E7F,IAAA,IAAKuC,WAAL,EAAmB;MACjBO,MAAM,CAACC,IAAP,CAAYlD,UAAZ,EAAsBmC,OAAtB,CAA8B,UAAAgB,GAAG,EAAI;AACnC,QAAA,IAAK,CAACM,QAAkB,CAACN,GAAD,CAAxB,EAAgC,OAAA;AAEhC,QAAA,IAAQvD,SAAR,GAAsB6D,QAAkB,CAACN,GAAD,CAAxC,CAAQvD,SAAR,CAAA;QAEAoD,OAAO,CAACK,IAAR,CAAgBzD,SAAhB,SAA6BI,UAAQ,CAACmD,GAAD,CAArC,CAAA,CAAA;OALF,CAAA,CAAA;AAOD,KArF4F;;;IAyF7FL,mBAAmB,GAAMA,mBAAN,GAAA,GAAA,GAA6BpD,SAAO,CAAC8D,IAAR,CAAa,GAAb,CAAhD,CAzF6F;;IA6F7FV,mBAAmB,GAAMA,mBAAN,GAAnB,iBAAA,CAAA;;AAEA,IAAA,IAAKE,OAAO,CAACU,MAAR,GAAiB,CAAtB,EAA0B;MACxBZ,mBAAmB,GAAMA,mBAAN,GAA6BE,GAAAA,GAAAA,OAAO,CAACQ,IAAR,CAAa,GAAb,CAAhD,CAAA;AACD,KAjG4F;;;IAqG7F7B,QAAQ,CAACgC,iBAAT,CAA2Bb,mBAA3B,CAAA,CAAA;GArGF,CAAA,CAAA;AAwGA,EAAA,OAAOnB,QAAQ,CAACiC,MAAT,CAAA,YAAA,GAA6B9D,KAA7B,CAAsCwB,CAAAA,MAAtC,CAA6CA,MAA7C,EAAqDuC,QAArD,CAAA,IAAA,GAAmEtC,OAAnE,CAAA,CAA8EuC,KAA9E,EAAP,CAAA;AACD;;;;AClJD,IAAMC,QAAQ,GAAG,SAAXA,QAAW,CAAyD,IAAA,EAAA;EAAA,IAAtDvC,QAAsD,QAAtDA,QAAsD;MAA5CC,gBAA4C,QAA5CA,gBAA4C;MAA1BC,SAA0B,QAA1BA,SAA0B;AAAA,MAAZsC,KAAY,GAAA,6BAAA,CAAA,IAAA,EAAA,SAAA,CAAA,CAAA;;AACxE,EAAA,IAAM5C,UAAU,GAAG;AACjBI,IAAAA,QAAQ,EAARA,QADiB;AAEjBC,IAAAA,gBAAgB,EAAhBA,gBAFiB;AAGjBC,IAAAA,SAAS,EAATA,SAAAA;GAHF,CAAA;EAKA,oBAAOuC,cAAA,CAACC,yBAAD,EAAA,QAAA,CAAA,EAAA,EAAWF,KAAX,EAAA;IAAkB,MAAM,EAAE,gBAAC7C,OAAD,EAAA;AAAA,MAAA,OAAaD,gBAAgB,CAACC,OAAD,EAAUC,UAAV,CAA7B,CAAA;AAAA,KAAA;GAAjC,CAAA,CAAA,CAAA;AACD;;;;;;;;"}

package/dist/next-cloudinary.modern.mjs

@@ -1,5 +1,5 @@
-import { Cloudinary } from '@cloudinary/url-gen';
 import Image from 'next/image';
+import { Cloudinary } from '@cloudinary/url-gen';
 import { jsx } from 'react/jsx-runtime';
 
 function _extends() {
@@ -34,13 +34,51 @@ function _objectWithoutPropertiesLoose(source, excluded) {
   return target;
 }
 
-const _excluded = ["effects", "removeBackground"];
+const primary = {
+  gravity: {
+    qualifier: 'g'
+  },
+  crop: {
+    qualifier: 'c'
+  },
+  width: {
+    qualifier: 'w'
+  },
+  height: {
+    qualifier: 'h'
+  }
+};
+const position = {
+  x: {
+    qualifier: 'x'
+  },
+  y: {
+    qualifier: 'y'
+  },
+  gravity: {
+    qualifier: 'g'
+  }
+};
+const text = {
+  color: {
+    qualifier: 'co',
+    location: 'primary'
+  },
+  fontFamily: {},
+  fontSize: {},
+  fontWeight: {},
+  textDecoration: {},
+  letterSpacing: {
+    qualifier: 'letter_spacing'
+  }
+};
+
+const _excluded$1 = ["publicId", "type", "position", "text", "effects"];
 const cld = new Cloudinary({
   cloud: {
     cloudName: process.env.NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME
   }
 });
-
 function cloudinaryLoader(options, cldOptions) {
   const {
     src,
@@ -49,34 +87,151 @@ function cloudinaryLoader(options, cldOptions) {
     quality = 'auto'
   } = options;
   const {
+    overlays = [],
     effects = [],
-    removeBackground = false
+    removeBackground = false,
+    underlays = []
   } = cldOptions;
   const cldImage = cld.image(src);
 
   if (removeBackground) {
     cldImage.effect('e_background_removal');
-  }
+  } // Adding overlays and underlays allows you to compose your image
+  // by using layering with overlays appearing on top of and udnerlays
+  // appearing below your base image layer
+  //
+  // Learn more: https://cloudinary.com/documentation/layers
+
+
+  const layers = [...overlays.map(overlay => _extends({}, overlay, {
+    type: 'overlay'
+  })), ...underlays.map(underlay => _extends({}, underlay, {
+    type: 'underlay'
+  }))];
+  layers.forEach(_ref => {
+    let {
+      publicId,
+      type,
+      position: position$1,
+      text: text$1,
+      effects: layerEffects = []
+    } = _ref,
+        options = _objectWithoutPropertiesLoose(_ref, _excluded$1);
+
+    const hasPublicId = typeof publicId === 'string';
+    const hasText = typeof text$1 === 'object';
+    const hasPosition = typeof position$1 === 'object';
+
+    if (!hasPublicId && !hasText) {
+      console.warn(`${type} is missing Public ID or Text`);
+      return;
+    } // Determine the qualifier for the type of layer
+
+
+    let typeQualifier;
+
+    if (type === 'overlay') {
+      typeQualifier = 'l';
+    } else if (type === 'underlay') {
+      typeQualifier = 'u';
+    } // Start to construct the transformation string using text or the public ID
+    // if it's image-based
 
-  effects.forEach(effect => cldImage.effect(effect));
+
+    let layerTransformation;
+
+    if (hasText) {
+      layerTransformation = `${typeQualifier}_text`;
+    } else {
+      layerTransformation = `${typeQualifier}_${publicId.replace(/\//g, ':')}`;
+    } // Begin organizing transformations based on what it is and the location
+    // it needs to be placed in the URL
+
+
+    const primary$1 = [];
+    const applied = []; // Gemeral options
+
+    Object.keys(options).forEach(key => {
+      if (!primary[key]) return;
+      const {
+        qualifier
+      } = primary[key];
+      primary$1.push(`${qualifier}_${options[key]}`);
+    }); // Layer effects
+
+    layerEffects.forEach(effect => {
+      Object.keys(effect).forEach(key => {
+        if (!primary[key]) return;
+        const {
+          qualifier
+        } = primary[key];
+        primary$1.push(`${qualifier}_${effect[key]}`);
+      });
+    }); // Text styling
+
+    if (hasText) {
+      const textTransformations = [];
+      Object.keys(text$1).forEach(key => {
+        if (!text[key]) return;
+        const {
+          qualifier,
+          location
+        } = text[key];
+
+        if (location === 'primary') {
+          primary$1.push(`${qualifier}_${text$1[key]}`);
+        } else {
+          textTransformations.push(text$1[key]);
+        }
+      });
+      layerTransformation = `${layerTransformation}:${textTransformations.join('_')}:${text$1.text}`;
+    } // Positioning
+
+
+    if (hasPosition) {
+      Object.keys(position$1).forEach(key => {
+        if (!position[key]) return;
+        const {
+          qualifier
+        } = position[key];
+        applied.push(`${qualifier}_${position$1[key]}`);
+      });
+    } // Add all primary transformations
+
+
+    layerTransformation = `${layerTransformation},${primary$1.join(',')}`; // Add all applied transformations
+
+    layerTransformation = `${layerTransformation}/fl_layer_apply`;
+
+    if (applied.length > 0) {
+      layerTransformation = `${layerTransformation},${applied.join(',')}`;
+    } // Finally add it to the image
+
+
+    cldImage.addTransformation(layerTransformation);
+  });
   return cldImage.resize(`c_limit,w_${width}`).format(format).delivery(`q_${quality}`).toURL();
 }
 
+const _excluded = ["overlays", "removeBackground", "underlays"];
+
 const CldImage = _ref => {
   let {
-    effects,
-    removeBackground
+    overlays,
+    removeBackground,
+    underlays
   } = _ref,
       props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   const cldOptions = {
-    effects,
-    removeBackground
+    overlays,
+    removeBackground,
+    underlays
   };
   return /*#__PURE__*/jsx(Image, _extends({}, props, {
     loader: options => cloudinaryLoader(options, cldOptions)
   }));
 };
 
-export { CldImage };
+export { CldImage, cloudinaryLoader, position, primary, text };
 //# sourceMappingURL=next-cloudinary.modern.mjs.map

package/dist/next-cloudinary.modern.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"next-cloudinary.modern.mjs","sources":["../src/components/CldImage/CldImage.js"],"sourcesContent":["import { Cloudinary } from '@cloudinary/url-gen';\nimport Image from 'next/image';\n\nconst cld = new Cloudinary({\n  cloud: {\n    cloudName: process.env.NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME\n  }\n});\n\nfunction cloudinaryLoader(options, cldOptions) {\n  const {\n    src,\n    width,\n    format = 'auto',\n    quality = 'auto'\n  } = options;\n\n  const {\n    effects = [],\n    removeBackground = false\n  } = cldOptions;\n\n  const cldImage = cld.image(src);\n\n  if ( removeBackground ) {\n    cldImage.effect('e_background_removal');\n  }\n\n  effects.forEach(effect => cldImage.effect(effect));\n\n  return cldImage.resize(`c_limit,w_${width}`).format(format).delivery(`q_${quality}`).toURL();\n}\n\nconst CldImage = ({ effects, removeBackground, ...props }) => {\n  const cldOptions = {\n    effects,\n    removeBackground\n  };\n  return <Image {...props} loader={(options) => cloudinaryLoader(options, cldOptions)} />\n}\n\nexport default CldImage;"],"names":["cld","Cloudinary","cloud","cloudName","process","env","NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME","cloudinaryLoader","options","cldOptions","src","width","format","quality","effects","removeBackground","cldImage","image","effect","forEach","resize","delivery","toURL","CldImage","props","_jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA,MAAMA,GAAG,GAAG,IAAIC,UAAJ,CAAe;AACzBC,EAAAA,KAAK,EAAE;AACLC,IAAAA,SAAS,EAAEC,OAAO,CAACC,GAAR,CAAYC,iCAAAA;AADlB,GAAA;AADkB,CAAf,CAAZ,CAAA;;AAMA,SAASC,gBAAT,CAA0BC,OAA1B,EAAmCC,UAAnC,EAA+C;EAC7C,MAAM;IACJC,GADI;IAEJC,KAFI;AAGJC,IAAAA,MAAM,GAAG,MAHL;AAIJC,IAAAA,OAAO,GAAG,MAAA;AAJN,GAAA,GAKFL,OALJ,CAAA;EAOA,MAAM;AACJM,IAAAA,OAAO,GAAG,EADN;AAEJC,IAAAA,gBAAgB,GAAG,KAAA;AAFf,GAAA,GAGFN,UAHJ,CAAA;AAKA,EAAA,MAAMO,QAAQ,GAAGhB,GAAG,CAACiB,KAAJ,CAAUP,GAAV,CAAjB,CAAA;;AAEA,EAAA,IAAKK,gBAAL,EAAwB;IACtBC,QAAQ,CAACE,MAAT,CAAgB,sBAAhB,CAAA,CAAA;AACD,GAAA;;EAEDJ,OAAO,CAACK,OAAR,CAAgBD,MAAM,IAAIF,QAAQ,CAACE,MAAT,CAAgBA,MAAhB,CAA1B,CAAA,CAAA;AAEA,EAAA,OAAOF,QAAQ,CAACI,MAAT,CAAiB,CAAYT,UAAAA,EAAAA,KAAM,EAAnC,CAAsCC,CAAAA,MAAtC,CAA6CA,MAA7C,CAAA,CAAqDS,QAArD,CAA+D,CAAA,EAAA,EAAIR,OAAQ,CAA3E,CAAA,CAAA,CAA8ES,KAA9E,EAAP,CAAA;AACD,CAAA;;AAEKC,MAAAA,QAAQ,GAAG,IAA6C,IAAA;EAAA,IAA5C;IAAET,OAAF;AAAWC,IAAAA,gBAAAA;GAAiC,GAAA,IAAA;AAAA,MAAZS,KAAY,GAAA,6BAAA,CAAA,IAAA,EAAA,SAAA,CAAA,CAAA;;AAC5D,EAAA,MAAMf,UAAU,GAAG;IACjBK,OADiB;AAEjBC,IAAAA,gBAAAA;GAFF,CAAA;EAIA,oBAAOU,GAAA,CAAC,KAAD,EAAA,QAAA,CAAA,EAAA,EAAWD,KAAX,EAAA;AAAkB,IAAA,MAAM,EAAGhB,OAAD,IAAaD,gBAAgB,CAACC,OAAD,EAAUC,UAAV,CAAA;GAA9D,CAAA,CAAA,CAAA;AACD;;;;"}
+{"version":3,"file":"next-cloudinary.modern.mjs","sources":["../src/constants/qualifiers.js","../src/loaders/cloudinary-loader.js","../src/components/CldImage/CldImage.js"],"sourcesContent":["export const primary = {\n  gravity: {\n    qualifier: 'g'\n  },\n  crop: {\n    qualifier: 'c'\n  },\n  width: {\n    qualifier: 'w'\n  },\n  height: {\n    qualifier: 'h'\n  }\n};\n\nexport const position = {\n  x: {\n    qualifier: 'x'\n  },\n  y: {\n    qualifier: 'y'\n  },\n  gravity: {\n    qualifier: 'g'\n  },\n}\n\nexport const text = {\n  color: {\n    qualifier: 'co',\n    location: 'primary'\n  },\n  fontFamily: {\n  },\n  fontSize: {\n  },\n  fontWeight: {\n  },\n  textDecoration: {\n  },\n  letterSpacing: {\n    qualifier: 'letter_spacing'\n  }\n}","import { Cloudinary } from '@cloudinary/url-gen';\n\nimport {\n  primary as qualifiersPrimary,\n  text as qualifiersText,\n  position as qualifiersPosition\n} from '../constants/qualifiers';\n\nconst cld = new Cloudinary({\n  cloud: {\n    cloudName: process.env.NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME\n  }\n});\n\nexport function cloudinaryLoader(options, cldOptions) {\n  const {\n    src,\n    width,\n    format = 'auto',\n    quality = 'auto',\n  } = options;\n\n  const {\n    overlays = [],\n    effects = [],\n    removeBackground = false,\n    underlays = []\n  } = cldOptions;\n\n  const cldImage = cld.image(src);\n\n  if ( removeBackground ) {\n    cldImage.effect('e_background_removal');\n  }\n\n  // Adding overlays and underlays allows you to compose your image\n  // by using layering with overlays appearing on top of and udnerlays\n  // appearing below your base image layer\n  //\n  // Learn more: https://cloudinary.com/documentation/layers\n\n  const layers = [\n    ...overlays.map(overlay => ({ ...overlay, type: 'overlay' })),\n    ...underlays.map(underlay => ({ ...underlay, type: 'underlay' })),\n  ];\n\n  layers.forEach(({ publicId, type, position, text, effects: layerEffects = [], ...options }) => {\n    const hasPublicId = typeof publicId === 'string';\n    const hasText = typeof text === 'object';\n    const hasPosition = typeof position === 'object';\n\n    if ( !hasPublicId && !hasText ) {\n      console.warn(`${type} is missing Public ID or Text`);\n      return;\n    }\n\n    // Determine the qualifier for the type of layer\n\n    let typeQualifier;\n\n    if ( type === 'overlay' ) {\n      typeQualifier = 'l';\n    } else if ( type === 'underlay' ) {\n      typeQualifier = 'u';\n    }\n\n    // Start to construct the transformation string using text or the public ID\n    // if it's image-based\n\n    let layerTransformation;\n\n    if ( hasText ) {\n      layerTransformation = `${typeQualifier}_text`;\n    } else {\n      layerTransformation = `${typeQualifier}_${publicId.replace(/\\//g, ':')}`;\n    }\n\n    // Begin organizing transformations based on what it is and the location\n    // it needs to be placed in the URL\n\n    const primary = [];\n    const applied = [];\n\n    // Gemeral options\n\n    Object.keys(options).forEach(key => {\n      if ( !qualifiersPrimary[key] ) return;\n      const { qualifier } = qualifiersPrimary[key];\n      primary.push(`${qualifier}_${options[key]}`);\n    });\n\n    // Layer effects\n\n    layerEffects.forEach(effect => {\n      Object.keys(effect).forEach(key => {\n        if ( !qualifiersPrimary[key] ) return;\n        const { qualifier } = qualifiersPrimary[key];\n        primary.push(`${qualifier}_${effect[key]}`);\n      });\n    });\n\n    // Text styling\n\n    if ( hasText ) {\n      const textTransformations = [];\n\n      Object.keys(text).forEach(key => {\n        if ( !qualifiersText[key] ) return;\n\n        const { qualifier, location } = qualifiersText[key];\n\n        if ( location === 'primary' ) {\n          primary.push(`${qualifier}_${text[key]}`);\n        } else {\n          textTransformations.push(text[key]);\n        }\n      });\n\n      layerTransformation = `${layerTransformation}:${textTransformations.join('_')}:${text.text}`\n    }\n\n    // Positioning\n\n    if ( hasPosition ) {\n      Object.keys(position).forEach(key => {\n        if ( !qualifiersPosition[key] ) return;\n\n        const { qualifier } = qualifiersPosition[key];\n\n        applied.push(`${qualifier}_${position[key]}`);\n      });\n    }\n\n    // Add all primary transformations\n\n    layerTransformation = `${layerTransformation},${primary.join(',')}`;\n\n    // Add all applied transformations\n\n    layerTransformation = `${layerTransformation}/fl_layer_apply`;\n\n    if ( applied.length > 0 ) {\n      layerTransformation = `${layerTransformation},${applied.join(',')}`;\n    }\n\n    // Finally add it to the image\n\n    cldImage.addTransformation(layerTransformation);\n  });\n\n  return cldImage.resize(`c_limit,w_${width}`).format(format).delivery(`q_${quality}`).toURL();\n}","\nimport Image from 'next/image';\n\nimport { cloudinaryLoader } from '../../loaders/cloudinary-loader';\n\nconst CldImage = ({ overlays, removeBackground, underlays, ...props }) => {\n  const cldOptions = {\n    overlays,\n    removeBackground,\n    underlays,\n  };\n  return <Image {...props} loader={(options) => cloudinaryLoader(options, cldOptions)} />\n}\n\nexport default CldImage;"],"names":["primary","gravity","qualifier","crop","width","height","position","x","y","text","color","location","fontFamily","fontSize","fontWeight","textDecoration","letterSpacing","cld","Cloudinary","cloud","cloudName","process","env","NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME","cloudinaryLoader","options","cldOptions","src","format","quality","overlays","effects","removeBackground","underlays","cldImage","image","effect","layers","map","overlay","type","underlay","forEach","publicId","layerEffects","_excluded","hasPublicId","hasText","hasPosition","console","warn","typeQualifier","layerTransformation","replace","applied","Object","keys","key","qualifiersPrimary","push","textTransformations","qualifiersText","join","qualifiersPosition","length","addTransformation","resize","delivery","toURL","CldImage","props","_jsx"],"mappings":"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"}

package/dist/next-cloudinary.module.js

@@ -1,5 +1,5 @@
-import { Cloudinary } from '@cloudinary/url-gen';
 import Image from 'next/image';
+import { Cloudinary } from '@cloudinary/url-gen';
 import { jsx } from 'react/jsx-runtime';
 
 function _extends() {
@@ -34,13 +34,51 @@ function _objectWithoutPropertiesLoose(source, excluded) {
   return target;
 }
 
-var _excluded = ["effects", "removeBackground"];
+var primary = {
+  gravity: {
+    qualifier: 'g'
+  },
+  crop: {
+    qualifier: 'c'
+  },
+  width: {
+    qualifier: 'w'
+  },
+  height: {
+    qualifier: 'h'
+  }
+};
+var position = {
+  x: {
+    qualifier: 'x'
+  },
+  y: {
+    qualifier: 'y'
+  },
+  gravity: {
+    qualifier: 'g'
+  }
+};
+var text = {
+  color: {
+    qualifier: 'co',
+    location: 'primary'
+  },
+  fontFamily: {},
+  fontSize: {},
+  fontWeight: {},
+  textDecoration: {},
+  letterSpacing: {
+    qualifier: 'letter_spacing'
+  }
+};
+
+var _excluded$1 = ["publicId", "type", "position", "text", "effects"];
 var cld = new Cloudinary({
   cloud: {
     cloudName: process.env.NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME
   }
 });
-
 function cloudinaryLoader(options, cldOptions) {
   var src = options.src,
       width = options.width,
@@ -48,30 +86,141 @@ function cloudinaryLoader(options, cldOptions) {
       format = _options$format === void 0 ? 'auto' : _options$format,
       _options$quality = options.quality,
       quality = _options$quality === void 0 ? 'auto' : _options$quality;
-  var _cldOptions$effects = cldOptions.effects,
-      effects = _cldOptions$effects === void 0 ? [] : _cldOptions$effects,
+  var _cldOptions$overlays = cldOptions.overlays,
+      overlays = _cldOptions$overlays === void 0 ? [] : _cldOptions$overlays,
       _cldOptions$removeBac = cldOptions.removeBackground,
-      removeBackground = _cldOptions$removeBac === void 0 ? false : _cldOptions$removeBac;
+      removeBackground = _cldOptions$removeBac === void 0 ? false : _cldOptions$removeBac,
+      _cldOptions$underlays = cldOptions.underlays,
+      underlays = _cldOptions$underlays === void 0 ? [] : _cldOptions$underlays;
   var cldImage = cld.image(src);
 
   if (removeBackground) {
     cldImage.effect('e_background_removal');
-  }
+  } // Adding overlays and underlays allows you to compose your image
+  // by using layering with overlays appearing on top of and udnerlays
+  // appearing below your base image layer
+  //
+  // Learn more: https://cloudinary.com/documentation/layers
+
+
+  var layers = [].concat(overlays.map(function (overlay) {
+    return _extends({}, overlay, {
+      type: 'overlay'
+    });
+  }), underlays.map(function (underlay) {
+    return _extends({}, underlay, {
+      type: 'underlay'
+    });
+  }));
+  layers.forEach(function (_ref) {
+    var publicId = _ref.publicId,
+        type = _ref.type,
+        position$1 = _ref.position,
+        text$1 = _ref.text,
+        _ref$effects = _ref.effects,
+        layerEffects = _ref$effects === void 0 ? [] : _ref$effects,
+        options = _objectWithoutPropertiesLoose(_ref, _excluded$1);
+
+    var hasPublicId = typeof publicId === 'string';
+    var hasText = typeof text$1 === 'object';
+    var hasPosition = typeof position$1 === 'object';
+
+    if (!hasPublicId && !hasText) {
+      console.warn(type + " is missing Public ID or Text");
+      return;
+    } // Determine the qualifier for the type of layer
+
+
+    var typeQualifier;
+
+    if (type === 'overlay') {
+      typeQualifier = 'l';
+    } else if (type === 'underlay') {
+      typeQualifier = 'u';
+    } // Start to construct the transformation string using text or the public ID
+    // if it's image-based
 
-  effects.forEach(function (effect) {
-    return cldImage.effect(effect);
+
+    var layerTransformation;
+
+    if (hasText) {
+      layerTransformation = typeQualifier + "_text";
+    } else {
+      layerTransformation = typeQualifier + "_" + publicId.replace(/\//g, ':');
+    } // Begin organizing transformations based on what it is and the location
+    // it needs to be placed in the URL
+
+
+    var primary$1 = [];
+    var applied = []; // Gemeral options
+
+    Object.keys(options).forEach(function (key) {
+      if (!primary[key]) return;
+      var qualifier = primary[key].qualifier;
+      primary$1.push(qualifier + "_" + options[key]);
+    }); // Layer effects
+
+    layerEffects.forEach(function (effect) {
+      Object.keys(effect).forEach(function (key) {
+        if (!primary[key]) return;
+        var qualifier = primary[key].qualifier;
+        primary$1.push(qualifier + "_" + effect[key]);
+      });
+    }); // Text styling
+
+    if (hasText) {
+      var textTransformations = [];
+      Object.keys(text$1).forEach(function (key) {
+        if (!text[key]) return;
+        var _qualifiersText$key = text[key],
+            qualifier = _qualifiersText$key.qualifier,
+            location = _qualifiersText$key.location;
+
+        if (location === 'primary') {
+          primary$1.push(qualifier + "_" + text$1[key]);
+        } else {
+          textTransformations.push(text$1[key]);
+        }
+      });
+      layerTransformation = layerTransformation + ":" + textTransformations.join('_') + ":" + text$1.text;
+    } // Positioning
+
+
+    if (hasPosition) {
+      Object.keys(position$1).forEach(function (key) {
+        if (!position[key]) return;
+        var qualifier = position[key].qualifier;
+        applied.push(qualifier + "_" + position$1[key]);
+      });
+    } // Add all primary transformations
+
+
+    layerTransformation = layerTransformation + "," + primary$1.join(','); // Add all applied transformations
+
+    layerTransformation = layerTransformation + "/fl_layer_apply";
+
+    if (applied.length > 0) {
+      layerTransformation = layerTransformation + "," + applied.join(',');
+    } // Finally add it to the image
+
+
+    cldImage.addTransformation(layerTransformation);
   });
   return cldImage.resize("c_limit,w_" + width).format(format).delivery("q_" + quality).toURL();
 }
 
+var _excluded = ["overlays", "removeBackground", "underlays"];
+
 var CldImage = function CldImage(_ref) {
-  var effects = _ref.effects,
+  var overlays = _ref.overlays,
       removeBackground = _ref.removeBackground,
+      underlays = _ref.underlays,
       props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
   var cldOptions = {
-    effects: effects,
-    removeBackground: removeBackground
+    overlays: overlays,
+    removeBackground: removeBackground,
+    underlays: underlays
   };
   return /*#__PURE__*/jsx(Image, _extends({}, props, {
     loader: function loader(options) {
@@ -80,5 +229,5 @@ var CldImage = function CldImage(_ref) {
   }));
 };
 
-export { CldImage };
+export { CldImage, cloudinaryLoader, position, primary, text };
 //# sourceMappingURL=next-cloudinary.module.js.map

package/dist/next-cloudinary.module.js.map

@@ -1 +1 @@
-{"version":3,"file":"next-cloudinary.module.js","sources":["../src/components/CldImage/CldImage.js"],"sourcesContent":["import { Cloudinary } from '@cloudinary/url-gen';\nimport Image from 'next/image';\n\nconst cld = new Cloudinary({\n  cloud: {\n    cloudName: process.env.NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME\n  }\n});\n\nfunction cloudinaryLoader(options, cldOptions) {\n  const {\n    src,\n    width,\n    format = 'auto',\n    quality = 'auto'\n  } = options;\n\n  const {\n    effects = [],\n    removeBackground = false\n  } = cldOptions;\n\n  const cldImage = cld.image(src);\n\n  if ( removeBackground ) {\n    cldImage.effect('e_background_removal');\n  }\n\n  effects.forEach(effect => cldImage.effect(effect));\n\n  return cldImage.resize(`c_limit,w_${width}`).format(format).delivery(`q_${quality}`).toURL();\n}\n\nconst CldImage = ({ effects, removeBackground, ...props }) => {\n  const cldOptions = {\n    effects,\n    removeBackground\n  };\n  return <Image {...props} loader={(options) => cloudinaryLoader(options, cldOptions)} />\n}\n\nexport default CldImage;"],"names":["cld","Cloudinary","cloud","cloudName","process","env","NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME","cloudinaryLoader","options","cldOptions","src","width","format","quality","effects","removeBackground","cldImage","image","effect","forEach","resize","delivery","toURL","CldImage","props","_jsx"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAGA,IAAMA,GAAG,GAAG,IAAIC,UAAJ,CAAe;AACzBC,EAAAA,KAAK,EAAE;AACLC,IAAAA,SAAS,EAAEC,OAAO,CAACC,GAAR,CAAYC,iCAAAA;AADlB,GAAA;AADkB,CAAf,CAAZ,CAAA;;AAMA,SAASC,gBAAT,CAA0BC,OAA1B,EAAmCC,UAAnC,EAA+C;AAC7C,EAAA,IACEC,GADF,GAKIF,OALJ,CACEE,GADF;AAAA,MAEEC,KAFF,GAKIH,OALJ,CAEEG,KAFF;MAKIH,eAAAA,GAAAA,OALJ,CAGEI,MAHF;MAGEA,MAHF,gCAGW,MAHX,GAAA,eAAA;MAKIJ,gBAAAA,GAAAA,OALJ,CAIEK,OAJF;MAIEA,OAJF,iCAIY,MAJZ,GAAA,gBAAA,CAAA;EAOA,IAGIJ,mBAAAA,GAAAA,UAHJ,CACEK,OADF;MACEA,OADF,oCACY,EADZ,GAAA,mBAAA;MAGIL,qBAAAA,GAAAA,UAHJ,CAEEM,gBAFF;MAEEA,gBAFF,sCAEqB,KAFrB,GAAA,qBAAA,CAAA;AAKA,EAAA,IAAMC,QAAQ,GAAGhB,GAAG,CAACiB,KAAJ,CAAUP,GAAV,CAAjB,CAAA;;AAEA,EAAA,IAAKK,gBAAL,EAAwB;IACtBC,QAAQ,CAACE,MAAT,CAAgB,sBAAhB,CAAA,CAAA;AACD,GAAA;;AAEDJ,EAAAA,OAAO,CAACK,OAAR,CAAgB,UAAAD,MAAM,EAAA;AAAA,IAAA,OAAIF,QAAQ,CAACE,MAAT,CAAgBA,MAAhB,CAAJ,CAAA;GAAtB,CAAA,CAAA;AAEA,EAAA,OAAOF,QAAQ,CAACI,MAAT,CAAA,YAAA,GAA6BT,KAA7B,CAAsCC,CAAAA,MAAtC,CAA6CA,MAA7C,EAAqDS,QAArD,CAAA,IAAA,GAAmER,OAAnE,CAAA,CAA8ES,KAA9E,EAAP,CAAA;AACD,CAAA;;AAED,IAAMC,QAAQ,GAAG,SAAXA,QAAW,CAA6C,IAAA,EAAA;EAAA,IAA1CT,OAA0C,QAA1CA,OAA0C;MAAjCC,gBAAiC,QAAjCA,gBAAiC;AAAA,MAAZS,KAAY,GAAA,6BAAA,CAAA,IAAA,EAAA,SAAA,CAAA,CAAA;;AAC5D,EAAA,IAAMf,UAAU,GAAG;AACjBK,IAAAA,OAAO,EAAPA,OADiB;AAEjBC,IAAAA,gBAAgB,EAAhBA,gBAAAA;GAFF,CAAA;EAIA,oBAAOU,GAAA,CAAC,KAAD,EAAA,QAAA,CAAA,EAAA,EAAWD,KAAX,EAAA;IAAkB,MAAM,EAAE,gBAAChB,OAAD,EAAA;AAAA,MAAA,OAAaD,gBAAgB,CAACC,OAAD,EAAUC,UAAV,CAA7B,CAAA;AAAA,KAAA;GAAjC,CAAA,CAAA,CAAA;AACD;;;;"}
+{"version":3,"file":"next-cloudinary.module.js","sources":["../src/constants/qualifiers.js","../src/loaders/cloudinary-loader.js","../src/components/CldImage/CldImage.js"],"sourcesContent":["export const primary = {\n  gravity: {\n    qualifier: 'g'\n  },\n  crop: {\n    qualifier: 'c'\n  },\n  width: {\n    qualifier: 'w'\n  },\n  height: {\n    qualifier: 'h'\n  }\n};\n\nexport const position = {\n  x: {\n    qualifier: 'x'\n  },\n  y: {\n    qualifier: 'y'\n  },\n  gravity: {\n    qualifier: 'g'\n  },\n}\n\nexport const text = {\n  color: {\n    qualifier: 'co',\n    location: 'primary'\n  },\n  fontFamily: {\n  },\n  fontSize: {\n  },\n  fontWeight: {\n  },\n  textDecoration: {\n  },\n  letterSpacing: {\n    qualifier: 'letter_spacing'\n  }\n}","import { Cloudinary } from '@cloudinary/url-gen';\n\nimport {\n  primary as qualifiersPrimary,\n  text as qualifiersText,\n  position as qualifiersPosition\n} from '../constants/qualifiers';\n\nconst cld = new Cloudinary({\n  cloud: {\n    cloudName: process.env.NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME\n  }\n});\n\nexport function cloudinaryLoader(options, cldOptions) {\n  const {\n    src,\n    width,\n    format = 'auto',\n    quality = 'auto',\n  } = options;\n\n  const {\n    overlays = [],\n    effects = [],\n    removeBackground = false,\n    underlays = []\n  } = cldOptions;\n\n  const cldImage = cld.image(src);\n\n  if ( removeBackground ) {\n    cldImage.effect('e_background_removal');\n  }\n\n  // Adding overlays and underlays allows you to compose your image\n  // by using layering with overlays appearing on top of and udnerlays\n  // appearing below your base image layer\n  //\n  // Learn more: https://cloudinary.com/documentation/layers\n\n  const layers = [\n    ...overlays.map(overlay => ({ ...overlay, type: 'overlay' })),\n    ...underlays.map(underlay => ({ ...underlay, type: 'underlay' })),\n  ];\n\n  layers.forEach(({ publicId, type, position, text, effects: layerEffects = [], ...options }) => {\n    const hasPublicId = typeof publicId === 'string';\n    const hasText = typeof text === 'object';\n    const hasPosition = typeof position === 'object';\n\n    if ( !hasPublicId && !hasText ) {\n      console.warn(`${type} is missing Public ID or Text`);\n      return;\n    }\n\n    // Determine the qualifier for the type of layer\n\n    let typeQualifier;\n\n    if ( type === 'overlay' ) {\n      typeQualifier = 'l';\n    } else if ( type === 'underlay' ) {\n      typeQualifier = 'u';\n    }\n\n    // Start to construct the transformation string using text or the public ID\n    // if it's image-based\n\n    let layerTransformation;\n\n    if ( hasText ) {\n      layerTransformation = `${typeQualifier}_text`;\n    } else {\n      layerTransformation = `${typeQualifier}_${publicId.replace(/\\//g, ':')}`;\n    }\n\n    // Begin organizing transformations based on what it is and the location\n    // it needs to be placed in the URL\n\n    const primary = [];\n    const applied = [];\n\n    // Gemeral options\n\n    Object.keys(options).forEach(key => {\n      if ( !qualifiersPrimary[key] ) return;\n      const { qualifier } = qualifiersPrimary[key];\n      primary.push(`${qualifier}_${options[key]}`);\n    });\n\n    // Layer effects\n\n    layerEffects.forEach(effect => {\n      Object.keys(effect).forEach(key => {\n        if ( !qualifiersPrimary[key] ) return;\n        const { qualifier } = qualifiersPrimary[key];\n        primary.push(`${qualifier}_${effect[key]}`);\n      });\n    });\n\n    // Text styling\n\n    if ( hasText ) {\n      const textTransformations = [];\n\n      Object.keys(text).forEach(key => {\n        if ( !qualifiersText[key] ) return;\n\n        const { qualifier, location } = qualifiersText[key];\n\n        if ( location === 'primary' ) {\n          primary.push(`${qualifier}_${text[key]}`);\n        } else {\n          textTransformations.push(text[key]);\n        }\n      });\n\n      layerTransformation = `${layerTransformation}:${textTransformations.join('_')}:${text.text}`\n    }\n\n    // Positioning\n\n    if ( hasPosition ) {\n      Object.keys(position).forEach(key => {\n        if ( !qualifiersPosition[key] ) return;\n\n        const { qualifier } = qualifiersPosition[key];\n\n        applied.push(`${qualifier}_${position[key]}`);\n      });\n    }\n\n    // Add all primary transformations\n\n    layerTransformation = `${layerTransformation},${primary.join(',')}`;\n\n    // Add all applied transformations\n\n    layerTransformation = `${layerTransformation}/fl_layer_apply`;\n\n    if ( applied.length > 0 ) {\n      layerTransformation = `${layerTransformation},${applied.join(',')}`;\n    }\n\n    // Finally add it to the image\n\n    cldImage.addTransformation(layerTransformation);\n  });\n\n  return cldImage.resize(`c_limit,w_${width}`).format(format).delivery(`q_${quality}`).toURL();\n}","\nimport Image from 'next/image';\n\nimport { cloudinaryLoader } from '../../loaders/cloudinary-loader';\n\nconst CldImage = ({ overlays, removeBackground, underlays, ...props }) => {\n  const cldOptions = {\n    overlays,\n    removeBackground,\n    underlays,\n  };\n  return <Image {...props} loader={(options) => cloudinaryLoader(options, cldOptions)} />\n}\n\nexport default CldImage;"],"names":["primary","gravity","qualifier","crop","width","height","position","x","y","text","color","location","fontFamily","fontSize","fontWeight","textDecoration","letterSpacing","cld","Cloudinary","cloud","cloudName","process","env","NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME","cloudinaryLoader","options","cldOptions","src","format","quality","overlays","removeBackground","underlays","cldImage","image","effect","layers","map","overlay","type","underlay","forEach","publicId","effects","layerEffects","_excluded","hasPublicId","hasText","hasPosition","console","warn","typeQualifier","layerTransformation","replace","applied","Object","keys","key","qualifiersPrimary","push","textTransformations","qualifiersText","join","qualifiersPosition","length","addTransformation","resize","delivery","toURL","CldImage","props","_jsx"],"mappings":"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"}

package/dist/next-cloudinary.umd.js

@@ -1,8 +1,8 @@
 (function (global, factory) {
-  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('@cloudinary/url-gen'), require('next/image'), require('react/jsx-runtime')) :
-  typeof define === 'function' && define.amd ? define(['exports', '@cloudinary/url-gen', 'next/image', 'react/jsx-runtime'], factory) :
-  (global = global || self, factory(global.nextCloudinary = {}, global.urlGen, global.Image, global.jsxRuntime));
-})(this, (function (exports, urlGen, Image, jsxRuntime) {
+  typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('next/image'), require('@cloudinary/url-gen'), require('react/jsx-runtime')) :
+  typeof define === 'function' && define.amd ? define(['exports', 'next/image', '@cloudinary/url-gen', 'react/jsx-runtime'], factory) :
+  (global = global || self, factory(global.nextCloudinary = {}, global.Image, global.urlGen, global.jsxRuntime));
+})(this, (function (exports, Image, urlGen, jsxRuntime) {
   function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
 
   var Image__default = /*#__PURE__*/_interopDefaultLegacy(Image);
@@ -39,13 +39,51 @@
     return target;
   }
 
-  var _excluded = ["effects", "removeBackground"];
+  var primary = {
+    gravity: {
+      qualifier: 'g'
+    },
+    crop: {
+      qualifier: 'c'
+    },
+    width: {
+      qualifier: 'w'
+    },
+    height: {
+      qualifier: 'h'
+    }
+  };
+  var position = {
+    x: {
+      qualifier: 'x'
+    },
+    y: {
+      qualifier: 'y'
+    },
+    gravity: {
+      qualifier: 'g'
+    }
+  };
+  var text = {
+    color: {
+      qualifier: 'co',
+      location: 'primary'
+    },
+    fontFamily: {},
+    fontSize: {},
+    fontWeight: {},
+    textDecoration: {},
+    letterSpacing: {
+      qualifier: 'letter_spacing'
+    }
+  };
+
+  var _excluded$1 = ["publicId", "type", "position", "text", "effects"];
   var cld = new urlGen.Cloudinary({
     cloud: {
       cloudName: process.env.NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME
     }
   });
-
   function cloudinaryLoader(options, cldOptions) {
     var src = options.src,
         width = options.width,
@@ -53,30 +91,141 @@
         format = _options$format === void 0 ? 'auto' : _options$format,
         _options$quality = options.quality,
         quality = _options$quality === void 0 ? 'auto' : _options$quality;
-    var _cldOptions$effects = cldOptions.effects,
-        effects = _cldOptions$effects === void 0 ? [] : _cldOptions$effects,
+    var _cldOptions$overlays = cldOptions.overlays,
+        overlays = _cldOptions$overlays === void 0 ? [] : _cldOptions$overlays,
         _cldOptions$removeBac = cldOptions.removeBackground,
-        removeBackground = _cldOptions$removeBac === void 0 ? false : _cldOptions$removeBac;
+        removeBackground = _cldOptions$removeBac === void 0 ? false : _cldOptions$removeBac,
+        _cldOptions$underlays = cldOptions.underlays,
+        underlays = _cldOptions$underlays === void 0 ? [] : _cldOptions$underlays;
     var cldImage = cld.image(src);
 
     if (removeBackground) {
       cldImage.effect('e_background_removal');
-    }
+    } // Adding overlays and underlays allows you to compose your image
+    // by using layering with overlays appearing on top of and udnerlays
+    // appearing below your base image layer
+    //
+    // Learn more: https://cloudinary.com/documentation/layers
+
+
+    var layers = [].concat(overlays.map(function (overlay) {
+      return _extends({}, overlay, {
+        type: 'overlay'
+      });
+    }), underlays.map(function (underlay) {
+      return _extends({}, underlay, {
+        type: 'underlay'
+      });
+    }));
+    layers.forEach(function (_ref) {
+      var publicId = _ref.publicId,
+          type = _ref.type,
+          position$1 = _ref.position,
+          text$1 = _ref.text,
+          _ref$effects = _ref.effects,
+          layerEffects = _ref$effects === void 0 ? [] : _ref$effects,
+          options = _objectWithoutPropertiesLoose(_ref, _excluded$1);
+
+      var hasPublicId = typeof publicId === 'string';
+      var hasText = typeof text$1 === 'object';
+      var hasPosition = typeof position$1 === 'object';
+
+      if (!hasPublicId && !hasText) {
+        console.warn(type + " is missing Public ID or Text");
+        return;
+      } // Determine the qualifier for the type of layer
+
+
+      var typeQualifier;
+
+      if (type === 'overlay') {
+        typeQualifier = 'l';
+      } else if (type === 'underlay') {
+        typeQualifier = 'u';
+      } // Start to construct the transformation string using text or the public ID
+      // if it's image-based
+
 
-    effects.forEach(function (effect) {
-      return cldImage.effect(effect);
+      var layerTransformation;
+
+      if (hasText) {
+        layerTransformation = typeQualifier + "_text";
+      } else {
+        layerTransformation = typeQualifier + "_" + publicId.replace(/\//g, ':');
+      } // Begin organizing transformations based on what it is and the location
+      // it needs to be placed in the URL
+
+
+      var primary$1 = [];
+      var applied = []; // Gemeral options
+
+      Object.keys(options).forEach(function (key) {
+        if (!primary[key]) return;
+        var qualifier = primary[key].qualifier;
+        primary$1.push(qualifier + "_" + options[key]);
+      }); // Layer effects
+
+      layerEffects.forEach(function (effect) {
+        Object.keys(effect).forEach(function (key) {
+          if (!primary[key]) return;
+          var qualifier = primary[key].qualifier;
+          primary$1.push(qualifier + "_" + effect[key]);
+        });
+      }); // Text styling
+
+      if (hasText) {
+        var textTransformations = [];
+        Object.keys(text$1).forEach(function (key) {
+          if (!text[key]) return;
+          var _qualifiersText$key = text[key],
+              qualifier = _qualifiersText$key.qualifier,
+              location = _qualifiersText$key.location;
+
+          if (location === 'primary') {
+            primary$1.push(qualifier + "_" + text$1[key]);
+          } else {
+            textTransformations.push(text$1[key]);
+          }
+        });
+        layerTransformation = layerTransformation + ":" + textTransformations.join('_') + ":" + text$1.text;
+      } // Positioning
+
+
+      if (hasPosition) {
+        Object.keys(position$1).forEach(function (key) {
+          if (!position[key]) return;
+          var qualifier = position[key].qualifier;
+          applied.push(qualifier + "_" + position$1[key]);
+        });
+      } // Add all primary transformations
+
+
+      layerTransformation = layerTransformation + "," + primary$1.join(','); // Add all applied transformations
+
+      layerTransformation = layerTransformation + "/fl_layer_apply";
+
+      if (applied.length > 0) {
+        layerTransformation = layerTransformation + "," + applied.join(',');
+      } // Finally add it to the image
+
+
+      cldImage.addTransformation(layerTransformation);
     });
     return cldImage.resize("c_limit,w_" + width).format(format).delivery("q_" + quality).toURL();
   }
 
+  var _excluded = ["overlays", "removeBackground", "underlays"];
+
   var CldImage = function CldImage(_ref) {
-    var effects = _ref.effects,
+    var overlays = _ref.overlays,
         removeBackground = _ref.removeBackground,
+        underlays = _ref.underlays,
         props = _objectWithoutPropertiesLoose(_ref, _excluded);
 
     var cldOptions = {
-      effects: effects,
-      removeBackground: removeBackground
+      overlays: overlays,
+      removeBackground: removeBackground,
+      underlays: underlays
     };
     return /*#__PURE__*/jsxRuntime.jsx(Image__default["default"], _extends({}, props, {
       loader: function loader(options) {
@@ -86,6 +235,10 @@
   };
 
   exports.CldImage = CldImage;
+  exports.cloudinaryLoader = cloudinaryLoader;
+  exports.position = position;
+  exports.primary = primary;
+  exports.text = text;
 
 }));
 //# sourceMappingURL=next-cloudinary.umd.js.map

package/dist/next-cloudinary.umd.js.map

@@ -1 +1 @@
-{"version":3,"file":"next-cloudinary.umd.js","sources":["../src/components/CldImage/CldImage.js"],"sourcesContent":["import { Cloudinary } from '@cloudinary/url-gen';\nimport Image from 'next/image';\n\nconst cld = new Cloudinary({\n  cloud: {\n    cloudName: process.env.NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME\n  }\n});\n\nfunction cloudinaryLoader(options, cldOptions) {\n  const {\n    src,\n    width,\n    format = 'auto',\n    quality = 'auto'\n  } = options;\n\n  const {\n    effects = [],\n    removeBackground = false\n  } = cldOptions;\n\n  const cldImage = cld.image(src);\n\n  if ( removeBackground ) {\n    cldImage.effect('e_background_removal');\n  }\n\n  effects.forEach(effect => cldImage.effect(effect));\n\n  return cldImage.resize(`c_limit,w_${width}`).format(format).delivery(`q_${quality}`).toURL();\n}\n\nconst CldImage = ({ effects, removeBackground, ...props }) => {\n  const cldOptions = {\n    effects,\n    removeBackground\n  };\n  return <Image {...props} loader={(options) => cloudinaryLoader(options, cldOptions)} />\n}\n\nexport default CldImage;"],"names":["cld","Cloudinary","cloud","cloudName","process","env","NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME","cloudinaryLoader","options","cldOptions","src","width","format","quality","effects","removeBackground","cldImage","image","effect","forEach","resize","delivery","toURL","CldImage","props","_jsx","Image"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;EAGA,IAAMA,GAAG,GAAG,IAAIC,iBAAJ,CAAe;EACzBC,EAAAA,KAAK,EAAE;EACLC,IAAAA,SAAS,EAAEC,OAAO,CAACC,GAAR,CAAYC,iCAAAA;EADlB,GAAA;EADkB,CAAf,CAAZ,CAAA;;EAMA,SAASC,gBAAT,CAA0BC,OAA1B,EAAmCC,UAAnC,EAA+C;EAC7C,EAAA,IACEC,GADF,GAKIF,OALJ,CACEE,GADF;EAAA,MAEEC,KAFF,GAKIH,OALJ,CAEEG,KAFF;QAKIH,eAAAA,GAAAA,OALJ,CAGEI,MAHF;QAGEA,MAHF,gCAGW,MAHX,GAAA,eAAA;QAKIJ,gBAAAA,GAAAA,OALJ,CAIEK,OAJF;QAIEA,OAJF,iCAIY,MAJZ,GAAA,gBAAA,CAAA;IAOA,IAGIJ,mBAAAA,GAAAA,UAHJ,CACEK,OADF;QACEA,OADF,oCACY,EADZ,GAAA,mBAAA;QAGIL,qBAAAA,GAAAA,UAHJ,CAEEM,gBAFF;QAEEA,gBAFF,sCAEqB,KAFrB,GAAA,qBAAA,CAAA;EAKA,EAAA,IAAMC,QAAQ,GAAGhB,GAAG,CAACiB,KAAJ,CAAUP,GAAV,CAAjB,CAAA;;EAEA,EAAA,IAAKK,gBAAL,EAAwB;MACtBC,QAAQ,CAACE,MAAT,CAAgB,sBAAhB,CAAA,CAAA;EACD,GAAA;;EAEDJ,EAAAA,OAAO,CAACK,OAAR,CAAgB,UAAAD,MAAM,EAAA;EAAA,IAAA,OAAIF,QAAQ,CAACE,MAAT,CAAgBA,MAAhB,CAAJ,CAAA;KAAtB,CAAA,CAAA;EAEA,EAAA,OAAOF,QAAQ,CAACI,MAAT,CAAA,YAAA,GAA6BT,KAA7B,CAAsCC,CAAAA,MAAtC,CAA6CA,MAA7C,EAAqDS,QAArD,CAAA,IAAA,GAAmER,OAAnE,CAAA,CAA8ES,KAA9E,EAAP,CAAA;EACD,CAAA;;AAED,MAAMC,QAAQ,GAAG,SAAXA,QAAW,CAA6C,IAAA,EAAA;IAAA,IAA1CT,OAA0C,QAA1CA,OAA0C;QAAjCC,gBAAiC,QAAjCA,gBAAiC;EAAA,MAAZS,KAAY,GAAA,6BAAA,CAAA,IAAA,EAAA,SAAA,CAAA,CAAA;;EAC5D,EAAA,IAAMf,UAAU,GAAG;EACjBK,IAAAA,OAAO,EAAPA,OADiB;EAEjBC,IAAAA,gBAAgB,EAAhBA,gBAAAA;KAFF,CAAA;IAIA,oBAAOU,cAAA,CAACC,yBAAD,EAAA,QAAA,CAAA,EAAA,EAAWF,KAAX,EAAA;MAAkB,MAAM,EAAE,gBAAChB,OAAD,EAAA;EAAA,MAAA,OAAaD,gBAAgB,CAACC,OAAD,EAAUC,UAAV,CAA7B,CAAA;EAAA,KAAA;KAAjC,CAAA,CAAA,CAAA;EACD;;;;;;;;"}
+{"version":3,"file":"next-cloudinary.umd.js","sources":["../src/constants/qualifiers.js","../src/loaders/cloudinary-loader.js","../src/components/CldImage/CldImage.js"],"sourcesContent":["export const primary = {\n  gravity: {\n    qualifier: 'g'\n  },\n  crop: {\n    qualifier: 'c'\n  },\n  width: {\n    qualifier: 'w'\n  },\n  height: {\n    qualifier: 'h'\n  }\n};\n\nexport const position = {\n  x: {\n    qualifier: 'x'\n  },\n  y: {\n    qualifier: 'y'\n  },\n  gravity: {\n    qualifier: 'g'\n  },\n}\n\nexport const text = {\n  color: {\n    qualifier: 'co',\n    location: 'primary'\n  },\n  fontFamily: {\n  },\n  fontSize: {\n  },\n  fontWeight: {\n  },\n  textDecoration: {\n  },\n  letterSpacing: {\n    qualifier: 'letter_spacing'\n  }\n}","import { Cloudinary } from '@cloudinary/url-gen';\n\nimport {\n  primary as qualifiersPrimary,\n  text as qualifiersText,\n  position as qualifiersPosition\n} from '../constants/qualifiers';\n\nconst cld = new Cloudinary({\n  cloud: {\n    cloudName: process.env.NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME\n  }\n});\n\nexport function cloudinaryLoader(options, cldOptions) {\n  const {\n    src,\n    width,\n    format = 'auto',\n    quality = 'auto',\n  } = options;\n\n  const {\n    overlays = [],\n    effects = [],\n    removeBackground = false,\n    underlays = []\n  } = cldOptions;\n\n  const cldImage = cld.image(src);\n\n  if ( removeBackground ) {\n    cldImage.effect('e_background_removal');\n  }\n\n  // Adding overlays and underlays allows you to compose your image\n  // by using layering with overlays appearing on top of and udnerlays\n  // appearing below your base image layer\n  //\n  // Learn more: https://cloudinary.com/documentation/layers\n\n  const layers = [\n    ...overlays.map(overlay => ({ ...overlay, type: 'overlay' })),\n    ...underlays.map(underlay => ({ ...underlay, type: 'underlay' })),\n  ];\n\n  layers.forEach(({ publicId, type, position, text, effects: layerEffects = [], ...options }) => {\n    const hasPublicId = typeof publicId === 'string';\n    const hasText = typeof text === 'object';\n    const hasPosition = typeof position === 'object';\n\n    if ( !hasPublicId && !hasText ) {\n      console.warn(`${type} is missing Public ID or Text`);\n      return;\n    }\n\n    // Determine the qualifier for the type of layer\n\n    let typeQualifier;\n\n    if ( type === 'overlay' ) {\n      typeQualifier = 'l';\n    } else if ( type === 'underlay' ) {\n      typeQualifier = 'u';\n    }\n\n    // Start to construct the transformation string using text or the public ID\n    // if it's image-based\n\n    let layerTransformation;\n\n    if ( hasText ) {\n      layerTransformation = `${typeQualifier}_text`;\n    } else {\n      layerTransformation = `${typeQualifier}_${publicId.replace(/\\//g, ':')}`;\n    }\n\n    // Begin organizing transformations based on what it is and the location\n    // it needs to be placed in the URL\n\n    const primary = [];\n    const applied = [];\n\n    // Gemeral options\n\n    Object.keys(options).forEach(key => {\n      if ( !qualifiersPrimary[key] ) return;\n      const { qualifier } = qualifiersPrimary[key];\n      primary.push(`${qualifier}_${options[key]}`);\n    });\n\n    // Layer effects\n\n    layerEffects.forEach(effect => {\n      Object.keys(effect).forEach(key => {\n        if ( !qualifiersPrimary[key] ) return;\n        const { qualifier } = qualifiersPrimary[key];\n        primary.push(`${qualifier}_${effect[key]}`);\n      });\n    });\n\n    // Text styling\n\n    if ( hasText ) {\n      const textTransformations = [];\n\n      Object.keys(text).forEach(key => {\n        if ( !qualifiersText[key] ) return;\n\n        const { qualifier, location } = qualifiersText[key];\n\n        if ( location === 'primary' ) {\n          primary.push(`${qualifier}_${text[key]}`);\n        } else {\n          textTransformations.push(text[key]);\n        }\n      });\n\n      layerTransformation = `${layerTransformation}:${textTransformations.join('_')}:${text.text}`\n    }\n\n    // Positioning\n\n    if ( hasPosition ) {\n      Object.keys(position).forEach(key => {\n        if ( !qualifiersPosition[key] ) return;\n\n        const { qualifier } = qualifiersPosition[key];\n\n        applied.push(`${qualifier}_${position[key]}`);\n      });\n    }\n\n    // Add all primary transformations\n\n    layerTransformation = `${layerTransformation},${primary.join(',')}`;\n\n    // Add all applied transformations\n\n    layerTransformation = `${layerTransformation}/fl_layer_apply`;\n\n    if ( applied.length > 0 ) {\n      layerTransformation = `${layerTransformation},${applied.join(',')}`;\n    }\n\n    // Finally add it to the image\n\n    cldImage.addTransformation(layerTransformation);\n  });\n\n  return cldImage.resize(`c_limit,w_${width}`).format(format).delivery(`q_${quality}`).toURL();\n}","\nimport Image from 'next/image';\n\nimport { cloudinaryLoader } from '../../loaders/cloudinary-loader';\n\nconst CldImage = ({ overlays, removeBackground, underlays, ...props }) => {\n  const cldOptions = {\n    overlays,\n    removeBackground,\n    underlays,\n  };\n  return <Image {...props} loader={(options) => cloudinaryLoader(options, cldOptions)} />\n}\n\nexport default CldImage;"],"names":["primary","gravity","qualifier","crop","width","height","position","x","y","text","color","location","fontFamily","fontSize","fontWeight","textDecoration","letterSpacing","cld","Cloudinary","cloud","cloudName","process","env","NEXT_PUBLIC_CLOUDINARY_CLOUD_NAME","cloudinaryLoader","options","cldOptions","src","format","quality","overlays","removeBackground","underlays","cldImage","image","effect","layers","map","overlay","type","underlay","forEach","publicId","effects","layerEffects","_excluded","hasPublicId","hasText","hasPosition","console","warn","typeQualifier","layerTransformation","replace","applied","Object","keys","key","qualifiersPrimary","push","textTransformations","qualifiersText","join","qualifiersPosition","length","addTransformation","resize","delivery","toURL","CldImage","props","_jsx","Image"],"mappings":"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"}

package/package.json

@@ -1,12 +1,13 @@
 {
   "name": "next-cloudinary",
-  "version": "0.0.1",
+  "version": "0.0.2",
   "main": "dist/next-cloudinary.umd.js",
   "module": "dist/next-cloudinary.module.js",
   "umd:main": "dist/next-cloudinary.umd.js",
   "source": "src/index.js",
   "scripts": {
-    "build": "microbundle --no-compress --jsx React.createElement --jsxFragment React.Fragment --jsxImportSource react"
+    "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"
   },
   "dependencies": {
     "@cloudinary/url-gen": "^1.8.5"