@frontify/guideline-blocks-settings 0.27.0 → 0.28.0

package/src/utilities/color/toHexString.ts

@@ -0,0 +1,10 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+import { Color } from '@frontify/fondue';
+import tinycolor from '@ctrl/tinycolor';
+import { toShortRgba } from './toShortRgba';
+
+/**
+ * Maps color object of rgba values to hex alpha string.
+ */
+export const toHexString = (color: Color): string => tinycolor(toShortRgba(color)).toHexString();

package/src/utilities/color/toRgbaString.spec.ts

@@ -0,0 +1,12 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+import { toRgbaString } from './toRgbaString';
+import { describe, expect, test } from 'vitest';
+
+describe('toRgbaString', () => {
+    const data = [{ color: { red: 1, green: 2, blue: 3, alpha: 0.5 }, expected: 'rgba(1, 2, 3, 0.5)' }];
+
+    test.each(data)('validates against expected values', ({ color, expected }) => {
+        expect(toRgbaString(color)).toBe(expected);
+    });
+});

package/src/utilities/color/toRgbaString.ts

@@ -0,0 +1,14 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+import { Color } from '@frontify/fondue';
+import tinycolor from '@ctrl/tinycolor';
+import { toShortRgba } from './toShortRgba';
+
+/**
+ * Maps color object of rgba values to rgba string.
+ *
+ * @param {Object} Color object
+ * @returns {String} To be used as css value.
+ */
+
+export const toRgbaString = (color: Color): string => tinycolor(toShortRgba(color)).toRgbString();

package/src/utilities/color/toShortRgba.spec.ts

@@ -0,0 +1,16 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+import { toShortRgba } from './toShortRgba';
+import { describe, expect, test } from 'vitest';
+
+describe('toShortRgba', () => {
+    const data = [
+        { color: { red: 50, green: 100, blue: 150 }, expected: { r: 50, g: 100, b: 150, a: 1 } },
+        { color: { red: 50, green: 100, blue: 150, alpha: 0.5 }, expected: { r: 50, g: 100, b: 150, a: 0.5 } },
+        { color: { r: 50, g: 100, b: 150, a: 0.5 }, expected: { r: 50, g: 100, b: 150, a: 0.5 } },
+    ];
+
+    test.each(data)('validates against expected values', ({ color, expected }) => {
+        expect(toShortRgba(color)).toStrictEqual(expected);
+    });
+});

package/src/utilities/color/toShortRgba.ts

@@ -0,0 +1,35 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+import { Color } from '@frontify/fondue';
+
+type ShortNotationColor = {
+    r: number;
+    g: number;
+    b: number;
+    a?: number;
+};
+
+/**
+ * Maps color object from long to short rgba notation.
+ *
+ * @param {Object} Color object
+ * @returns {Object} ShortNotationColor object
+ */
+
+export const toShortRgba = (color: unknown): ShortNotationColor => {
+    const isRgbaLongFormat = (value: Color) => {
+        const requiredKeys = ['red', 'green', 'blue'];
+        return typeof value === 'object' && requiredKeys.every((i) => value.hasOwnProperty(i));
+    };
+
+    const mapToShortFormat = (value: Color): ShortNotationColor => {
+        const alpha = typeof value.alpha === 'number' ? value.alpha : 1;
+        return { r: value.red, g: value.green, b: value.blue, a: alpha };
+    };
+
+    if (isRgbaLongFormat(color as Color)) {
+        return mapToShortFormat(color as Color);
+    }
+
+    return color as ShortNotationColor;
+};

package/src/utilities/index.ts

@@ -0,0 +1,5 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+export * from './color';
+export * from './moveItemInArray';
+export * from './react';

package/src/utilities/moveItemInArray.spec.ts

@@ -0,0 +1,17 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+import { describe, expect, it } from 'vitest';
+import { moveItemInArray } from './moveItemInArray';
+
+describe('moveItemInArray', () => {
+    it.each([
+        [[], 0, 0, []],
+        [[1, 2, 3], 0, 0, [1, 2, 3]],
+        [[1, 2, 3], 0, 1, [2, 1, 3]],
+        [[1, 2, 3], 1, 0, [2, 1, 3]],
+        [[1, { a: 1 }, 3], 1, 0, [{ a: 1 }, 1, 3]],
+        [[{ a: 1 }, { b: 1 }, { c: 1 }], 1, 0, [{ b: 1 }, { a: 1 }, { c: 1 }]],
+    ])('move items accordingly', (items, from, to, expected) => {
+        expect(expected).toEqual(moveItemInArray(items as number[], from, to));
+    });
+});

package/src/utilities/moveItemInArray.ts

@@ -0,0 +1,21 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+/**
+ * Moves an item from the 'from' position to the 'to' position and updates the array
+ *
+ * @param {Array} array Array of items
+ * @param {Number} from Initial index of the item
+ * @param {Number} to New index of the item
+ * @returns {Array} New array with the item moved to the new position
+ */
+export const moveItemInArray = <T>(array: T[], from: number, to: number): T[] => {
+    const newArray = [...array];
+    const toIndex = to < 0 ? newArray.length + to : to;
+
+    if (toIndex >= 0 && toIndex < newArray.length) {
+        const slice = newArray.splice(from, 1)[0];
+        newArray.splice(toIndex, 0, slice);
+    }
+
+    return newArray;
+};

package/src/utilities/react/getBackgroundColorStyles.spec.ts

@@ -0,0 +1,18 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+import { getBackgroundColorStyles } from './getBackgroundColorStyles';
+import { describe, expect, it } from 'vitest';
+
+describe('getBackgroundColorStyles', () => {
+    it('should return a rgba background color', () => {
+        expect(getBackgroundColorStyles({ red: 0, green: 0, blue: 0, alpha: 0.5 })).toEqual({
+            backgroundColor: 'rgba(0, 0, 0, 0.5)',
+        });
+    });
+
+    it('should return a rgb background color', () => {
+        expect(getBackgroundColorStyles({ red: 255, green: 255, blue: 255 })).toEqual({
+            backgroundColor: 'rgb(255, 255, 255)',
+        });
+    });
+});

package/src/utilities/react/getBackgroundColorStyles.ts

@@ -0,0 +1,11 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+import { CSSProperties } from 'react';
+
+import { Color } from '@frontify/fondue';
+
+import { toRgbaString } from '../color';
+
+export const getBackgroundColorStyles = (backgroundColor: Color): CSSProperties => ({
+    backgroundColor: toRgbaString(backgroundColor),
+});

package/src/utilities/react/getBorderStyles.spec.ts

@@ -0,0 +1,39 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+import { BorderStyle } from '../../settings/types';
+import { getBorderStyles } from './getBorderStyles';
+import { describe, expect, it } from 'vitest';
+
+describe('getBorderStyles', () => {
+    it('should return the default border styles', () => {
+        expect(getBorderStyles()).toEqual({
+            borderStyle: 'solid',
+            borderWidth: '1px',
+            borderColor: 'rgb(234, 235, 235)',
+        });
+    });
+
+    it('should return a dashed border style', () => {
+        expect(getBorderStyles(BorderStyle.Dashed)).toEqual({
+            borderStyle: 'dashed',
+            borderWidth: '1px',
+            borderColor: 'rgb(234, 235, 235)',
+        });
+    });
+
+    it('should return a border width of 5px', () => {
+        expect(getBorderStyles(BorderStyle.Solid, '5px')).toEqual({
+            borderStyle: 'solid',
+            borderWidth: '5px',
+            borderColor: 'rgb(234, 235, 235)',
+        });
+    });
+
+    it('should return a border color of rgba(255, 0, 0, 0.5)', () => {
+        expect(getBorderStyles(BorderStyle.Solid, '1px', { red: 255, green: 0, blue: 0, alpha: 0.5 })).toEqual({
+            borderStyle: 'solid',
+            borderWidth: '1px',
+            borderColor: 'rgba(255, 0, 0, 0.5)',
+        });
+    });
+});

package/src/utilities/react/getBorderStyles.ts

@@ -0,0 +1,21 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+import { CSSProperties } from 'react';
+
+import { Color } from '@frontify/fondue';
+
+import { BorderStyle, borderStyleMap } from '../../settings/types';
+import { BORDER_COLOR_DEFAULT_VALUE } from '../../settings/defaultValues';
+import { toRgbaString } from '../color';
+
+export const getBorderStyles = (
+    style = BorderStyle.Solid,
+    borderWidth = '1px',
+    color = BORDER_COLOR_DEFAULT_VALUE as Color
+): CSSProperties => {
+    return {
+        borderStyle: borderStyleMap[style],
+        borderWidth,
+        borderColor: toRgbaString(color),
+    };
+};

package/src/utilities/react/getRadiusStyles.spec.ts

@@ -0,0 +1,25 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+import { Radius } from '../../settings/types';
+import { getRadiusStyles } from './getRadiusStyles';
+import { describe, expect, it } from 'vitest';
+
+describe('getRadiusStyles', () => {
+    it('should return border radius 0px', () => {
+        expect(getRadiusStyles(Radius.None, false)).toEqual({
+            borderRadius: '0px',
+        });
+    });
+
+    it('should return border radius 4px', () => {
+        expect(getRadiusStyles(Radius.Medium, false)).toEqual({
+            borderRadius: '4px',
+        });
+    });
+
+    it('should return custom radius of 20px', () => {
+        expect(getRadiusStyles(Radius.None, true, 20)).toEqual({
+            borderRadius: 20,
+        });
+    });
+});

package/src/utilities/react/getRadiusStyles.ts

@@ -0,0 +1,8 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+import { CSSProperties } from 'react';
+import { Radius, radiusStyleMap } from '../../settings/types';
+
+export const getRadiusStyles = (radiusChoice: Radius, hasRadius = false, radiusValue?: number): CSSProperties => ({
+    borderRadius: hasRadius ? radiusValue : radiusStyleMap[radiusChoice],
+});

package/src/utilities/react/index.ts

@@ -0,0 +1,6 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+export * from './getBackgroundColorStyles';
+export * from './getBorderStyles';
+export * from './getRadiusStyles';
+export * from './joinClassNames';

package/src/utilities/react/joinClassNames.spec.ts

@@ -0,0 +1,18 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+import { joinClassNames } from './joinClassNames';
+import { describe, expect, test } from 'vitest';
+
+describe('joinClassNames', () => {
+    const data = [
+        { classes: ['lorem', undefined, false], expected: 'lorem' },
+        { classes: ['lorem', 'ipsum'], expected: 'lorem ipsum' },
+        { classes: ['lorem', ''], expected: 'lorem' },
+        { classes: ['lorem', ' '], expected: 'lorem  ' },
+        { classes: [], expected: '' },
+    ];
+
+    test.each(data)('validate correctly values', ({ classes, expected }) => {
+        expect(joinClassNames(classes)).toBe(expected);
+    });
+});

package/src/utilities/react/joinClassNames.ts

@@ -0,0 +1,10 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+/**
+ * Cleans and joins an array of inputs with possible undefined or boolean values.
+ *
+ * @param {Array} classNames Array of class names
+ * @returns Clean string to be used for class name.
+ */
+export const joinClassNames = (classNames: (string | undefined | boolean)[]): string =>
+    classNames.filter(Boolean).join(' ');

package/tailwind.config.js

@@ -0,0 +1,27 @@
+/* (c) Copyright Frontify Ltd., all rights reserved. */
+
+module.exports = {
+    presets: [require('@frontify/fondue/tailwind')],
+    content: ['src/**/*.{ts,tsx}'],
+    corePlugins: {
+        preflight: false,
+    },
+    theme: {
+        extend: {
+            colors: {
+                'blank-state-weak': '#ABADAD',
+                'blank-state-weak-inverse': '#FFFFFF',
+                'blank-state-shaded': '#727474',
+                'blank-state-shaded-inverse': '#FAFAFA',
+                'blank-state-weighted': '#696B6B',
+                'blank-state-weighted-inverse': '#F1F1F1',
+                'blank-state-hover': '#1A1C1C',
+                'blank-state-hover-inverse': '#FFFFFF',
+                'blank-state-pressed': '#080808',
+                'blank-state-pressed-inverse': '#F1F1F1',
+                'blank-state-line': '#A3A5A5',
+                'blank-state-line-hover': '#1A1C1C',
+            },
+        },
+    },
+};

package/tsconfig.json

@@ -14,11 +14,13 @@
         "sourceMap": true,
         "strict": true,
         "target": "es6",
+        "jsx": "react-jsx",
         "lib": ["dom", "dom.iterable", "esnext"],
         "resolveJsonModule": true,
         "declaration": true,
         "esModuleInterop": true,
-        "skipLibCheck": true
+        "skipLibCheck": true,
+        "types": ["cypress", "node", "cypress-real-events"]
     },
     "include": ["src/**/*"],
     "exclude": ["node_modules", "dist"]

package/vite.config.ts

@@ -1,6 +1,6 @@
 /* (c) Copyright Frontify Ltd., all rights reserved. */
 
-import { defineConfig } from 'vite';
+import { defineConfig } from 'vitest/config';
 import { dependencies as dependenciesMap } from './package.json';
 import { resolve } from 'path';
 import dts from 'vite-plugin-dts';
@@ -9,6 +9,16 @@ const dependencies = Object.keys(dependenciesMap);
 
 export default defineConfig({
     plugins: [dts({ insertTypesEntry: true, rollupTypes: true })],
+    resolve: {
+        mainFields: ['module', 'main'],
+    },
+    test: {
+        environment: 'happy-dom',
+        deps: {
+            inline: ['clsx', '@juggle/resize-observer'],
+        },
+        setupFiles: ['setupTests.ts'],
+    },
     build: {
         lib: {
             entry: resolve(__dirname, 'src/index.ts'),

package/dist/index.cjs.js

@@ -1,2 +0,0 @@
-"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const t=require("@frontify/sidebar-settings");var r=(e=>(e.Main="main",e.Basics="basics",e.Layout="layout",e.Style="style",e.Security="security",e.Targets="targets",e))(r||{});const a=e=>e,i=e=>e;exports.Sections=r;exports.defineBlock=a;exports.defineSettings=i;Object.keys(t).forEach(e=>{e!=="default"&&!exports.hasOwnProperty(e)&&Object.defineProperty(exports,e,{enumerable:!0,get:()=>t[e]})});
-//# sourceMappingURL=index.cjs.js.map

package/dist/index.cjs.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.cjs.js","sources":["../src/index.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport type { FC } from 'react';\nimport type { AppBridgeBlock } from '@frontify/app-bridge';\nimport type {\n    AssetInputBlock as AssetInputBlockSidebarSettings,\n    BaseBlock as BaseBlockSidebarSettings,\n    Bundle as BundleSidebarSettings,\n    ChecklistBlock as ChecklistBlockSidebarSettings,\n    ChoicesType as ChoicesTypeSidebarSettings,\n    ColorInputBlock as ColorInputBlockSidebarSettings,\n    DropdownBlock as DropdownBlockSidebarSettings,\n    DynamicSettingBlock as DynamicSettingBlockSidebarSettings,\n    DynamicSupportedBlock as DynamicSupportedBlockSidebarSettings,\n    FontInputBlock as FontInputBlockSidebarSettings,\n    InputBlock as InputBlockSidebarSettings,\n    LegacyAssetInputBlock as LegacyAssetInputBlockSidebarSettings,\n    LinkChooserBlock as LinkChooserBlockSidebarSettings,\n    MultiInputBlock as MultiInputBlockSidebarSettings,\n    NotificationBlock as NotificationBlockSidebarSettings,\n    SectionHeadingBlock as SectionHeadingBlockSidebarSettings,\n    SegmentedControlsBlock as SegmentedControlsBlockSidebarSettings,\n    SettingBlock as SettingBlockSidebarSettings,\n    SimpleSettingBlock as SimpleSettingBlockSidebarSettings,\n    SwitchBlock as SwitchBlockSidebarSettings,\n    TemplateInputBlock as TemplateInputBlockSidebarSettings,\n    TextareaBlock as TextareaBlockSidebarSettings,\n    ValueOrPromisedValue as ValueOrPromisedValueSidebarSettings,\n} from '@frontify/sidebar-settings';\n\nexport * from '@frontify/sidebar-settings';\n\nexport type AssetInputBlock = AssetInputBlockSidebarSettings<AppBridgeBlock>;\nexport type BaseBlock<T = undefined> = BaseBlockSidebarSettings<AppBridgeBlock, T>;\nexport type Bundle = BundleSidebarSettings<AppBridgeBlock>;\nexport type ChecklistBlock = ChecklistBlockSidebarSettings<AppBridgeBlock>;\nexport type ChoicesType = ChoicesTypeSidebarSettings<AppBridgeBlock>;\nexport type ColorInputBlock = ColorInputBlockSidebarSettings<AppBridgeBlock>;\nexport type DropdownBlock = DropdownBlockSidebarSettings<AppBridgeBlock>;\nexport type DynamicSettingBlock<Block extends DynamicSupportedBlock = DynamicSupportedBlock> =\n    DynamicSettingBlockSidebarSettings<AppBridgeBlock, Block>;\nexport type DynamicSupportedBlock = DynamicSupportedBlockSidebarSettings<AppBridgeBlock>;\nexport type FontInputBlock = FontInputBlockSidebarSettings<AppBridgeBlock>;\nexport type InputBlock = InputBlockSidebarSettings<AppBridgeBlock>;\nexport type LegacyAssetInputBlock = LegacyAssetInputBlockSidebarSettings<AppBridgeBlock>;\nexport type LinkChooserBlock = LinkChooserBlockSidebarSettings<AppBridgeBlock>;\nexport type MultiInputBlock = MultiInputBlockSidebarSettings<AppBridgeBlock>;\nexport type NotificationBlock = NotificationBlockSidebarSettings<AppBridgeBlock>;\nexport type SectionHeadingBlock = SectionHeadingBlockSidebarSettings<AppBridgeBlock>;\nexport type SegmentedControlsBlock = SegmentedControlsBlockSidebarSettings<AppBridgeBlock>;\nexport type SettingBlock = SettingBlockSidebarSettings<AppBridgeBlock>;\nexport type SimpleSettingBlock = SimpleSettingBlockSidebarSettings<AppBridgeBlock>;\nexport type SwitchBlock = SwitchBlockSidebarSettings<AppBridgeBlock>;\nexport type TemplateInputBlock = TemplateInputBlockSidebarSettings<AppBridgeBlock>;\nexport type TextareaBlock = TextareaBlockSidebarSettings<AppBridgeBlock>;\nexport type ValueOrPromisedValue<T> = ValueOrPromisedValueSidebarSettings<AppBridgeBlock, T>;\n\nexport enum Sections {\n    Main = 'main',\n    Basics = 'basics',\n    Layout = 'layout',\n    Style = 'style',\n    Security = 'security',\n    Targets = 'targets',\n}\n\nexport type BlockSettingsStructureExport = {\n    [Sections.Main]?: SettingBlock[];\n    [Sections.Basics]?: SettingBlock[];\n    [Sections.Layout]?: SettingBlock[];\n    [Sections.Style]?: SettingBlock[];\n    [Sections.Security]?: SettingBlock[];\n} & { [customSectionName: string]: SettingBlock[] };\n\nexport type BlockProps = {\n    /**\n     * The Frontify App Bridge provides an interface to the Frontify app internals.\n     * {@link https://developer.frontify.com/d/XFPCrGNrXQQM/content-blocks#/details-concepts-1/content-blocks/introducing-the-app-bridge}\n     */\n    appBridge: AppBridgeBlock;\n};\n\nexport type BlockConfigExport = {\n    /**\n     * Block component to render.\n     * {@link https://developer.frontify.com/d/XFPCrGNrXQQM/content-blocks#/details-concepts-1/content-blocks}\n     */\n    block: FC<BlockProps>;\n    /**\n     * Contains the block settings and its structure.\n     * {@link https://developer.frontify.com/d/XFPCrGNrXQQM/content-blocks#/details-concepts-1/block-settings-1}\n     */\n    settings: ReturnType<typeof defineSettings>;\n    /**\n     * Block lifecycle hook ran before the block gets added in the Guideline.\n     * The hook support both synchronous or asynchronous execution.\n     * {@link https://developer.frontify.com/d/XFPCrGNrXQQM/content-blocks#/details-concepts-1/block-lifecycle/on-block-creation}\n     */\n    onBlockCreated?:\n        | (({ appBridge }: { appBridge: AppBridgeBlock }) => void)\n        | (({ appBridge }: { appBridge: AppBridgeBlock }) => Promise<void>);\n    /**\n     * Block lifecycle hook ran before the block gets deleted from the Guideline.\n     * The hook support both synchronous or asynchronous execution.\n     * {@link https://developer.frontify.com/d/XFPCrGNrXQQM/content-blocks#/details-concepts-1/block-lifecycle/on-block-deletion}\n     */\n    onBlockDeleted?:\n        | (({ appBridge }: { appBridge: AppBridgeBlock }) => void)\n        | (({ appBridge }: { appBridge: AppBridgeBlock }) => Promise<void>);\n};\n\n/**\n * Type helper to make it easier to export a theme, accepts a direct {@link BlockConfigExport} object.\n */\nexport const defineBlock = (config: BlockConfigExport): BlockConfigExport => config;\n\n/**\n * Type helper to make it easier to export block's settings structure, accepts a direct {@link BlockSettingsStructureExport} object\n * or a function return a direct {@link BlockSettingsStructureExport} or a function returning a Promise of {@link BlockSettingsStructureExport}.\n */\nexport const defineSettings = <\n    T extends\n        | BlockSettingsStructureExport\n        | (() => Promise<BlockSettingsStructureExport>)\n        | (() => BlockSettingsStructureExport)\n>(\n    settingsStructure: T\n): T => settingsStructure;\n"],"names":["Sections","defineBlock","config","defineSettings","settingsStructure"],"mappings":"8HAyDY,IAAAA,GAAAA,IACRA,EAAA,KAAO,OACPA,EAAA,OAAS,SACTA,EAAA,OAAS,SACTA,EAAA,MAAQ,QACRA,EAAA,SAAW,WACXA,EAAA,QAAU,UANFA,IAAAA,GAAA,CAAA,CAAA,EAyDC,MAAAC,EAAeC,GAAiDA,EAMhEC,EAMTC,GACIA"}

package/dist/index.d.ts

@@ -1,147 +0,0 @@
-import type { AppBridgeBlock } from '@frontify/app-bridge';
-import type { AssetInputBlock as AssetInputBlock_2 } from '@frontify/sidebar-settings';
-import type { BaseBlock as BaseBlock_2 } from '@frontify/sidebar-settings';
-import type { Bundle as Bundle_2 } from '@frontify/sidebar-settings';
-import type { ChecklistBlock as ChecklistBlock_2 } from '@frontify/sidebar-settings';
-import type { ChoicesType as ChoicesType_2 } from '@frontify/sidebar-settings';
-import type { ColorInputBlock as ColorInputBlock_2 } from '@frontify/sidebar-settings';
-import type { DropdownBlock as DropdownBlock_2 } from '@frontify/sidebar-settings';
-import type { DynamicSettingBlock as DynamicSettingBlock_2 } from '@frontify/sidebar-settings';
-import type { DynamicSupportedBlock as DynamicSupportedBlock_2 } from '@frontify/sidebar-settings';
-import type { FC } from 'react';
-import type { FontInputBlock as FontInputBlock_2 } from '@frontify/sidebar-settings';
-import type { InputBlock as InputBlock_2 } from '@frontify/sidebar-settings';
-import type { LegacyAssetInputBlock as LegacyAssetInputBlock_2 } from '@frontify/sidebar-settings';
-import type { LinkChooserBlock as LinkChooserBlock_2 } from '@frontify/sidebar-settings';
-import type { MultiInputBlock as MultiInputBlock_2 } from '@frontify/sidebar-settings';
-import type { NotificationBlock as NotificationBlock_2 } from '@frontify/sidebar-settings';
-import type { SectionHeadingBlock as SectionHeadingBlock_2 } from '@frontify/sidebar-settings';
-import type { SegmentedControlsBlock as SegmentedControlsBlock_2 } from '@frontify/sidebar-settings';
-import type { SettingBlock as SettingBlock_2 } from '@frontify/sidebar-settings';
-import type { SimpleSettingBlock as SimpleSettingBlock_2 } from '@frontify/sidebar-settings';
-import type { SwitchBlock as SwitchBlock_2 } from '@frontify/sidebar-settings';
-import type { TemplateInputBlock as TemplateInputBlock_2 } from '@frontify/sidebar-settings';
-import type { TextareaBlock as TextareaBlock_2 } from '@frontify/sidebar-settings';
-import type { ValueOrPromisedValue as ValueOrPromisedValue_2 } from '@frontify/sidebar-settings';
-
-export declare type AssetInputBlock = AssetInputBlock_2<AppBridgeBlock>;
-
-export declare type BaseBlock<T = undefined> = BaseBlock_2<AppBridgeBlock, T>;
-
-export declare 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>);
-};
-
-export declare 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 declare type BlockSettingsStructureExport = {
-    [Sections.Main]?: SettingBlock[];
-    [Sections.Basics]?: SettingBlock[];
-    [Sections.Layout]?: SettingBlock[];
-    [Sections.Style]?: SettingBlock[];
-    [Sections.Security]?: SettingBlock[];
-} & {
-    [customSectionName: string]: SettingBlock[];
-};
-
-export declare type Bundle = Bundle_2<AppBridgeBlock>;
-
-export declare type ChecklistBlock = ChecklistBlock_2<AppBridgeBlock>;
-
-export declare type ChoicesType = ChoicesType_2<AppBridgeBlock>;
-
-export declare type ColorInputBlock = ColorInputBlock_2<AppBridgeBlock>;
-
-/**
- * Type helper to make it easier to export a theme, accepts a direct {@link BlockConfigExport} object.
- */
-export declare const defineBlock: (config: BlockConfigExport) => BlockConfigExport;
-
-/**
- * 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 declare const defineSettings: <T extends BlockSettingsStructureExport | (() => Promise<BlockSettingsStructureExport>) | (() => BlockSettingsStructureExport)>(settingsStructure: T) => T;
-
-export declare type DropdownBlock = DropdownBlock_2<AppBridgeBlock>;
-
-export declare type DynamicSettingBlock<Block extends DynamicSupportedBlock = DynamicSupportedBlock> = DynamicSettingBlock_2<AppBridgeBlock, Block>;
-
-export declare type DynamicSupportedBlock = DynamicSupportedBlock_2<AppBridgeBlock>;
-
-export declare type FontInputBlock = FontInputBlock_2<AppBridgeBlock>;
-
-export declare type InputBlock = InputBlock_2<AppBridgeBlock>;
-
-export declare type LegacyAssetInputBlock = LegacyAssetInputBlock_2<AppBridgeBlock>;
-
-export declare type LinkChooserBlock = LinkChooserBlock_2<AppBridgeBlock>;
-
-export declare type MultiInputBlock = MultiInputBlock_2<AppBridgeBlock>;
-
-export declare type NotificationBlock = NotificationBlock_2<AppBridgeBlock>;
-
-export declare type SectionHeadingBlock = SectionHeadingBlock_2<AppBridgeBlock>;
-
-export declare enum Sections {
-    Main = "main",
-    Basics = "basics",
-    Layout = "layout",
-    Style = "style",
-    Security = "security",
-    Targets = "targets"
-}
-
-export declare type SegmentedControlsBlock = SegmentedControlsBlock_2<AppBridgeBlock>;
-
-export declare type SettingBlock = SettingBlock_2<AppBridgeBlock>;
-
-export declare type SimpleSettingBlock = SimpleSettingBlock_2<AppBridgeBlock>;
-
-export declare type SwitchBlock = SwitchBlock_2<AppBridgeBlock>;
-
-export declare type TemplateInputBlock = TemplateInputBlock_2<AppBridgeBlock>;
-
-export declare type TextareaBlock = TextareaBlock_2<AppBridgeBlock>;
-
-export declare type ValueOrPromisedValue<T> = ValueOrPromisedValue_2<AppBridgeBlock, T>;
-
-
-export * from "@frontify/sidebar-settings";
-
-export { }

package/dist/index.es.js

@@ -1,9 +0,0 @@
-export * from "@frontify/sidebar-settings";
-var r = /* @__PURE__ */ ((t) => (t.Main = "main", t.Basics = "basics", t.Layout = "layout", t.Style = "style", t.Security = "security", t.Targets = "targets", t))(r || {});
-const a = (t) => t, e = (t) => t;
-export {
-  r as Sections,
-  a as defineBlock,
-  e as defineSettings
-};
-//# sourceMappingURL=index.es.js.map

package/dist/index.es.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.es.js","sources":["../src/index.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport type { FC } from 'react';\nimport type { AppBridgeBlock } from '@frontify/app-bridge';\nimport type {\n    AssetInputBlock as AssetInputBlockSidebarSettings,\n    BaseBlock as BaseBlockSidebarSettings,\n    Bundle as BundleSidebarSettings,\n    ChecklistBlock as ChecklistBlockSidebarSettings,\n    ChoicesType as ChoicesTypeSidebarSettings,\n    ColorInputBlock as ColorInputBlockSidebarSettings,\n    DropdownBlock as DropdownBlockSidebarSettings,\n    DynamicSettingBlock as DynamicSettingBlockSidebarSettings,\n    DynamicSupportedBlock as DynamicSupportedBlockSidebarSettings,\n    FontInputBlock as FontInputBlockSidebarSettings,\n    InputBlock as InputBlockSidebarSettings,\n    LegacyAssetInputBlock as LegacyAssetInputBlockSidebarSettings,\n    LinkChooserBlock as LinkChooserBlockSidebarSettings,\n    MultiInputBlock as MultiInputBlockSidebarSettings,\n    NotificationBlock as NotificationBlockSidebarSettings,\n    SectionHeadingBlock as SectionHeadingBlockSidebarSettings,\n    SegmentedControlsBlock as SegmentedControlsBlockSidebarSettings,\n    SettingBlock as SettingBlockSidebarSettings,\n    SimpleSettingBlock as SimpleSettingBlockSidebarSettings,\n    SwitchBlock as SwitchBlockSidebarSettings,\n    TemplateInputBlock as TemplateInputBlockSidebarSettings,\n    TextareaBlock as TextareaBlockSidebarSettings,\n    ValueOrPromisedValue as ValueOrPromisedValueSidebarSettings,\n} from '@frontify/sidebar-settings';\n\nexport * from '@frontify/sidebar-settings';\n\nexport type AssetInputBlock = AssetInputBlockSidebarSettings<AppBridgeBlock>;\nexport type BaseBlock<T = undefined> = BaseBlockSidebarSettings<AppBridgeBlock, T>;\nexport type Bundle = BundleSidebarSettings<AppBridgeBlock>;\nexport type ChecklistBlock = ChecklistBlockSidebarSettings<AppBridgeBlock>;\nexport type ChoicesType = ChoicesTypeSidebarSettings<AppBridgeBlock>;\nexport type ColorInputBlock = ColorInputBlockSidebarSettings<AppBridgeBlock>;\nexport type DropdownBlock = DropdownBlockSidebarSettings<AppBridgeBlock>;\nexport type DynamicSettingBlock<Block extends DynamicSupportedBlock = DynamicSupportedBlock> =\n    DynamicSettingBlockSidebarSettings<AppBridgeBlock, Block>;\nexport type DynamicSupportedBlock = DynamicSupportedBlockSidebarSettings<AppBridgeBlock>;\nexport type FontInputBlock = FontInputBlockSidebarSettings<AppBridgeBlock>;\nexport type InputBlock = InputBlockSidebarSettings<AppBridgeBlock>;\nexport type LegacyAssetInputBlock = LegacyAssetInputBlockSidebarSettings<AppBridgeBlock>;\nexport type LinkChooserBlock = LinkChooserBlockSidebarSettings<AppBridgeBlock>;\nexport type MultiInputBlock = MultiInputBlockSidebarSettings<AppBridgeBlock>;\nexport type NotificationBlock = NotificationBlockSidebarSettings<AppBridgeBlock>;\nexport type SectionHeadingBlock = SectionHeadingBlockSidebarSettings<AppBridgeBlock>;\nexport type SegmentedControlsBlock = SegmentedControlsBlockSidebarSettings<AppBridgeBlock>;\nexport type SettingBlock = SettingBlockSidebarSettings<AppBridgeBlock>;\nexport type SimpleSettingBlock = SimpleSettingBlockSidebarSettings<AppBridgeBlock>;\nexport type SwitchBlock = SwitchBlockSidebarSettings<AppBridgeBlock>;\nexport type TemplateInputBlock = TemplateInputBlockSidebarSettings<AppBridgeBlock>;\nexport type TextareaBlock = TextareaBlockSidebarSettings<AppBridgeBlock>;\nexport type ValueOrPromisedValue<T> = ValueOrPromisedValueSidebarSettings<AppBridgeBlock, T>;\n\nexport enum Sections {\n    Main = 'main',\n    Basics = 'basics',\n    Layout = 'layout',\n    Style = 'style',\n    Security = 'security',\n    Targets = 'targets',\n}\n\nexport type BlockSettingsStructureExport = {\n    [Sections.Main]?: SettingBlock[];\n    [Sections.Basics]?: SettingBlock[];\n    [Sections.Layout]?: SettingBlock[];\n    [Sections.Style]?: SettingBlock[];\n    [Sections.Security]?: SettingBlock[];\n} & { [customSectionName: string]: SettingBlock[] };\n\nexport type BlockProps = {\n    /**\n     * The Frontify App Bridge provides an interface to the Frontify app internals.\n     * {@link https://developer.frontify.com/d/XFPCrGNrXQQM/content-blocks#/details-concepts-1/content-blocks/introducing-the-app-bridge}\n     */\n    appBridge: AppBridgeBlock;\n};\n\nexport type BlockConfigExport = {\n    /**\n     * Block component to render.\n     * {@link https://developer.frontify.com/d/XFPCrGNrXQQM/content-blocks#/details-concepts-1/content-blocks}\n     */\n    block: FC<BlockProps>;\n    /**\n     * Contains the block settings and its structure.\n     * {@link https://developer.frontify.com/d/XFPCrGNrXQQM/content-blocks#/details-concepts-1/block-settings-1}\n     */\n    settings: ReturnType<typeof defineSettings>;\n    /**\n     * Block lifecycle hook ran before the block gets added in the Guideline.\n     * The hook support both synchronous or asynchronous execution.\n     * {@link https://developer.frontify.com/d/XFPCrGNrXQQM/content-blocks#/details-concepts-1/block-lifecycle/on-block-creation}\n     */\n    onBlockCreated?:\n        | (({ appBridge }: { appBridge: AppBridgeBlock }) => void)\n        | (({ appBridge }: { appBridge: AppBridgeBlock }) => Promise<void>);\n    /**\n     * Block lifecycle hook ran before the block gets deleted from the Guideline.\n     * The hook support both synchronous or asynchronous execution.\n     * {@link https://developer.frontify.com/d/XFPCrGNrXQQM/content-blocks#/details-concepts-1/block-lifecycle/on-block-deletion}\n     */\n    onBlockDeleted?:\n        | (({ appBridge }: { appBridge: AppBridgeBlock }) => void)\n        | (({ appBridge }: { appBridge: AppBridgeBlock }) => Promise<void>);\n};\n\n/**\n * Type helper to make it easier to export a theme, accepts a direct {@link BlockConfigExport} object.\n */\nexport const defineBlock = (config: BlockConfigExport): BlockConfigExport => config;\n\n/**\n * Type helper to make it easier to export block's settings structure, accepts a direct {@link BlockSettingsStructureExport} object\n * or a function return a direct {@link BlockSettingsStructureExport} or a function returning a Promise of {@link BlockSettingsStructureExport}.\n */\nexport const defineSettings = <\n    T extends\n        | BlockSettingsStructureExport\n        | (() => Promise<BlockSettingsStructureExport>)\n        | (() => BlockSettingsStructureExport)\n>(\n    settingsStructure: T\n): T => settingsStructure;\n"],"names":["Sections","defineBlock","config","defineSettings","settingsStructure"],"mappings":";AAyDY,IAAAA,sBAAAA,OACRA,EAAA,OAAO,QACPA,EAAA,SAAS,UACTA,EAAA,SAAS,UACTA,EAAA,QAAQ,SACRA,EAAA,WAAW,YACXA,EAAA,UAAU,WANFA,IAAAA,KAAA,CAAA,CAAA;AAyDC,MAAAC,IAAc,CAACC,MAAiDA,GAMhEC,IAAiB,CAM1BC,MACIA;"}

package/dist/index.umd.js

@@ -1,2 +0,0 @@
-(function(t,i){typeof exports=="object"&&typeof module<"u"?i(exports,require("@frontify/sidebar-settings")):typeof define=="function"&&define.amd?define(["exports","@frontify/sidebar-settings"],i):(t=typeof globalThis<"u"?globalThis:t||self,i(t.GuidelineBlocksSettings={},t.sidebarSettings))})(this,function(t,i){"use strict";var n=(e=>(e.Main="main",e.Basics="basics",e.Layout="layout",e.Style="style",e.Security="security",e.Targets="targets",e))(n||{});const f=e=>e,s=e=>e;t.Sections=n,t.defineBlock=f,t.defineSettings=s,Object.keys(i).forEach(e=>{e!=="default"&&!t.hasOwnProperty(e)&&Object.defineProperty(t,e,{enumerable:!0,get:()=>i[e]})}),Object.defineProperty(t,Symbol.toStringTag,{value:"Module"})});
-//# sourceMappingURL=index.umd.js.map

package/dist/index.umd.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"index.umd.js","sources":["../src/index.ts"],"sourcesContent":["/* (c) Copyright Frontify Ltd., all rights reserved. */\n\nimport type { FC } from 'react';\nimport type { AppBridgeBlock } from '@frontify/app-bridge';\nimport type {\n    AssetInputBlock as AssetInputBlockSidebarSettings,\n    BaseBlock as BaseBlockSidebarSettings,\n    Bundle as BundleSidebarSettings,\n    ChecklistBlock as ChecklistBlockSidebarSettings,\n    ChoicesType as ChoicesTypeSidebarSettings,\n    ColorInputBlock as ColorInputBlockSidebarSettings,\n    DropdownBlock as DropdownBlockSidebarSettings,\n    DynamicSettingBlock as DynamicSettingBlockSidebarSettings,\n    DynamicSupportedBlock as DynamicSupportedBlockSidebarSettings,\n    FontInputBlock as FontInputBlockSidebarSettings,\n    InputBlock as InputBlockSidebarSettings,\n    LegacyAssetInputBlock as LegacyAssetInputBlockSidebarSettings,\n    LinkChooserBlock as LinkChooserBlockSidebarSettings,\n    MultiInputBlock as MultiInputBlockSidebarSettings,\n    NotificationBlock as NotificationBlockSidebarSettings,\n    SectionHeadingBlock as SectionHeadingBlockSidebarSettings,\n    SegmentedControlsBlock as SegmentedControlsBlockSidebarSettings,\n    SettingBlock as SettingBlockSidebarSettings,\n    SimpleSettingBlock as SimpleSettingBlockSidebarSettings,\n    SwitchBlock as SwitchBlockSidebarSettings,\n    TemplateInputBlock as TemplateInputBlockSidebarSettings,\n    TextareaBlock as TextareaBlockSidebarSettings,\n    ValueOrPromisedValue as ValueOrPromisedValueSidebarSettings,\n} from '@frontify/sidebar-settings';\n\nexport * from '@frontify/sidebar-settings';\n\nexport type AssetInputBlock = AssetInputBlockSidebarSettings<AppBridgeBlock>;\nexport type BaseBlock<T = undefined> = BaseBlockSidebarSettings<AppBridgeBlock, T>;\nexport type Bundle = BundleSidebarSettings<AppBridgeBlock>;\nexport type ChecklistBlock = ChecklistBlockSidebarSettings<AppBridgeBlock>;\nexport type ChoicesType = ChoicesTypeSidebarSettings<AppBridgeBlock>;\nexport type ColorInputBlock = ColorInputBlockSidebarSettings<AppBridgeBlock>;\nexport type DropdownBlock = DropdownBlockSidebarSettings<AppBridgeBlock>;\nexport type DynamicSettingBlock<Block extends DynamicSupportedBlock = DynamicSupportedBlock> =\n    DynamicSettingBlockSidebarSettings<AppBridgeBlock, Block>;\nexport type DynamicSupportedBlock = DynamicSupportedBlockSidebarSettings<AppBridgeBlock>;\nexport type FontInputBlock = FontInputBlockSidebarSettings<AppBridgeBlock>;\nexport type InputBlock = InputBlockSidebarSettings<AppBridgeBlock>;\nexport type LegacyAssetInputBlock = LegacyAssetInputBlockSidebarSettings<AppBridgeBlock>;\nexport type LinkChooserBlock = LinkChooserBlockSidebarSettings<AppBridgeBlock>;\nexport type MultiInputBlock = MultiInputBlockSidebarSettings<AppBridgeBlock>;\nexport type NotificationBlock = NotificationBlockSidebarSettings<AppBridgeBlock>;\nexport type SectionHeadingBlock = SectionHeadingBlockSidebarSettings<AppBridgeBlock>;\nexport type SegmentedControlsBlock = SegmentedControlsBlockSidebarSettings<AppBridgeBlock>;\nexport type SettingBlock = SettingBlockSidebarSettings<AppBridgeBlock>;\nexport type SimpleSettingBlock = SimpleSettingBlockSidebarSettings<AppBridgeBlock>;\nexport type SwitchBlock = SwitchBlockSidebarSettings<AppBridgeBlock>;\nexport type TemplateInputBlock = TemplateInputBlockSidebarSettings<AppBridgeBlock>;\nexport type TextareaBlock = TextareaBlockSidebarSettings<AppBridgeBlock>;\nexport type ValueOrPromisedValue<T> = ValueOrPromisedValueSidebarSettings<AppBridgeBlock, T>;\n\nexport enum Sections {\n    Main = 'main',\n    Basics = 'basics',\n    Layout = 'layout',\n    Style = 'style',\n    Security = 'security',\n    Targets = 'targets',\n}\n\nexport type BlockSettingsStructureExport = {\n    [Sections.Main]?: SettingBlock[];\n    [Sections.Basics]?: SettingBlock[];\n    [Sections.Layout]?: SettingBlock[];\n    [Sections.Style]?: SettingBlock[];\n    [Sections.Security]?: SettingBlock[];\n} & { [customSectionName: string]: SettingBlock[] };\n\nexport type BlockProps = {\n    /**\n     * The Frontify App Bridge provides an interface to the Frontify app internals.\n     * {@link https://developer.frontify.com/d/XFPCrGNrXQQM/content-blocks#/details-concepts-1/content-blocks/introducing-the-app-bridge}\n     */\n    appBridge: AppBridgeBlock;\n};\n\nexport type BlockConfigExport = {\n    /**\n     * Block component to render.\n     * {@link https://developer.frontify.com/d/XFPCrGNrXQQM/content-blocks#/details-concepts-1/content-blocks}\n     */\n    block: FC<BlockProps>;\n    /**\n     * Contains the block settings and its structure.\n     * {@link https://developer.frontify.com/d/XFPCrGNrXQQM/content-blocks#/details-concepts-1/block-settings-1}\n     */\n    settings: ReturnType<typeof defineSettings>;\n    /**\n     * Block lifecycle hook ran before the block gets added in the Guideline.\n     * The hook support both synchronous or asynchronous execution.\n     * {@link https://developer.frontify.com/d/XFPCrGNrXQQM/content-blocks#/details-concepts-1/block-lifecycle/on-block-creation}\n     */\n    onBlockCreated?:\n        | (({ appBridge }: { appBridge: AppBridgeBlock }) => void)\n        | (({ appBridge }: { appBridge: AppBridgeBlock }) => Promise<void>);\n    /**\n     * Block lifecycle hook ran before the block gets deleted from the Guideline.\n     * The hook support both synchronous or asynchronous execution.\n     * {@link https://developer.frontify.com/d/XFPCrGNrXQQM/content-blocks#/details-concepts-1/block-lifecycle/on-block-deletion}\n     */\n    onBlockDeleted?:\n        | (({ appBridge }: { appBridge: AppBridgeBlock }) => void)\n        | (({ appBridge }: { appBridge: AppBridgeBlock }) => Promise<void>);\n};\n\n/**\n * Type helper to make it easier to export a theme, accepts a direct {@link BlockConfigExport} object.\n */\nexport const defineBlock = (config: BlockConfigExport): BlockConfigExport => config;\n\n/**\n * Type helper to make it easier to export block's settings structure, accepts a direct {@link BlockSettingsStructureExport} object\n * or a function return a direct {@link BlockSettingsStructureExport} or a function returning a Promise of {@link BlockSettingsStructureExport}.\n */\nexport const defineSettings = <\n    T extends\n        | BlockSettingsStructureExport\n        | (() => Promise<BlockSettingsStructureExport>)\n        | (() => BlockSettingsStructureExport)\n>(\n    settingsStructure: T\n): T => settingsStructure;\n"],"names":["Sections","defineBlock","config","defineSettings","settingsStructure"],"mappings":"sUAyDY,IAAAA,GAAAA,IACRA,EAAA,KAAO,OACPA,EAAA,OAAS,SACTA,EAAA,OAAS,SACTA,EAAA,MAAQ,QACRA,EAAA,SAAW,WACXA,EAAA,QAAU,UANFA,IAAAA,GAAA,CAAA,CAAA,EAyDC,MAAAC,EAAeC,GAAiDA,EAMhEC,EAMTC,GACIA"}