@brilo/base-blocks 0.1.15 → 0.1.17

package/build/blocks/contact/contact-group/constants.d.ts

@@ -1,3 +1,20 @@
 export declare const CONTACT_COLUMNS: readonly [2, 3];
 export declare const CONTACT_COLUMNS_CONTEXT = "brilo/contact-columns";
+export declare const DEFAULT_SHADOWS: readonly [{
+    readonly value: 'none';
+    readonly label: import("@wordpress/i18n").TransformedText<"Žádný">;
+}, {
+    readonly value: 'sm';
+    readonly label: import("@wordpress/i18n").TransformedText<"Malý">;
+}, {
+    readonly value: 'md';
+    readonly label: import("@wordpress/i18n").TransformedText<"Střední">;
+}];
+export declare const TEXT_ALIGNS: readonly [{
+    readonly value: 'left';
+    readonly label: import("@wordpress/i18n").TransformedText<"Vlevo">;
+}, {
+    readonly value: 'center';
+    readonly label: import("@wordpress/i18n").TransformedText<"Na střed">;
+}];
 //# sourceMappingURL=constants.d.ts.map

package/build/blocks/contact/contact-group/constants.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../../src/blocks/contact/contact-group/constants.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,eAAe,YAAI,CAAC,EAAE,CAAC,CAAU,CAAA;AAE9C,eAAO,MAAM,uBAAuB,0BAA0B,CAAA"}
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../../src/blocks/contact/contact-group/constants.ts"],"names":[],"mappings":"AAEA,eAAO,MAAM,eAAe,YAAI,CAAC,EAAE,CAAC,CAAU,CAAA;AAE9C,eAAO,MAAM,uBAAuB,0BAA0B,CAAA;AAE9D,eAAO,MAAM,eAAe;aACzB,KAAK,EAAE,MAAM;aAAE,KAAK;;aACpB,KAAK,EAAE,IAAI;aAAE,KAAK;;aAClB,KAAK,EAAE,IAAI;aAAE,KAAK;EACX,CAAA;AAEV,eAAO,MAAM,WAAW;aACrB,KAAK,EAAE,MAAM;aAAE,KAAK;;aACpB,KAAK,EAAE,QAAQ;aAAE,KAAK;EACf,CAAA"}

package/build/blocks/contact/contact-group/constants.js

@@ -1,2 +1,12 @@
+import { __ } from '@wordpress/i18n';
 export const CONTACT_COLUMNS = [2, 3];
 export const CONTACT_COLUMNS_CONTEXT = 'brilo/contact-columns';
+export const DEFAULT_SHADOWS = [
+    { value: 'none', label: __('Žádný', 'brilo-blocks') },
+    { value: 'sm', label: __('Malý', 'brilo-blocks') },
+    { value: 'md', label: __('Střední', 'brilo-blocks') },
+];
+export const TEXT_ALIGNS = [
+    { value: 'left', label: __('Vlevo', 'brilo-blocks') },
+    { value: 'center', label: __('Na střed', 'brilo-blocks') },
+];

package/build/blocks/contact/contact-group/edit.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"edit.d.ts","sourceRoot":"","sources":["../../../../src/blocks/contact/contact-group/edit.tsx"],"names":[],"mappings":"AAUA,OAAO,KAAK,EAAiB,sBAAsB,EAAE,mBAAmB,EAAC,MAAM,SAAS,CAAA;AAExF,wBAAgB,sBAAsB,CAAC,OAAO,EAAE,mBAAmB,oCAM9D;IACD,UAAU,EAAE,sBAAsB,CAAA;IAClC,aAAa,EAAE,CAAC,CAAC,EAAE,OAAO,CAAC,sBAAsB,CAAC,KAAK,IAAI,CAAA;CAC5D,iCAmCF"}
+{"version":3,"file":"edit.d.ts","sourceRoot":"","sources":["../../../../src/blocks/contact/contact-group/edit.tsx"],"names":[],"mappings":"AAaA,OAAO,KAAK,EAAiB,sBAAsB,EAAE,mBAAmB,EAAkC,MAAM,SAAS,CAAA;AAEzH,wBAAgB,sBAAsB,CAAC,OAAO,EAAE,mBAAmB,oCAM9D;IACD,UAAU,EAAE,sBAAsB,CAAA;IAClC,aAAa,EAAE,CAAC,CAAC,EAAE,OAAO,CAAC,sBAAsB,CAAC,KAAK,IAAI,CAAA;CAC5D,iCAmFF"}

package/build/blocks/contact/contact-group/edit.js

@@ -1,16 +1,18 @@
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { InspectorControls } from '@wordpress/block-editor';
-import { PanelBody, __experimentalToggleGroupControl as ToggleGroupControl, __experimentalToggleGroupControlOption as ToggleGroupControlOption, } from '@wordpress/components';
+import { BaseControl, ColorPalette, PanelBody, __experimentalToggleGroupControl as ToggleGroupControl, __experimentalToggleGroupControlOption as ToggleGroupControlOption, } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 import clsx from 'clsx';
 import { useGroupBlock } from '../../../hooks/useGroupBlock';
-import { CONTACT_COLUMNS } from './constants';
+import { useTenantColorPalette } from '../../../hooks/useTenantColorPalette';
+import { CONTACT_COLUMNS, DEFAULT_SHADOWS, TEXT_ALIGNS } from './constants';
 export function createContactGroupEdit(options) {
     var _a;
     const COLUMNS = (_a = options.columns) !== null && _a !== void 0 ? _a : CONTACT_COLUMNS;
     return function Edit({ attributes, setAttributes, }) {
         var _a, _b;
-        const { columns } = attributes;
+        const { columns, style } = attributes;
+        const { paletteColors } = useTenantColorPalette();
         const { blockProps, innerBlocksProps } = useGroupBlock({
             blockClassName: clsx((_a = options.blockClassName) !== null && _a !== void 0 ? _a : 'g-contact wp-block-section'),
             containerClassName: [(_b = options.containerClassName) !== null && _b !== void 0 ? _b : 'g-contact__items', `--cols-${columns}`],
@@ -20,6 +22,6 @@ export function createContactGroupEdit(options) {
             template: options.template,
             layout: { type: 'default' },
         });
-        return (_jsxs(_Fragment, { children: [_jsx(InspectorControls, { children: _jsx(PanelBody, { title: __('Rozložení', 'brilo-blocks'), children: _jsx(ToggleGroupControl, { isBlock: true, label: __('Počet sloupců', 'brilo-blocks'), value: String(columns), onChange: (v) => setAttributes({ columns: Number(v) }), children: COLUMNS.map((c) => (_jsx(ToggleGroupControlOption, { value: String(c), label: String(c) }, c))) }) }) }), _jsx("div", { ...blockProps, children: _jsx("div", { ...innerBlocksProps }) })] }));
+        return (_jsxs(_Fragment, { children: [_jsxs(InspectorControls, { children: [_jsx(PanelBody, { title: __('Rozložení', 'brilo-blocks'), children: _jsx(ToggleGroupControl, { isBlock: true, label: __('Počet sloupců', 'brilo-blocks'), value: String(columns), onChange: (v) => setAttributes({ columns: Number(v) }), children: COLUMNS.map((c) => (_jsx(ToggleGroupControlOption, { value: String(c), label: String(c) }, c))) }) }), _jsxs(PanelBody, { title: __('Styl', 'brilo-blocks'), children: [_jsx(ToggleGroupControl, { isBlock: true, label: __('Stín', 'brilo-blocks'), value: style.shadow, onChange: (v) => setAttributes({ style: { ...style, shadow: v } }), children: DEFAULT_SHADOWS.map((s) => (_jsx(ToggleGroupControlOption, { value: s.value, label: s.label }, s.value))) }), _jsx(BaseControl, { label: __('Barva okraje', 'brilo-blocks'), help: __('Bez vybrané barvy se okraj nevykreslí.', 'brilo-blocks'), id: "contact-group-border-color", children: _jsx(ColorPalette, { colors: paletteColors, value: style.borderColor || undefined, onChange: (value) => setAttributes({ style: { ...style, borderColor: value !== null && value !== void 0 ? value : '' } }) }) }), _jsx(BaseControl, { label: __('Barva pozadí', 'brilo-blocks'), id: "contact-group-background-color", children: _jsx(ColorPalette, { colors: paletteColors, value: style.backgroundColor || undefined, onChange: (value) => setAttributes({ style: { ...style, backgroundColor: value !== null && value !== void 0 ? value : '' } }) }) }), _jsx(BaseControl, { label: __('Barva textu', 'brilo-blocks'), id: "contact-group-text-color", children: _jsx(ColorPalette, { colors: paletteColors, value: style.textColor || undefined, onChange: (value) => setAttributes({ style: { ...style, textColor: value !== null && value !== void 0 ? value : '' } }) }) }), _jsx(ToggleGroupControl, { isBlock: true, label: __('Zarovnání textu', 'brilo-blocks'), value: style.textAlign, onChange: (v) => setAttributes({ style: { ...style, textAlign: v } }), children: TEXT_ALIGNS.map((a) => (_jsx(ToggleGroupControlOption, { value: a.value, label: a.label }, a.value))) })] })] }), _jsx("div", { ...blockProps, children: _jsx("div", { ...innerBlocksProps }) })] }));
     };
 }

package/build/blocks/contact/contact-group/factory.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"factory.d.ts","sourceRoot":"","sources":["../../../../src/blocks/contact/contact-group/factory.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,mBAAmB,CAAA;AAEzD,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,SAAS,CAAA;AACxC,OAAO,EAAC,eAAe,EAA0B,MAAM,aAAa,CAAA;AAEpE,OAAO,KAAK,EAAC,sBAAsB,EAAE,mBAAmB,EAAC,MAAM,SAAS,CAAA;AAExE,YAAY,EAAC,sBAAsB,EAAE,mBAAmB,EAAC,CAAA;AAEzD,wBAAgB,uBAAuB,CAAC,QAAQ,SAAS,WAAW,GAAG,OAAO,eAAe,EAC3F,OAAO,EAAE,mBAAmB,CAAC,QAAQ,CAAC,GACrC,kBAAkB,CAAC,sBAAsB,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,CAsB9D"}
+{"version":3,"file":"factory.d.ts","sourceRoot":"","sources":["../../../../src/blocks/contact/contact-group/factory.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,mBAAmB,CAAA;AAEzD,OAAO,KAAK,EAAC,WAAW,EAAC,MAAM,SAAS,CAAA;AACxC,OAAO,EAAC,eAAe,EAA2C,MAAM,aAAa,CAAA;AAErF,OAAO,KAAK,EAAC,sBAAsB,EAAE,mBAAmB,EAAC,MAAM,SAAS,CAAA;AAExE,YAAY,EAAC,sBAAsB,EAAE,mBAAmB,EAAC,CAAA;AAEzD,wBAAgB,uBAAuB,CAAC,QAAQ,SAAS,WAAW,GAAG,OAAO,eAAe,EAC3F,OAAO,EAAE,mBAAmB,CAAC,QAAQ,CAAC,GACrC,kBAAkB,CAAC,sBAAsB,CAAC,QAAQ,CAAC,MAAM,CAAC,CAAC,CAAC,CA0B9D"}

package/build/blocks/contact/contact-group/factory.js

@@ -1,7 +1,7 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { InnerBlocks } from '@wordpress/block-editor';
 import { __ } from '@wordpress/i18n';
-import { CONTACT_COLUMNS, CONTACT_COLUMNS_CONTEXT } from './constants';
+import { CONTACT_COLUMNS, CONTACT_COLUMNS_CONTEXT, DEFAULT_SHADOWS } from './constants';
 import { createContactGroupEdit } from './edit';
 export function createContactGroupBlock(options) {
     var _a, _b, _c, _d, _e;
@@ -21,6 +21,10 @@ export function createContactGroupBlock(options) {
                 default: (_e = columns[1]) !== null && _e !== void 0 ? _e : columns[0],
                 enum: [...columns],
             },
+            style: {
+                type: 'object',
+                default: { shadow: DEFAULT_SHADOWS[0].value, borderColor: '', backgroundColor: '', textColor: '', textAlign: 'left' },
+            },
         },
         edit: createContactGroupEdit(options),
         save: () => _jsx(InnerBlocks.Content, {}),

package/build/blocks/contact/contact-group/types.d.ts

@@ -1,8 +1,17 @@
 import type { BriloBlockType, NumberArray } from '../../../types';
-import type { CONTACT_COLUMNS } from './constants';
+import type { CONTACT_COLUMNS, DEFAULT_SHADOWS, TEXT_ALIGNS } from './constants';
 export type ContactColumns = (typeof CONTACT_COLUMNS)[number];
+export type ContactShadow = (typeof DEFAULT_SHADOWS)[number]['value'];
+export type ContactTextAlign = (typeof TEXT_ALIGNS)[number]['value'];
 export interface ContactGroupAttributes<TColumns extends number = ContactColumns> extends Record<string, unknown> {
     columns: TColumns;
+    style: {
+        shadow: ContactShadow;
+        borderColor: string;
+        backgroundColor: string;
+        textColor: string;
+        textAlign: ContactTextAlign;
+    };
 }
 export interface ContactGroupOptions<TColumns extends NumberArray = typeof CONTACT_COLUMNS> extends BriloBlockType {
     columns?: TColumns;

package/build/blocks/contact/contact-group/types.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/blocks/contact/contact-group/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,cAAc,EAAE,WAAW,EAAC,MAAM,SAAS,CAAA;AACxD,OAAO,KAAK,EAAC,eAAe,EAAC,MAAM,aAAa,CAAA;AAEhD,MAAM,MAAM,cAAc,GAAG,CAAC,OAAO,eAAe,CAAC,CAAC,MAAM,CAAC,CAAA;AAE7D,MAAM,WAAW,sBAAsB,CAAC,QAAQ,SAAS,MAAM,GAAG,cAAc,CAAE,SAAQ,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IAC/G,OAAO,EAAE,QAAQ,CAAA;CAClB;AAED,MAAM,WAAW,mBAAmB,CAAC,QAAQ,SAAS,WAAW,GAAG,OAAO,eAAe,CAAE,SAAQ,cAAc;IAChH,OAAO,CAAC,EAAE,QAAQ,CAAA;CACnB"}
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/blocks/contact/contact-group/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,cAAc,EAAE,WAAW,EAAC,MAAM,SAAS,CAAA;AACxD,OAAO,KAAK,EAAC,eAAe,EAAE,eAAe,EAAE,WAAW,EAAC,MAAM,aAAa,CAAA;AAE9E,MAAM,MAAM,cAAc,GAAG,CAAC,OAAO,eAAe,CAAC,CAAC,MAAM,CAAC,CAAA;AAE7D,MAAM,MAAM,aAAa,GAAG,CAAC,OAAO,eAAe,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA;AAErE,MAAM,MAAM,gBAAgB,GAAG,CAAC,OAAO,WAAW,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA;AAEpE,MAAM,WAAW,sBAAsB,CAAC,QAAQ,SAAS,MAAM,GAAG,cAAc,CAAE,SAAQ,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IAC/G,OAAO,EAAE,QAAQ,CAAA;IACjB,KAAK,EAAE;QACL,MAAM,EAAE,aAAa,CAAA;QACrB,WAAW,EAAE,MAAM,CAAA;QACnB,eAAe,EAAE,MAAM,CAAA;QACvB,SAAS,EAAE,MAAM,CAAA;QACjB,SAAS,EAAE,gBAAgB,CAAA;KAC5B,CAAA;CACF;AAED,MAAM,WAAW,mBAAmB,CAAC,QAAQ,SAAS,WAAW,GAAG,OAAO,eAAe,CAAE,SAAQ,cAAc;IAChH,OAAO,CAAC,EAAE,QAAQ,CAAA;CACnB"}

package/build/blocks/contact/contact-item/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/blocks/contact/contact-item/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAC,eAAe,EAAE,sBAAsB,EAAE,qBAAqB,EAAE,kBAAkB,EAAC,MAAM,SAAS,CAAA;AAC/G,OAAO,EAAC,sBAAsB,EAAC,MAAM,WAAW,CAAA;AAChD,OAAO,EAAC,qBAAqB,EAAC,MAAM,QAAQ,CAAA;AAC5C,OAAO,EAAC,uBAAuB,EAAE,kBAAkB,EAAE,kBAAkB,EAAC,MAAM,aAAa,CAAA;AAE3F,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,SAAS,CAAA;AAE/C,eAAO,MAAM,mBAAmB,EAAE,kBAiBjC,CAAA"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../../src/blocks/contact/contact-item/index.ts"],"names":[],"mappings":"AAAA,YAAY,EAAC,eAAe,EAAE,sBAAsB,EAAE,qBAAqB,EAAE,kBAAkB,EAAC,MAAM,SAAS,CAAA;AAC/G,OAAO,EAAC,sBAAsB,EAAC,MAAM,WAAW,CAAA;AAChD,OAAO,EAAC,qBAAqB,EAAC,MAAM,QAAQ,CAAA;AAC5C,OAAO,EAAC,uBAAuB,EAAE,kBAAkB,EAAE,kBAAkB,EAAC,MAAM,aAAa,CAAA;AAE3F,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,SAAS,CAAA;AAE/C,eAAO,MAAM,mBAAmB,EAAE,kBAkBjC,CAAA"}

package/build/blocks/contact/contact-item/index.js

@@ -13,6 +13,7 @@ export const contactItemDefaults = {
         'brilo/column-group',
         'brilo/responsive-grid-group',
         'brilo/link-item',
+        'core/group',
     ],
     template: [
         ['core/heading', { level: 3 }],

package/build/blocks/signpost/signpost-item/index.js

@@ -2,5 +2,5 @@ export { createSignpostItemBlock } from './factory';
 export const signpostItemDefaults = {
     name: 'brilo/signpost-item',
     parent: ['brilo/signpost-group'],
-    allowedBlocks: ['core/paragraph', 'core/list', 'core/heading'],
+    allowedBlocks: ['core/paragraph', 'core/list', 'core/heading', 'core/group', 'brilo/responsive-grid-group', 'brilo/link-item'],
 };

package/build/blocks/usp/usp-group/constants.d.ts

@@ -39,55 +39,68 @@ export declare const DEFAULT_SHADOWS: readonly [{
     readonly value: 'md';
     readonly label: import("@wordpress/i18n").TransformedText<"Střední">;
 }];
-export declare const DEFAULT_ICON_SIZES: readonly [{
-    readonly value: 'xs';
-    readonly label: import("@wordpress/i18n").TransformedText<"Extra Malá">;
-    readonly description: import("@wordpress/i18n").TransformedText<"48px">;
+export declare const DEFAULT_ICON_SIZE = 88;
+export declare const ICON_SIZE_MIN = 4;
+export declare const ICON_SIZE_MAX = 128;
+export declare const DEFAULT_ICON_SIZE_PRESETS: readonly [{
+    readonly value: 8;
+    readonly label: import("@wordpress/i18n").TransformedText<"XS">;
 }, {
-    readonly value: 'sm';
-    readonly label: import("@wordpress/i18n").TransformedText<"Malá">;
-    readonly description: import("@wordpress/i18n").TransformedText<"64px">;
+    readonly value: 16;
+    readonly label: import("@wordpress/i18n").TransformedText<"SM">;
 }, {
-    readonly value: 'default';
-    readonly label: import("@wordpress/i18n").TransformedText<"Výchozí">;
-    readonly description: import("@wordpress/i18n").TransformedText<"88px">;
+    readonly value: 24;
+    readonly label: import("@wordpress/i18n").TransformedText<"MD">;
 }, {
-    readonly value: 'lg';
-    readonly label: import("@wordpress/i18n").TransformedText<"Velká">;
-    readonly description: import("@wordpress/i18n").TransformedText<"104px">;
+    readonly value: 32;
+    readonly label: import("@wordpress/i18n").TransformedText<"LG">;
 }, {
-    readonly value: 'xl';
-    readonly label: import("@wordpress/i18n").TransformedText<"Extra Velká">;
-    readonly description: import("@wordpress/i18n").TransformedText<"128px">;
+    readonly value: 48;
+    readonly label: import("@wordpress/i18n").TransformedText<"XL">;
 }];
-export declare const DEFAULT_ICON_COLORS: readonly [{
-    readonly value: 'none';
-    readonly label: import("@wordpress/i18n").TransformedText<"Žádná">;
+export declare const DEFAULT_ICON_BACKGROUND_SIZE = 88;
+export declare const ICON_BACKGROUND_SIZE_MIN = 16;
+export declare const ICON_BACKGROUND_SIZE_MAX = 240;
+export declare const DEFAULT_ICON_BACKGROUND_SIZE_PRESETS: readonly [{
+    readonly value: 48;
+    readonly label: import("@wordpress/i18n").TransformedText<"XS">;
 }, {
-    readonly value: 'primary';
-    readonly label: import("@wordpress/i18n").TransformedText<"Primární">;
+    readonly value: 64;
+    readonly label: import("@wordpress/i18n").TransformedText<"SM">;
 }, {
-    readonly value: 'secondary';
-    readonly label: import("@wordpress/i18n").TransformedText<"Sekundární">;
+    readonly value: 88;
+    readonly label: import("@wordpress/i18n").TransformedText<"Výchozí">;
 }, {
-    readonly value: 'neutral';
-    readonly label: import("@wordpress/i18n").TransformedText<"Neutrální">;
+    readonly value: 104;
+    readonly label: import("@wordpress/i18n").TransformedText<"LG">;
 }, {
-    readonly value: 'conversion';
-    readonly label: import("@wordpress/i18n").TransformedText<"Konverzní">;
+    readonly value: 128;
+    readonly label: import("@wordpress/i18n").TransformedText<"XL">;
 }];
-export declare const DEFAULT_ICON_BACKGROUNDS: readonly [{
+export declare const DEFAULT_ICON_BACKGROUND_SHAPES: readonly [{
     readonly value: 'none';
-    readonly label: import("@wordpress/i18n").TransformedText<"Žádné">;
+    readonly label: import("@wordpress/i18n").TransformedText<"Žádný">;
+}, {
+    readonly value: 'circle';
+    readonly label: import("@wordpress/i18n").TransformedText<"Kruh">;
+}, {
+    readonly value: 'triangle';
+    readonly label: import("@wordpress/i18n").TransformedText<"Trojúhelník">;
+}, {
+    readonly value: 'rhombus';
+    readonly label: import("@wordpress/i18n").TransformedText<"Kosočtverec">;
+}, {
+    readonly value: 'octagon';
+    readonly label: import("@wordpress/i18n").TransformedText<"Osmiúhelník">;
 }, {
-    readonly value: 'primary';
-    readonly label: import("@wordpress/i18n").TransformedText<"Primární">;
+    readonly value: 'bevel';
+    readonly label: import("@wordpress/i18n").TransformedText<"Zkosený">;
 }, {
-    readonly value: 'secondary';
-    readonly label: import("@wordpress/i18n").TransformedText<"Sekundární">;
+    readonly value: 'rabbet';
+    readonly label: import("@wordpress/i18n").TransformedText<"Drážkovaný">;
 }, {
-    readonly value: 'neutral';
-    readonly label: import("@wordpress/i18n").TransformedText<"Neutrální">;
+    readonly value: 'parallelogram';
+    readonly label: import("@wordpress/i18n").TransformedText<"Rovnoběžník">;
 }];
 export declare const DEFAULT_ALIGNMENTS: readonly [{
     readonly value: 'left';

package/build/blocks/usp/usp-group/constants.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../../src/blocks/usp/usp-group/constants.ts"],"names":[],"mappings":"AAEA,OAAO,EAAC,aAAa,IAAI,qBAAqB,EAAC,MAAM,aAAa,CAAA;AAElE,eAAO,MAAM,eAAe,YAAI,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAU,CAAA;AAEvD,eAAO,MAAM,kBAAkB;aAC5B,KAAK,EAAE,UAAU;aAAE,KAAK;;aACxB,KAAK,EAAE,YAAY;aAAE,KAAK;EACnB,CAAA;AAEV,eAAO,MAAM,cAAc,YAAI,CAAC,EAAE,CAAC,CAAU,CAAA;AAE7C,eAAO,MAAM,sBAAsB;aAChC,KAAK,EAAE,IAAI;aAAE,KAAK,EAAE,GAAG;aAAE,WAAW;;aACpC,KAAK,EAAE,IAAI;aAAE,KAAK,EAAE,GAAG;aAAE,WAAW;;aACpC,KAAK,EAAE,IAAI;aAAE,KAAK,EAAE,GAAG;aAAE,WAAW;;aACpC,KAAK,EAAE,IAAI;aAAE,KAAK,EAAE,IAAI;aAAE,WAAW;;aACrC,KAAK,EAAE,IAAI;aAAE,KAAK,EAAE,KAAK;aAAE,WAAW;EAC/B,CAAA;AAEV,eAAO,MAAM,eAAe;aACzB,KAAK,EAAE,MAAM;aAAE,KAAK;;aACpB,KAAK,EAAE,IAAI;aAAE,KAAK;;aAClB,KAAK,EAAE,IAAI;aAAE,KAAK;EACX,CAAA;AAEV,eAAO,MAAM,kBAAkB;aAC5B,KAAK,EAAE,IAAI;aAAE,KAAK;aAAoC,WAAW;;aACjE,KAAK,EAAE,IAAI;aAAE,KAAK;aAA8B,WAAW;;aAC3D,KAAK,EAAE,SAAS;aAAE,KAAK;aAAiC,WAAW;;aACnE,KAAK,EAAE,IAAI;aAAE,KAAK;aAA+B,WAAW;;aAC5D,KAAK,EAAE,IAAI;aAAE,KAAK;aAAqC,WAAW;EAC3D,CAAA;AAEV,eAAO,MAAM,mBAAmB;aAC7B,KAAK,EAAE,MAAM;aAAE,KAAK;;aACpB,KAAK,EAAE,SAAS;aAAE,KAAK;;aACvB,KAAK,EAAE,WAAW;aAAE,KAAK;;aACzB,KAAK,EAAE,SAAS;aAAE,KAAK;;aACvB,KAAK,EAAE,YAAY;aAAE,KAAK;EACnB,CAAA;AAEV,eAAO,MAAM,wBAAwB;aAClC,KAAK,EAAE,MAAM;aAAE,KAAK;;aACpB,KAAK,EAAE,SAAS;aAAE,KAAK;;aACvB,KAAK,EAAE,WAAW;aAAE,KAAK;;aACzB,KAAK,EAAE,SAAS;aAAE,KAAK;EAChB,CAAA;AAEV,eAAO,MAAM,kBAAkB;aAC5B,KAAK,EAAE,MAAM;aAAE,KAAK;;aACpB,KAAK,EAAE,QAAQ;aAAE,KAAK;EACf,CAAA"}
+{"version":3,"file":"constants.d.ts","sourceRoot":"","sources":["../../../../src/blocks/usp/usp-group/constants.ts"],"names":[],"mappings":"AAEA,OAAO,EAAC,aAAa,IAAI,qBAAqB,EAAC,MAAM,aAAa,CAAA;AAElE,eAAO,MAAM,eAAe,YAAI,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,EAAE,CAAC,CAAU,CAAA;AAEvD,eAAO,MAAM,kBAAkB;aAC5B,KAAK,EAAE,UAAU;aAAE,KAAK;;aACxB,KAAK,EAAE,YAAY;aAAE,KAAK;EACnB,CAAA;AAEV,eAAO,MAAM,cAAc,YAAI,CAAC,EAAE,CAAC,CAAU,CAAA;AAE7C,eAAO,MAAM,sBAAsB;aAChC,KAAK,EAAE,IAAI;aAAE,KAAK,EAAE,GAAG;aAAE,WAAW;;aACpC,KAAK,EAAE,IAAI;aAAE,KAAK,EAAE,GAAG;aAAE,WAAW;;aACpC,KAAK,EAAE,IAAI;aAAE,KAAK,EAAE,GAAG;aAAE,WAAW;;aACpC,KAAK,EAAE,IAAI;aAAE,KAAK,EAAE,IAAI;aAAE,WAAW;;aACrC,KAAK,EAAE,IAAI;aAAE,KAAK,EAAE,KAAK;aAAE,WAAW;EAC/B,CAAA;AAEV,eAAO,MAAM,eAAe;aACzB,KAAK,EAAE,MAAM;aAAE,KAAK;;aACpB,KAAK,EAAE,IAAI;aAAE,KAAK;;aAClB,KAAK,EAAE,IAAI;aAAE,KAAK;EACX,CAAA;AAEV,eAAO,MAAM,iBAAiB,KAAK,CAAA;AACnC,eAAO,MAAM,aAAa,IAAI,CAAA;AAC9B,eAAO,MAAM,aAAa,MAAM,CAAA;AAEhC,eAAO,MAAM,yBAAyB;aACnC,KAAK,EAAE,CAAC;aAAE,KAAK;;aACf,KAAK,EAAE,EAAE;aAAE,KAAK;;aAChB,KAAK,EAAE,EAAE;aAAE,KAAK;;aAChB,KAAK,EAAE,EAAE;aAAE,KAAK;;aAChB,KAAK,EAAE,EAAE;aAAE,KAAK;EACT,CAAA;AAEV,eAAO,MAAM,4BAA4B,KAAK,CAAA;AAC9C,eAAO,MAAM,wBAAwB,KAAK,CAAA;AAC1C,eAAO,MAAM,wBAAwB,MAAM,CAAA;AAE3C,eAAO,MAAM,oCAAoC;aAC9C,KAAK,EAAE,EAAE;aAAE,KAAK;;aAChB,KAAK,EAAE,EAAE;aAAE,KAAK;;aAChB,KAAK,EAAE,EAAE;aAAE,KAAK;;aAChB,KAAK,EAAE,GAAG;aAAE,KAAK;;aACjB,KAAK,EAAE,GAAG;aAAE,KAAK;EACV,CAAA;AAEV,eAAO,MAAM,8BAA8B;aACxC,KAAK,EAAE,MAAM;aAAE,KAAK;;aACpB,KAAK,EAAE,QAAQ;aAAE,KAAK;;aACtB,KAAK,EAAE,UAAU;aAAE,KAAK;;aACxB,KAAK,EAAE,SAAS;aAAE,KAAK;;aACvB,KAAK,EAAE,SAAS;aAAE,KAAK;;aACvB,KAAK,EAAE,OAAO;aAAE,KAAK;;aACrB,KAAK,EAAE,QAAQ;aAAE,KAAK;;aACtB,KAAK,EAAE,eAAe;aAAE,KAAK;EACtB,CAAA;AAEV,eAAO,MAAM,kBAAkB;aAC5B,KAAK,EAAE,MAAM;aAAE,KAAK;;aACpB,KAAK,EAAE,QAAQ;aAAE,KAAK;EACf,CAAA"}

package/build/blocks/usp/usp-group/constants.js

@@ -18,25 +18,35 @@ export const DEFAULT_SHADOWS = [
     { value: 'sm', label: __('Malý', 'brilo-blocks') },
     { value: 'md', label: __('Střední', 'brilo-blocks') },
 ];
-export const DEFAULT_ICON_SIZES = [
-    { value: 'xs', label: __('Extra Malá', 'brilo-blocks'), description: __('48px', 'brilo-blocks') },
-    { value: 'sm', label: __('Malá', 'brilo-blocks'), description: __('64px', 'brilo-blocks') },
-    { value: 'default', label: __('Výchozí', 'brilo-blocks'), description: __('88px', 'brilo-blocks') },
-    { value: 'lg', label: __('Velká', 'brilo-blocks'), description: __('104px', 'brilo-blocks') },
-    { value: 'xl', label: __('Extra Velká', 'brilo-blocks'), description: __('128px', 'brilo-blocks') },
+export const DEFAULT_ICON_SIZE = 88;
+export const ICON_SIZE_MIN = 4;
+export const ICON_SIZE_MAX = 128;
+export const DEFAULT_ICON_SIZE_PRESETS = [
+    { value: 8, label: __('XS', 'brilo-blocks') },
+    { value: 16, label: __('SM', 'brilo-blocks') },
+    { value: 24, label: __('MD', 'brilo-blocks') },
+    { value: 32, label: __('LG', 'brilo-blocks') },
+    { value: 48, label: __('XL', 'brilo-blocks') },
 ];
-export const DEFAULT_ICON_COLORS = [
-    { value: 'none', label: __('Žádná', 'brilo-blocks') },
-    { value: 'primary', label: __('Primární', 'brilo-blocks') },
-    { value: 'secondary', label: __('Sekundární', 'brilo-blocks') },
-    { value: 'neutral', label: __('Neutrální', 'brilo-blocks') },
-    { value: 'conversion', label: __('Konverzní', 'brilo-blocks') },
+export const DEFAULT_ICON_BACKGROUND_SIZE = 88;
+export const ICON_BACKGROUND_SIZE_MIN = 16;
+export const ICON_BACKGROUND_SIZE_MAX = 240;
+export const DEFAULT_ICON_BACKGROUND_SIZE_PRESETS = [
+    { value: 48, label: __('XS', 'brilo-blocks') },
+    { value: 64, label: __('SM', 'brilo-blocks') },
+    { value: 88, label: __('Výchozí', 'brilo-blocks') },
+    { value: 104, label: __('LG', 'brilo-blocks') },
+    { value: 128, label: __('XL', 'brilo-blocks') },
 ];
-export const DEFAULT_ICON_BACKGROUNDS = [
-    { value: 'none', label: __('Žádné', 'brilo-blocks') },
-    { value: 'primary', label: __('Primární', 'brilo-blocks') },
-    { value: 'secondary', label: __('Sekundární', 'brilo-blocks') },
-    { value: 'neutral', label: __('Neutrální', 'brilo-blocks') },
+export const DEFAULT_ICON_BACKGROUND_SHAPES = [
+    { value: 'none', label: __('Žádný', 'brilo-blocks') },
+    { value: 'circle', label: __('Kruh', 'brilo-blocks') },
+    { value: 'triangle', label: __('Trojúhelník', 'brilo-blocks') },
+    { value: 'rhombus', label: __('Kosočtverec', 'brilo-blocks') },
+    { value: 'octagon', label: __('Osmiúhelník', 'brilo-blocks') },
+    { value: 'bevel', label: __('Zkosený', 'brilo-blocks') },
+    { value: 'rabbet', label: __('Drážkovaný', 'brilo-blocks') },
+    { value: 'parallelogram', label: __('Rovnoběžník', 'brilo-blocks') },
 ];
 export const DEFAULT_ALIGNMENTS = [
     { value: 'left', label: __('Vlevo', 'brilo-blocks') },

package/build/blocks/usp/usp-group/edit.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"edit.d.ts","sourceRoot":"","sources":["../../../../src/blocks/usp/usp-group/edit.tsx"],"names":[],"mappings":"AA0BA,OAAO,KAAK,EAIV,kBAAkB,EAClB,eAAe,EAOhB,MAAM,SAAS,CAAA;AAEhB,wBAAgB,kBAAkB,CAAC,OAAO,EAAE,eAAe,oCActD;IACD,UAAU,EAAE,kBAAkB,CAAA;IAC9B,aAAa,EAAE,CAAC,CAAC,EAAE,OAAO,CAAC,kBAAkB,CAAC,KAAK,IAAI,CAAA;CACxD,iCAkKF"}
+{"version":3,"file":"edit.d.ts","sourceRoot":"","sources":["../../../../src/blocks/usp/usp-group/edit.tsx"],"names":[],"mappings":"AA+BA,OAAO,KAAK,EAIV,kBAAkB,EAClB,eAAe,EAMhB,MAAM,SAAS,CAAA;AA+BhB,wBAAgB,kBAAkB,CAAC,OAAO,EAAE,eAAe,oCActD;IACD,UAAU,EAAE,kBAAkB,CAAA;IAC9B,aAAa,EAAE,CAAC,CAAC,EAAE,OAAO,CAAC,kBAAkB,CAAC,KAAK,IAAI,CAAA;CACxD,iCA4MF"}

package/build/blocks/usp/usp-group/edit.js

@@ -1,24 +1,27 @@
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { InspectorControls } from '@wordpress/block-editor';
-import { PanelBody, SelectControl, ToggleControl, BaseControl, ColorPalette, __experimentalToggleGroupControl as ToggleGroupControl, __experimentalToggleGroupControlOption as ToggleGroupControlOption, } from '@wordpress/components';
+import { PanelBody, Button, RangeControl, BaseControl, ColorPalette, SelectControl, __experimentalToggleGroupControl as ToggleGroupControl, __experimentalToggleGroupControlOption as ToggleGroupControlOption, } from '@wordpress/components';
 import { __ } from '@wordpress/i18n';
 import clsx from 'clsx';
 import { useGroupBlock } from '../../../hooks/useGroupBlock';
 import { useTenantColorPalette } from '../../../hooks/useTenantColorPalette';
-import { DEFAULT_ALIGNMENTS, DEFAULT_COLUMNS, DEFAULT_CONTENT_SIZES, DEFAULT_DIRECTIONS, DEFAULT_HEADING_STYLES, DEFAULT_ICON_BACKGROUNDS, DEFAULT_ICON_COLORS, DEFAULT_ICON_SIZES, DEFAULT_SHADOWS, HEADING_LEVELS, } from './constants';
+import { DEFAULT_ALIGNMENTS, DEFAULT_COLUMNS, DEFAULT_CONTENT_SIZES, DEFAULT_DIRECTIONS, DEFAULT_HEADING_STYLES, DEFAULT_ICON_BACKGROUND_SHAPES, DEFAULT_ICON_BACKGROUND_SIZE_PRESETS, DEFAULT_ICON_SIZE_PRESETS, DEFAULT_SHADOWS, HEADING_LEVELS, ICON_BACKGROUND_SIZE_MAX, ICON_BACKGROUND_SIZE_MIN, ICON_SIZE_MAX, ICON_SIZE_MIN, } from './constants';
+function PresetSizeControl({ label, value, presets, min, max, onChange, }) {
+    return (_jsxs(BaseControl, { label: label, id: `usp-group-size-${label}`, children: [_jsx("div", { style: { display: 'flex', gap: 4, marginBottom: 8, flexWrap: 'wrap' }, children: presets.map((p) => (_jsx(Button, { variant: value === p.value ? 'primary' : 'secondary', size: "small", onClick: () => onChange(p.value), children: p.label }, p.label))) }), _jsx(RangeControl, { value: value, onChange: (v) => onChange(v !== null && v !== void 0 ? v : min), min: min, max: max, step: 1, withInputField: true })] }));
+}
 export function createUspGroupEdit(options) {
     var _a, _b, _c, _d, _e, _f, _g, _h, _j;
     const COLUMNS = (_a = options.columns) !== null && _a !== void 0 ? _a : DEFAULT_COLUMNS;
     const DIRECTIONS = (_b = options.directions) !== null && _b !== void 0 ? _b : DEFAULT_DIRECTIONS;
     const HEADING_STYLES = (_c = options.headingStyles) !== null && _c !== void 0 ? _c : DEFAULT_HEADING_STYLES;
     const SHADOWS = (_d = options.shadows) !== null && _d !== void 0 ? _d : DEFAULT_SHADOWS;
-    const ICON_SIZES = (_e = options.iconSizes) !== null && _e !== void 0 ? _e : DEFAULT_ICON_SIZES;
-    const ICON_COLORS = (_f = options.iconColors) !== null && _f !== void 0 ? _f : DEFAULT_ICON_COLORS;
-    const ICON_BACKGROUND = (_g = options.iconBackgrounds) !== null && _g !== void 0 ? _g : DEFAULT_ICON_BACKGROUNDS;
+    const ICON_SIZE_PRESETS = (_e = options.iconSizePresets) !== null && _e !== void 0 ? _e : DEFAULT_ICON_SIZE_PRESETS;
+    const ICON_BACKGROUND_SIZE_PRESETS = (_f = options.iconBackgroundSizePresets) !== null && _f !== void 0 ? _f : DEFAULT_ICON_BACKGROUND_SIZE_PRESETS;
+    const ICON_BACKGROUND_SHAPES = (_g = options.iconBackgroundShapes) !== null && _g !== void 0 ? _g : DEFAULT_ICON_BACKGROUND_SHAPES;
     const ALIGNMENTS = (_h = options.alignments) !== null && _h !== void 0 ? _h : DEFAULT_ALIGNMENTS;
     const CONTENT_SIZES = (_j = options.contentSizes) !== null && _j !== void 0 ? _j : DEFAULT_CONTENT_SIZES;
     return function Edit({ attributes, setAttributes, }) {
-        var _a, _b, _c;
+        var _a, _b;
         const { columns, headingSettings, content, style } = attributes;
         const { paletteColors } = useTenantColorPalette();
         const { blockProps, innerBlocksProps } = useGroupBlock({
@@ -30,6 +33,6 @@ export function createUspGroupEdit(options) {
             template: options.template,
             layout: { type: 'default' },
         });
-        return (_jsxs(_Fragment, { children: [_jsxs(InspectorControls, { children: [_jsxs(PanelBody, { title: __('Rozložení', 'brilo-blocks'), children: [_jsx(ToggleGroupControl, { isBlock: true, label: __('Počet sloupců', 'brilo-blocks'), value: String(columns), onChange: (v) => setAttributes({ columns: Number(v) }), children: COLUMNS.map((c) => (_jsx(ToggleGroupControlOption, { value: String(c), label: String(c) }, c))) }), _jsx(ToggleGroupControl, { isBlock: true, label: __('Směr', 'brilo-blocks'), value: style.direction, onChange: (v) => setAttributes({ style: { ...style, direction: v } }), children: DIRECTIONS.map((d) => (_jsx(ToggleGroupControlOption, { value: d.value, label: d.label }, d.value))) }), style.direction === 'vertical' && (_jsx(ToggleGroupControl, { isBlock: true, label: __('Zarovnání', 'brilo-blocks'), value: style.align, onChange: (v) => setAttributes({ style: { ...style, align: v } }), children: ALIGNMENTS.map((a) => (_jsx(ToggleGroupControlOption, { value: a.value, label: a.label }, a.value))) })), _jsx(ToggleGroupControl, { isBlock: true, label: __('Úroveň nadpisu položek', 'brilo-blocks'), value: String(headingSettings.level), onChange: (v) => setAttributes({ headingSettings: { ...headingSettings, level: Number(v) } }), children: HEADING_LEVELS.map((l) => (_jsx(ToggleGroupControlOption, { value: String(l), label: `H${l}` }, l))) }), _jsx(ToggleGroupControl, { isBlock: true, label: __('Styl nadpisu položek', 'brilo-blocks'), value: headingSettings.style, onChange: (v) => setAttributes({ headingSettings: { ...headingSettings, style: v } }), children: HEADING_STYLES.map((s) => (_jsx(ToggleGroupControlOption, { value: s.value, label: s.label, "aria-label": s.description, showTooltip: true }, s.value))) }), _jsx(ToggleGroupControl, { isBlock: true, label: __('Velikost textu', 'brilo-blocks'), value: content.size, onChange: (v) => setAttributes({ content: { size: v } }), children: CONTENT_SIZES.map((s) => (_jsx(ToggleGroupControlOption, { value: s.value, label: s.label }, s.value))) })] }), _jsxs(PanelBody, { title: __('Styl', 'brilo-blocks'), children: [_jsx(ToggleGroupControl, { isBlock: true, label: __('Stín', 'brilo-blocks'), value: style.shadow, onChange: (v) => setAttributes({ style: { ...style, shadow: v } }), children: SHADOWS.map((s) => (_jsx(ToggleGroupControlOption, { value: s.value, label: s.label }, s.value))) }), _jsx(BaseControl, { label: __('Barva okraje', 'brilo-blocks'), help: __('Bez vybrané barvy se okraj nevykreslí.', 'brilo-blocks'), id: "usp-group-border-color", children: _jsx(ColorPalette, { colors: paletteColors, value: style.borderColor || undefined, onChange: (value) => setAttributes({ style: { ...style, borderColor: value !== null && value !== void 0 ? value : '' } }) }) }), _jsx(BaseControl, { label: __('Barva pozadí', 'brilo-blocks'), id: "usp-group-background-color", children: _jsx(ColorPalette, { colors: paletteColors, value: style.backgroundColor || undefined, onChange: (value) => setAttributes({ style: { ...style, backgroundColor: value !== null && value !== void 0 ? value : '' } }) }) }), _jsx(BaseControl, { label: __('Barva textu', 'brilo-blocks'), id: "usp-group-text-color", children: _jsx(ColorPalette, { colors: paletteColors, value: style.textColor || undefined, onChange: (value) => setAttributes({ style: { ...style, textColor: value !== null && value !== void 0 ? value : '' } }) }) })] }), _jsxs(PanelBody, { title: __('Ikona', 'brilo-blocks'), initialOpen: false, children: [_jsx(ToggleGroupControl, { isBlock: true, label: __('Velikost', 'brilo-blocks'), value: style.icon.size, onChange: (v) => setAttributes({ style: { ...style, icon: { ...style.icon, size: v } } }), children: ICON_SIZES.map((s) => (_jsx(ToggleGroupControlOption, { value: s.value, label: s.label, "aria-label": s.description, showTooltip: true }, s.value))) }), _jsx(SelectControl, { label: __('Barva', 'brilo-blocks'), value: style.icon.color, options: [...ICON_COLORS], onChange: (v) => setAttributes({ style: { ...style, icon: { ...style.icon, color: v } } }) }), _jsx(SelectControl, { label: __('Pozadí', 'brilo-blocks'), value: style.icon.background, options: [...ICON_BACKGROUND], onChange: (v) => setAttributes({ style: { ...style, icon: { ...style.icon, background: v } } }) }), style.icon.background !== 'none' && (_jsx(ToggleControl, { label: __('Ohraničení ikony', 'brilo-blocks'), checked: (_c = style.icon.bordered) !== null && _c !== void 0 ? _c : false, onChange: (v) => setAttributes({ style: { ...style, icon: { ...style.icon, bordered: v } } }) }))] })] }), _jsx("div", { ...blockProps, children: _jsx("div", { ...innerBlocksProps }) })] }));
+        return (_jsxs(_Fragment, { children: [_jsxs(InspectorControls, { children: [_jsxs(PanelBody, { title: __('Rozložení', 'brilo-blocks'), children: [_jsx(ToggleGroupControl, { isBlock: true, label: __('Počet sloupců', 'brilo-blocks'), value: String(columns), onChange: (v) => setAttributes({ columns: Number(v) }), children: COLUMNS.map((c) => (_jsx(ToggleGroupControlOption, { value: String(c), label: String(c) }, c))) }), _jsx(ToggleGroupControl, { isBlock: true, label: __('Směr', 'brilo-blocks'), value: style.direction, onChange: (v) => setAttributes({ style: { ...style, direction: v } }), children: DIRECTIONS.map((d) => (_jsx(ToggleGroupControlOption, { value: d.value, label: d.label }, d.value))) }), style.direction === 'vertical' && (_jsx(ToggleGroupControl, { isBlock: true, label: __('Zarovnání', 'brilo-blocks'), value: style.align, onChange: (v) => setAttributes({ style: { ...style, align: v } }), children: ALIGNMENTS.map((a) => (_jsx(ToggleGroupControlOption, { value: a.value, label: a.label }, a.value))) })), style.direction === 'vertical' && (_jsx(ToggleGroupControl, { isBlock: true, label: __('Zarovnání textu', 'brilo-blocks'), value: style.textAlign, onChange: (v) => { var _a; return setAttributes({ style: { ...style, textAlign: (_a = v) !== null && _a !== void 0 ? _a : '' } }); }, children: ALIGNMENTS.map((a) => (_jsx(ToggleGroupControlOption, { value: a.value, label: a.label }, a.value))) })), _jsx(ToggleGroupControl, { isBlock: true, label: __('Úroveň nadpisu položek', 'brilo-blocks'), value: String(headingSettings.level), onChange: (v) => setAttributes({ headingSettings: { ...headingSettings, level: Number(v) } }), children: HEADING_LEVELS.map((l) => (_jsx(ToggleGroupControlOption, { value: String(l), label: `H${l}` }, l))) }), _jsx(ToggleGroupControl, { isBlock: true, label: __('Styl nadpisu položek', 'brilo-blocks'), value: headingSettings.style, onChange: (v) => setAttributes({ headingSettings: { ...headingSettings, style: v } }), children: HEADING_STYLES.map((s) => (_jsx(ToggleGroupControlOption, { value: s.value, label: s.label, "aria-label": s.description, showTooltip: true }, s.value))) }), _jsx(ToggleGroupControl, { isBlock: true, label: __('Velikost textu', 'brilo-blocks'), value: content.size, onChange: (v) => setAttributes({ content: { size: v } }), children: CONTENT_SIZES.map((s) => (_jsx(ToggleGroupControlOption, { value: s.value, label: s.label }, s.value))) })] }), _jsxs(PanelBody, { title: __('Styl', 'brilo-blocks'), children: [_jsx(ToggleGroupControl, { isBlock: true, label: __('Stín', 'brilo-blocks'), value: style.shadow, onChange: (v) => setAttributes({ style: { ...style, shadow: v } }), children: SHADOWS.map((s) => (_jsx(ToggleGroupControlOption, { value: s.value, label: s.label }, s.value))) }), _jsx(BaseControl, { label: __('Barva okraje', 'brilo-blocks'), help: __('Bez vybrané barvy se okraj nevykreslí.', 'brilo-blocks'), id: "usp-group-border-color", children: _jsx(ColorPalette, { colors: paletteColors, value: style.borderColor || undefined, onChange: (value) => setAttributes({ style: { ...style, borderColor: value !== null && value !== void 0 ? value : '' } }) }) }), _jsx(BaseControl, { label: __('Barva pozadí', 'brilo-blocks'), id: "usp-group-background-color", children: _jsx(ColorPalette, { colors: paletteColors, value: style.backgroundColor || undefined, onChange: (value) => setAttributes({ style: { ...style, backgroundColor: value !== null && value !== void 0 ? value : '' } }) }) }), _jsx(BaseControl, { label: __('Barva textu', 'brilo-blocks'), id: "usp-group-text-color", children: _jsx(ColorPalette, { colors: paletteColors, value: style.textColor || undefined, onChange: (value) => setAttributes({ style: { ...style, textColor: value !== null && value !== void 0 ? value : '' } }) }) })] }), _jsxs(PanelBody, { title: __('Ikona', 'brilo-blocks'), initialOpen: false, children: [_jsx(PresetSizeControl, { label: __('Velikost', 'brilo-blocks'), value: style.icon.size, presets: ICON_SIZE_PRESETS, min: ICON_SIZE_MIN, max: ICON_SIZE_MAX, onChange: (v) => setAttributes({ style: { ...style, icon: { ...style.icon, size: v } } }) }), _jsx(BaseControl, { label: __('Barva', 'brilo-blocks'), id: "usp-group-icon-color", children: _jsx(ColorPalette, { colors: paletteColors, value: style.icon.color || undefined, onChange: (value) => setAttributes({ style: { ...style, icon: { ...style.icon, color: value !== null && value !== void 0 ? value : '' } } }) }) }), _jsx(BaseControl, { label: __('Pozadí', 'brilo-blocks'), id: "usp-group-icon-background-color", children: _jsx(ColorPalette, { colors: paletteColors, value: style.icon.background || undefined, onChange: (value) => setAttributes({ style: { ...style, icon: { ...style.icon, background: value !== null && value !== void 0 ? value : '' } } }) }) }), _jsx(PresetSizeControl, { label: __('Velikost pozadí', 'brilo-blocks'), value: style.icon.backgroundSize, presets: ICON_BACKGROUND_SIZE_PRESETS, min: ICON_BACKGROUND_SIZE_MIN, max: ICON_BACKGROUND_SIZE_MAX, onChange: (v) => setAttributes({ style: { ...style, icon: { ...style.icon, backgroundSize: v } } }) }), style.icon.background && (_jsx(SelectControl, { label: __('Tvar pozadí', 'brilo-blocks'), value: style.icon.backgroundShape, options: [...ICON_BACKGROUND_SHAPES], onChange: (v) => setAttributes({ style: { ...style, icon: { ...style.icon, backgroundShape: v } } }) })), _jsx(BaseControl, { label: __('Barva ohraničení', 'brilo-blocks'), help: __('Bez vybrané barvy se okraj nevykreslí.', 'brilo-blocks'), id: "usp-group-icon-border-color", children: _jsx(ColorPalette, { colors: paletteColors, value: style.icon.borderColor || undefined, onChange: (value) => setAttributes({ style: { ...style, icon: { ...style.icon, borderColor: value !== null && value !== void 0 ? value : '' } } }) }) }), style.icon.borderColor && (_jsx(RangeControl, { label: __('Šířka ohraničení (px)', 'brilo-blocks'), value: style.icon.borderWidth, onChange: (v) => setAttributes({ style: { ...style, icon: { ...style.icon, borderWidth: v !== null && v !== void 0 ? v : 0 } } }), min: 0, max: 10, step: 1 }))] })] }), _jsx("div", { ...blockProps, children: _jsx("div", { ...innerBlocksProps }) })] }));
     };
 }

package/build/blocks/usp/usp-group/factory.d.ts

@@ -1,7 +1,7 @@
 import type { BlockConfiguration } from '@wordpress/blocks';
 import type { NumberArray, OptionArray } from '../../../types';
-import { DEFAULT_ALIGNMENTS, DEFAULT_COLUMNS, DEFAULT_CONTENT_SIZES, DEFAULT_DIRECTIONS, DEFAULT_HEADING_STYLES, DEFAULT_ICON_BACKGROUNDS, DEFAULT_ICON_COLORS, DEFAULT_ICON_SIZES, DEFAULT_SHADOWS } from './constants';
+import { DEFAULT_ALIGNMENTS, DEFAULT_COLUMNS, DEFAULT_CONTENT_SIZES, DEFAULT_DIRECTIONS, DEFAULT_HEADING_STYLES, DEFAULT_ICON_BACKGROUND_SHAPES, DEFAULT_SHADOWS } from './constants';
 import type { UspGroupAttributes, UspGroupOptions } from './types';
 export type { UspGroupAttributes, UspGroupOptions };
-export declare function createUspGroupBlock<TColumns extends NumberArray = typeof DEFAULT_COLUMNS, TDirections extends OptionArray = typeof DEFAULT_DIRECTIONS, THeadingStyles extends OptionArray = typeof DEFAULT_HEADING_STYLES, TShadows extends OptionArray = typeof DEFAULT_SHADOWS, TIconSizes extends OptionArray = typeof DEFAULT_ICON_SIZES, TIconColors extends OptionArray = typeof DEFAULT_ICON_COLORS, TIconBackgrounds extends OptionArray = typeof DEFAULT_ICON_BACKGROUNDS, TAlignments extends OptionArray = typeof DEFAULT_ALIGNMENTS, TContentSizes extends OptionArray = typeof DEFAULT_CONTENT_SIZES>(options: UspGroupOptions<TColumns, TDirections, THeadingStyles, TShadows, TIconSizes, TIconColors, TIconBackgrounds, TAlignments, TContentSizes>): BlockConfiguration<UspGroupAttributes<TColumns[number], TDirections[number]['value'], THeadingStyles[number]['value'], TShadows[number]['value'], TIconSizes[number]['value'], TIconColors[number]['value'], TIconBackgrounds[number]['value'], TAlignments[number]['value'], TContentSizes[number]['value']>>;
+export declare function createUspGroupBlock<TColumns extends NumberArray = typeof DEFAULT_COLUMNS, TDirections extends OptionArray = typeof DEFAULT_DIRECTIONS, THeadingStyles extends OptionArray = typeof DEFAULT_HEADING_STYLES, TShadows extends OptionArray = typeof DEFAULT_SHADOWS, TIconBackgroundShapes extends OptionArray = typeof DEFAULT_ICON_BACKGROUND_SHAPES, TAlignments extends OptionArray = typeof DEFAULT_ALIGNMENTS, TContentSizes extends OptionArray = typeof DEFAULT_CONTENT_SIZES>(options: UspGroupOptions<TColumns, TDirections, THeadingStyles, TShadows, TIconBackgroundShapes, TAlignments, TContentSizes>): BlockConfiguration<UspGroupAttributes<TColumns[number], TDirections[number]['value'], THeadingStyles[number]['value'], TShadows[number]['value'], TIconBackgroundShapes[number]['value'], TAlignments[number]['value'], TContentSizes[number]['value']>>;
 //# sourceMappingURL=factory.d.ts.map

package/build/blocks/usp/usp-group/factory.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"factory.d.ts","sourceRoot":"","sources":["../../../../src/blocks/usp/usp-group/factory.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,mBAAmB,CAAA;AAEzD,OAAO,KAAK,EAAC,WAAW,EAAE,WAAW,EAAC,MAAM,SAAS,CAAA;AACrD,OAAO,EACL,kBAAkB,EAClB,eAAe,EACf,qBAAqB,EACrB,kBAAkB,EAClB,sBAAsB,EACtB,wBAAwB,EACxB,mBAAmB,EACnB,kBAAkB,EAClB,eAAe,EAEhB,MAAM,aAAa,CAAA;AAGpB,OAAO,KAAK,EAAC,kBAAkB,EAAE,eAAe,EAAC,MAAM,SAAS,CAAA;AAEhE,YAAY,EAAC,kBAAkB,EAAE,eAAe,EAAC,CAAA;AAEjD,wBAAgB,mBAAmB,CACjC,QAAQ,SAAS,WAAW,GAAG,OAAO,eAAe,EACrD,WAAW,SAAS,WAAW,GAAG,OAAO,kBAAkB,EAC3D,cAAc,SAAS,WAAW,GAAG,OAAO,sBAAsB,EAClE,QAAQ,SAAS,WAAW,GAAG,OAAO,eAAe,EACrD,UAAU,SAAS,WAAW,GAAG,OAAO,kBAAkB,EAC1D,WAAW,SAAS,WAAW,GAAG,OAAO,mBAAmB,EAC5D,gBAAgB,SAAS,WAAW,GAAG,OAAO,wBAAwB,EACtE,WAAW,SAAS,WAAW,GAAG,OAAO,kBAAkB,EAC3D,aAAa,SAAS,WAAW,GAAG,OAAO,qBAAqB,EAEhE,OAAO,EAAE,eAAe,CACtB,QAAQ,EACR,WAAW,EACX,cAAc,EACd,QAAQ,EACR,UAAU,EACV,WAAW,EACX,gBAAgB,EAChB,WAAW,EACX,aAAa,CACd,GACA,kBAAkB,CACnB,kBAAkB,CAChB,QAAQ,CAAC,MAAM,CAAC,EAChB,WAAW,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,EAC5B,cAAc,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,EAC/B,QAAQ,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,EACzB,UAAU,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,EAC3B,WAAW,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,EAC5B,gBAAgB,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,EACjC,WAAW,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,EAC5B,aAAa,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAC/B,CACF,CA2DA"}
+{"version":3,"file":"factory.d.ts","sourceRoot":"","sources":["../../../../src/blocks/usp/usp-group/factory.tsx"],"names":[],"mappings":"AACA,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,mBAAmB,CAAA;AAEzD,OAAO,KAAK,EAAC,WAAW,EAAE,WAAW,EAAC,MAAM,SAAS,CAAA;AACrD,OAAO,EACL,kBAAkB,EAClB,eAAe,EACf,qBAAqB,EACrB,kBAAkB,EAClB,sBAAsB,EACtB,8BAA8B,EAG9B,eAAe,EAEhB,MAAM,aAAa,CAAA;AAGpB,OAAO,KAAK,EAAC,kBAAkB,EAAE,eAAe,EAAC,MAAM,SAAS,CAAA;AAEhE,YAAY,EAAC,kBAAkB,EAAE,eAAe,EAAC,CAAA;AAEjD,wBAAgB,mBAAmB,CACjC,QAAQ,SAAS,WAAW,GAAG,OAAO,eAAe,EACrD,WAAW,SAAS,WAAW,GAAG,OAAO,kBAAkB,EAC3D,cAAc,SAAS,WAAW,GAAG,OAAO,sBAAsB,EAClE,QAAQ,SAAS,WAAW,GAAG,OAAO,eAAe,EACrD,qBAAqB,SAAS,WAAW,GAAG,OAAO,8BAA8B,EACjF,WAAW,SAAS,WAAW,GAAG,OAAO,kBAAkB,EAC3D,aAAa,SAAS,WAAW,GAAG,OAAO,qBAAqB,EAEhE,OAAO,EAAE,eAAe,CAAC,QAAQ,EAAE,WAAW,EAAE,cAAc,EAAE,QAAQ,EAAE,qBAAqB,EAAE,WAAW,EAAE,aAAa,CAAC,GAC3H,kBAAkB,CACnB,kBAAkB,CAChB,QAAQ,CAAC,MAAM,CAAC,EAChB,WAAW,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,EAC5B,cAAc,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,EAC/B,QAAQ,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,EACzB,qBAAqB,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,EACtC,WAAW,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,EAC5B,aAAa,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAC/B,CACF,CAiEA"}

package/build/blocks/usp/usp-group/factory.js

@@ -1,40 +1,39 @@
 import { jsx as _jsx } from "react/jsx-runtime";
 import { InnerBlocks } from '@wordpress/block-editor';
 import { __ } from '@wordpress/i18n';
-import { DEFAULT_ALIGNMENTS, DEFAULT_COLUMNS, DEFAULT_CONTENT_SIZES, DEFAULT_DIRECTIONS, DEFAULT_HEADING_STYLES, DEFAULT_ICON_BACKGROUNDS, DEFAULT_ICON_COLORS, DEFAULT_ICON_SIZES, DEFAULT_SHADOWS, HEADING_LEVELS, } from './constants';
+import { DEFAULT_ALIGNMENTS, DEFAULT_COLUMNS, DEFAULT_CONTENT_SIZES, DEFAULT_DIRECTIONS, DEFAULT_HEADING_STYLES, DEFAULT_ICON_BACKGROUND_SHAPES, DEFAULT_ICON_BACKGROUND_SIZE, DEFAULT_ICON_SIZE, DEFAULT_SHADOWS, HEADING_LEVELS, } from './constants';
 import { createUspGroupEdit } from './edit';
 import { icon as defaultIcon } from './icon';
 export function createUspGroupBlock(options) {
-    var _a, _b, _c;
-    var _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q, _r, _s, _t, _u;
-    const columns = (_d = options.columns) !== null && _d !== void 0 ? _d : DEFAULT_COLUMNS;
-    const directions = (_e = options.directions) !== null && _e !== void 0 ? _e : DEFAULT_DIRECTIONS;
-    const headingStyles = (_f = options.headingStyles) !== null && _f !== void 0 ? _f : DEFAULT_HEADING_STYLES;
-    const shadows = (_g = options.shadows) !== null && _g !== void 0 ? _g : DEFAULT_SHADOWS;
-    const iconSizes = (_h = options.iconSizes) !== null && _h !== void 0 ? _h : DEFAULT_ICON_SIZES;
-    const iconColors = (_j = options.iconColors) !== null && _j !== void 0 ? _j : DEFAULT_ICON_COLORS;
-    const iconBackgrounds = (_k = options.iconBackgrounds) !== null && _k !== void 0 ? _k : DEFAULT_ICON_BACKGROUNDS;
-    const alignments = (_l = options.alignments) !== null && _l !== void 0 ? _l : DEFAULT_ALIGNMENTS;
-    const contentSizes = (_m = options.contentSizes) !== null && _m !== void 0 ? _m : DEFAULT_CONTENT_SIZES;
+    var _a, _b;
+    var _c, _d, _e, _f, _g, _h, _j, _k, _l, _m, _o, _p, _q;
+    const columns = (_c = options.columns) !== null && _c !== void 0 ? _c : DEFAULT_COLUMNS;
+    const directions = (_d = options.directions) !== null && _d !== void 0 ? _d : DEFAULT_DIRECTIONS;
+    const headingStyles = (_e = options.headingStyles) !== null && _e !== void 0 ? _e : DEFAULT_HEADING_STYLES;
+    const shadows = (_f = options.shadows) !== null && _f !== void 0 ? _f : DEFAULT_SHADOWS;
+    const iconBackgroundShapes = (_g = options.iconBackgroundShapes) !== null && _g !== void 0 ? _g : DEFAULT_ICON_BACKGROUND_SHAPES;
+    const alignments = (_h = options.alignments) !== null && _h !== void 0 ? _h : DEFAULT_ALIGNMENTS;
+    const contentSizes = (_j = options.contentSizes) !== null && _j !== void 0 ? _j : DEFAULT_CONTENT_SIZES;
     return {
         name: options.name,
-        title: (_o = options.title) !== null && _o !== void 0 ? _o : __('USP Konkurenční výhody', 'brilo-blocks'),
+        title: (_k = options.title) !== null && _k !== void 0 ? _k : __('USP Konkurenční výhody', 'brilo-blocks'),
         description: options.description,
-        category: (_p = options.category) !== null && _p !== void 0 ? _p : 'layout',
+        category: (_l = options.category) !== null && _l !== void 0 ? _l : 'layout',
         ...(options.parent && { parent: options.parent }),
-        icon: (_q = options.icon) !== null && _q !== void 0 ? _q : { src: defaultIcon },
+        icon: (_m = options.icon) !== null && _m !== void 0 ? _m : { src: defaultIcon },
         supports: { html: false, customClassName: false },
+        providesContext: { 'brilo/usp-style': 'style' },
         attributes: {
             columns: {
                 type: 'number',
-                default: (_r = columns[1]) !== null && _r !== void 0 ? _r : columns[0],
+                default: (_o = columns[1]) !== null && _o !== void 0 ? _o : columns[0],
                 enum: [...columns],
             },
             headingSettings: {
                 type: 'object',
-                default: { level: HEADING_LEVELS[0], style: (_s = (_a = headingStyles[2]) === null || _a === void 0 ? void 0 : _a.value) !== null && _s !== void 0 ? _s : headingStyles[0].value },
+                default: { level: HEADING_LEVELS[0], style: (_p = (_a = headingStyles[2]) === null || _a === void 0 ? void 0 : _a.value) !== null && _p !== void 0 ? _p : headingStyles[0].value },
             },
-            content: { type: 'object', default: { size: (_t = (_b = contentSizes[1]) === null || _b === void 0 ? void 0 : _b.value) !== null && _t !== void 0 ? _t : contentSizes[0].value } },
+            content: { type: 'object', default: { size: (_q = (_b = contentSizes[1]) === null || _b === void 0 ? void 0 : _b.value) !== null && _q !== void 0 ? _q : contentSizes[0].value } },
             style: {
                 type: 'object',
                 default: {
@@ -42,10 +41,19 @@ export function createUspGroupBlock(options) {
                     card: false,
                     direction: directions[0].value,
                     align: alignments[0].value,
+                    textAlign: '',
                     borderColor: '',
                     backgroundColor: '',
                     textColor: '',
-                    icon: { size: (_u = (_c = iconSizes[2]) === null || _c === void 0 ? void 0 : _c.value) !== null && _u !== void 0 ? _u : iconSizes[0].value, color: iconColors[0].value, background: iconBackgrounds[0].value },
+                    icon: {
+                        size: DEFAULT_ICON_SIZE,
+                        color: '',
+                        background: '',
+                        backgroundSize: DEFAULT_ICON_BACKGROUND_SIZE,
+                        backgroundShape: iconBackgroundShapes[0].value,
+                        borderColor: '',
+                        borderWidth: 1,
+                    },
                 },
             },
         },

package/build/blocks/usp/usp-group/types.d.ts

@@ -1,16 +1,18 @@
 import type { BriloBlockType, NumberArray, OptionArray } from '../../../types';
-import type { DEFAULT_ALIGNMENTS, DEFAULT_COLUMNS, DEFAULT_CONTENT_SIZES, DEFAULT_DIRECTIONS, DEFAULT_HEADING_STYLES, DEFAULT_ICON_BACKGROUNDS, DEFAULT_ICON_COLORS, DEFAULT_ICON_SIZES, DEFAULT_SHADOWS, HEADING_LEVELS } from './constants';
+import type { DEFAULT_ALIGNMENTS, DEFAULT_COLUMNS, DEFAULT_CONTENT_SIZES, DEFAULT_DIRECTIONS, DEFAULT_HEADING_STYLES, DEFAULT_ICON_BACKGROUND_SHAPES, DEFAULT_SHADOWS, HEADING_LEVELS } from './constants';
 export type UspColumns = (typeof DEFAULT_COLUMNS)[number];
 export type UspDirection = (typeof DEFAULT_DIRECTIONS)[number]['value'];
 export type UspHeadingLevel = (typeof HEADING_LEVELS)[number];
 export type UspHeadingStyle = (typeof DEFAULT_HEADING_STYLES)[number]['value'];
 export type UspShadow = (typeof DEFAULT_SHADOWS)[number]['value'];
 export type UspAlignment = (typeof DEFAULT_ALIGNMENTS)[number]['value'];
-export type UspIconSize = (typeof DEFAULT_ICON_SIZES)[number]['value'];
-export type UspIconColor = (typeof DEFAULT_ICON_COLORS)[number]['value'];
-export type UspIconBackground = (typeof DEFAULT_ICON_BACKGROUNDS)[number]['value'];
 export type UspContentSize = (typeof DEFAULT_CONTENT_SIZES)[number]['value'];
-export interface UspGroupAttributes<TColumn extends number = UspColumns, TDirection extends string = UspDirection, THeadingStyle extends string = UspHeadingStyle, TShadow extends string = UspShadow, TIconSize extends string = UspIconSize, TIconColor extends string = UspIconColor, TIconBackground extends string = UspIconBackground, TAlignment extends string = UspAlignment, TContentSize extends string = UspContentSize> extends Record<string, unknown> {
+export type UspIconBackgroundShape = (typeof DEFAULT_ICON_BACKGROUND_SHAPES)[number]['value'];
+export interface UspSizePreset {
+    value: number;
+    label: string;
+}
+export interface UspGroupAttributes<TColumn extends number = UspColumns, TDirection extends string = UspDirection, THeadingStyle extends string = UspHeadingStyle, TShadow extends string = UspShadow, TIconBackgroundShape extends string = UspIconBackgroundShape, TAlignment extends string = UspAlignment, TContentSize extends string = UspContentSize> extends Record<string, unknown> {
     columns: TColumn;
     headingSettings: {
         level: UspHeadingLevel;
@@ -24,26 +26,30 @@ export interface UspGroupAttributes<TColumn extends number = UspColumns, TDirect
         card: boolean;
         direction: TDirection;
         align: TAlignment;
+        textAlign: string;
         borderColor: string;
         backgroundColor: string;
         textColor: string;
         icon: {
-            size: TIconSize;
-            color: TIconColor;
-            background: TIconBackground;
-            bordered?: boolean;
+            size: number;
+            color: string;
+            background: string;
+            backgroundSize: number;
+            backgroundShape: TIconBackgroundShape;
+            borderColor: string;
+            borderWidth: number;
         };
     };
 }
-export interface UspGroupOptions<TColumns extends NumberArray = typeof DEFAULT_COLUMNS, TDirections extends OptionArray = typeof DEFAULT_DIRECTIONS, THeadingStyles extends OptionArray = typeof DEFAULT_HEADING_STYLES, TShadows extends OptionArray = typeof DEFAULT_SHADOWS, TIconSizes extends OptionArray = typeof DEFAULT_ICON_SIZES, TIconColors extends OptionArray = typeof DEFAULT_ICON_COLORS, TIconBackgrounds extends OptionArray = typeof DEFAULT_ICON_BACKGROUNDS, TAlignments extends OptionArray = typeof DEFAULT_ALIGNMENTS, TContentSizes extends OptionArray = typeof DEFAULT_CONTENT_SIZES> extends BriloBlockType {
+export interface UspGroupOptions<TColumns extends NumberArray = typeof DEFAULT_COLUMNS, TDirections extends OptionArray = typeof DEFAULT_DIRECTIONS, THeadingStyles extends OptionArray = typeof DEFAULT_HEADING_STYLES, TShadows extends OptionArray = typeof DEFAULT_SHADOWS, TIconBackgroundShapes extends OptionArray = typeof DEFAULT_ICON_BACKGROUND_SHAPES, TAlignments extends OptionArray = typeof DEFAULT_ALIGNMENTS, TContentSizes extends OptionArray = typeof DEFAULT_CONTENT_SIZES> extends BriloBlockType {
     allowedBlocks: string[];
     columns?: TColumns;
     directions?: TDirections;
     headingStyles?: THeadingStyles;
     shadows?: TShadows;
-    iconSizes?: TIconSizes;
-    iconColors?: TIconColors;
-    iconBackgrounds?: TIconBackgrounds;
+    iconSizePresets?: readonly UspSizePreset[];
+    iconBackgroundSizePresets?: readonly UspSizePreset[];
+    iconBackgroundShapes?: TIconBackgroundShapes;
     alignments?: TAlignments;
     contentSizes?: TContentSizes;
 }