@frontify/guideline-blocks-settings 0.33.4 → 0.34.0

package/src/helpers/mapColorPalettes.ts

@@ -1,65 +0,0 @@
-/* (c) Copyright Frontify Ltd., all rights reserved. */
-
-import { ColorPalette } from '@frontify/app-bridge';
-import { Palette } from '@frontify/fondue';
-
-type Nullable<T> = T | null;
-
-type V3Color = {
-    id: number;
-    name: Nullable<string>;
-    red: Nullable<number>;
-    green: Nullable<number>;
-    blue: Nullable<number>;
-    alpha: Nullable<number>;
-};
-
-type V4Color = {
-    id: number;
-    title: Nullable<string>;
-    revision: {
-        rgba: {
-            red: Nullable<number>;
-            green: Nullable<number>;
-            blue: Nullable<number>;
-            alpha: Nullable<number>;
-        };
-    };
-};
-
-type Color = V3Color | V4Color;
-
-export const mapAppBridgeColorPalettesToFonduePalettes = (colorPalettes: ColorPalette[]): Palette[] => {
-    return colorPalettes.map(mapAppBridgeColorPaletteToFonduePalette);
-};
-export const mapAppBridgeColorPaletteToFonduePalette = (colorPalette: ColorPalette): Palette => {
-    return {
-        id: colorPalette.id,
-        title: colorPalette.name,
-        colors: colorPalette.colors.map(mapColor),
-    };
-};
-
-const isV4Color = (color: Color): color is V4Color => {
-    return 'revision' in color;
-};
-
-const mapColor = (color: Color) => {
-    if (isV4Color(color)) {
-        const { title, revision } = color;
-        return {
-            alpha: revision.rgba.alpha ? revision.rgba.alpha / 255 : 1,
-            red: revision.rgba.red ?? 0,
-            green: revision.rgba.green ?? 0,
-            blue: revision.rgba.blue ?? 0,
-            name: title ?? '',
-        };
-    }
-    return {
-        alpha: color.alpha ? color.alpha / 255 : 1,
-        red: color.red ?? 0,
-        green: color.green ?? 0,
-        blue: color.blue ?? 0,
-        name: color.name ?? '',
-    };
-};

package/src/hooks/index.ts

@@ -1,4 +0,0 @@
-/* (c) Copyright Frontify Ltd., all rights reserved. */
-
-export * from './useAttachments';
-export * from './useDndSensors';

package/src/hooks/useAttachments.spec.tsx

@@ -1,127 +0,0 @@
-/* (c) Copyright Frontify Ltd., all rights reserved. */
-
-import { AssetDummy, getAppBridgeBlockStub } from '@frontify/app-bridge';
-import { render, renderHook, waitFor } from '@testing-library/react';
-import { describe, expect, it } from 'vitest';
-
-import { AttachmentsProvider, useAttachments, useAttachmentsContext, withAttachmentsProvider } from './useAttachments';
-
-const MOCK_SETTINGS_ID = 'attachments';
-
-describe('useAttachments', async () => {
-    it('should have 1 attachment if attachment is added', async () => {
-        const STUB_WITH_NO_ASSETS = getAppBridgeBlockStub({
-            blockId: 1,
-            blockAssets: { [MOCK_SETTINGS_ID]: [] },
-        });
-        const { result } = renderHook(() => useAttachments(STUB_WITH_NO_ASSETS, MOCK_SETTINGS_ID));
-
-        await result.current.onAttachmentsAdd([AssetDummy.with(1)]);
-        await waitFor(() => {
-            expect(result.current.attachments).toHaveLength(1);
-        });
-    });
-
-    it('should decrease the attachment count from 3 to 2', async () => {
-        const STUB_WITH_THREE_ASSETS = getAppBridgeBlockStub({
-            blockId: 2,
-            blockAssets: { [MOCK_SETTINGS_ID]: [AssetDummy.with(1), AssetDummy.with(2), AssetDummy.with(3)] },
-            editorState: true,
-        });
-        const { result } = renderHook(() => useAttachments(STUB_WITH_THREE_ASSETS, MOCK_SETTINGS_ID));
-
-        const initialValue = result.current;
-        await waitFor(() => {
-            expect(result.current).not.toBe(initialValue);
-        });
-        await result.current.onAttachmentDelete(AssetDummy.with(1));
-        await waitFor(() => {
-            expect(result.current.attachments).toHaveLength(2);
-        });
-    });
-
-    it('should replace the attachment in the same position', async () => {
-        const STUB_WITH_THREE_ASSETS = getAppBridgeBlockStub({
-            blockId: 2,
-            blockAssets: { [MOCK_SETTINGS_ID]: [AssetDummy.with(1), AssetDummy.with(2), AssetDummy.with(3)] },
-        });
-        const { result } = renderHook(() => useAttachments(STUB_WITH_THREE_ASSETS, MOCK_SETTINGS_ID));
-        const initialValue = result.current;
-        await waitFor(() => {
-            expect(result.current).not.toBe(initialValue);
-        });
-        await result.current.onAttachmentReplace(AssetDummy.with(2), AssetDummy.with(10));
-        await waitFor(() => {
-            expect(result.current.attachments[1].id).toBe(10);
-        });
-    });
-
-    it('should reorder the attachments', async () => {
-        const STUB_WITH_THREE_ASSETS = getAppBridgeBlockStub({
-            blockId: 2,
-            blockAssets: { [MOCK_SETTINGS_ID]: [AssetDummy.with(1), AssetDummy.with(2), AssetDummy.with(3)] },
-        });
-        const { result } = renderHook(() => useAttachments(STUB_WITH_THREE_ASSETS, MOCK_SETTINGS_ID));
-        const initialValue = result.current;
-        await waitFor(() => {
-            expect(result.current).not.toBe(initialValue);
-        });
-        await result.current.onAttachmentsSorted([AssetDummy.with(3), AssetDummy.with(2), AssetDummy.with(1)]);
-        await waitFor(() => {
-            expect(result.current.attachments[0].id).toBe(3);
-            expect(result.current.attachments[1].id).toBe(2);
-            expect(result.current.attachments[2].id).toBe(1);
-        });
-    });
-});
-
-describe('useAttachmentsContext', () => {
-    it('should throw an error when not a child of a provider', async () => {
-        expect(() => renderHook(() => useAttachmentsContext())).toThrowError();
-    });
-
-    it('should return correct info', async () => {
-        const STUB_WITH_NO_ASSETS = getAppBridgeBlockStub({
-            blockId: 1,
-            blockAssets: { [MOCK_SETTINGS_ID]: [AssetDummy.with(1)] },
-        });
-        const { result } = renderHook(useAttachmentsContext, {
-            wrapper: ({ children }) => (
-                <AttachmentsProvider appBridge={STUB_WITH_NO_ASSETS} assetId={MOCK_SETTINGS_ID}>
-                    {children}
-                </AttachmentsProvider>
-            ),
-        });
-
-        expect(result.current.appBridge).toEqual(STUB_WITH_NO_ASSETS);
-        await waitFor(() => {
-            expect(result.current.attachments).toHaveLength(1);
-        });
-    });
-});
-
-describe('withAttachmentsProvider', () => {
-    it('should provide correct info to context consumer', async () => {
-        const STUB_WITH_THREE_ASSETS = getAppBridgeBlockStub({
-            blockId: 2,
-            blockAssets: { [MOCK_SETTINGS_ID]: [AssetDummy.with(1), AssetDummy.with(2), AssetDummy.with(3)] },
-        });
-
-        const Component = withAttachmentsProvider(() => {
-            const context = useAttachmentsContext();
-            return (
-                <ul>
-                    {context.attachments.map((attachment) => (
-                        <li key={attachment.id} data-test-id="item-test">
-                            {attachment.id}
-                        </li>
-                    ))}
-                </ul>
-            );
-        }, MOCK_SETTINGS_ID);
-
-        const { getAllByTestId } = render(<Component appBridge={STUB_WITH_THREE_ASSETS} />);
-
-        await waitFor(() => expect(getAllByTestId('item-test')).toHaveLength(3));
-    });
-});

package/src/hooks/useAttachments.tsx

@@ -1,90 +0,0 @@
-/* (c) Copyright Frontify Ltd., all rights reserved. */
-
-import { AppBridgeBlock, Asset, useBlockAssets } from '@frontify/app-bridge';
-import { type ReactNode, createContext, useContext } from 'react';
-
-import { type BlockProps } from '../index';
-
-export const useAttachments = (appBridge: AppBridgeBlock, attachmentKey: string) => {
-    const { blockAssets, addAssetIdsToKey, deleteAssetIdsFromKey, updateAssetIdsFromKey } = useBlockAssets(appBridge);
-    const attachments = blockAssets?.[attachmentKey] || [];
-
-    const onAttachmentsAdd = async (newAssets: Asset[]) => {
-        await addAssetIdsToKey(
-            attachmentKey,
-            newAssets.map((asset) => asset.id),
-        );
-    };
-
-    const onAttachmentDelete = async (assetToDelete: Asset) => {
-        await deleteAssetIdsFromKey(attachmentKey, [assetToDelete.id]);
-    };
-
-    const onAttachmentReplace = async (attachmentToReplace: Asset, newAsset: Asset) => {
-        const newAssetIds = attachments.map((attachment) =>
-            attachment.id === attachmentToReplace.id ? newAsset.id : attachment.id,
-        );
-
-        await updateAssetIdsFromKey(attachmentKey, newAssetIds);
-    };
-
-    const onAttachmentsSorted = async (assets: Asset[]) => {
-        const newAssetIds = assets.map((asset) => asset.id);
-
-        await updateAssetIdsFromKey(attachmentKey, newAssetIds);
-    };
-
-    return {
-        onAttachmentsAdd,
-        onAttachmentDelete,
-        onAttachmentReplace,
-        onAttachmentsSorted,
-        attachments,
-        appBridge,
-    };
-};
-
-const AttachmentsContext = createContext<ReturnType<typeof useAttachments> | null>(null);
-
-export const AttachmentsProvider = ({
-    appBridge,
-    children,
-    assetId,
-}: {
-    appBridge: AppBridgeBlock;
-    children: ReactNode;
-    assetId: string;
-}) => {
-    const attachmentContext = useAttachments(appBridge, assetId);
-
-    return <AttachmentsContext.Provider value={attachmentContext}>{children}</AttachmentsContext.Provider>;
-};
-
-export const useAttachmentsContext = () => {
-    const context = useContext(AttachmentsContext);
-
-    if (!context) {
-        throw new Error(
-            "No AttachmentsContext Provided. Component must be wrapped in an 'AttachmentsProvider' or the 'withAttachmentsProvider' HOC",
-        );
-    }
-
-    return context;
-};
-
-/**
- * Block-level HOC for cases when there is only one attachment asset field related to the block.
- * Recommended for most cases.
- * If finer control is required over attachments, use {@link AttachmentsProvider} component.
- */
-export const withAttachmentsProvider = <T extends BlockProps>(Component: (props: T) => ReactNode, assetId: string) => {
-    const wrappedComponent = (props: T) => (
-        <AttachmentsProvider appBridge={props.appBridge} assetId={assetId}>
-            <Component {...props} />
-        </AttachmentsProvider>
-    );
-
-    wrappedComponent.displayName = 'withAttachmentsProvider';
-
-    return wrappedComponent;
-};

package/src/hooks/useDndSensors.spec.ts

@@ -1,40 +0,0 @@
-/* (c) Copyright Frontify Ltd., all rights reserved. */
-
-import { renderHook } from '@testing-library/react';
-import { useDndSensors } from './useDndSensors';
-import { describe, expect, it } from 'vitest';
-import { KeyboardSensorOptions } from '@dnd-kit/core';
-
-/**
- * @vitest-environment happy-dom
- */
-describe('useDndSensors', () => {
-    it('should create a PointerSensor and a KeyboardSensor with a coordinate getter function and custom keyboardCodes', () => {
-        const { result } = renderHook(() => useDndSensors());
-        expect(result.current.length).toBe(2);
-        expect(result.current[0].sensor.name).toBe('PointerSensor');
-        expect(result.current[1].sensor.name).toBe('KeyboardSensor');
-        expect(typeof (result.current[1].options as KeyboardSensorOptions).coordinateGetter).toBe('function');
-        expect((result.current[1].options as KeyboardSensorOptions).keyboardCodes).toEqual({
-            start: ['Space', 'Enter'],
-            cancel: [],
-            end: ['Space', 'Enter', 'Escape'],
-        });
-    });
-
-    it('should create a PointerSensor and a KeyboardSensor with a coordinate getter with columnGap', () => {
-        const { result } = renderHook(() => useDndSensors(100));
-        expect(result.current.length).toBe(2);
-        expect(result.current[0].sensor.name).toBe('PointerSensor');
-        expect(result.current[1].sensor.name).toBe('KeyboardSensor');
-        expect(typeof (result.current[1].options as KeyboardSensorOptions).coordinateGetter).toBe('function');
-    });
-
-    it('should create a PointerSensor and a KeyboardSensor with a coordinate getter with columnGap and rowGap', () => {
-        const { result } = renderHook(() => useDndSensors(100, 150));
-        expect(result.current.length).toBe(2);
-        expect(result.current[0].sensor.name).toBe('PointerSensor');
-        expect(result.current[1].sensor.name).toBe('KeyboardSensor');
-        expect(typeof (result.current[1].options as KeyboardSensorOptions).coordinateGetter).toBe('function');
-    });
-});

package/src/hooks/useDndSensors.ts

@@ -1,23 +0,0 @@
-/* (c) Copyright Frontify Ltd., all rights reserved. */
-
-import { KeyboardSensor, PointerSensor, useSensor, useSensors } from '@dnd-kit/core';
-import { customCoordinatesGetterFactory } from '../helpers/customCoordinatesGetterFactory';
-
-const keyboardCodes = {
-    start: ['Space', 'Enter'],
-    cancel: [],
-    end: ['Space', 'Enter', 'Escape'],
-};
-
-export const useDndSensors = (columnGap = 0, rowGap = 0) => {
-    const customCoordinatesGetter = customCoordinatesGetterFactory(columnGap, rowGap);
-    const sensors = useSensors(
-        useSensor(PointerSensor),
-        useSensor(KeyboardSensor, {
-            coordinateGetter: customCoordinatesGetter,
-            keyboardCodes,
-        }),
-    );
-
-    return sensors;
-};

package/src/index.ts

@@ -1,138 +0,0 @@
-/* (c) Copyright Frontify Ltd., all rights reserved. */
-
-import './styles.css';
-
-import type { FC } from 'react';
-import type { AppBridgeBlock } from '@frontify/app-bridge';
-import type {
-    AssetInputBlock as AssetInputBlockSidebarSettings,
-    BaseBlock as BaseBlockSidebarSettings,
-    Bundle as BundleSidebarSettings,
-    ChecklistBlock as ChecklistBlockSidebarSettings,
-    ChoicesType as ChoicesTypeSidebarSettings,
-    ColorInputBlock as ColorInputBlockSidebarSettings,
-    DropdownBlock as DropdownBlockSidebarSettings,
-    DynamicSettingBlock as DynamicSettingBlockSidebarSettings,
-    DynamicSupportedBlock as DynamicSupportedBlockSidebarSettings,
-    FontInputBlock as FontInputBlockSidebarSettings,
-    InputBlock as InputBlockSidebarSettings,
-    LegacyAssetInputBlock as LegacyAssetInputBlockSidebarSettings,
-    LinkBlock as LinkBlockSidebarSettings,
-    LinkChooserBlock as LinkChooserBlockSidebarSettings,
-    MultiInputBlock as MultiInputBlockSidebarSettings,
-    NotificationBlock as NotificationBlockSidebarSettings,
-    SectionHeadingBlock as SectionHeadingBlockSidebarSettings,
-    SegmentedControlsBlock as SegmentedControlsBlockSidebarSettings,
-    SettingBlock as SettingBlockSidebarSettings,
-    SimpleSettingBlock as SimpleSettingBlockSidebarSettings,
-    SwitchBlock as SwitchBlockSidebarSettings,
-    TemplateInputBlock as TemplateInputBlockSidebarSettings,
-    TextareaBlock as TextareaBlockSidebarSettings,
-    ValueOrPromisedValue as ValueOrPromisedValueSidebarSettings,
-} from '@frontify/sidebar-settings';
-
-export * from '@frontify/sidebar-settings';
-
-export type AssetInputBlock = AssetInputBlockSidebarSettings<AppBridgeBlock>;
-export type BaseBlock<T = undefined> = BaseBlockSidebarSettings<AppBridgeBlock, T>;
-export type Bundle = BundleSidebarSettings<AppBridgeBlock>;
-export type ChecklistBlock = ChecklistBlockSidebarSettings<AppBridgeBlock>;
-export type ChoicesType = ChoicesTypeSidebarSettings<AppBridgeBlock>;
-export type ColorInputBlock = ColorInputBlockSidebarSettings<AppBridgeBlock>;
-export type DropdownBlock = DropdownBlockSidebarSettings<AppBridgeBlock>;
-export type DynamicSettingBlock<Block extends DynamicSupportedBlock = DynamicSupportedBlock> =
-    DynamicSettingBlockSidebarSettings<AppBridgeBlock, Block>;
-export type DynamicSupportedBlock = DynamicSupportedBlockSidebarSettings<AppBridgeBlock>;
-export type FontInputBlock = FontInputBlockSidebarSettings<AppBridgeBlock>;
-export type InputBlock = InputBlockSidebarSettings<AppBridgeBlock>;
-export type LegacyAssetInputBlock = LegacyAssetInputBlockSidebarSettings<AppBridgeBlock>;
-export type LinkBlock = LinkBlockSidebarSettings<AppBridgeBlock>;
-export type LinkChooserBlock = LinkChooserBlockSidebarSettings<AppBridgeBlock>;
-export type MultiInputBlock = MultiInputBlockSidebarSettings<AppBridgeBlock>;
-export type NotificationBlock = NotificationBlockSidebarSettings<AppBridgeBlock>;
-export type SectionHeadingBlock = SectionHeadingBlockSidebarSettings<AppBridgeBlock>;
-export type SegmentedControlsBlock = SegmentedControlsBlockSidebarSettings<AppBridgeBlock>;
-export type SettingBlock = SettingBlockSidebarSettings<AppBridgeBlock>;
-export type SimpleSettingBlock = SimpleSettingBlockSidebarSettings<AppBridgeBlock>;
-export type SwitchBlock = SwitchBlockSidebarSettings<AppBridgeBlock>;
-export type TemplateInputBlock = TemplateInputBlockSidebarSettings<AppBridgeBlock>;
-export type TextareaBlock = TextareaBlockSidebarSettings<AppBridgeBlock>;
-export type ValueOrPromisedValue<T> = ValueOrPromisedValueSidebarSettings<AppBridgeBlock, T>;
-
-export enum Sections {
-    Main = 'main',
-    Basics = 'basics',
-    Layout = 'layout',
-    Style = 'style',
-    Security = 'security',
-    Targets = 'targets',
-}
-
-export type BlockSettingsStructureExport = {
-    [Sections.Main]?: SettingBlock[];
-    [Sections.Basics]?: SettingBlock[];
-    [Sections.Layout]?: SettingBlock[];
-    [Sections.Style]?: SettingBlock[];
-    [Sections.Security]?: SettingBlock[];
-} & { [customSectionName: string]: SettingBlock[] };
-
-export type BlockProps = {
-    /**
-     * The Frontify App Bridge provides an interface to the Frontify app internals.
-     * {@link https://developer.frontify.com/d/XFPCrGNrXQQM/content-blocks#/details-concepts-1/content-blocks/introducing-the-app-bridge}
-     */
-    appBridge: AppBridgeBlock;
-};
-
-export type BlockConfigExport = {
-    /**
-     * Block component to render.
-     * {@link https://developer.frontify.com/d/XFPCrGNrXQQM/content-blocks#/details-concepts-1/content-blocks}
-     */
-    block: FC<BlockProps>;
-    /**
-     * Contains the block settings and its structure.
-     * {@link https://developer.frontify.com/d/XFPCrGNrXQQM/content-blocks#/details-concepts-1/block-settings-1}
-     */
-    settings: ReturnType<typeof defineSettings>;
-    /**
-     * Block lifecycle hook ran before the block gets added in the Guideline.
-     * The hook support both synchronous or asynchronous execution.
-     * {@link https://developer.frontify.com/d/XFPCrGNrXQQM/content-blocks#/details-concepts-1/block-lifecycle/on-block-creation}
-     */
-    onBlockCreated?:
-        | (({ appBridge }: { appBridge: AppBridgeBlock }) => void)
-        | (({ appBridge }: { appBridge: AppBridgeBlock }) => Promise<void>);
-    /**
-     * Block lifecycle hook ran before the block gets deleted from the Guideline.
-     * The hook support both synchronous or asynchronous execution.
-     * {@link https://developer.frontify.com/d/XFPCrGNrXQQM/content-blocks#/details-concepts-1/block-lifecycle/on-block-deletion}
-     */
-    onBlockDeleted?:
-        | (({ appBridge }: { appBridge: AppBridgeBlock }) => void)
-        | (({ appBridge }: { appBridge: AppBridgeBlock }) => Promise<void>);
-};
-
-/**
- * Type helper to make it easier to export a theme, accepts a direct {@link BlockConfigExport} object.
- */
-export const defineBlock = (config: BlockConfigExport): BlockConfigExport => config;
-
-/**
- * Type helper to make it easier to export block's settings structure, accepts a direct {@link BlockSettingsStructureExport} object
- * or a function return a direct {@link BlockSettingsStructureExport} or a function returning a Promise of {@link BlockSettingsStructureExport}.
- */
-export const defineSettings = <
-    T extends
-        | BlockSettingsStructureExport
-        | (() => Promise<BlockSettingsStructureExport>)
-        | (() => BlockSettingsStructureExport),
->(
-    settingsStructure: T,
-): T => settingsStructure;
-
-export * from './components';
-export * from './helpers';
-export * from './hooks';
-export * from './settings';
-export * from './utilities';

package/src/settings/background.spec.ts

@@ -1,173 +0,0 @@
-/* (c) Copyright Frontify Ltd., all rights reserved. */
-
-import { describe, expect, it } from 'vitest';
-import { getBackgroundSettings } from './background';
-
-describe('getBackgroundSettings', () => {
-    it('should return background settings without arguments', () => {
-        expect(getBackgroundSettings()).toEqual({
-            id: 'hasBackground',
-            label: 'Background',
-            type: 'switch',
-            defaultValue: false,
-            on: [
-                {
-                    id: 'backgroundColor',
-                    defaultValue: {
-                        red: 241,
-                        green: 241,
-                        blue: 241,
-                        alpha: 1,
-                    },
-                    type: 'colorInput',
-                },
-            ],
-        });
-    });
-
-    it('should return background settings with id', () => {
-        expect(getBackgroundSettings({ id: 'Test' })).toEqual({
-            id: 'hasBackgroundTest',
-            label: 'Background',
-            type: 'switch',
-            defaultValue: false,
-            on: [
-                {
-                    id: 'backgroundColorTest',
-                    defaultValue: {
-                        red: 241,
-                        green: 241,
-                        blue: 241,
-                        alpha: 1,
-                    },
-                    type: 'colorInput',
-                },
-            ],
-        });
-    });
-
-    it('should return background settings with default value', () => {
-        expect(getBackgroundSettings({ defaultValue: true })).toEqual({
-            id: 'hasBackground',
-            label: 'Background',
-            type: 'switch',
-            defaultValue: true,
-            on: [
-                {
-                    id: 'backgroundColor',
-                    defaultValue: {
-                        red: 241,
-                        green: 241,
-                        blue: 241,
-                        alpha: 1,
-                    },
-                    type: 'colorInput',
-                },
-            ],
-        });
-    });
-
-    it('should return background settings with default color', () => {
-        expect(getBackgroundSettings({ defaultColor: { red: 0, green: 0, blue: 0, alpha: 1 } })).toEqual({
-            id: 'hasBackground',
-            label: 'Background',
-            type: 'switch',
-            defaultValue: false,
-            on: [
-                {
-                    id: 'backgroundColor',
-                    defaultValue: {
-                        red: 0,
-                        green: 0,
-                        blue: 0,
-                        alpha: 1,
-                    },
-                    type: 'colorInput',
-                },
-            ],
-        });
-    });
-
-    it('should return background settings with id, default value and default color', () => {
-        expect(
-            getBackgroundSettings({
-                id: 'Test',
-                defaultValue: true,
-                defaultColor: { red: 0, green: 0, blue: 0, alpha: 1 },
-            }),
-        ).toEqual({
-            id: 'hasBackgroundTest',
-            label: 'Background',
-            type: 'switch',
-            defaultValue: true,
-            on: [
-                {
-                    id: 'backgroundColorTest',
-                    defaultValue: {
-                        red: 0,
-                        green: 0,
-                        blue: 0,
-                        alpha: 1,
-                    },
-                    type: 'colorInput',
-                },
-            ],
-        });
-    });
-
-    it('should return background settings with switch label', () => {
-        expect(getBackgroundSettings({ switchLabel: 'Test' })).toEqual({
-            id: 'hasBackground',
-            label: 'Background',
-            type: 'switch',
-            switchLabel: 'Test',
-            defaultValue: false,
-            on: [
-                {
-                    id: 'backgroundColor',
-                    defaultValue: {
-                        red: 241,
-                        green: 241,
-                        blue: 241,
-                        alpha: 1,
-                    },
-                    type: 'colorInput',
-                },
-            ],
-        });
-    });
-    it('should not return default color if hasDefaultColor is false', () => {
-        expect(getBackgroundSettings({ preventDefaultColor: true })).toEqual({
-            id: 'hasBackground',
-            label: 'Background',
-            type: 'switch',
-            defaultValue: false,
-            on: [
-                {
-                    id: 'backgroundColor',
-                    type: 'colorInput',
-                },
-            ],
-        });
-    });
-    it('should return default color if hasDefaultColor is true', () => {
-        expect(getBackgroundSettings({ preventDefaultColor: false })).toEqual({
-            id: 'hasBackground',
-            label: 'Background',
-            type: 'switch',
-            defaultValue: false,
-            on: [
-                {
-                    id: 'backgroundColor',
-                    defaultValue: {
-                        red: 241,
-                        green: 241,
-                        blue: 241,
-                        alpha: 1,
-                    },
-                    type: 'colorInput',
-                },
-            ],
-        });
-    });
-});