@brilo/base-blocks 0.1.30 → 0.1.32
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/build/.tsbuildinfo +1 -1
- package/build/blocks/document/documents-grid/types.d.ts.map +1 -1
- package/build/blocks/groups/banner-group/edit.d.ts.map +1 -1
- package/build/blocks/groups/banner-group/edit.js +3 -1
- package/build/blocks/groups/banner-group/factory.js +1 -1
- package/build/blocks/groups/banner-group/types.d.ts +1 -0
- package/build/blocks/groups/banner-group/types.d.ts.map +1 -1
- package/build/blocks/groups/basic-header-group/edit.d.ts.map +1 -1
- package/build/blocks/groups/basic-header-group/edit.js +4 -2
- package/build/blocks/groups/basic-header-group/factory.js +1 -1
- package/build/blocks/groups/basic-header-group/types.d.ts +1 -0
- package/build/blocks/groups/basic-header-group/types.d.ts.map +1 -1
- package/build/blocks/groups/text-and-media-group/edit.d.ts.map +1 -1
- package/build/blocks/groups/text-and-media-group/edit.js +5 -3
- package/build/blocks/groups/text-and-media-group/factory.js +1 -1
- package/build/blocks/groups/text-and-media-group/types.d.ts +1 -0
- package/build/blocks/groups/text-and-media-group/types.d.ts.map +1 -1
- package/build/blocks/hero/hero-item/edit.d.ts.map +1 -1
- package/build/blocks/hero/hero-item/edit.js +5 -3
- package/build/blocks/hero/hero-item/factory.d.ts.map +1 -1
- package/build/blocks/hero/hero-item/factory.js +1 -0
- package/build/blocks/hero/hero-item/types.d.ts +1 -0
- package/build/blocks/hero/hero-item/types.d.ts.map +1 -1
- package/package.json +1 -1
- package/src/blocks/document/documents-grid/types.ts +1 -6
- package/src/blocks/groups/banner-group/edit.tsx +10 -0
- package/src/blocks/groups/banner-group/factory.tsx +1 -1
- package/src/blocks/groups/banner-group/types.ts +1 -1
- package/src/blocks/groups/basic-header-group/edit.tsx +13 -1
- package/src/blocks/groups/basic-header-group/factory.tsx +1 -1
- package/src/blocks/groups/basic-header-group/types.ts +1 -1
- package/src/blocks/groups/text-and-media-group/edit.tsx +13 -1
- package/src/blocks/groups/text-and-media-group/factory.tsx +1 -1
- package/src/blocks/groups/text-and-media-group/types.ts +1 -1
- package/src/blocks/hero/hero-item/edit.tsx +9 -1
- package/src/blocks/hero/hero-item/factory.tsx +1 -0
- package/src/blocks/hero/hero-item/types.ts +1 -0
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/blocks/document/documents-grid/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,SAAS,CAAA;AAC3C,OAAO,KAAK,
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/blocks/document/documents-grid/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,cAAc,EAAC,MAAM,SAAS,CAAA;AAC3C,OAAO,KAAK,EAAC,6BAA6B,EAAE,6BAA6B,EAAE,oBAAoB,EAAE,uBAAuB,EAAC,MAAM,aAAa,CAAA;AAE5I,MAAM,MAAM,iBAAiB,GAAG,CAAC,OAAO,oBAAoB,CAAC,CAAC,MAAM,CAAC,CAAA;AACrE,MAAM,MAAM,yBAAyB,GAAG,CAAC,OAAO,6BAA6B,CAAC,CAAC,MAAM,CAAC,CAAA;AACtF,MAAM,MAAM,mBAAmB,GAAG,CAAC,OAAO,uBAAuB,CAAC,CAAC,MAAM,CAAC,CAAA;AAC1E,MAAM,MAAM,oBAAoB,GAAG,CAAC,OAAO,6BAA6B,CAAC,CAAC,MAAM,CAAC,CAAA;AAEjF,MAAM,WAAW,uBAAwB,SAAQ,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IACtE,IAAI,EAAE,iBAAiB,CAAA;IACvB,YAAY,EAAE,yBAAyB,CAAA;IACvC,MAAM,EAAE,mBAAmB,CAAA;IAC3B,OAAO,EAAE,oBAAoB,CAAA;IAC7B,iBAAiB,EAAE,MAAM,EAAE,CAAA;IAC3B,kBAAkB,EAAE,MAAM,EAAE,CAAA;CAC7B;AAED,MAAM,WAAW,kBAAkB;IACjC,aAAa,EAAE,MAAM,EAAE,CAAA;IACvB,QAAQ,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,KAAK,IAAI,CAAA;CAClC;AAED,MAAM,WAAW,oBAAqB,SAAQ,cAAc;IAC1D,qBAAqB,CAAC,EAAE,CAAC,KAAK,EAAE,kBAAkB,KAAK,GAAG,CAAC,OAAO,CAAA;IAClE,sBAAsB,CAAC,EAAE,CAAC,KAAK,EAAE,kBAAkB,KAAK,GAAG,CAAC,OAAO,CAAA;CACpE"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"edit.d.ts","sourceRoot":"","sources":["../../../../src/blocks/groups/banner-group/edit.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"edit.d.ts","sourceRoot":"","sources":["../../../../src/blocks/groups/banner-group/edit.tsx"],"names":[],"mappings":"AAeA,OAAO,KAAK,EAAC,qBAAqB,EAAE,kBAAkB,EAAyC,MAAM,SAAS,CAAA;AAG9G,wBAAgB,qBAAqB,CAAC,OAAO,EAAE,kBAAkB,oCAO5D;IACD,UAAU,EAAE,qBAAqB,CAAA;IACjC,aAAa,EAAE,CAAC,CAAC,EAAE,OAAO,CAAC,qBAAqB,CAAC,KAAK,IAAI,CAAA;CAC3D,iCAuGF"}
|
|
@@ -4,6 +4,7 @@ import { PanelBody, __experimentalToggleGroupControl as ToggleGroupControl, __ex
|
|
|
4
4
|
import { __ } from '@wordpress/i18n';
|
|
5
5
|
import { ImagePickerControl } from '../../../components/ImagePicker';
|
|
6
6
|
import { useGroupBlock } from '../../../hooks/useGroupBlock';
|
|
7
|
+
import { useTenantColorPalette } from '../../../hooks/useTenantColorPalette';
|
|
7
8
|
import { DEFAULT_HEADING_STYLES, DEFAULT_VARIANTS } from './constants';
|
|
8
9
|
import { HEADING_LEVELS } from '../../../constants';
|
|
9
10
|
import clsx from 'clsx';
|
|
@@ -14,12 +15,13 @@ export function createBannerGroupEdit(options) {
|
|
|
14
15
|
return function Edit({ attributes, setAttributes, }) {
|
|
15
16
|
var _a, _b;
|
|
16
17
|
const { header, img, description, variant, hasBackgroundColor, backgroundColor, textColor } = attributes;
|
|
18
|
+
const { paletteColors } = useTenantColorPalette();
|
|
17
19
|
const { blockProps, innerBlocksProps } = useGroupBlock({
|
|
18
20
|
blockClassName: [(_a = options.blockClassName) !== null && _a !== void 0 ? _a : 'g-banner wp-block-section', `--variant-${variant}`],
|
|
19
21
|
containerClassName: (_b = options.containerClassName) !== null && _b !== void 0 ? _b : 'g-banner__inner-blocks',
|
|
20
22
|
allowedBlocks: options.allowedBlocks,
|
|
21
23
|
template: options.template,
|
|
22
24
|
});
|
|
23
|
-
return (_jsxs(_Fragment, { children: [_jsxs(InspectorControls, { children: [_jsx(PanelBody, { title: __('Vzhled', 'brilo-blocks'), children: _jsx(ToggleGroupControl, { label: __('Varianta', 'brilo-blocks'), value: variant, onChange: (value) => setAttributes({ variant: value }), isBlock: true, children: VARIANTS.map((v) => (_jsx(ToggleGroupControlOption, { value: v.value, label: v.label }, v.value))) }) }), _jsxs(PanelBody, { title: __('Nadpis', 'brilo-blocks'), initialOpen: false, children: [_jsx(ToggleGroupControl, { label: __('Úroveň nadpisu', 'brilo-blocks'), value: String(header.heading.level), onChange: (value) => setAttributes({ header: { ...header, heading: { ...header.heading, level: Number(value) } } }), isBlock: true, children: HEADING_LEVELS.map((l) => (_jsx(ToggleGroupControlOption, { value: String(l), label: `H${l}` }, l))) }), _jsx(ToggleGroupControl, { label: __('Styl nadpisu', 'brilo-blocks'), value: header.heading.style, onChange: (value) => setAttributes({ header: { ...header, heading: { ...header.heading, style: value } } }), isBlock: true, children: HEADING_STYLES.map((s) => (_jsx(ToggleGroupControlOption, { value: s, label: s }, s))) })] }), _jsx(PanelBody, { title: __('Obrázek v pozadí', 'brilo-blocks'), children: _jsx(ImagePickerControl, { value: img, onChange: (val) => setAttributes({ img: val }) }) }), _jsxs(PanelBody, { title: __('Vzhled', 'brilo-blocks'), children: [_jsx(ToggleControl, { label: __('Použít barvu pozadí', 'brilo-blocks'), checked: hasBackgroundColor, onChange: (value) => setAttributes({ hasBackgroundColor: value }) }), hasBackgroundColor && (_jsx(BaseControl, { label: __('Barva pozadí', 'brilo-blocks'), children: _jsx(ColorPalette, { value: backgroundColor, onChange: (value) => setAttributes({ backgroundColor: value }), enableAlpha: true }) })), _jsx(BaseControl, { label: __('Barva textu', 'brilo-blocks'), children: _jsx(ColorPalette, { value: textColor, onChange: (value) => setAttributes({ textColor: value }) }) })] })] }), _jsxs("div", { ...blockProps, children: [_jsxs("div", { className: "g-banner__content", children: [_jsx(RichText, { tagName: `h${header.heading.level}`, className: clsx('g-banner__heading', `--heading-style-${header.heading.style}`, 'u-text-editable'), value: header.heading.title, onChange: (value) => setAttributes({ header: { ...header, heading: { ...header.heading, title: value } } }), placeholder: __('Nadpis...', 'brilo-blocks'), allowedFormats: ['core/bold', 'core/italic'] }), _jsx(RichText, { tagName: "div", className: "g-banner__description u-text-editable", value: description, onChange: (value) => setAttributes({ description: value }), placeholder: __('Popis...', 'brilo-blocks') })] }), _jsx("div", { ...innerBlocksProps })] })] }));
|
|
25
|
+
return (_jsxs(_Fragment, { children: [_jsxs(InspectorControls, { children: [_jsx(PanelBody, { title: __('Vzhled', 'brilo-blocks'), children: _jsx(ToggleGroupControl, { label: __('Varianta', 'brilo-blocks'), value: variant, onChange: (value) => setAttributes({ variant: value }), isBlock: true, children: VARIANTS.map((v) => (_jsx(ToggleGroupControlOption, { value: v.value, label: v.label }, v.value))) }) }), _jsxs(PanelBody, { title: __('Nadpis', 'brilo-blocks'), initialOpen: false, children: [_jsx(ToggleGroupControl, { label: __('Úroveň nadpisu', 'brilo-blocks'), value: String(header.heading.level), onChange: (value) => setAttributes({ header: { ...header, heading: { ...header.heading, level: Number(value) } } }), isBlock: true, children: HEADING_LEVELS.map((l) => (_jsx(ToggleGroupControlOption, { value: String(l), label: `H${l}` }, l))) }), _jsx(ToggleGroupControl, { label: __('Styl nadpisu', 'brilo-blocks'), value: header.heading.style, onChange: (value) => setAttributes({ header: { ...header, heading: { ...header.heading, style: value } } }), isBlock: true, children: HEADING_STYLES.map((s) => (_jsx(ToggleGroupControlOption, { value: s, label: s }, s))) }), _jsx(BaseControl, { label: __('Barva nadpisu', 'brilo-blocks'), children: _jsx(ColorPalette, { colors: paletteColors, value: header.heading.color || undefined, onChange: (value) => setAttributes({ header: { ...header, heading: { ...header.heading, color: value !== null && value !== void 0 ? value : '' } } }) }) })] }), _jsx(PanelBody, { title: __('Obrázek v pozadí', 'brilo-blocks'), children: _jsx(ImagePickerControl, { value: img, onChange: (val) => setAttributes({ img: val }) }) }), _jsxs(PanelBody, { title: __('Vzhled', 'brilo-blocks'), children: [_jsx(ToggleControl, { label: __('Použít barvu pozadí', 'brilo-blocks'), checked: hasBackgroundColor, onChange: (value) => setAttributes({ hasBackgroundColor: value }) }), hasBackgroundColor && (_jsx(BaseControl, { label: __('Barva pozadí', 'brilo-blocks'), children: _jsx(ColorPalette, { value: backgroundColor, onChange: (value) => setAttributes({ backgroundColor: value }), enableAlpha: true }) })), _jsx(BaseControl, { label: __('Barva textu', 'brilo-blocks'), children: _jsx(ColorPalette, { value: textColor, onChange: (value) => setAttributes({ textColor: value }) }) })] })] }), _jsxs("div", { ...blockProps, children: [_jsxs("div", { className: "g-banner__content", children: [_jsx(RichText, { tagName: `h${header.heading.level}`, className: clsx('g-banner__heading', `--heading-style-${header.heading.style}`, 'u-text-editable'), style: header.heading.color ? { color: header.heading.color } : undefined, value: header.heading.title, onChange: (value) => setAttributes({ header: { ...header, heading: { ...header.heading, title: value } } }), placeholder: __('Nadpis...', 'brilo-blocks'), allowedFormats: ['core/bold', 'core/italic'] }), _jsx(RichText, { tagName: "div", className: "g-banner__description u-text-editable", value: description, onChange: (value) => setAttributes({ description: value }), placeholder: __('Popis...', 'brilo-blocks') })] }), _jsx("div", { ...innerBlocksProps })] })] }));
|
|
24
26
|
};
|
|
25
27
|
}
|
|
@@ -25,7 +25,7 @@ export function createBannerGroupBlock(options) {
|
|
|
25
25
|
header: {
|
|
26
26
|
type: 'object',
|
|
27
27
|
default: {
|
|
28
|
-
heading: { title: '', level: HEADING_LEVELS[1], style: (_f = headingStyles[1]) !== null && _f !== void 0 ? _f : headingStyles[0] },
|
|
28
|
+
heading: { title: '', level: HEADING_LEVELS[1], style: (_f = headingStyles[1]) !== null && _f !== void 0 ? _f : headingStyles[0], color: '' },
|
|
29
29
|
},
|
|
30
30
|
},
|
|
31
31
|
img: {
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/blocks/groups/banner-group/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,cAAc,EAAE,KAAK,EAAE,WAAW,EAAE,WAAW,EAAC,MAAM,SAAS,CAAA;AAC5E,OAAO,EAAC,sBAAsB,EAAE,gBAAgB,EAAC,MAAM,aAAa,CAAA;AACpE,OAAO,EAAC,cAAc,EAAC,MAAM,aAAa,CAAA;AAE1C,MAAM,MAAM,QAAQ,GAAG,CAAC,OAAO,gBAAgB,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA;AACjE,MAAM,MAAM,aAAa,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAA;AAC3D,MAAM,MAAM,aAAa,GAAG,CAAC,OAAO,sBAAsB,CAAC,CAAC,MAAM,CAAC,CAAA;AAEnE,MAAM,WAAW,qBAAqB,CAAC,QAAQ,SAAS,MAAM,GAAG,QAAQ,EAAE,aAAa,SAAS,MAAM,GAAG,aAAa,CACrH,SAAQ,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IAC/B,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,EAAE;QACN,OAAO,EAAE;YAAC,KAAK,EAAE,MAAM,CAAC;YAAC,KAAK,EAAE,aAAa,CAAC;YAAC,KAAK,EAAE,aAAa,CAAA;SAAC,CAAA;
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/blocks/groups/banner-group/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,cAAc,EAAE,KAAK,EAAE,WAAW,EAAE,WAAW,EAAC,MAAM,SAAS,CAAA;AAC5E,OAAO,EAAC,sBAAsB,EAAE,gBAAgB,EAAC,MAAM,aAAa,CAAA;AACpE,OAAO,EAAC,cAAc,EAAC,MAAM,aAAa,CAAA;AAE1C,MAAM,MAAM,QAAQ,GAAG,CAAC,OAAO,gBAAgB,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA;AACjE,MAAM,MAAM,aAAa,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAA;AAC3D,MAAM,MAAM,aAAa,GAAG,CAAC,OAAO,sBAAsB,CAAC,CAAC,MAAM,CAAC,CAAA;AAEnE,MAAM,WAAW,qBAAqB,CAAC,QAAQ,SAAS,MAAM,GAAG,QAAQ,EAAE,aAAa,SAAS,MAAM,GAAG,aAAa,CACrH,SAAQ,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IAC/B,KAAK,EAAE,MAAM,CAAA;IACb,MAAM,EAAE;QACN,OAAO,EAAE;YAAC,KAAK,EAAE,MAAM,CAAC;YAAC,KAAK,EAAE,aAAa,CAAC;YAAC,KAAK,EAAE,aAAa,CAAC;YAAC,KAAK,CAAC,EAAE,MAAM,CAAA;SAAC,CAAA;KACrF,CAAA;IACD,GAAG,EAAE,KAAK,CAAA;IACV,kBAAkB,EAAE,OAAO,CAAA;IAC3B,eAAe,EAAE,MAAM,CAAA;IACvB,SAAS,EAAE,MAAM,CAAA;IACjB,WAAW,EAAE,MAAM,CAAA;IACnB,OAAO,EAAE,QAAQ,CAAA;CAClB;AAED,MAAM,WAAW,kBAAkB,CACjC,SAAS,SAAS,WAAW,GAAG,OAAO,gBAAgB,EACvD,cAAc,SAAS,WAAW,GAAG,OAAO,sBAAsB,CAClE,SAAQ,cAAc;IACtB,QAAQ,CAAC,EAAE,SAAS,CAAA;IACpB,aAAa,CAAC,EAAE,cAAc,CAAA;IAC9B,aAAa,CAAC,EAAE,aAAa,CAAA;CAC9B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"edit.d.ts","sourceRoot":"","sources":["../../../../src/blocks/groups/basic-header-group/edit.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"edit.d.ts","sourceRoot":"","sources":["../../../../src/blocks/groups/basic-header-group/edit.tsx"],"names":[],"mappings":"AAYA,OAAO,KAAK,EAAC,0BAA0B,EAAE,uBAAuB,EAAgC,MAAM,SAAS,CAAA;AAE/G,wBAAgB,0BAA0B,CAAC,OAAO,EAAE,uBAAuB,oCAQtE;IACD,UAAU,EAAE,0BAA0B,CAAA;IACtC,aAAa,EAAE,CAAC,CAAC,EAAE,OAAO,CAAC,0BAA0B,CAAC,KAAK,IAAI,CAAA;CAChE,iCAqFF"}
|
|
@@ -1,8 +1,9 @@
|
|
|
1
1
|
import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { InspectorControls, RichText, useBlockProps } from '@wordpress/block-editor';
|
|
3
|
-
import { PanelBody, __experimentalToggleGroupControl as ToggleGroupControl, __experimentalToggleGroupControlOption as ToggleGroupControlOption, } from '@wordpress/components';
|
|
3
|
+
import { BaseControl, ColorPalette, PanelBody, __experimentalToggleGroupControl as ToggleGroupControl, __experimentalToggleGroupControlOption as ToggleGroupControlOption, } from '@wordpress/components';
|
|
4
4
|
import { __ } from '@wordpress/i18n';
|
|
5
5
|
import clsx from 'clsx';
|
|
6
|
+
import { useTenantColorPalette } from '../../../hooks/useTenantColorPalette';
|
|
6
7
|
import { DEFAULT_ALIGNMENTS, DEFAULT_LEVELS, DEFAULT_STYLES } from './constants';
|
|
7
8
|
export function createBasicHeaderGroupEdit(options) {
|
|
8
9
|
var _a, _b, _c;
|
|
@@ -15,8 +16,9 @@ export function createBasicHeaderGroupEdit(options) {
|
|
|
15
16
|
const blockProps = useBlockProps({
|
|
16
17
|
className: clsx((_a = options.blockClassName) !== null && _a !== void 0 ? _a : 'g-header wp-block-section', `--textAlign-${textAlign}`),
|
|
17
18
|
});
|
|
19
|
+
const { paletteColors } = useTenantColorPalette();
|
|
18
20
|
return (_jsxs(_Fragment, { children: [_jsx(InspectorControls, { children: _jsxs(PanelBody, { title: __('Nadpis', 'brilo-blocks'), children: [_jsx(ToggleGroupControl, { label: __('Úroveň nadpisu', 'brilo-blocks'), value: String(heading.level), onChange: (value) => setAttributes({
|
|
19
21
|
heading: { ...heading, level: Number(value) },
|
|
20
|
-
}), isBlock: true, children: LEVELS.map((l) => (_jsx(ToggleGroupControlOption, { value: String(l), label: `H${l}` }, l))) }), _jsx(ToggleGroupControl, { label: __('Styl nadpisu', 'brilo-blocks'), value: heading.style, onChange: (value) => setAttributes({ heading: { ...heading, style: value } }), isBlock: true, children: STYLES.map((s) => (_jsx(ToggleGroupControlOption, { value: s, label: s.toUpperCase() }, s))) }), _jsx(ToggleGroupControl, { label: __('Zarovnání', 'brilo-blocks'), value: textAlign, onChange: (value) => setAttributes({ textAlign: value }), isBlock: true, children: ALIGNMENTS.map((a) => (_jsx(ToggleGroupControlOption, { value: a.value, label: a.label }, a.value))) })] }) }), _jsxs("div", { ...blockProps, children: [_jsx(RichText, { tagName: "span", className: "g-header__overline u-text-editable", value: overline.title, onChange: (value) => setAttributes({ overline: { title: value } }), placeholder: __('Overline...', 'brilo-blocks'), allowedFormats: [] }), _jsx(RichText, { tagName: `h${heading.level}`, className: clsx('g-header__heading', `--heading-style-${heading.style}`, 'u-text-editable'), value: heading.title, onChange: (value) => setAttributes({ heading: { ...heading, title: value } }), placeholder: __('Nadpis...', 'brilo-blocks'), allowedFormats: ['core/bold', 'core/italic'] }), _jsx(RichText, { tagName: "div", multiline: "p", className: "g-header__content u-text-editable", value: content, onChange: (value) => setAttributes({ content: value }), placeholder: __('Perex...', 'brilo-blocks'), allowedFormats: ['core/bold', 'core/italic', 'core/link'] })] })] }));
|
|
22
|
+
}), isBlock: true, children: LEVELS.map((l) => (_jsx(ToggleGroupControlOption, { value: String(l), label: `H${l}` }, l))) }), _jsx(ToggleGroupControl, { label: __('Styl nadpisu', 'brilo-blocks'), value: heading.style, onChange: (value) => setAttributes({ heading: { ...heading, style: value } }), isBlock: true, children: STYLES.map((s) => (_jsx(ToggleGroupControlOption, { value: s, label: s.toUpperCase() }, s))) }), _jsx(BaseControl, { label: __('Barva nadpisu', 'brilo-blocks'), children: _jsx(ColorPalette, { colors: paletteColors, value: heading.color || undefined, onChange: (value) => setAttributes({ heading: { ...heading, color: value !== null && value !== void 0 ? value : '' } }) }) }), _jsx(ToggleGroupControl, { label: __('Zarovnání', 'brilo-blocks'), value: textAlign, onChange: (value) => setAttributes({ textAlign: value }), isBlock: true, children: ALIGNMENTS.map((a) => (_jsx(ToggleGroupControlOption, { value: a.value, label: a.label }, a.value))) })] }) }), _jsxs("div", { ...blockProps, children: [_jsx(RichText, { tagName: "span", className: "g-header__overline u-text-editable", value: overline.title, onChange: (value) => setAttributes({ overline: { title: value } }), placeholder: __('Overline...', 'brilo-blocks'), allowedFormats: [] }), _jsx(RichText, { tagName: `h${heading.level}`, className: clsx('g-header__heading', `--heading-style-${heading.style}`, 'u-text-editable'), style: heading.color ? { color: heading.color } : undefined, value: heading.title, onChange: (value) => setAttributes({ heading: { ...heading, title: value } }), placeholder: __('Nadpis...', 'brilo-blocks'), allowedFormats: ['core/bold', 'core/italic', 'core/text-color'] }), _jsx(RichText, { tagName: "div", multiline: "p", className: "g-header__content u-text-editable", value: content, onChange: (value) => setAttributes({ content: value }), placeholder: __('Perex...', 'brilo-blocks'), allowedFormats: ['core/bold', 'core/italic', 'core/link'] })] })] }));
|
|
21
23
|
};
|
|
22
24
|
}
|
|
@@ -19,7 +19,7 @@ export function createBasicHeaderGroupBlock(options) {
|
|
|
19
19
|
attributes: {
|
|
20
20
|
heading: {
|
|
21
21
|
type: 'object',
|
|
22
|
-
default: { title: '', level: (_h = levels[1]) !== null && _h !== void 0 ? _h : levels[0], style: (_j = styles[1]) !== null && _j !== void 0 ? _j : styles[0] },
|
|
22
|
+
default: { title: '', level: (_h = levels[1]) !== null && _h !== void 0 ? _h : levels[0], style: (_j = styles[1]) !== null && _j !== void 0 ? _j : styles[0], color: '' },
|
|
23
23
|
},
|
|
24
24
|
overline: { type: 'object', default: { title: '' } },
|
|
25
25
|
content: { type: 'string', default: '' },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/blocks/groups/basic-header-group/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,cAAc,EAAE,WAAW,EAAE,WAAW,EAAE,WAAW,EAAC,MAAM,SAAS,CAAA;AAClF,OAAO,KAAK,EAAC,kBAAkB,EAAE,cAAc,EAAE,cAAc,EAAC,MAAM,aAAa,CAAA;AAEnF,MAAM,MAAM,eAAe,GAAG,CAAC,OAAO,kBAAkB,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA;AAC1E,MAAM,MAAM,YAAY,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAA;AAC1D,MAAM,MAAM,YAAY,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAA;AAE1D,MAAM,WAAW,0BAA0B,CACzC,MAAM,SAAS,MAAM,GAAG,YAAY,EACpC,MAAM,SAAS,MAAM,GAAG,YAAY,EACpC,UAAU,SAAS,MAAM,GAAG,eAAe,CAC3C,SAAQ,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IAC/B,OAAO,EAAE;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,CAAA;
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/blocks/groups/basic-header-group/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,cAAc,EAAE,WAAW,EAAE,WAAW,EAAE,WAAW,EAAC,MAAM,SAAS,CAAA;AAClF,OAAO,KAAK,EAAC,kBAAkB,EAAE,cAAc,EAAE,cAAc,EAAC,MAAM,aAAa,CAAA;AAEnF,MAAM,MAAM,eAAe,GAAG,CAAC,OAAO,kBAAkB,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA;AAC1E,MAAM,MAAM,YAAY,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAA;AAC1D,MAAM,MAAM,YAAY,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAA;AAE1D,MAAM,WAAW,0BAA0B,CACzC,MAAM,SAAS,MAAM,GAAG,YAAY,EACpC,MAAM,SAAS,MAAM,GAAG,YAAY,EACpC,UAAU,SAAS,MAAM,GAAG,eAAe,CAC3C,SAAQ,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IAC/B,OAAO,EAAE;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,EAAE,MAAM,CAAC;QAAC,KAAK,CAAC,EAAE,MAAM,CAAA;KAAC,CAAA;IACtE,QAAQ,EAAE;QAAC,KAAK,EAAE,MAAM,CAAA;KAAC,CAAA;IACzB,OAAO,EAAE,MAAM,CAAA;IACf,SAAS,EAAE,UAAU,CAAA;CACtB;AAED,MAAM,WAAW,uBAAuB,CACtC,OAAO,SAAS,WAAW,GAAG,OAAO,cAAc,EACnD,OAAO,SAAS,WAAW,GAAG,OAAO,cAAc,EACnD,WAAW,SAAS,WAAW,GAAG,OAAO,kBAAkB,CAC3D,SAAQ,cAAc;IACtB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,UAAU,CAAC,EAAE,WAAW,CAAA;CACzB"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"edit.d.ts","sourceRoot":"","sources":["../../../../src/blocks/groups/text-and-media-group/edit.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"edit.d.ts","sourceRoot":"","sources":["../../../../src/blocks/groups/text-and-media-group/edit.tsx"],"names":[],"mappings":"AA0BA,OAAO,KAAK,EASV,2BAA2B,EAC3B,wBAAwB,EACzB,MAAM,SAAS,CAAA;AAEhB,wBAAgB,2BAA2B,CAAC,OAAO,EAAE,wBAAwB,oCAWxE;IACD,UAAU,EAAE,2BAA2B,CAAA;IACvC,aAAa,EAAE,CAAC,CAAC,EAAE,OAAO,CAAC,2BAA2B,CAAC,KAAK,IAAI,CAAA;CACjE,iCAuMF"}
|
|
@@ -1,10 +1,11 @@
|
|
|
1
1
|
import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { BlockControls, InspectorControls, RichText } from '@wordpress/block-editor';
|
|
3
|
-
import { PanelBody, TextControl, __experimentalToggleGroupControl as ToggleGroupControl, __experimentalToggleGroupControlOption as ToggleGroupControlOption, ToolbarButton, ToolbarGroup, } from '@wordpress/components';
|
|
3
|
+
import { BaseControl, ColorPalette, PanelBody, TextControl, __experimentalToggleGroupControl as ToggleGroupControl, __experimentalToggleGroupControlOption as ToggleGroupControlOption, ToolbarButton, ToolbarGroup, } from '@wordpress/components';
|
|
4
4
|
import { __ } from '@wordpress/i18n';
|
|
5
5
|
import clsx from 'clsx';
|
|
6
6
|
import { ImagePickerBody, ImagePickerControl } from '../../../components/ImagePicker';
|
|
7
7
|
import { useGroupBlock } from '../../../hooks/useGroupBlock';
|
|
8
|
+
import { useTenantColorPalette } from '../../../hooks/useTenantColorPalette';
|
|
8
9
|
import { CHIP_POSITIONS, DEFAULT_CHIP_VARIANTS, DEFAULT_CONTENT_SIZES, DEFAULT_GRID_STYLES, DEFAULT_HEADING_STYLES, DEFAULT_MEDIA_POSITIONS, DEFAULT_RATIOS, HEADING_LEVELS, } from './constants';
|
|
9
10
|
export function createTextAndMediaGroupEdit(options) {
|
|
10
11
|
var _a, _b, _c, _d, _e, _f;
|
|
@@ -18,6 +19,7 @@ export function createTextAndMediaGroupEdit(options) {
|
|
|
18
19
|
var _a, _b;
|
|
19
20
|
const { header, mediaPosition, img, ratio, gridStyle, content } = attributes;
|
|
20
21
|
const isMediaLeft = mediaPosition === 'left';
|
|
22
|
+
const { paletteColors } = useTenantColorPalette();
|
|
21
23
|
const { blockProps, innerBlocksProps } = useGroupBlock({
|
|
22
24
|
blockClassName: [
|
|
23
25
|
(_a = options.blockClassName) !== null && _a !== void 0 ? _a : 'g-text-and-media wp-block-section',
|
|
@@ -30,7 +32,7 @@ export function createTextAndMediaGroupEdit(options) {
|
|
|
30
32
|
template: options.template,
|
|
31
33
|
});
|
|
32
34
|
const mediaColumn = (_jsxs("div", { className: "g-text-and-media__media", children: [_jsx(ImagePickerBody, { value: { id: img.id, alt: img.alt }, onChange: (val) => setAttributes({ img: { ...img, ...val } }), placeholder: __('Vybrat obrázek', 'brilo-blocks') }), img.id > 0 && img.chip.title && (_jsx("span", { className: clsx('g-text-and-media__chip', `--${img.chip.position}`, `--${img.chip.variant}`), children: img.chip.title }))] }));
|
|
33
|
-
const textColumn = (_jsxs("div", { className: "g-text-and-media__text", children: [_jsx(RichText, { tagName: "span", className: "g-text-and-media__overline u-text-editable", value: header.overline.title, onChange: (value) => setAttributes({ header: { ...header, overline: { title: value } } }), placeholder: __('Overline...', 'brilo-blocks'), allowedFormats: [] }), _jsx(RichText, { tagName: `h${header.heading.level}`, className: clsx('g-text-and-media__heading', `--heading-style-${header.heading.style}`, 'u-text-editable'), value: header.heading.title, onChange: (value) => setAttributes({ header: { ...header, heading: { ...header.heading, title: value } } }), placeholder: __('Nadpis...', 'brilo-blocks'), allowedFormats: ['core/bold', 'core/italic'] }), _jsx("div", { ...innerBlocksProps })] }));
|
|
34
|
-
return (_jsxs(_Fragment, { children: [_jsx(BlockControls, { children: _jsxs(ToolbarGroup, { children: [_jsx(ToolbarButton, { icon: "align-pull-left", label: __('Média vlevo', 'brilo-blocks'), isActive: isMediaLeft, onClick: () => setAttributes({ mediaPosition: 'left' }) }), _jsx(ToolbarButton, { icon: "align-pull-right", label: __('Média vpravo', 'brilo-blocks'), isActive: !isMediaLeft, onClick: () => setAttributes({ mediaPosition: 'right' }) })] }) }), _jsxs(InspectorControls, { children: [_jsxs(PanelBody, { title: __('Obrázek', 'brilo-blocks'), children: [_jsx(ImagePickerControl, { value: { id: img.id, alt: img.alt }, onChange: (val) => setAttributes({ img: { ...img, ...val } }) }), _jsx(ToggleGroupControl, { label: __('Poměr stran', 'brilo-blocks'), value: ratio, onChange: (value) => setAttributes({ ratio: value }), isBlock: true, children: RATIOS.map((r) => (_jsx(ToggleGroupControlOption, { value: r.value, label: r.label }, r.value))) }), _jsx(TextControl, { label: __('URL videa', 'brilo-blocks'), value: img.video.src, onChange: (value) => setAttributes({ img: { ...img, video: { src: value } } }) })] }), _jsxs(PanelBody, { title: __('Chip', 'brilo-blocks'), initialOpen: false, children: [_jsx(TextControl, { label: __('Text chipu', 'brilo-blocks'), value: img.chip.title, onChange: (value) => setAttributes({ img: { ...img, chip: { ...img.chip, title: value } } }) }), _jsx(ToggleGroupControl, { label: __('Pozice chipu', 'brilo-blocks'), value: img.chip.position, onChange: (value) => setAttributes({ img: { ...img, chip: { ...img.chip, position: value } } }), isBlock: true, children: CHIP_POSITIONS.map((p) => (_jsx(ToggleGroupControlOption, { value: p.value, label: p.label }, p.value))) }), _jsx(ToggleGroupControl, { label: __('Varianta chipu', 'brilo-blocks'), value: img.chip.variant, onChange: (value) => setAttributes({ img: { ...img, chip: { ...img.chip, variant: value } } }), isBlock: true, children: CHIP_VARIANTS.map((v) => (_jsx(ToggleGroupControlOption, { value: v.value, label: v.label }, v.value))) })] }), _jsxs(PanelBody, { title: __('Rozložení', 'brilo-blocks'), children: [_jsx(ToggleGroupControl, { label: __('Pozice médií', 'brilo-blocks'), value: mediaPosition, onChange: (value) => setAttributes({ mediaPosition: value }), isBlock: true, children: MEDIA_POSITIONS.map((p) => (_jsx(ToggleGroupControlOption, { value: p.value, label: p.label }, p.value))) }), _jsx(ToggleGroupControl, { label: __('Styl mřížky', 'brilo-blocks'), value: gridStyle, onChange: (value) => setAttributes({ gridStyle: value }), isBlock: true, children: GRID_STYLES.map((s) => (_jsx(ToggleGroupControlOption, { value: s.value, label: s.label }, s.value))) }), _jsx(ToggleGroupControl, { label: __('Velikost textu', 'brilo-blocks'), value: content.size, onChange: (value) => setAttributes({ content: { size: value } }), isBlock: true, children: CONTENT_SIZES.map((s) => (_jsx(ToggleGroupControlOption, { value: s.value, label: s.label }, s.value))) })] }), _jsxs(PanelBody, { title: __('Nadpis', 'brilo-blocks'), initialOpen: false, children: [_jsx(ToggleGroupControl, { label: __('Úroveň nadpisu', 'brilo-blocks'), value: String(header.heading.level), onChange: (value) => setAttributes({ header: { ...header, heading: { ...header.heading, level: Number(value) } } }), isBlock: true, children: HEADING_LEVELS.map((l) => (_jsx(ToggleGroupControlOption, { value: String(l), label: `H${l}` }, l))) }), _jsx(ToggleGroupControl, { label: __('Styl nadpisu', 'brilo-blocks'), value: header.heading.style, onChange: (value) => setAttributes({ header: { ...header, heading: { ...header.heading, style: value } } }), isBlock: true, children: HEADING_STYLES.map((s) => (_jsx(ToggleGroupControlOption, { value: s.value, label: s.label }, s.value))) })] })] }), _jsx("div", { ...blockProps, children: _jsx("div", { className: clsx('u-grid-responsive --col-2 g-text-and-media__grid', `--grid-style-${gridStyle}`), children: isMediaLeft ? (_jsxs(_Fragment, { children: [mediaColumn, textColumn] })) : (_jsxs(_Fragment, { children: [textColumn, mediaColumn] })) }) })] }));
|
|
35
|
+
const textColumn = (_jsxs("div", { className: "g-text-and-media__text", children: [_jsx(RichText, { tagName: "span", className: "g-text-and-media__overline u-text-editable", value: header.overline.title, onChange: (value) => setAttributes({ header: { ...header, overline: { title: value } } }), placeholder: __('Overline...', 'brilo-blocks'), allowedFormats: [] }), _jsx(RichText, { tagName: `h${header.heading.level}`, className: clsx('g-text-and-media__heading', `--heading-style-${header.heading.style}`, 'u-text-editable'), style: header.heading.color ? { color: header.heading.color } : undefined, value: header.heading.title, onChange: (value) => setAttributes({ header: { ...header, heading: { ...header.heading, title: value } } }), placeholder: __('Nadpis...', 'brilo-blocks'), allowedFormats: ['core/bold', 'core/italic', 'core/text-color'] }), _jsx("div", { ...innerBlocksProps })] }));
|
|
36
|
+
return (_jsxs(_Fragment, { children: [_jsx(BlockControls, { children: _jsxs(ToolbarGroup, { children: [_jsx(ToolbarButton, { icon: "align-pull-left", label: __('Média vlevo', 'brilo-blocks'), isActive: isMediaLeft, onClick: () => setAttributes({ mediaPosition: 'left' }) }), _jsx(ToolbarButton, { icon: "align-pull-right", label: __('Média vpravo', 'brilo-blocks'), isActive: !isMediaLeft, onClick: () => setAttributes({ mediaPosition: 'right' }) })] }) }), _jsxs(InspectorControls, { children: [_jsxs(PanelBody, { title: __('Obrázek', 'brilo-blocks'), children: [_jsx(ImagePickerControl, { value: { id: img.id, alt: img.alt }, onChange: (val) => setAttributes({ img: { ...img, ...val } }) }), _jsx(ToggleGroupControl, { label: __('Poměr stran', 'brilo-blocks'), value: ratio, onChange: (value) => setAttributes({ ratio: value }), isBlock: true, children: RATIOS.map((r) => (_jsx(ToggleGroupControlOption, { value: r.value, label: r.label }, r.value))) }), _jsx(TextControl, { label: __('URL videa', 'brilo-blocks'), value: img.video.src, onChange: (value) => setAttributes({ img: { ...img, video: { src: value } } }) })] }), _jsxs(PanelBody, { title: __('Chip', 'brilo-blocks'), initialOpen: false, children: [_jsx(TextControl, { label: __('Text chipu', 'brilo-blocks'), value: img.chip.title, onChange: (value) => setAttributes({ img: { ...img, chip: { ...img.chip, title: value } } }) }), _jsx(ToggleGroupControl, { label: __('Pozice chipu', 'brilo-blocks'), value: img.chip.position, onChange: (value) => setAttributes({ img: { ...img, chip: { ...img.chip, position: value } } }), isBlock: true, children: CHIP_POSITIONS.map((p) => (_jsx(ToggleGroupControlOption, { value: p.value, label: p.label }, p.value))) }), _jsx(ToggleGroupControl, { label: __('Varianta chipu', 'brilo-blocks'), value: img.chip.variant, onChange: (value) => setAttributes({ img: { ...img, chip: { ...img.chip, variant: value } } }), isBlock: true, children: CHIP_VARIANTS.map((v) => (_jsx(ToggleGroupControlOption, { value: v.value, label: v.label }, v.value))) })] }), _jsxs(PanelBody, { title: __('Rozložení', 'brilo-blocks'), children: [_jsx(ToggleGroupControl, { label: __('Pozice médií', 'brilo-blocks'), value: mediaPosition, onChange: (value) => setAttributes({ mediaPosition: value }), isBlock: true, children: MEDIA_POSITIONS.map((p) => (_jsx(ToggleGroupControlOption, { value: p.value, label: p.label }, p.value))) }), _jsx(ToggleGroupControl, { label: __('Styl mřížky', 'brilo-blocks'), value: gridStyle, onChange: (value) => setAttributes({ gridStyle: value }), isBlock: true, children: GRID_STYLES.map((s) => (_jsx(ToggleGroupControlOption, { value: s.value, label: s.label }, s.value))) }), _jsx(ToggleGroupControl, { label: __('Velikost textu', 'brilo-blocks'), value: content.size, onChange: (value) => setAttributes({ content: { size: value } }), isBlock: true, children: CONTENT_SIZES.map((s) => (_jsx(ToggleGroupControlOption, { value: s.value, label: s.label }, s.value))) })] }), _jsxs(PanelBody, { title: __('Nadpis', 'brilo-blocks'), initialOpen: false, children: [_jsx(ToggleGroupControl, { label: __('Úroveň nadpisu', 'brilo-blocks'), value: String(header.heading.level), onChange: (value) => setAttributes({ header: { ...header, heading: { ...header.heading, level: Number(value) } } }), isBlock: true, children: HEADING_LEVELS.map((l) => (_jsx(ToggleGroupControlOption, { value: String(l), label: `H${l}` }, l))) }), _jsx(ToggleGroupControl, { label: __('Styl nadpisu', 'brilo-blocks'), value: header.heading.style, onChange: (value) => setAttributes({ header: { ...header, heading: { ...header.heading, style: value } } }), isBlock: true, children: HEADING_STYLES.map((s) => (_jsx(ToggleGroupControlOption, { value: s.value, label: s.label }, s.value))) }), _jsx(BaseControl, { label: __('Barva nadpisu', 'brilo-blocks'), children: _jsx(ColorPalette, { colors: paletteColors, value: header.heading.color || undefined, onChange: (value) => setAttributes({ header: { ...header, heading: { ...header.heading, color: value !== null && value !== void 0 ? value : '' } } }) }) })] })] }), _jsx("div", { ...blockProps, children: _jsx("div", { className: clsx('u-grid-responsive --col-2 g-text-and-media__grid', `--grid-style-${gridStyle}`), children: isMediaLeft ? (_jsxs(_Fragment, { children: [mediaColumn, textColumn] })) : (_jsxs(_Fragment, { children: [textColumn, mediaColumn] })) }) })] }));
|
|
35
37
|
};
|
|
36
38
|
}
|
|
@@ -25,7 +25,7 @@ export function createTextAndMediaGroupBlock(options) {
|
|
|
25
25
|
header: {
|
|
26
26
|
type: 'object',
|
|
27
27
|
default: {
|
|
28
|
-
heading: { title: '', level: HEADING_LEVELS[1], style: (_p = (_a = headingStyles[1]) === null || _a === void 0 ? void 0 : _a.value) !== null && _p !== void 0 ? _p : headingStyles[0].value },
|
|
28
|
+
heading: { title: '', level: HEADING_LEVELS[1], style: (_p = (_a = headingStyles[1]) === null || _a === void 0 ? void 0 : _a.value) !== null && _p !== void 0 ? _p : headingStyles[0].value, color: '' },
|
|
29
29
|
overline: { title: '' },
|
|
30
30
|
},
|
|
31
31
|
},
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/blocks/groups/text-and-media-group/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,cAAc,EAAE,WAAW,EAAC,MAAM,SAAS,CAAA;AACxD,OAAO,KAAK,EACV,cAAc,EACd,qBAAqB,EACrB,qBAAqB,EACrB,mBAAmB,EACnB,sBAAsB,EACtB,uBAAuB,EACvB,cAAc,EACd,cAAc,EACf,MAAM,aAAa,CAAA;AAEpB,MAAM,MAAM,cAAc,GAAG,CAAC,OAAO,uBAAuB,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA;AAC9E,MAAM,MAAM,MAAM,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA;AAC7D,MAAM,MAAM,UAAU,GAAG,CAAC,OAAO,mBAAmB,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA;AACtE,MAAM,MAAM,aAAa,GAAG,CAAC,OAAO,sBAAsB,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA;AAC5E,MAAM,MAAM,aAAa,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAA;AAC3D,MAAM,MAAM,YAAY,GAAG,CAAC,OAAO,qBAAqB,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA;AAC1E,MAAM,MAAM,aAAa,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA;AACpE,MAAM,MAAM,YAAY,GAAG,CAAC,OAAO,qBAAqB,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA;AAE1E,MAAM,WAAW,2BAA2B,CAC1C,MAAM,SAAS,MAAM,GAAG,MAAM,EAC9B,cAAc,SAAS,MAAM,GAAG,cAAc,EAC9C,UAAU,SAAS,MAAM,GAAG,UAAU,EACtC,aAAa,SAAS,MAAM,GAAG,aAAa,EAC5C,YAAY,SAAS,MAAM,GAAG,YAAY,EAC1C,YAAY,SAAS,MAAM,GAAG,YAAY,CAC1C,SAAQ,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IAC/B,MAAM,EAAE;QACN,OAAO,EAAE;YAAC,KAAK,EAAE,MAAM,CAAC;YAAC,KAAK,EAAE,aAAa,CAAC;YAAC,KAAK,EAAE,aAAa,CAAA;SAAC,CAAA;
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/blocks/groups/text-and-media-group/types.ts"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,cAAc,EAAE,WAAW,EAAC,MAAM,SAAS,CAAA;AACxD,OAAO,KAAK,EACV,cAAc,EACd,qBAAqB,EACrB,qBAAqB,EACrB,mBAAmB,EACnB,sBAAsB,EACtB,uBAAuB,EACvB,cAAc,EACd,cAAc,EACf,MAAM,aAAa,CAAA;AAEpB,MAAM,MAAM,cAAc,GAAG,CAAC,OAAO,uBAAuB,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA;AAC9E,MAAM,MAAM,MAAM,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA;AAC7D,MAAM,MAAM,UAAU,GAAG,CAAC,OAAO,mBAAmB,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA;AACtE,MAAM,MAAM,aAAa,GAAG,CAAC,OAAO,sBAAsB,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA;AAC5E,MAAM,MAAM,aAAa,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAA;AAC3D,MAAM,MAAM,YAAY,GAAG,CAAC,OAAO,qBAAqB,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA;AAC1E,MAAM,MAAM,aAAa,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA;AACpE,MAAM,MAAM,YAAY,GAAG,CAAC,OAAO,qBAAqB,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA;AAE1E,MAAM,WAAW,2BAA2B,CAC1C,MAAM,SAAS,MAAM,GAAG,MAAM,EAC9B,cAAc,SAAS,MAAM,GAAG,cAAc,EAC9C,UAAU,SAAS,MAAM,GAAG,UAAU,EACtC,aAAa,SAAS,MAAM,GAAG,aAAa,EAC5C,YAAY,SAAS,MAAM,GAAG,YAAY,EAC1C,YAAY,SAAS,MAAM,GAAG,YAAY,CAC1C,SAAQ,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IAC/B,MAAM,EAAE;QACN,OAAO,EAAE;YAAC,KAAK,EAAE,MAAM,CAAC;YAAC,KAAK,EAAE,aAAa,CAAC;YAAC,KAAK,EAAE,aAAa,CAAC;YAAC,KAAK,CAAC,EAAE,MAAM,CAAA;SAAC,CAAA;QACpF,QAAQ,EAAE;YAAC,KAAK,EAAE,MAAM,CAAA;SAAC,CAAA;KAC1B,CAAA;IACD,aAAa,EAAE,cAAc,CAAA;IAC7B,GAAG,EAAE;QACH,EAAE,EAAE,MAAM,CAAA;QACV,GAAG,EAAE,MAAM,CAAA;QACX,KAAK,EAAE;YAAC,GAAG,EAAE,MAAM,CAAA;SAAC,CAAA;QACpB,IAAI,EAAE;YAAC,KAAK,EAAE,MAAM,CAAC;YAAC,QAAQ,EAAE,aAAa,CAAC;YAAC,OAAO,EAAE,YAAY,CAAA;SAAC,CAAA;KACtE,CAAA;IACD,KAAK,EAAE,MAAM,CAAA;IACb,SAAS,EAAE,UAAU,CAAA;IACrB,OAAO,EAAE;QAAC,IAAI,EAAE,YAAY,CAAA;KAAC,CAAA;CAC9B;AAED,MAAM,WAAW,wBAAwB,CACvC,OAAO,SAAS,WAAW,GAAG,OAAO,cAAc,EACnD,eAAe,SAAS,WAAW,GAAG,OAAO,uBAAuB,EACpE,WAAW,SAAS,WAAW,GAAG,OAAO,mBAAmB,EAC5D,cAAc,SAAS,WAAW,GAAG,OAAO,sBAAsB,EAClE,aAAa,SAAS,WAAW,GAAG,OAAO,qBAAqB,EAChE,aAAa,SAAS,WAAW,GAAG,OAAO,qBAAqB,CAChE,SAAQ,cAAc;IACtB,MAAM,CAAC,EAAE,OAAO,CAAA;IAChB,cAAc,CAAC,EAAE,eAAe,CAAA;IAChC,UAAU,CAAC,EAAE,WAAW,CAAA;IACxB,aAAa,CAAC,EAAE,cAAc,CAAA;IAC9B,YAAY,CAAC,EAAE,aAAa,CAAA;IAC5B,YAAY,CAAC,EAAE,aAAa,CAAA;CAC7B"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"edit.d.ts","sourceRoot":"","sources":["../../../../src/blocks/hero/hero-item/edit.tsx"],"names":[],"mappings":"
|
|
1
|
+
{"version":3,"file":"edit.d.ts","sourceRoot":"","sources":["../../../../src/blocks/hero/hero-item/edit.tsx"],"names":[],"mappings":"AAcA,OAAO,KAAK,EAAkB,kBAAkB,EAAE,eAAe,EAAC,MAAM,SAAS,CAAA;AAKjF,wBAAgB,kBAAkB,CAAC,OAAO,EAAE,eAAe,oCAItD;IACD,UAAU,EAAE,kBAAkB,CAAA;IAC9B,aAAa,EAAE,CAAC,CAAC,EAAE,OAAO,CAAC,kBAAkB,CAAC,KAAK,IAAI,CAAA;CACxD,iCAwFF"}
|
|
@@ -1,16 +1,18 @@
|
|
|
1
1
|
import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
|
|
2
2
|
import { InspectorControls, RichText } from '@wordpress/block-editor';
|
|
3
|
-
import { PanelBody, __experimentalToggleGroupControlOption as ToggleGroupControlOption, AlignmentMatrixControl, __experimentalToggleGroupControl as ToggleGroupControl, BaseControl, TextControl, ToggleControl, } from '@wordpress/components';
|
|
3
|
+
import { PanelBody, __experimentalToggleGroupControlOption as ToggleGroupControlOption, AlignmentMatrixControl, __experimentalToggleGroupControl as ToggleGroupControl, BaseControl, ColorPalette, TextControl, ToggleControl, } from '@wordpress/components';
|
|
4
4
|
import { __ } from '@wordpress/i18n';
|
|
5
5
|
import { ImagePickerBody, ImagePickerControl } from '../../../components/ImagePicker';
|
|
6
6
|
import { HEADING_LEVELS } from './constants';
|
|
7
7
|
import { useGroupBlock } from '../../../hooks/useGroupBlock';
|
|
8
|
+
import { useTenantColorPalette } from '../../../hooks/useTenantColorPalette';
|
|
8
9
|
import clsx from 'clsx';
|
|
9
10
|
export function createHeroItemEdit(options) {
|
|
10
11
|
return function Edit({ attributes, setAttributes, }) {
|
|
11
12
|
var _a;
|
|
12
13
|
var _b, _c, _d;
|
|
13
|
-
const { title, img, headingLevel, contentPosition, url, focalPoint } = attributes;
|
|
14
|
+
const { title, titleColor, img, headingLevel, contentPosition, url, focalPoint } = attributes;
|
|
15
|
+
const { paletteColors } = useTenantColorPalette();
|
|
14
16
|
const { blockProps, innerBlocksProps } = useGroupBlock({
|
|
15
17
|
blockClassName: clsx((_b = options.blockClassName) !== null && _b !== void 0 ? _b : 'i-hero'),
|
|
16
18
|
containerClassName: [(_c = options.containerClassName) !== null && _c !== void 0 ? _c : 'i-hero__content wp-block-inner-content'],
|
|
@@ -19,6 +21,6 @@ export function createHeroItemEdit(options) {
|
|
|
19
21
|
template: options.template,
|
|
20
22
|
layout: { type: 'default' },
|
|
21
23
|
});
|
|
22
|
-
return (_jsxs(_Fragment, { children: [_jsx(InspectorControls, { children: _jsxs(PanelBody, { title: __('Nastavení položky', 'brilo-blocks'), children: [_jsx(ImagePickerControl, { value: { id: img.id, alt: img.alt }, onChange: (v) => setAttributes({ img: { ...img, ...v } }) }), _jsx(BaseControl, { label: __('Focal point (desktop)', 'brilo-blocks'), children: _jsx(AlignmentMatrixControl, { value: focalPoint.point, onChange: (v) => setAttributes({ focalPoint: { ...focalPoint, point: (v !== null && v !== void 0 ? v : 'center center') } }) }) }), _jsx(BaseControl, { label: __('Focal point (mobil)', 'brilo-blocks'), children: _jsx(AlignmentMatrixControl, { value: ((_d = (_a = focalPoint.sm) === null || _a === void 0 ? void 0 : _a.point) !== null && _d !== void 0 ? _d : 'center center'), onChange: (v) => setAttributes({ focalPoint: { ...focalPoint, sm: { point: (v !== null && v !== void 0 ? v : 'center center') } } }) }) }), _jsx(ToggleGroupControl, { isBlock: true, label: __('Úroveň nadpisu položek', 'brilo-blocks'), value: String(headingLevel), onChange: (v) => setAttributes({ headingLevel: Number(v !== null && v !== void 0 ? v : HEADING_LEVELS[1]) }), children: HEADING_LEVELS.map((l) => (_jsx(ToggleGroupControlOption, { value: String(l), label: `H${l}` }, l))) }), _jsx(BaseControl, { label: __('Pozice obsahu', 'brilo-blocks'), children: _jsx(AlignmentMatrixControl, { value: contentPosition, onChange: (v) => setAttributes({ contentPosition: v }) }) }), _jsx(TextControl, { label: __('URL odkazu', 'brilo-blocks'), value: url.src, onChange: (v) => setAttributes({ url: { ...url, src: v } }) }), _jsx(ToggleControl, { label: __('Otevřít v novém okně', 'brilo-blocks'), checked: url.blank, onChange: (v) => setAttributes({ url: { ...url, blank: v } }) })] }) }), _jsxs("div", { ...blockProps, children: [_jsx("div", { className: "i-hero__image-wrap", children: _jsx(ImagePickerBody, { value: { id: img.id, alt: img.alt }, onChange: (v) => setAttributes({ img: { ...img, ...v } }), placeholder: __('Vyberte obrázek', 'brilo-blocks') }) }), _jsxs("div", { className: `i-hero__overlay --${contentPosition.replace(' ', '-')}`, children: [_jsx(RichText, { tagName: `h${headingLevel}`, className: "i-hero__title u-text-editable", value: title, onChange: (v) => setAttributes({ title: v }), placeholder: __('Nadpis...', 'brilo-blocks') }), _jsx("div", { ...innerBlocksProps })] })] })] }));
|
|
24
|
+
return (_jsxs(_Fragment, { children: [_jsx(InspectorControls, { children: _jsxs(PanelBody, { title: __('Nastavení položky', 'brilo-blocks'), children: [_jsx(ImagePickerControl, { value: { id: img.id, alt: img.alt }, onChange: (v) => setAttributes({ img: { ...img, ...v } }) }), _jsx(BaseControl, { label: __('Focal point (desktop)', 'brilo-blocks'), children: _jsx(AlignmentMatrixControl, { value: focalPoint.point, onChange: (v) => setAttributes({ focalPoint: { ...focalPoint, point: (v !== null && v !== void 0 ? v : 'center center') } }) }) }), _jsx(BaseControl, { label: __('Focal point (mobil)', 'brilo-blocks'), children: _jsx(AlignmentMatrixControl, { value: ((_d = (_a = focalPoint.sm) === null || _a === void 0 ? void 0 : _a.point) !== null && _d !== void 0 ? _d : 'center center'), onChange: (v) => setAttributes({ focalPoint: { ...focalPoint, sm: { point: (v !== null && v !== void 0 ? v : 'center center') } } }) }) }), _jsx(BaseControl, { label: __('Barva nadpisu', 'brilo-blocks'), children: _jsx(ColorPalette, { colors: paletteColors, value: titleColor || undefined, onChange: (v) => setAttributes({ titleColor: v !== null && v !== void 0 ? v : '' }) }) }), _jsx(ToggleGroupControl, { isBlock: true, label: __('Úroveň nadpisu položek', 'brilo-blocks'), value: String(headingLevel), onChange: (v) => setAttributes({ headingLevel: Number(v !== null && v !== void 0 ? v : HEADING_LEVELS[1]) }), children: HEADING_LEVELS.map((l) => (_jsx(ToggleGroupControlOption, { value: String(l), label: `H${l}` }, l))) }), _jsx(BaseControl, { label: __('Pozice obsahu', 'brilo-blocks'), children: _jsx(AlignmentMatrixControl, { value: contentPosition, onChange: (v) => setAttributes({ contentPosition: v }) }) }), _jsx(TextControl, { label: __('URL odkazu', 'brilo-blocks'), value: url.src, onChange: (v) => setAttributes({ url: { ...url, src: v } }) }), _jsx(ToggleControl, { label: __('Otevřít v novém okně', 'brilo-blocks'), checked: url.blank, onChange: (v) => setAttributes({ url: { ...url, blank: v } }) })] }) }), _jsxs("div", { ...blockProps, children: [_jsx("div", { className: "i-hero__image-wrap", children: _jsx(ImagePickerBody, { value: { id: img.id, alt: img.alt }, onChange: (v) => setAttributes({ img: { ...img, ...v } }), placeholder: __('Vyberte obrázek', 'brilo-blocks') }) }), _jsxs("div", { className: `i-hero__overlay --${contentPosition.replace(' ', '-')}`, children: [_jsx(RichText, { tagName: `h${headingLevel}`, className: "i-hero__title u-text-editable", style: titleColor ? { color: titleColor } : undefined, value: title, onChange: (v) => setAttributes({ title: v }), placeholder: __('Nadpis...', 'brilo-blocks') }), _jsx("div", { ...innerBlocksProps })] })] })] }));
|
|
23
25
|
};
|
|
24
26
|
}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"factory.d.ts","sourceRoot":"","sources":["../../../../src/blocks/hero/hero-item/factory.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,mBAAmB,CAAA;AAIzD,OAAO,KAAK,EAAC,kBAAkB,EAAE,eAAe,EAAC,MAAM,SAAS,CAAA;AAGhE,YAAY,EAAC,kBAAkB,EAAE,eAAe,EAAC,CAAA;AAEjD,wBAAgB,mBAAmB,CAAC,OAAO,EAAE,eAAe,GAAG,kBAAkB,CAAC,kBAAkB,CAAC,
|
|
1
|
+
{"version":3,"file":"factory.d.ts","sourceRoot":"","sources":["../../../../src/blocks/hero/hero-item/factory.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,mBAAmB,CAAA;AAIzD,OAAO,KAAK,EAAC,kBAAkB,EAAE,eAAe,EAAC,MAAM,SAAS,CAAA;AAGhE,YAAY,EAAC,kBAAkB,EAAE,eAAe,EAAC,CAAA;AAEjD,wBAAgB,mBAAmB,CAAC,OAAO,EAAE,eAAe,GAAG,kBAAkB,CAAC,kBAAkB,CAAC,CAwCpG"}
|
|
@@ -16,6 +16,7 @@ export function createHeroItemBlock(options) {
|
|
|
16
16
|
supports: { html: false, customClassName: false },
|
|
17
17
|
attributes: {
|
|
18
18
|
title: { type: 'string', default: '' },
|
|
19
|
+
titleColor: { type: 'string', default: '' },
|
|
19
20
|
img: {
|
|
20
21
|
type: 'object',
|
|
21
22
|
default: { id: 0, url: '', alt: '' },
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/blocks/hero/hero-item/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,cAAc,EAAE,KAAK,EAAE,WAAW,EAAC,MAAM,SAAS,CAAA;AAC1D,OAAO,EAAC,iBAAiB,EAAE,cAAc,EAAC,MAAM,aAAa,CAAA;AAE7D,MAAM,MAAM,eAAe,GAAG,CAAC,OAAO,iBAAiB,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA;AACzE,MAAM,MAAM,YAAY,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAA;AAE1D,MAAM,MAAM,WAAW,GAAG;IACxB,GAAG,EAAE,MAAM,CAAA;IACX,KAAK,EAAE,OAAO,CAAA;CACf,CAAA;AAED,MAAM,MAAM,cAAc,GAAG;IAC3B,KAAK,EAAE,MAAM,CAAA;IACb,GAAG,EAAE,KAAK,CAAA;IACV,YAAY,EAAE,MAAM,CAAA;IACpB,eAAe,EAAE,eAAe,CAAA;IAChC,GAAG,EAAE,WAAW,CAAA;CACjB,CAAA;AAED,MAAM,MAAM,kBAAkB,GAAG;IAC/B,KAAK,EAAE,eAAe,CAAA;IACtB,EAAE,CAAC,EAAE;QACH,KAAK,EAAE,eAAe,CAAA;KACvB,CAAA;CACF,CAAA;AAED,MAAM,WAAW,kBAAmB,SAAQ,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IACjE,KAAK,EAAE,MAAM,CAAA;IACb,GAAG,EAAE,KAAK,CAAA;IACV,YAAY,EAAE,MAAM,CAAA;IACpB,eAAe,EAAE,eAAe,CAAA;IAChC,GAAG,EAAE,WAAW,CAAA;IAChB,UAAU,EAAE,kBAAkB,CAAA;CAC/B;AAED,MAAM,WAAW,eAAgB,SAAQ,cAAc;IACrD,gBAAgB,CAAC,EAAE,WAAW,CAAA;CAC/B"}
|
|
1
|
+
{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../src/blocks/hero/hero-item/types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,cAAc,EAAE,KAAK,EAAE,WAAW,EAAC,MAAM,SAAS,CAAA;AAC1D,OAAO,EAAC,iBAAiB,EAAE,cAAc,EAAC,MAAM,aAAa,CAAA;AAE7D,MAAM,MAAM,eAAe,GAAG,CAAC,OAAO,iBAAiB,CAAC,CAAC,MAAM,CAAC,CAAC,OAAO,CAAC,CAAA;AACzE,MAAM,MAAM,YAAY,GAAG,CAAC,OAAO,cAAc,CAAC,CAAC,MAAM,CAAC,CAAA;AAE1D,MAAM,MAAM,WAAW,GAAG;IACxB,GAAG,EAAE,MAAM,CAAA;IACX,KAAK,EAAE,OAAO,CAAA;CACf,CAAA;AAED,MAAM,MAAM,cAAc,GAAG;IAC3B,KAAK,EAAE,MAAM,CAAA;IACb,GAAG,EAAE,KAAK,CAAA;IACV,YAAY,EAAE,MAAM,CAAA;IACpB,eAAe,EAAE,eAAe,CAAA;IAChC,GAAG,EAAE,WAAW,CAAA;CACjB,CAAA;AAED,MAAM,MAAM,kBAAkB,GAAG;IAC/B,KAAK,EAAE,eAAe,CAAA;IACtB,EAAE,CAAC,EAAE;QACH,KAAK,EAAE,eAAe,CAAA;KACvB,CAAA;CACF,CAAA;AAED,MAAM,WAAW,kBAAmB,SAAQ,MAAM,CAAC,MAAM,EAAE,OAAO,CAAC;IACjE,KAAK,EAAE,MAAM,CAAA;IACb,UAAU,EAAE,MAAM,CAAA;IAClB,GAAG,EAAE,KAAK,CAAA;IACV,YAAY,EAAE,MAAM,CAAA;IACpB,eAAe,EAAE,eAAe,CAAA;IAChC,GAAG,EAAE,WAAW,CAAA;IAChB,UAAU,EAAE,kBAAkB,CAAA;CAC/B;AAED,MAAM,WAAW,eAAgB,SAAQ,cAAc;IACrD,gBAAgB,CAAC,EAAE,WAAW,CAAA;CAC/B"}
|
package/package.json
CHANGED
|
@@ -1,10 +1,5 @@
|
|
|
1
1
|
import type {BriloBlockType} from '~/types'
|
|
2
|
-
import type {
|
|
3
|
-
DOCUMENTS_GRID_COLUMN_OPTIONS,
|
|
4
|
-
DOCUMENTS_GRID_LISTING_STYLES,
|
|
5
|
-
DOCUMENTS_GRID_MODES,
|
|
6
|
-
DOCUMENTS_GRID_SORT_BYS,
|
|
7
|
-
} from './constants'
|
|
2
|
+
import type {DOCUMENTS_GRID_COLUMN_OPTIONS, DOCUMENTS_GRID_LISTING_STYLES, DOCUMENTS_GRID_MODES, DOCUMENTS_GRID_SORT_BYS} from './constants'
|
|
8
3
|
|
|
9
4
|
export type DocumentsGridMode = (typeof DOCUMENTS_GRID_MODES)[number]
|
|
10
5
|
export type DocumentsGridListingStyle = (typeof DOCUMENTS_GRID_LISTING_STYLES)[number]
|
|
@@ -10,6 +10,7 @@ import {
|
|
|
10
10
|
import {__} from '@wordpress/i18n'
|
|
11
11
|
import {ImagePickerBody, ImagePickerControl} from '~/components/ImagePicker'
|
|
12
12
|
import {useGroupBlock} from '~/hooks/useGroupBlock'
|
|
13
|
+
import {useTenantColorPalette} from '~/hooks/useTenantColorPalette'
|
|
13
14
|
import {DEFAULT_HEADING_STYLES, DEFAULT_VARIANTS} from './constants'
|
|
14
15
|
import {HEADING_LEVELS} from '~/constants'
|
|
15
16
|
import type {BannerGroupAttributes, BannerGroupOptions, HeadingLevels, HeadingStyles, Variants} from './types'
|
|
@@ -27,6 +28,7 @@ export function createBannerGroupEdit(options: BannerGroupOptions) {
|
|
|
27
28
|
setAttributes: (a: Partial<BannerGroupAttributes>) => void
|
|
28
29
|
}) {
|
|
29
30
|
const {header, img, description, variant, hasBackgroundColor, backgroundColor, textColor} = attributes
|
|
31
|
+
const {paletteColors} = useTenantColorPalette()
|
|
30
32
|
|
|
31
33
|
const {blockProps, innerBlocksProps} = useGroupBlock({
|
|
32
34
|
blockClassName: [options.blockClassName ?? 'g-banner wp-block-section', `--variant-${variant}`],
|
|
@@ -74,6 +76,13 @@ export function createBannerGroupEdit(options: BannerGroupOptions) {
|
|
|
74
76
|
<ToggleGroupControlOption key={s} value={s} label={s} />
|
|
75
77
|
))}
|
|
76
78
|
</ToggleGroupControl>
|
|
79
|
+
<BaseControl label={__('Barva nadpisu', 'brilo-blocks')}>
|
|
80
|
+
<ColorPalette
|
|
81
|
+
colors={paletteColors}
|
|
82
|
+
value={header.heading.color || undefined}
|
|
83
|
+
onChange={(value) => setAttributes({header: {...header, heading: {...header.heading, color: value ?? ''}}})}
|
|
84
|
+
/>
|
|
85
|
+
</BaseControl>
|
|
77
86
|
</PanelBody>
|
|
78
87
|
|
|
79
88
|
<PanelBody title={__('Obrázek v pozadí', 'brilo-blocks')}>
|
|
@@ -101,6 +110,7 @@ export function createBannerGroupEdit(options: BannerGroupOptions) {
|
|
|
101
110
|
<RichText
|
|
102
111
|
tagName={`h${header.heading.level}` as HeadingStyles}
|
|
103
112
|
className={clsx('g-banner__heading', `--heading-style-${header.heading.style}`, 'u-text-editable')}
|
|
113
|
+
style={header.heading.color ? {color: header.heading.color} : undefined}
|
|
104
114
|
value={header.heading.title}
|
|
105
115
|
onChange={(value: string) => setAttributes({header: {...header, heading: {...header.heading, title: value}}})}
|
|
106
116
|
placeholder={__('Nadpis...', 'brilo-blocks')}
|
|
@@ -35,7 +35,7 @@ export function createBannerGroupBlock<
|
|
|
35
35
|
header: {
|
|
36
36
|
type: 'object',
|
|
37
37
|
default: {
|
|
38
|
-
heading: {title: '', level: HEADING_LEVELS[1], style: headingStyles[1] ?? headingStyles[0]},
|
|
38
|
+
heading: {title: '', level: HEADING_LEVELS[1], style: headingStyles[1] ?? headingStyles[0], color: ''},
|
|
39
39
|
},
|
|
40
40
|
},
|
|
41
41
|
img: {
|
|
@@ -10,7 +10,7 @@ export interface BannerGroupAttributes<TVariant extends string = Variants, THead
|
|
|
10
10
|
extends Record<string, unknown> {
|
|
11
11
|
title: string
|
|
12
12
|
header: {
|
|
13
|
-
heading: {title: string; level: HeadingLevels; style: THeadingStyle}
|
|
13
|
+
heading: {title: string; level: HeadingLevels; style: THeadingStyle; color?: string}
|
|
14
14
|
}
|
|
15
15
|
img: Media
|
|
16
16
|
hasBackgroundColor: boolean
|
|
@@ -1,11 +1,14 @@
|
|
|
1
1
|
import {InspectorControls, RichText, useBlockProps} from '@wordpress/block-editor'
|
|
2
2
|
import {
|
|
3
|
+
BaseControl,
|
|
4
|
+
ColorPalette,
|
|
3
5
|
PanelBody,
|
|
4
6
|
__experimentalToggleGroupControl as ToggleGroupControl,
|
|
5
7
|
__experimentalToggleGroupControlOption as ToggleGroupControlOption,
|
|
6
8
|
} from '@wordpress/components'
|
|
7
9
|
import {__} from '@wordpress/i18n'
|
|
8
10
|
import clsx from 'clsx'
|
|
11
|
+
import {useTenantColorPalette} from '~/hooks/useTenantColorPalette'
|
|
9
12
|
import {DEFAULT_ALIGNMENTS, DEFAULT_LEVELS, DEFAULT_STYLES} from './constants'
|
|
10
13
|
import type {BasicHeaderGroupAttributes, BasicHeaderGroupOptions, HeaderAlignment, HeadingStyle} from './types'
|
|
11
14
|
|
|
@@ -25,6 +28,7 @@ export function createBasicHeaderGroupEdit(options: BasicHeaderGroupOptions) {
|
|
|
25
28
|
const blockProps = useBlockProps({
|
|
26
29
|
className: clsx(options.blockClassName ?? 'g-header wp-block-section', `--textAlign-${textAlign}`),
|
|
27
30
|
})
|
|
31
|
+
const {paletteColors} = useTenantColorPalette()
|
|
28
32
|
|
|
29
33
|
return (
|
|
30
34
|
<>
|
|
@@ -54,6 +58,13 @@ export function createBasicHeaderGroupEdit(options: BasicHeaderGroupOptions) {
|
|
|
54
58
|
<ToggleGroupControlOption key={s} value={s} label={s.toUpperCase()} />
|
|
55
59
|
))}
|
|
56
60
|
</ToggleGroupControl>
|
|
61
|
+
<BaseControl label={__('Barva nadpisu', 'brilo-blocks')}>
|
|
62
|
+
<ColorPalette
|
|
63
|
+
colors={paletteColors}
|
|
64
|
+
value={heading.color || undefined}
|
|
65
|
+
onChange={(value) => setAttributes({heading: {...heading, color: value ?? ''}})}
|
|
66
|
+
/>
|
|
67
|
+
</BaseControl>
|
|
57
68
|
<ToggleGroupControl
|
|
58
69
|
label={__('Zarovnání', 'brilo-blocks')}
|
|
59
70
|
value={textAlign}
|
|
@@ -78,10 +89,11 @@ export function createBasicHeaderGroupEdit(options: BasicHeaderGroupOptions) {
|
|
|
78
89
|
<RichText
|
|
79
90
|
tagName={`h${heading.level}` as 'h1' | 'h2' | 'h3' | 'h4'}
|
|
80
91
|
className={clsx('g-header__heading', `--heading-style-${heading.style}`, 'u-text-editable')}
|
|
92
|
+
style={heading.color ? {color: heading.color} : undefined}
|
|
81
93
|
value={heading.title}
|
|
82
94
|
onChange={(value) => setAttributes({heading: {...heading, title: value}})}
|
|
83
95
|
placeholder={__('Nadpis...', 'brilo-blocks')}
|
|
84
|
-
allowedFormats={['core/bold', 'core/italic']}
|
|
96
|
+
allowedFormats={['core/bold', 'core/italic', 'core/text-color']}
|
|
85
97
|
/>
|
|
86
98
|
<RichText
|
|
87
99
|
tagName="div"
|
|
@@ -30,7 +30,7 @@ export function createBasicHeaderGroupBlock<
|
|
|
30
30
|
attributes: {
|
|
31
31
|
heading: {
|
|
32
32
|
type: 'object',
|
|
33
|
-
default: {title: '', level: levels[1] ?? levels[0], style: styles[1] ?? styles[0]},
|
|
33
|
+
default: {title: '', level: levels[1] ?? levels[0], style: styles[1] ?? styles[0], color: ''},
|
|
34
34
|
},
|
|
35
35
|
overline: {type: 'object', default: {title: ''}},
|
|
36
36
|
content: {type: 'string', default: ''},
|
|
@@ -10,7 +10,7 @@ export interface BasicHeaderGroupAttributes<
|
|
|
10
10
|
TStyle extends string = HeadingStyle,
|
|
11
11
|
TAlignment extends string = HeaderAlignment,
|
|
12
12
|
> extends Record<string, unknown> {
|
|
13
|
-
heading: {title: string; level: TLevel; style: TStyle}
|
|
13
|
+
heading: {title: string; level: TLevel; style: TStyle; color?: string}
|
|
14
14
|
overline: {title: string}
|
|
15
15
|
content: string
|
|
16
16
|
textAlign: TAlignment
|
|
@@ -1,5 +1,7 @@
|
|
|
1
1
|
import {BlockControls, InspectorControls, RichText} from '@wordpress/block-editor'
|
|
2
2
|
import {
|
|
3
|
+
BaseControl,
|
|
4
|
+
ColorPalette,
|
|
3
5
|
PanelBody,
|
|
4
6
|
TextControl,
|
|
5
7
|
__experimentalToggleGroupControl as ToggleGroupControl,
|
|
@@ -11,6 +13,7 @@ import {__} from '@wordpress/i18n'
|
|
|
11
13
|
import clsx from 'clsx'
|
|
12
14
|
import {ImagePickerBody, ImagePickerControl} from '~/components/ImagePicker'
|
|
13
15
|
import {useGroupBlock} from '~/hooks/useGroupBlock'
|
|
16
|
+
import {useTenantColorPalette} from '~/hooks/useTenantColorPalette'
|
|
14
17
|
import {
|
|
15
18
|
CHIP_POSITIONS,
|
|
16
19
|
DEFAULT_CHIP_VARIANTS,
|
|
@@ -51,6 +54,7 @@ export function createTextAndMediaGroupEdit(options: TextAndMediaGroupOptions) {
|
|
|
51
54
|
}) {
|
|
52
55
|
const {header, mediaPosition, img, ratio, gridStyle, content} = attributes
|
|
53
56
|
const isMediaLeft = mediaPosition === 'left'
|
|
57
|
+
const {paletteColors} = useTenantColorPalette()
|
|
54
58
|
|
|
55
59
|
const {blockProps, innerBlocksProps} = useGroupBlock({
|
|
56
60
|
blockClassName: [
|
|
@@ -90,10 +94,11 @@ export function createTextAndMediaGroupEdit(options: TextAndMediaGroupOptions) {
|
|
|
90
94
|
<RichText
|
|
91
95
|
tagName={`h${header.heading.level}` as 'h1' | 'h2' | 'h3' | 'h4'}
|
|
92
96
|
className={clsx('g-text-and-media__heading', `--heading-style-${header.heading.style}`, 'u-text-editable')}
|
|
97
|
+
style={header.heading.color ? {color: header.heading.color} : undefined}
|
|
93
98
|
value={header.heading.title}
|
|
94
99
|
onChange={(value: string) => setAttributes({header: {...header, heading: {...header.heading, title: value}}})}
|
|
95
100
|
placeholder={__('Nadpis...', 'brilo-blocks')}
|
|
96
|
-
allowedFormats={['core/bold', 'core/italic']}
|
|
101
|
+
allowedFormats={['core/bold', 'core/italic', 'core/text-color']}
|
|
97
102
|
/>
|
|
98
103
|
<div {...innerBlocksProps} />
|
|
99
104
|
</div>
|
|
@@ -218,6 +223,13 @@ export function createTextAndMediaGroupEdit(options: TextAndMediaGroupOptions) {
|
|
|
218
223
|
<ToggleGroupControlOption key={s.value} value={s.value} label={s.label} />
|
|
219
224
|
))}
|
|
220
225
|
</ToggleGroupControl>
|
|
226
|
+
<BaseControl label={__('Barva nadpisu', 'brilo-blocks')}>
|
|
227
|
+
<ColorPalette
|
|
228
|
+
colors={paletteColors}
|
|
229
|
+
value={header.heading.color || undefined}
|
|
230
|
+
onChange={(value) => setAttributes({header: {...header, heading: {...header.heading, color: value ?? ''}}})}
|
|
231
|
+
/>
|
|
232
|
+
</BaseControl>
|
|
221
233
|
</PanelBody>
|
|
222
234
|
</InspectorControls>
|
|
223
235
|
<div {...blockProps}>
|
|
@@ -55,7 +55,7 @@ export function createTextAndMediaGroupBlock<
|
|
|
55
55
|
header: {
|
|
56
56
|
type: 'object',
|
|
57
57
|
default: {
|
|
58
|
-
heading: {title: '', level: HEADING_LEVELS[1], style: headingStyles[1]?.value ?? headingStyles[0].value},
|
|
58
|
+
heading: {title: '', level: HEADING_LEVELS[1], style: headingStyles[1]?.value ?? headingStyles[0].value, color: ''},
|
|
59
59
|
overline: {title: ''},
|
|
60
60
|
},
|
|
61
61
|
},
|
|
@@ -28,7 +28,7 @@ export interface TextAndMediaGroupAttributes<
|
|
|
28
28
|
TChipVariant extends string = ChipVariants,
|
|
29
29
|
> extends Record<string, unknown> {
|
|
30
30
|
header: {
|
|
31
|
-
heading: {title: string; level: HeadingLevels; style: THeadingStyle}
|
|
31
|
+
heading: {title: string; level: HeadingLevels; style: THeadingStyle; color?: string}
|
|
32
32
|
overline: {title: string}
|
|
33
33
|
}
|
|
34
34
|
mediaPosition: TMediaPosition
|
|
@@ -5,6 +5,7 @@ import {
|
|
|
5
5
|
AlignmentMatrixControl,
|
|
6
6
|
__experimentalToggleGroupControl as ToggleGroupControl,
|
|
7
7
|
BaseControl,
|
|
8
|
+
ColorPalette,
|
|
8
9
|
TextControl,
|
|
9
10
|
ToggleControl,
|
|
10
11
|
} from '@wordpress/components'
|
|
@@ -13,6 +14,7 @@ import {ImagePickerBody, ImagePickerControl} from '~/components/ImagePicker'
|
|
|
13
14
|
import {CONTENT_POSITIONS, HEADING_LEVELS} from './constants'
|
|
14
15
|
import type {ContentPosition, HeroItemAttributes, HeroItemOptions} from './types'
|
|
15
16
|
import {useGroupBlock} from '~/hooks/useGroupBlock'
|
|
17
|
+
import {useTenantColorPalette} from '~/hooks/useTenantColorPalette'
|
|
16
18
|
import clsx from 'clsx'
|
|
17
19
|
|
|
18
20
|
export function createHeroItemEdit(options: HeroItemOptions) {
|
|
@@ -23,7 +25,8 @@ export function createHeroItemEdit(options: HeroItemOptions) {
|
|
|
23
25
|
attributes: HeroItemAttributes
|
|
24
26
|
setAttributes: (a: Partial<HeroItemAttributes>) => void
|
|
25
27
|
}) {
|
|
26
|
-
const {title, img, headingLevel, contentPosition, url, focalPoint} = attributes
|
|
28
|
+
const {title, titleColor, img, headingLevel, contentPosition, url, focalPoint} = attributes
|
|
29
|
+
const {paletteColors} = useTenantColorPalette()
|
|
27
30
|
|
|
28
31
|
const {blockProps, innerBlocksProps} = useGroupBlock({
|
|
29
32
|
blockClassName: clsx(options.blockClassName ?? 'i-hero'),
|
|
@@ -54,6 +57,10 @@ export function createHeroItemEdit(options: HeroItemOptions) {
|
|
|
54
57
|
/>
|
|
55
58
|
</BaseControl>
|
|
56
59
|
|
|
60
|
+
<BaseControl label={__('Barva nadpisu', 'brilo-blocks')}>
|
|
61
|
+
<ColorPalette colors={paletteColors} value={titleColor || undefined} onChange={(v) => setAttributes({titleColor: v ?? ''})} />
|
|
62
|
+
</BaseControl>
|
|
63
|
+
|
|
57
64
|
<ToggleGroupControl
|
|
58
65
|
isBlock
|
|
59
66
|
label={__('Úroveň nadpisu položek', 'brilo-blocks')}
|
|
@@ -94,6 +101,7 @@ export function createHeroItemEdit(options: HeroItemOptions) {
|
|
|
94
101
|
<RichText
|
|
95
102
|
tagName={`h${headingLevel}` as any}
|
|
96
103
|
className="i-hero__title u-text-editable"
|
|
104
|
+
style={titleColor ? {color: titleColor} : undefined}
|
|
97
105
|
value={title}
|
|
98
106
|
onChange={(v) => setAttributes({title: v})}
|
|
99
107
|
placeholder={__('Nadpis...', 'brilo-blocks')}
|
|
@@ -20,6 +20,7 @@ export function createHeroItemBlock(options: HeroItemOptions): BlockConfiguratio
|
|
|
20
20
|
supports: {html: false, customClassName: false},
|
|
21
21
|
attributes: {
|
|
22
22
|
title: {type: 'string', default: ''},
|
|
23
|
+
titleColor: {type: 'string', default: ''},
|
|
23
24
|
img: {
|
|
24
25
|
type: 'object',
|
|
25
26
|
default: {id: 0, url: '', alt: ''},
|