[FEATURE] Add simple way to enable/disable layout fill

packages/sdk/src/controllers/ClipboardController.ts

@@ -63,7 +63,7 @@ export class ClipboardController {
         const result = await res.pasteFrames(clipboardData);
 
         return getEditorResponseData<null>(result);
-    }
+    };
 
     /**
      * This method will get the content type of the OS clipboard
@@ -76,7 +76,5 @@ export class ClipboardController {
         const result = await res.getClipboardContentType(clipboardData);
 
         return getEditorResponseData<ClipboardContentType>(result);
-    }
+    };
 }
-
-

packages/sdk/src/controllers/FrameController.ts

@@ -393,7 +393,6 @@ export class FrameController {
         return res.duplicateFrames(ids).then((result) => getEditorResponseData<Id>(result));
     };
 
-
     /**
      * This method sets or removes the image source to the ImageFrame
      * @param imageFrameId the id of the imageFrame where an image needs to be assigned to

packages/sdk/src/controllers/LayoutController.ts

@@ -219,26 +219,38 @@ export class LayoutController {
 
     /**
      * This method sets the fill color of a specific layout.
-     * Note: Depending on the layout intent, some colors might not be valid (eg opacity for digitalAnimated, any color for print) 
-     * 
+     * Note: Depending on the layout intent, some colors might not be valid (eg opacity for digitalAnimated, any color for print)
+     *
      * @param id the id of a specific layout
      * @param color the color that will be used for the layout
      */
     setFillColor = async (id: Id, color: ColorUsage) => {
         const res = await this.#editorAPI;
         return res.setLayoutFillColor(id, JSON.stringify(color)).then((result) => getEditorResponseData<null>(result));
-    }
+    };
+
+    /**
+     * This is a convenience method to enable or disable the fill color of a specific layout.
+     * Note: Depending on the layout intent, disabling might not be valid (eg disabling for digitalAnimated)
+     *
+     * @param id the id of a specific layout
+     * @param enabled  whether the fill color should be enabled or disabled
+     */
+    setFillColorEnabled = async (id: Id, enabled: boolean) => {
+        const res = await this.#editorAPI;
+        return res.setLayoutFillColorEnabled(id, enabled).then((result) => getEditorResponseData<null>(result));
+    };
 
     /**
      * This method resets the fill color of a specific layout to its original (inherited) value.
      * Note: Calling this on the top layout is not valid
-     * 
+     *
      * @param id The id of the (child) layout to reset the fill color for
      */
     resetFillColor = async (id: Id) => {
         const res = await this.#editorAPI;
         return res.resetLayoutFillColor(id).then((result) => getEditorResponseData<null>(result));
-    }
+    };
 
     /**
      * This method sets the bleed value of a specific layout.

packages/sdk/src/tests/controllers/ClipboardController.test.ts

@@ -6,7 +6,7 @@ describe('ClipboardController', () => {
     let mockedClipboardController: ClipboardController;
 
     const clipboardValue = 'a json string frame';
-    const writeText = jest.fn().mockResolvedValue('');;
+    const writeText = jest.fn().mockResolvedValue('');
     const readText = jest.fn().mockResolvedValue(clipboardValue);
 
     Object.assign(navigator, {
@@ -23,7 +23,6 @@ describe('ClipboardController', () => {
         getClipboardContentType: async () => getEditorResponseData(castToEditorResponse(null)),
     };
 
-
     beforeEach(() => {
         mockedClipboardController = new ClipboardController(mockEditorApi);
         jest.spyOn(mockEditorApi, 'copyFrames');

packages/sdk/src/tests/controllers/LayoutController.test.ts

@@ -29,6 +29,7 @@ const mockedEditorApi: EditorAPI = {
     setLayoutIntent: async () => getEditorResponseData(castToEditorResponse(null)),
     resetLayoutIntent: async () => getEditorResponseData(castToEditorResponse(null)),
     setLayoutFillColor: async () => getEditorResponseData(castToEditorResponse(null)),
+    setLayoutFillColorEnabled: async () => getEditorResponseData(castToEditorResponse(null)),
     resetLayoutFillColor: async () => getEditorResponseData(castToEditorResponse(null)),
     updateLayoutBleed: async () => getEditorResponseData(castToEditorResponse(null)),
 };
@@ -56,6 +57,7 @@ beforeEach(() => {
     jest.spyOn(mockedEditorApi, 'resetLayoutIntent');
     jest.spyOn(mockedEditorApi, 'setLayoutFillColor');
     jest.spyOn(mockedEditorApi, 'resetLayoutFillColor');
+    jest.spyOn(mockedEditorApi, 'setLayoutFillColorEnabled');
     jest.spyOn(mockedEditorApi, 'updateLayoutBleed');
 
     mockId = mockSelectPage.layoutId;
@@ -171,6 +173,14 @@ describe('LayoutController', () => {
         await mockedLayoutController.resetFillColor('1');
         expect(mockedEditorApi.resetLayoutFillColor).toHaveBeenCalledTimes(1);
     });
+    it('Should be possible to set the layout fill color to disabled', async () => {
+        await mockedLayoutController.setFillColorEnabled('1', false);
+        expect(mockedEditorApi.setLayoutFillColorEnabled).toHaveBeenCalledTimes(1);
+    });
+    it('Should be possible to set the layout fill color to enabled', async () => {
+        await mockedLayoutController.setFillColorEnabled('1', true);
+        expect(mockedEditorApi.setLayoutFillColorEnabled).toHaveBeenCalledTimes(1);
+    });
     describe('bleed', () => {
         it('Should be possible set the combined bleed value', async () => {
             await mockedLayoutController.setBleedValue('1', '5');

packages/sdk/src/types/ClipboardTypes.ts

@@ -1,4 +1,4 @@
 export enum ClipboardContentType {
     frame = 'frame',
-    unknown = 'unknown'
+    unknown = 'unknown',
 }

packages/sdk/src/types/LayoutTypes.ts

@@ -49,6 +49,7 @@ export type Layout = {
     intent: PropertyState<LayoutIntent>;
     bleed: PropertyState<LayoutBleed>;
     fillColor: PropertyState<ColorUsage>;
+    fillColorEnabled: PropertyState<ColorUsage>;
 };
 
 // used by onLayoutsChanged