Merge pull request #236 from cloudinary-community/b_gen_fill-seed

feat: add seed parameter for b_gen_fill

Author: eportis-cloudinary

packages/url-loader/src/plugins/fill-background.ts

@@ -21,6 +21,7 @@ export declare namespace FillBackgroundPlugin {
     crop?: CropMode;
     gravity?: Gravity;
     prompt?: ListablePrompts;
+    seed?: number;
   }
 }
 
@@ -64,16 +65,26 @@ export const FillBackgroundPlugin = /* #__PURE__ */ plugin({
 
       cldAsset.addTransformation(properties.join(","));
     } else if (typeof fillBackground === "object") {
-      const { crop = defaultCrop, gravity, prompt } = fillBackground;
+      const { crop = defaultCrop, gravity, prompt, seed } = fillBackground;
 
-      const properties = [`ar_${aspectRatio}`, `c_${crop}`];
+      const bGenFillProperties = [];
 
       if (typeof prompt === "string") {
-        properties.unshift(`b_gen_fill:${prompt}`);
-      } else {
-        properties.unshift(`b_gen_fill`);
+        bGenFillProperties.push(`prompt_${prompt}`);
       }
 
+      if (typeof seed === "number") {
+        bGenFillProperties.push(`seed_${seed}`);
+      }
+
+      const bGenFill = ( 
+        bGenFillProperties.length > 0 
+        ? `b_gen_fill:${bGenFillProperties.join(';')}`
+        : "b_gen_fill"
+      );
+
+      const properties = [ bGenFill, `ar_${aspectRatio}`, `c_${crop}`];
+
       if (typeof gravity === "string") {
         properties.push(`g_${gravity}`);
       }

packages/url-loader/tests/plugins/fill-background.spec.ts

@@ -41,13 +41,54 @@ describe("Plugins", () => {
           gravity: "east",
           prompt: "pink and purple flowers",
           crop: "mpad",
+          seed: 3
         },
       } as const;
 
       FillBackgroundPlugin.apply(cldImage, options);
 
       expect(cldImage.toURL()).toContain(
-        `b_gen_fill:${encodeURIComponent(options.fillBackground.prompt)},ar_${options.width}:${options.height},c_${options.fillBackground.crop},g_${options.fillBackground.gravity}/${TEST_PUBLIC_ID}`,
+        `b_gen_fill:prompt_${encodeURIComponent(options.fillBackground.prompt)};seed_3,ar_${options.width}:${options.height},c_${options.fillBackground.crop},g_${options.fillBackground.gravity}/${TEST_PUBLIC_ID}`,
+      );
+    });
+
+    it("should generate with just a seed but no prompt", () => {
+      const cldImage = cld.image(TEST_PUBLIC_ID);
+
+      const options = {
+        src: TEST_PUBLIC_ID,
+        width: 800,
+        height: 600,
+        fillBackground: {
+          crop: 'pad',
+          seed: 3
+        },
+      } as const;
+
+      FillBackgroundPlugin.apply(cldImage, options);
+
+      expect(cldImage.toURL()).toContain(
+        `b_gen_fill:seed_3,ar_${options.width}:${options.height},c_${options.fillBackground.crop}/${TEST_PUBLIC_ID}`,
+      );
+    });
+
+    it("should generate with just a prompt but no seed", () => {
+      const cldImage = cld.image(TEST_PUBLIC_ID);
+
+      const options = {
+        src: TEST_PUBLIC_ID,
+        width: 800,
+        height: 600,
+        fillBackground: {
+          crop: 'pad',
+          prompt: 'a herd of llamas'
+        },
+      } as const;
+
+      FillBackgroundPlugin.apply(cldImage, options);
+
+      expect(cldImage.toURL()).toContain(
+        `b_gen_fill:prompt_${encodeURIComponent(options.fillBackground.prompt)},ar_${options.width}:${options.height},c_${options.fillBackground.crop}/${TEST_PUBLIC_ID}`,
       );
     });