support raw transformation string

Author: manu4543

README.md

@@ -173,6 +173,8 @@ https://ik.imagekit.io/your_imagekit_id/tr:h-300,w-400/default-image.jpg?v=123&i
 
 See the complete list of transformations supported in ImageKit [here](https://docs.imagekit.io/features/image-transformations). The SDK gives a name to each transformation parameter e.g. `height` for `h` and `width` for `w` parameter. It makes your code more readable. If the property does not match any of the following supported options, it is added as it is.
 
+If you want to generate transformations in your application and add them to the URL as it is, use the `raw` parameter.
+
 | Supported Transformation Name | Translates to parameter |
 |-------------------------------|-------------------------|
 | height | h |
@@ -232,6 +234,7 @@ See the complete list of transformations supported in ImageKit [here](https://do
 | effectContrast | e-contrast |
 | effectGray | e-grayscale |
 | original | orig |
+| raw | `replaced by the parameter value` |
 
 
 

libs/url/builder.ts

@@ -12,7 +12,7 @@ import transformationUtils from "../../utils/transformation";
 import urlFormatter from "../../utils/urlFormatter";
 
 /*
-	Interfaces
+  Interfaces
 */
 import { FinalUrlOptions, Transformation } from "../interfaces";
 
@@ -129,6 +129,8 @@ function constructTransformationString(transformation: Array<Transformation> | u
 
       if (transformation[i][key] === "-") {
         parsedTransformStep.push(transformKey);
+      } else if (key === "raw") {
+        parsedTransformStep.push(transformation[i][key]);
       } else {
         var value = String(transformation[i][key]);
         if (transformKey === "oi" || transformKey === "di") {

tests/url-generation.js

@@ -298,11 +298,12 @@ describe("URL generation", function () {
                 effectContrast: true,
                 effectGray: true,
                 original: true,
+                raw: "h-200,w-300,l-image,i-logo.png,l-end",
                 overlayImageFocus: "face"
             }]
         })
 
-        expect(url).equal(`https://ik.imagekit.io/test_url_endpoint/tr:h-300,w-400,ar-4-3,q-40,c-force,cm-extract,fo-left,f-jpeg,r-50,bg-A94D34,b-5-A94D34,rt-90,bl-10,n-some_name,ox-35,oy-35,ofo-bottom,oh-20,ow-20,oi-folder@@file.jpg,oit-false,oiar-4:3,oibg-0F0F0F,oib-10_0F0F0F,oidpr-2,oiq-50,oic-force,ot-two words,ots-20,otf-Open Sans,otc-00FFFF,oa-5,ott-b,obg-00AAFF55,ote-b3ZlcmxheSBtYWRlIGVhc3k%3D,otw-50,otbg-00AAFF55,otp-40,otia-left,or-10,pr-true,lo-true,t-5,md-true,cp-true,di-folder@@file.jpg,dpr-3,e-sharpen-10,e-usm-2-2-0.8-0.024,e-contrast-true,e-grayscale-true,orig-true,oifo-face/test_path.jpg`);
+        expect(url).equal(`https://ik.imagekit.io/test_url_endpoint/tr:h-300,w-400,ar-4-3,q-40,c-force,cm-extract,fo-left,f-jpeg,r-50,bg-A94D34,b-5-A94D34,rt-90,bl-10,n-some_name,ox-35,oy-35,ofo-bottom,oh-20,ow-20,oi-folder@@file.jpg,oit-false,oiar-4:3,oibg-0F0F0F,oib-10_0F0F0F,oidpr-2,oiq-50,oic-force,ot-two words,ots-20,otf-Open Sans,otc-00FFFF,oa-5,ott-b,obg-00AAFF55,ote-b3ZlcmxheSBtYWRlIGVhc3k%3D,otw-50,otbg-00AAFF55,otp-40,otia-left,or-10,pr-true,lo-true,t-5,md-true,cp-true,di-folder@@file.jpg,dpr-3,e-sharpen-10,e-usm-2-2-0.8-0.024,e-contrast-true,e-grayscale-true,orig-true,h-200,w-300,l-image,i-logo.png,l-end,oifo-face/test_path.jpg`);
     });
 });