Creates TainacanBlocksCompatToolbar function and replaces ToolbarGroups usage by it. #461

This commit is contained in:
mateuswetah 2020-11-30 12:01:50 -03:00
parent 936914c315
commit ee2c577956
13 changed files with 162 additions and 477 deletions

View File

@ -0,0 +1,29 @@
const { Button, ToolbarGroup, ToolbarButton } = wp.components;
export default function TainacanBlocksCompatToolbar({ label, icon, onClick, onClickParams, controls }) {
return tainacan_blocks.wp_version < '5.4' ?
<Button style={{ whiteSpace: 'nowrap', alignItems: 'center', borderTop: '1px solid #b5bcc2' }} onClick={ () => onClick(onClickParams) }>
<p style={{ margin: 0 }}>
{ icon }
</p>&nbsp;
{ label }
</Button>
:
<ToolbarGroup>
{ tainacan_blocks.wp_version < '5.5' ?
<Button style={{ whiteSpace: 'nowrap' }} onClick={ () => onClick(onClickParams) }>
<p>
{ icon }
</p>&nbsp;
{ label }
</Button>
:
<ToolbarButton onClick={ () => onClick(onClickParams) }>
<p>
{ icon }
</p>&nbsp;
{ label }
</ToolbarButton>
}
</ToolbarGroup>
}

View File

@ -2,7 +2,7 @@ const { registerBlockType } = wp.blocks;
const { __ } = wp.i18n; const { __ } = wp.i18n;
const { RangeControl, Spinner, Button, BaseControl, ToggleControl, SelectControl, Placeholder, IconButton, PanelBody, ToolbarGroup, ToolbarButton } = wp.components; const { RangeControl, Spinner, Button, BaseControl, ToggleControl, SelectControl, Placeholder, IconButton, PanelBody } = wp.components;
const { InspectorControls, BlockControls } = wp.editor; const { InspectorControls, BlockControls } = wp.editor;
@ -10,6 +10,7 @@ import CarouselCollectionsModal from './carousel-collections-modal.js';
import tainacan from '../../js/axios.js'; import tainacan from '../../js/axios.js';
import axios from 'axios'; import axios from 'axios';
import qs from 'qs'; import qs from 'qs';
import TainacanBlocksCompatToolbar from '../../js/tainacan-blocks-compat-toolbar.js';
registerBlockType('tainacan/carousel-collections-list', { registerBlockType('tainacan/carousel-collections-list', {
title: __('Tainacan Collections Carousel', 'tainacan'), title: __('Tainacan Collections Carousel', 'tainacan'),
@ -322,49 +323,18 @@ registerBlockType('tainacan/carousel-collections-list', {
{ collections.length ? { collections.length ?
<BlockControls> <BlockControls>
{ tainacan_blocks.wp_version < '5.4' ? {
<Button style={{ whiteSpace: 'nowrap', alignItems: 'center', borderTop: '1px solid #b5bcc2' }} onClick={ () => openCarouselModal() } > TainacanBlocksCompatToolbar({
<p style={{ margin: 0 }}> label: __('Add more collections', 'tainacan'),
<svg icon: <svg
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24" viewBox="0 -2 24 24"
height="24px" height="24px"
width="24px"> width="24px">
<path d="M18,17v2H12a5.65,5.65,0,0,0-.36-2ZM2,7v7.57a5.74,5.74,0,0,1,2-1.2V7ZM20,6H15L13,4H8A2,2,0,0,0,6,6v7a6,6,0,0,1,5.19,3H20a2,2,0,0,0,2-2V8A2,2,0,0,0,20,6ZM7,16.05v6.06l3.06-3.06ZM5,22.11V16.05L1.94,19.11Z"/> <path d="M18,17v2H12a5.65,5.65,0,0,0-.36-2ZM2,7v7.57a5.74,5.74,0,0,1,2-1.2V7ZM20,6H15L13,4H8A2,2,0,0,0,6,6v7a6,6,0,0,1,5.19,3H20a2,2,0,0,0,2-2V8A2,2,0,0,0,20,6ZM7,16.05v6.06l3.06-3.06ZM5,22.11V16.05L1.94,19.11Z"/>
</svg> </svg>,
</p>&nbsp; onClick: openCarouselModal
{ __('Add more collections', 'tainacan') } })
</Button>
:
<ToolbarGroup>
{ tainacan_blocks.wp_version < '5.5' ?
<Button style={{ whiteSpace: 'nowrap' }} onClick={ () => openCarouselModal() } >
<p>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
height="24px"
width="24px">
<path d="M18,17v2H12a5.65,5.65,0,0,0-.36-2ZM2,7v7.57a5.74,5.74,0,0,1,2-1.2V7ZM20,6H15L13,4H8A2,2,0,0,0,6,6v7a6,6,0,0,1,5.19,3H20a2,2,0,0,0,2-2V8A2,2,0,0,0,20,6ZM7,16.05v6.06l3.06-3.06ZM5,22.11V16.05L1.94,19.11Z"/>
</svg>
</p>&nbsp;
{ __('Add more collections', 'tainacan') }
</Button>
:
<ToolbarButton onClick={ () => openCarouselModal() } >
<p>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
height="24px"
width="24px">
<path d="M18,17v2H12a5.65,5.65,0,0,0-.36-2ZM2,7v7.57a5.74,5.74,0,0,1,2-1.2V7ZM20,6H15L13,4H8A2,2,0,0,0,6,6v7a6,6,0,0,1,5.19,3H20a2,2,0,0,0,2-2V8A2,2,0,0,0,20,6ZM7,16.05v6.06l3.06-3.06ZM5,22.11V16.05L1.94,19.11Z"/>
</svg>
</p>&nbsp;
{ __('Add more collections', 'tainacan') }
</ToolbarButton>
}
</ToolbarGroup>
} }
</BlockControls> </BlockControls>
: null } : null }

View File

@ -2,10 +2,11 @@ const { registerBlockType } = wp.blocks;
const { __ } = wp.i18n; const { __ } = wp.i18n;
const { RangeControl, IconButton, Button, ToggleControl, Placeholder, Toolbar, ToolbarGroup, PanelBody, ToolbarButton } = wp.components; const { RangeControl, IconButton, Button, ToggleControl, Placeholder, Toolbar, PanelBody } = wp.components;
const { InspectorControls, BlockControls } = wp.editor; const { InspectorControls, BlockControls } = wp.editor;
import TainacanBlocksCompatToolbar from '../../js/tainacan-blocks-compat-toolbar.js';
import CollectionsModal from './collections-modal.js'; import CollectionsModal from './collections-modal.js';
registerBlockType('tainacan/collections-list', { registerBlockType('tainacan/collections-list', {
@ -221,43 +222,15 @@ registerBlockType('tainacan/collections-list', {
<BlockControls> <BlockControls>
<Toolbar controls={ layoutControls } /> <Toolbar controls={ layoutControls } />
{ selectedCollectionsHTML.length ? { selectedCollectionsHTML.length ?
tainacan_blocks.wp_version < '5.4' ? TainacanBlocksCompatToolbar({
<Button style={{ whiteSpace: 'nowrap', alignItems: 'center', borderTop: '1px solid #b5bcc2' }} onClick={ openCollectionsModal } > label: __( 'Select collections', 'tainacan' ),
<p style={{ margin: 0 }}> icon: <svg width="24" height="24" viewBox="0 -5 12 16">
<svg width="24" height="24" viewBox="0 -5 12 16">
<path <path
d="M10,8.8v1.3H1.2C0.6,10.1,0,9.5,0,8.8V2.5h1.3v6.3H10z M6.9,0H3.8C3.1,0,2.5,0.6,2.5,1.3l0,5c0,0.7,0.6,1.2,1.3,1.2h7.5 d="M10,8.8v1.3H1.2C0.6,10.1,0,9.5,0,8.8V2.5h1.3v6.3H10z M6.9,0H3.8C3.1,0,2.5,0.6,2.5,1.3l0,5c0,0.7,0.6,1.2,1.3,1.2h7.5
c0.7,0,1.3-0.6,1.3-1.2V2.5c0-0.7-0.6-1.2-1.3-1.2H8.2L6.9,0z"/> c0.7,0,1.3-0.6,1.3-1.2V2.5c0-0.7-0.6-1.2-1.3-1.2H8.2L6.9,0z"/>
</svg> </svg>,
</p>&nbsp; onClick: openCollectionsModal
{ __( 'Select collections', 'tainacan' ) } })
</Button>
:
<ToolbarGroup>
{ tainacan_blocks.wp_version < '5.5' ?
<Button style={{ whiteSpace: 'nowrap' }} onClick={ openCollectionsModal } >
<p>
<svg width="24" height="24" viewBox="0 -5 12 16">
<path
d="M10,8.8v1.3H1.2C0.6,10.1,0,9.5,0,8.8V2.5h1.3v6.3H10z M6.9,0H3.8C3.1,0,2.5,0.6,2.5,1.3l0,5c0,0.7,0.6,1.2,1.3,1.2h7.5
c0.7,0,1.3-0.6,1.3-1.2V2.5c0-0.7-0.6-1.2-1.3-1.2H8.2L6.9,0z"/>
</svg>
</p>&nbsp;
{ __( 'Select collections', 'tainacan' ) }
</Button>
:
<ToolbarButton onClick={ openCollectionsModal } >
<p>
<svg width="24" height="24" viewBox="0 -5 12 16">
<path
d="M10,8.8v1.3H1.2C0.6,10.1,0,9.5,0,8.8V2.5h1.3v6.3H10z M6.9,0H3.8C3.1,0,2.5,0.6,2.5,1.3l0,5c0,0.7,0.6,1.2,1.3,1.2h7.5
c0.7,0,1.3-0.6,1.3-1.2V2.5c0-0.7-0.6-1.2-1.3-1.2H8.2L6.9,0z"/>
</svg>
</p>&nbsp;
{ __( 'Select collections', 'tainacan' ) }
</ToolbarButton>
}
</ToolbarGroup>
: null } : null }
</BlockControls> </BlockControls>
</div> </div>

View File

@ -2,7 +2,7 @@ const { registerBlockType } = wp.blocks;
const { __ } = wp.i18n; const { __ } = wp.i18n;
const { BaseControl, RangeControl, Spinner, Button, ToggleControl, Tooltip, Placeholder, Toolbar, ToolbarGroup, ToolbarButton, PanelBody } = wp.components; const { BaseControl, RangeControl, Spinner, Button, ToggleControl, Tooltip, Placeholder, Toolbar, PanelBody } = wp.components;
const { InspectorControls, BlockControls } = wp.editor; const { InspectorControls, BlockControls } = wp.editor;
@ -11,6 +11,7 @@ import ParentTermModal from './parent-term-modal.js';
import tainacan from '../../js/axios.js'; import tainacan from '../../js/axios.js';
import axios from 'axios'; import axios from 'axios';
import qs from 'qs'; import qs from 'qs';
import TainacanBlocksCompatToolbar from '../../js/tainacan-blocks-compat-toolbar.js';
registerBlockType('tainacan/facets-list', { registerBlockType('tainacan/facets-list', {
title: __('Tainacan Facets List', 'tainacan'), title: __('Tainacan Facets List', 'tainacan'),
@ -381,49 +382,17 @@ registerBlockType('tainacan/facets-list', {
<BlockControls> <BlockControls>
<Toolbar controls={ layoutControls } /> <Toolbar controls={ layoutControls } />
{ facets.length ? ( { facets.length ? (
tainacan_blocks.wp_version < '5.4' ? TainacanBlocksCompatToolbar({
<Button style={{ whiteSpace: 'nowrap', alignItems: 'center', borderTop: '1px solid #b5bcc2' }} onClick={ () => openMetadataModal() } > label: __('Select facets', 'tainacan'),
<p style={{ margin: 0 }}> icon: <svg
<svg
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24" viewBox="0 0 24 24"
height="24px" height="24px"
width="24px"> width="24px">
<path d="M21.43,13.64,19.32,16a2.57,2.57,0,0,1-2,1H11a3.91,3.91,0,0,0,0-.49,5.49,5.49,0,0,0-5-5.47V9.64A2.59,2.59,0,0,1,8.59,7H17.3a2.57,2.57,0,0,1,2,1l2.11,2.38A2.59,2.59,0,0,1,21.43,13.64ZM4,3A2,2,0,0,0,2,5v7.3a5.32,5.32,0,0,1,2-1V5H16V3ZM11,21l-1,1L8.86,20.89,8,20H8l-.57-.57A3.42,3.42,0,0,1,5.5,20a3.5,3.5,0,0,1,0-7,2.74,2.74,0,0,1,.5,0A3.5,3.5,0,0,1,9,16a2.92,2.92,0,0,1,0,.51,3.42,3.42,0,0,1-.58,1.92L9,19H9l.85.85Zm-4-4.5A1.5,1.5,0,1,0,5.5,18,1.5,1.5,0,0,0,7,16.53Z"/> <path d="M21.43,13.64,19.32,16a2.57,2.57,0,0,1-2,1H11a3.91,3.91,0,0,0,0-.49,5.49,5.49,0,0,0-5-5.47V9.64A2.59,2.59,0,0,1,8.59,7H17.3a2.57,2.57,0,0,1,2,1l2.11,2.38A2.59,2.59,0,0,1,21.43,13.64ZM4,3A2,2,0,0,0,2,5v7.3a5.32,5.32,0,0,1,2-1V5H16V3ZM11,21l-1,1L8.86,20.89,8,20H8l-.57-.57A3.42,3.42,0,0,1,5.5,20a3.5,3.5,0,0,1,0-7,2.74,2.74,0,0,1,.5,0A3.5,3.5,0,0,1,9,16a2.92,2.92,0,0,1,0,.51,3.42,3.42,0,0,1-.58,1.92L9,19H9l.85.85Zm-4-4.5A1.5,1.5,0,1,0,5.5,18,1.5,1.5,0,0,0,7,16.53Z"/>
</svg> </svg>,
</p>&nbsp; onclick: openMetadataModal
{__('Select facets', 'tainacan')} })
</Button>
:
<ToolbarGroup>
{ tainacan_blocks.wp_version < '5.5' ?
<Button style={{ whiteSpace: 'nowrap' }} onClick={ () => openMetadataModal() }>
<p>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
height="24px"
width="24px">
<path d="M21.43,13.64,19.32,16a2.57,2.57,0,0,1-2,1H11a3.91,3.91,0,0,0,0-.49,5.49,5.49,0,0,0-5-5.47V9.64A2.59,2.59,0,0,1,8.59,7H17.3a2.57,2.57,0,0,1,2,1l2.11,2.38A2.59,2.59,0,0,1,21.43,13.64ZM4,3A2,2,0,0,0,2,5v7.3a5.32,5.32,0,0,1,2-1V5H16V3ZM11,21l-1,1L8.86,20.89,8,20H8l-.57-.57A3.42,3.42,0,0,1,5.5,20a3.5,3.5,0,0,1,0-7,2.74,2.74,0,0,1,.5,0A3.5,3.5,0,0,1,9,16a2.92,2.92,0,0,1,0,.51,3.42,3.42,0,0,1-.58,1.92L9,19H9l.85.85Zm-4-4.5A1.5,1.5,0,1,0,5.5,18,1.5,1.5,0,0,0,7,16.53Z"/>
</svg>
</p>&nbsp;
{__('Select facets', 'tainacan')}
</Button>
:
<ToolbarButton onClick={ () => openMetadataModal() }>
<p>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
height="24px"
width="24px">
<path d="M21.43,13.64,19.32,16a2.57,2.57,0,0,1-2,1H11a3.91,3.91,0,0,0,0-.49,5.49,5.49,0,0,0-5-5.47V9.64A2.59,2.59,0,0,1,8.59,7H17.3a2.57,2.57,0,0,1,2,1l2.11,2.38A2.59,2.59,0,0,1,21.43,13.64ZM4,3A2,2,0,0,0,2,5v7.3a5.32,5.32,0,0,1,2-1V5H16V3ZM11,21l-1,1L8.86,20.89,8,20H8l-.57-.57A3.42,3.42,0,0,1,5.5,20a3.5,3.5,0,0,1,0-7,2.74,2.74,0,0,1,.5,0A3.5,3.5,0,0,1,9,16a2.92,2.92,0,0,1,0,.51,3.42,3.42,0,0,1-.58,1.92L9,19H9l.85.85Zm-4-4.5A1.5,1.5,0,1,0,5.5,18,1.5,1.5,0,0,0,7,16.53Z"/>
</svg>
</p>&nbsp;
{__('Select facets', 'tainacan')}
</ToolbarButton>
}
</ToolbarGroup>
): null ): null
} }
</BlockControls> </BlockControls>

View File

@ -2,7 +2,7 @@ const { registerBlockType } = wp.blocks;
const { __ } = wp.i18n; const { __ } = wp.i18n;
const { RangeControl, Spinner, Button, ToggleControl, SelectControl, Placeholder, IconButton, ColorPicker, ColorPalette, BaseControl, PanelBody, ToolbarGroup, ToolbarButton } = wp.components; const { RangeControl, Spinner, Button, ToggleControl, SelectControl, Placeholder, IconButton, ColorPicker, ColorPalette, BaseControl, PanelBody } = wp.components;
const { InspectorControls, BlockControls } = wp.editor; const { InspectorControls, BlockControls } = wp.editor;
@ -10,6 +10,7 @@ import CarouselItemsModal from './carousel-items-modal.js';
import tainacan from '../../js/axios.js'; import tainacan from '../../js/axios.js';
import axios from 'axios'; import axios from 'axios';
import qs from 'qs'; import qs from 'qs';
import TainacanBlocksCompatToolbar from '../../js/tainacan-blocks-compat-toolbar.js';
registerBlockType('tainacan/carousel-items-list', { registerBlockType('tainacan/carousel-items-list', {
title: __('Tainacan Collection\'s Items Carousel', 'tainacan'), title: __('Tainacan Collection\'s Items Carousel', 'tainacan'),
@ -361,92 +362,32 @@ registerBlockType('tainacan/carousel-items-list', {
{ items.length ? { items.length ?
<BlockControls> <BlockControls>
{ tainacan_blocks.wp_version < '5.4' ? { loadStrategy != 'search' ?
loadStrategy != 'search' ? TainacanBlocksCompatToolbar({
<Button style={{ whiteSpace: 'nowrap', alignItems: 'center', borderTop: '1px solid #b5bcc2' }} onClick={ () => openCarouseltemsModal('selection') } > label: __('Add more items', 'tainacan'),
<p style={{ margin: 0 }}> icon: <svg
<svg
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24" viewBox="0 0 24 24"
height="24px" height="24px"
width="24px"> width="24px">
<path d="M16,6H12a2,2,0,0,0-2,2v6.52A6,6,0,0,1,12,19a6,6,0,0,1-.73,2.88A1.92,1.92,0,0,0,12,22h8a2,2,0,0,0,2-2V12Zm-1,6V7.5L19.51,12ZM15,2V4H8v9.33A5.8,5.8,0,0,0,6,13V4A2,2,0,0,1,8,2ZM10.09,19.05,7,22.11V16.05L8,17l2,2ZM5,16.05v6.06L2,19.11Z"/> <path d="M16,6H12a2,2,0,0,0-2,2v6.52A6,6,0,0,1,12,19a6,6,0,0,1-.73,2.88A1.92,1.92,0,0,0,12,22h8a2,2,0,0,0,2-2V12Zm-1,6V7.5L19.51,12ZM15,2V4H8v9.33A5.8,5.8,0,0,0,6,13V4A2,2,0,0,1,8,2ZM10.09,19.05,7,22.11V16.05L8,17l2,2ZM5,16.05v6.06L2,19.11Z"/>
</svg> </svg>,
</p>&nbsp; onClick: openCarouseltemsModal,
{ __('Add more items', 'tainacan') } onClickParams: 'selection'
</Button> })
: :
<Button style={{ whiteSpace: 'nowrap', alignItems: 'center', borderTop: '1px solid #b5bcc2' }} onClick={ () => openCarouseltemsModal('search') } > TainacanBlocksCompatToolbar({
<p style={{ margin: 0 }}> label: __('Configure a search', 'tainacan'),
<svg icon: <svg
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24" viewBox="0 0 24 24"
height="24px" height="24px"
width="24px"> width="24px">
<path d="M16,6H12a2,2,0,0,0-2,2v6.52A6,6,0,0,1,12,19a6,6,0,0,1-.73,2.88A1.92,1.92,0,0,0,12,22h8a2,2,0,0,0,2-2V12Zm-1,6V7.5L19.51,12ZM15,2V4H8v9.33A5.8,5.8,0,0,0,6,13V4A2,2,0,0,1,8,2ZM10.09,19.05,7,22.11V16.05L8,17l2,2ZM5,16.05v6.06L2,19.11Z"/> <path d="M16,6H12a2,2,0,0,0-2,2v6.52A6,6,0,0,1,12,19a6,6,0,0,1-.73,2.88A1.92,1.92,0,0,0,12,22h8a2,2,0,0,0,2-2V12Zm-1,6V7.5L19.51,12ZM15,2V4H8v9.33A5.8,5.8,0,0,0,6,13V4A2,2,0,0,1,8,2ZM10.09,19.05,7,22.11V16.05L8,17l2,2ZM5,16.05v6.06L2,19.11Z"/>
</svg> </svg>,
</p>&nbsp; onClick: openCarouseltemsModal,
{ __('Configure a search', 'tainacan') } onClickParams: 'search'
</Button> })
:
<ToolbarGroup>
{ loadStrategy != 'search' ? (
tainacan_blocks.wp_version < '5.5' ?
<Button style={{ whiteSpace: 'nowrap' }} onClick={ () => openCarouseltemsModal('selection') } >
<p>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
height="24px"
width="24px">
<path d="M16,6H12a2,2,0,0,0-2,2v6.52A6,6,0,0,1,12,19a6,6,0,0,1-.73,2.88A1.92,1.92,0,0,0,12,22h8a2,2,0,0,0,2-2V12Zm-1,6V7.5L19.51,12ZM15,2V4H8v9.33A5.8,5.8,0,0,0,6,13V4A2,2,0,0,1,8,2ZM10.09,19.05,7,22.11V16.05L8,17l2,2ZM5,16.05v6.06L2,19.11Z"/>
</svg>
</p>&nbsp;
{ __('Add more items', 'tainacan') }
</Button>
:
<ToolbarButton onClick={ () => openCarouseltemsModal('selection') } >
<p>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
height="24px"
width="24px">
<path d="M16,6H12a2,2,0,0,0-2,2v6.52A6,6,0,0,1,12,19a6,6,0,0,1-.73,2.88A1.92,1.92,0,0,0,12,22h8a2,2,0,0,0,2-2V12Zm-1,6V7.5L19.51,12ZM15,2V4H8v9.33A5.8,5.8,0,0,0,6,13V4A2,2,0,0,1,8,2ZM10.09,19.05,7,22.11V16.05L8,17l2,2ZM5,16.05v6.06L2,19.11Z"/>
</svg>
</p>&nbsp;
{ __('Add more items', 'tainacan') }
</ToolbarButton>
) :
( tainacan_blocks.wp_version < '5.5' ?
<Button style={{ whiteSpace: 'nowrap' }} onClick={ () => openCarouseltemsModal('search') } >
<p>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
height="24px"
width="24px">
<path d="M16,6H12a2,2,0,0,0-2,2v6.52A6,6,0,0,1,12,19a6,6,0,0,1-.73,2.88A1.92,1.92,0,0,0,12,22h8a2,2,0,0,0,2-2V12Zm-1,6V7.5L19.51,12ZM15,2V4H8v9.33A5.8,5.8,0,0,0,6,13V4A2,2,0,0,1,8,2ZM10.09,19.05,7,22.11V16.05L8,17l2,2ZM5,16.05v6.06L2,19.11Z"/>
</svg>
</p>&nbsp;
{ __('Configure a search', 'tainacan') }
</Button>
:
<ToolbarButton onClick={ () => openCarouseltemsModal('search') } >
<p>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
height="24px"
width="24px">
<path d="M16,6H12a2,2,0,0,0-2,2v6.52A6,6,0,0,1,12,19a6,6,0,0,1-.73,2.88A1.92,1.92,0,0,0,12,22h8a2,2,0,0,0,2-2V12Zm-1,6V7.5L19.51,12ZM15,2V4H8v9.33A5.8,5.8,0,0,0,6,13V4A2,2,0,0,1,8,2ZM10.09,19.05,7,22.11V16.05L8,17l2,2ZM5,16.05v6.06L2,19.11Z"/>
</svg>
</p>&nbsp;
{ __('Configure a search', 'tainacan') }
</ToolbarButton>
)
}
</ToolbarGroup>
} }
</BlockControls> </BlockControls>
: null } : null }

View File

@ -2,7 +2,7 @@ const { registerBlockType } = wp.blocks;
const { __ } = wp.i18n; const { __ } = wp.i18n;
const { ResizableBox, FocalPointPicker, SelectControl, RangeControl, Spinner, Button, ToggleControl, Tooltip, Placeholder, Toolbar, ToolbarGroup, ToolbarButton, ColorPicker, ColorPalette, BaseControl, PanelBody } = wp.components; const { ResizableBox, FocalPointPicker, SelectControl, RangeControl, Spinner, Button, ToggleControl, Tooltip, Placeholder, Toolbar, ColorPicker, ColorPalette, BaseControl, PanelBody } = wp.components;
const { InspectorControls, BlockControls } = wp.editor; const { InspectorControls, BlockControls } = wp.editor;
@ -10,6 +10,7 @@ import DynamicItemsModal from './dynamic-items-modal.js';
import tainacan from '../../js/axios.js'; import tainacan from '../../js/axios.js';
import axios from 'axios'; import axios from 'axios';
import qs from 'qs'; import qs from 'qs';
import TainacanBlocksCompatToolbar from '../../js/tainacan-blocks-compat-toolbar.js';
registerBlockType('tainacan/dynamic-items-list', { registerBlockType('tainacan/dynamic-items-list', {
title: __('Tainacan Collection\'s Items List', 'tainacan'), title: __('Tainacan Collection\'s Items List', 'tainacan'),
@ -483,49 +484,17 @@ registerBlockType('tainacan/dynamic-items-list', {
<BlockControls> <BlockControls>
<Toolbar controls={ layoutControls } /> <Toolbar controls={ layoutControls } />
{ items.length ? { items.length ?
tainacan_blocks.wp_version < '5.4' ? TainacanBlocksCompatToolbar({
<Button style={{ whiteSpace: 'nowrap', alignItems: 'center', borderTop: '1px solid #b5bcc2' }} onClick={ openDynamicItemsModal } > label: __('Configure search', 'tainacan'),
<p style={{ margin: 0 }}> icon: <svg
<svg
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24" viewBox="0 -2 24 24"
height="24px" height="24px"
width="24px"> width="24px">
<path d="M14,2V4H7v7.24A5.33,5.33,0,0,0,5.5,11a4.07,4.07,0,0,0-.5,0V4A2,2,0,0,1,7,2Zm7,10v8a2,2,0,0,1-2,2H12l1-1-2.41-2.41A5.56,5.56,0,0,0,11,16.53a5.48,5.48,0,0,0-2-4.24V8a2,2,0,0,1,2-2h4Zm-2.52,0L14,7.5V12ZM11,21l-1,1L8.86,20.89,8,20H8l-.57-.57A3.42,3.42,0,0,1,5.5,20a3.5,3.5,0,0,1-.5-7,2.74,2.74,0,0,1,.5,0,3.41,3.41,0,0,1,1.5.34,3.5,3.5,0,0,1,2,3.16,3.42,3.42,0,0,1-.58,1.92L9,19H9l.85.85Zm-4-4.5A1.5,1.5,0,0,0,5.5,15a1.39,1.39,0,0,0-.5.09A1.5,1.5,0,0,0,5.5,18a1.48,1.48,0,0,0,1.42-1A1.5,1.5,0,0,0,7,16.53Z"/> <path d="M14,2V4H7v7.24A5.33,5.33,0,0,0,5.5,11a4.07,4.07,0,0,0-.5,0V4A2,2,0,0,1,7,2Zm7,10v8a2,2,0,0,1-2,2H12l1-1-2.41-2.41A5.56,5.56,0,0,0,11,16.53a5.48,5.48,0,0,0-2-4.24V8a2,2,0,0,1,2-2h4Zm-2.52,0L14,7.5V12ZM11,21l-1,1L8.86,20.89,8,20H8l-.57-.57A3.42,3.42,0,0,1,5.5,20a3.5,3.5,0,0,1-.5-7,2.74,2.74,0,0,1,.5,0,3.41,3.41,0,0,1,1.5.34,3.5,3.5,0,0,1,2,3.16,3.42,3.42,0,0,1-.58,1.92L9,19H9l.85.85Zm-4-4.5A1.5,1.5,0,0,0,5.5,15a1.39,1.39,0,0,0-.5.09A1.5,1.5,0,0,0,5.5,18a1.48,1.48,0,0,0,1.42-1A1.5,1.5,0,0,0,7,16.53Z"/>
</svg> </svg>,
</p>&nbsp; onClick: openDynamicItemsModal
{__('Configure search', 'tainacan')} })
</Button>
:
<ToolbarGroup>
{ tainacan_blocks.wp_version < '5.5' ?
<Button style={{ whiteSpace: 'nowrap' }} onClick={ openDynamicItemsModal }>
<p style={{ margin: 0 }}>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
height="24px"
width="24px">
<path d="M14,2V4H7v7.24A5.33,5.33,0,0,0,5.5,11a4.07,4.07,0,0,0-.5,0V4A2,2,0,0,1,7,2Zm7,10v8a2,2,0,0,1-2,2H12l1-1-2.41-2.41A5.56,5.56,0,0,0,11,16.53a5.48,5.48,0,0,0-2-4.24V8a2,2,0,0,1,2-2h4Zm-2.52,0L14,7.5V12ZM11,21l-1,1L8.86,20.89,8,20H8l-.57-.57A3.42,3.42,0,0,1,5.5,20a3.5,3.5,0,0,1-.5-7,2.74,2.74,0,0,1,.5,0,3.41,3.41,0,0,1,1.5.34,3.5,3.5,0,0,1,2,3.16,3.42,3.42,0,0,1-.58,1.92L9,19H9l.85.85Zm-4-4.5A1.5,1.5,0,0,0,5.5,15a1.39,1.39,0,0,0-.5.09A1.5,1.5,0,0,0,5.5,18a1.48,1.48,0,0,0,1.42-1A1.5,1.5,0,0,0,7,16.53Z"/>
</svg>
</p>&nbsp;
{__('Configure search', 'tainacan')}
</Button>
:
<ToolbarButton onClick={ openDynamicItemsModal }>
<p>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
height="24px"
width="24px">
<path d="M14,2V4H7v7.24A5.33,5.33,0,0,0,5.5,11a4.07,4.07,0,0,0-.5,0V4A2,2,0,0,1,7,2Zm7,10v8a2,2,0,0,1-2,2H12l1-1-2.41-2.41A5.56,5.56,0,0,0,11,16.53a5.48,5.48,0,0,0-2-4.24V8a2,2,0,0,1,2-2h4Zm-2.52,0L14,7.5V12ZM11,21l-1,1L8.86,20.89,8,20H8l-.57-.57A3.42,3.42,0,0,1,5.5,20a3.5,3.5,0,0,1-.5-7,2.74,2.74,0,0,1,.5,0,3.41,3.41,0,0,1,1.5.34,3.5,3.5,0,0,1,2,3.16,3.42,3.42,0,0,1-.58,1.92L9,19H9l.85.85Zm-4-4.5A1.5,1.5,0,0,0,5.5,15a1.39,1.39,0,0,0-.5.09A1.5,1.5,0,0,0,5.5,18a1.48,1.48,0,0,0,1.42-1A1.5,1.5,0,0,0,7,16.53Z"/>
</svg>
</p>&nbsp;
{__('Configure search', 'tainacan')}
</ToolbarButton>
}
</ToolbarGroup>
: null } : null }
</BlockControls> </BlockControls>
</div> </div>

View File

@ -13,14 +13,13 @@ const {
Spinner, Spinner,
ToggleControl, ToggleControl,
Placeholder, Placeholder,
PanelBody, PanelBody
ToolbarGroup,
ToolbarButton
} = wp.components; } = wp.components;
const { InspectorControls, BlockControls } = wp.editor; const { InspectorControls, BlockControls } = wp.editor;
import tainacan from '../../js/axios.js'; import tainacan from '../../js/axios.js';
import TainacanBlocksCompatToolbar from '../../js/tainacan-blocks-compat-toolbar.js';
import CollectionModal from '../../tainacan-facets/faceted-search/collection-modal.js'; import CollectionModal from '../../tainacan-facets/faceted-search/collection-modal.js';
registerBlockType('tainacan/item-submission-form', { registerBlockType('tainacan/item-submission-form', {
@ -275,10 +274,10 @@ registerBlockType('tainacan/item-submission-form', {
{ collectionId != undefined ? { collectionId != undefined ?
<BlockControls> <BlockControls>
{ tainacan_blocks.wp_version < '5.4' ? {
<Button style={{ whiteSpace: 'nowrap', height: '2.3rem', alignItems: 'center', borderTop: '1px solid #b5bcc2' }} onClick={ () => openCollectionModal() }> TainacanBlocksCompatToolbar({
<p> label: __('Change target collection', 'tainacan'),
<svg icon: <svg
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
viewBox="-2 -2 12 12" viewBox="-2 -2 12 12"
height="24px" height="24px"
@ -286,44 +285,9 @@ registerBlockType('tainacan/item-submission-form', {
<g transform="translate(227.4751,-183.8442)"> <g transform="translate(227.4751,-183.8442)">
<path d="m -227.47379,191.95102 c 0.0372,-2.35931 -0.0195,-4.71936 0.0185,-7.07842 0.0356,-0.55424 0.52604,-0.99051 1.07473,-0.99702 0.80102,-0.0806 1.607,0.0149 2.41027,-0.0211 1.66482,0.0101 3.33138,-0.0202 4.99509,0.01 0.58652,0.0617 1.0108,0.60434 0.99243,1.1815 0.0416,0.76157 -0.0361,1.52426 0.008,2.28649 0.0113,1.65577 -0.006,3.31214 -0.009,4.96756 -0.0429,0.59366 -0.57833,1.06966 -1.17191,1.04765 -0.92086,0.0516 -1.84377,-0.0208 -2.7657,-0.006 -1.49072,-0.0194 -2.98293,0.0353 -4.47258,0.009 -0.60954,-0.039 -1.111,-0.56284 -1.07768,-1.17994 -0.004,-0.0728 -0.004,-0.1462 -0.002,-0.21867 z m 1.15668,0.28162 c 2.40388,0 4.80776,0 7.21164,0 0,-2.41394 0,-4.82787 0,-7.24181 -2.40388,0 -4.80776,0 -7.21164,0 0,2.41394 0,4.82787 0,7.24181 z m 0.53308,-0.53308 c 0,-0.83147 0,-1.66293 0,-2.4944 0.82476,0 1.64953,0 2.47429,0 0,0.83147 0,1.66293 0,2.4944 -0.82476,0 -1.64953,0 -2.47429,0 z m 2.45417,-6.18571 c 0,0.83482 0,1.66964 0,2.50446 -0.82141,0 -1.64282,0 -2.46423,0 0,-0.83482 0,-1.66964 0,-2.50446 0.82141,0 1.64282,0 2.46423,0 z m 1.1768,1.67969 c 0,-0.28833 0,-0.57666 0,-0.86499 0.82811,0 1.65623,0 2.48434,0 0,0.28833 0,0.57666 0,0.86499 -0.82811,0 -1.65623,0 -2.48434,0 z m 2.48434,2.76598 c 0,0.28162 0,0.56325 0,0.84487 -0.82811,0 -1.65623,0 -2.48434,0 0,-0.28162 0,-0.56325 0,-0.84487 0.82811,0 1.65623,0 2.48434,0 z m -5.64258,-2.49441 c 0.48614,0 0.97228,0 1.45842,0 0,-0.47273 0,-0.94546 0,-1.41819 -0.48614,0 -0.97228,0 -1.45842,0 0,0.47273 0,0.94546 0,1.41819 z m 0,3.68126 c 0.48949,0 0.97899,0 1.46848,0 0,-0.47273 0,-0.94546 0,-1.41819 -0.48949,0 -0.97899,0 -1.46848,0 0,0.47273 0,0.94546 0,1.41819 z"></path> <path d="m -227.47379,191.95102 c 0.0372,-2.35931 -0.0195,-4.71936 0.0185,-7.07842 0.0356,-0.55424 0.52604,-0.99051 1.07473,-0.99702 0.80102,-0.0806 1.607,0.0149 2.41027,-0.0211 1.66482,0.0101 3.33138,-0.0202 4.99509,0.01 0.58652,0.0617 1.0108,0.60434 0.99243,1.1815 0.0416,0.76157 -0.0361,1.52426 0.008,2.28649 0.0113,1.65577 -0.006,3.31214 -0.009,4.96756 -0.0429,0.59366 -0.57833,1.06966 -1.17191,1.04765 -0.92086,0.0516 -1.84377,-0.0208 -2.7657,-0.006 -1.49072,-0.0194 -2.98293,0.0353 -4.47258,0.009 -0.60954,-0.039 -1.111,-0.56284 -1.07768,-1.17994 -0.004,-0.0728 -0.004,-0.1462 -0.002,-0.21867 z m 1.15668,0.28162 c 2.40388,0 4.80776,0 7.21164,0 0,-2.41394 0,-4.82787 0,-7.24181 -2.40388,0 -4.80776,0 -7.21164,0 0,2.41394 0,4.82787 0,7.24181 z m 0.53308,-0.53308 c 0,-0.83147 0,-1.66293 0,-2.4944 0.82476,0 1.64953,0 2.47429,0 0,0.83147 0,1.66293 0,2.4944 -0.82476,0 -1.64953,0 -2.47429,0 z m 2.45417,-6.18571 c 0,0.83482 0,1.66964 0,2.50446 -0.82141,0 -1.64282,0 -2.46423,0 0,-0.83482 0,-1.66964 0,-2.50446 0.82141,0 1.64282,0 2.46423,0 z m 1.1768,1.67969 c 0,-0.28833 0,-0.57666 0,-0.86499 0.82811,0 1.65623,0 2.48434,0 0,0.28833 0,0.57666 0,0.86499 -0.82811,0 -1.65623,0 -2.48434,0 z m 2.48434,2.76598 c 0,0.28162 0,0.56325 0,0.84487 -0.82811,0 -1.65623,0 -2.48434,0 0,-0.28162 0,-0.56325 0,-0.84487 0.82811,0 1.65623,0 2.48434,0 z m -5.64258,-2.49441 c 0.48614,0 0.97228,0 1.45842,0 0,-0.47273 0,-0.94546 0,-1.41819 -0.48614,0 -0.97228,0 -1.45842,0 0,0.47273 0,0.94546 0,1.41819 z m 0,3.68126 c 0.48949,0 0.97899,0 1.46848,0 0,-0.47273 0,-0.94546 0,-1.41819 -0.48949,0 -0.97899,0 -1.46848,0 0,0.47273 0,0.94546 0,1.41819 z"></path>
</g> </g>
</svg> </svg>,
</p>&nbsp; onClick: openCollectionModal
{ __('Change target collection', 'tainacan') } })
</Button>
:
<ToolbarGroup>
{ tainacan_blocks.wp_version < '5.5' ?
<Button style={{ whiteSpace: 'nowrap' }} onClick={ () => openCollectionModal() }>
<p>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="-2 -2 12 12"
height="24px"
width="24px">
<g transform="translate(227.4751,-183.8442)">
<path d="m -227.47379,191.95102 c 0.0372,-2.35931 -0.0195,-4.71936 0.0185,-7.07842 0.0356,-0.55424 0.52604,-0.99051 1.07473,-0.99702 0.80102,-0.0806 1.607,0.0149 2.41027,-0.0211 1.66482,0.0101 3.33138,-0.0202 4.99509,0.01 0.58652,0.0617 1.0108,0.60434 0.99243,1.1815 0.0416,0.76157 -0.0361,1.52426 0.008,2.28649 0.0113,1.65577 -0.006,3.31214 -0.009,4.96756 -0.0429,0.59366 -0.57833,1.06966 -1.17191,1.04765 -0.92086,0.0516 -1.84377,-0.0208 -2.7657,-0.006 -1.49072,-0.0194 -2.98293,0.0353 -4.47258,0.009 -0.60954,-0.039 -1.111,-0.56284 -1.07768,-1.17994 -0.004,-0.0728 -0.004,-0.1462 -0.002,-0.21867 z m 1.15668,0.28162 c 2.40388,0 4.80776,0 7.21164,0 0,-2.41394 0,-4.82787 0,-7.24181 -2.40388,0 -4.80776,0 -7.21164,0 0,2.41394 0,4.82787 0,7.24181 z m 0.53308,-0.53308 c 0,-0.83147 0,-1.66293 0,-2.4944 0.82476,0 1.64953,0 2.47429,0 0,0.83147 0,1.66293 0,2.4944 -0.82476,0 -1.64953,0 -2.47429,0 z m 2.45417,-6.18571 c 0,0.83482 0,1.66964 0,2.50446 -0.82141,0 -1.64282,0 -2.46423,0 0,-0.83482 0,-1.66964 0,-2.50446 0.82141,0 1.64282,0 2.46423,0 z m 1.1768,1.67969 c 0,-0.28833 0,-0.57666 0,-0.86499 0.82811,0 1.65623,0 2.48434,0 0,0.28833 0,0.57666 0,0.86499 -0.82811,0 -1.65623,0 -2.48434,0 z m 2.48434,2.76598 c 0,0.28162 0,0.56325 0,0.84487 -0.82811,0 -1.65623,0 -2.48434,0 0,-0.28162 0,-0.56325 0,-0.84487 0.82811,0 1.65623,0 2.48434,0 z m -5.64258,-2.49441 c 0.48614,0 0.97228,0 1.45842,0 0,-0.47273 0,-0.94546 0,-1.41819 -0.48614,0 -0.97228,0 -1.45842,0 0,0.47273 0,0.94546 0,1.41819 z m 0,3.68126 c 0.48949,0 0.97899,0 1.46848,0 0,-0.47273 0,-0.94546 0,-1.41819 -0.48949,0 -0.97899,0 -1.46848,0 0,0.47273 0,0.94546 0,1.41819 z"></path>
</g>
</svg>
</p>&nbsp;
{ __('Change target collection', 'tainacan') }
</Button>
:
<ToolbarButton onClick={ () => openCollectionModal() }>
<p>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="-2 -2 12 12"
height="24px"
width="24px">
<g transform="translate(227.4751,-183.8442)">
<path d="m -227.47379,191.95102 c 0.0372,-2.35931 -0.0195,-4.71936 0.0185,-7.07842 0.0356,-0.55424 0.52604,-0.99051 1.07473,-0.99702 0.80102,-0.0806 1.607,0.0149 2.41027,-0.0211 1.66482,0.0101 3.33138,-0.0202 4.99509,0.01 0.58652,0.0617 1.0108,0.60434 0.99243,1.1815 0.0416,0.76157 -0.0361,1.52426 0.008,2.28649 0.0113,1.65577 -0.006,3.31214 -0.009,4.96756 -0.0429,0.59366 -0.57833,1.06966 -1.17191,1.04765 -0.92086,0.0516 -1.84377,-0.0208 -2.7657,-0.006 -1.49072,-0.0194 -2.98293,0.0353 -4.47258,0.009 -0.60954,-0.039 -1.111,-0.56284 -1.07768,-1.17994 -0.004,-0.0728 -0.004,-0.1462 -0.002,-0.21867 z m 1.15668,0.28162 c 2.40388,0 4.80776,0 7.21164,0 0,-2.41394 0,-4.82787 0,-7.24181 -2.40388,0 -4.80776,0 -7.21164,0 0,2.41394 0,4.82787 0,7.24181 z m 0.53308,-0.53308 c 0,-0.83147 0,-1.66293 0,-2.4944 0.82476,0 1.64953,0 2.47429,0 0,0.83147 0,1.66293 0,2.4944 -0.82476,0 -1.64953,0 -2.47429,0 z m 2.45417,-6.18571 c 0,0.83482 0,1.66964 0,2.50446 -0.82141,0 -1.64282,0 -2.46423,0 0,-0.83482 0,-1.66964 0,-2.50446 0.82141,0 1.64282,0 2.46423,0 z m 1.1768,1.67969 c 0,-0.28833 0,-0.57666 0,-0.86499 0.82811,0 1.65623,0 2.48434,0 0,0.28833 0,0.57666 0,0.86499 -0.82811,0 -1.65623,0 -2.48434,0 z m 2.48434,2.76598 c 0,0.28162 0,0.56325 0,0.84487 -0.82811,0 -1.65623,0 -2.48434,0 0,-0.28162 0,-0.56325 0,-0.84487 0.82811,0 1.65623,0 2.48434,0 z m -5.64258,-2.49441 c 0.48614,0 0.97228,0 1.45842,0 0,-0.47273 0,-0.94546 0,-1.41819 -0.48614,0 -0.97228,0 -1.45842,0 0,0.47273 0,0.94546 0,1.41819 z m 0,3.68126 c 0.48949,0 0.97899,0 1.46848,0 0,-0.47273 0,-0.94546 0,-1.41819 -0.48949,0 -0.97899,0 -1.46848,0 0,0.47273 0,0.94546 0,1.41819 z"></path>
</g>
</svg>
</p>&nbsp;
{ __('Change target collection', 'tainacan') }
</ToolbarButton>
}
</ToolbarGroup>
} }
</BlockControls> </BlockControls>
: null } : null }

View File

@ -2,10 +2,11 @@ const { registerBlockType } = wp.blocks;
const { __ } = wp.i18n; const { __ } = wp.i18n;
const { RangeControl, IconButton, Button, ToggleControl, Placeholder, Toolbar, ToolbarGroup, PanelBody, ToolbarButton } = wp.components; const { RangeControl, IconButton, Button, ToggleControl, Placeholder, Toolbar, PanelBody } = wp.components;
const { InspectorControls, BlockControls } = wp.editor; const { InspectorControls, BlockControls } = wp.editor;
import TainacanBlocksCompatToolbar from '../../js/tainacan-blocks-compat-toolbar.js';
import ItemsModal from './items-modal.js'; import ItemsModal from './items-modal.js';
registerBlockType('tainacan/items-list', { registerBlockType('tainacan/items-list', {
@ -226,43 +227,15 @@ registerBlockType('tainacan/items-list', {
<BlockControls> <BlockControls>
<Toolbar controls={ layoutControls } /> <Toolbar controls={ layoutControls } />
{ selectedItemsHTML.length ? { selectedItemsHTML.length ?
tainacan_blocks.wp_version < '5.4' ? TainacanBlocksCompatToolbar({
<Button style={{ whiteSpace: 'nowrap', alignItems: 'center', borderTop: '1px solid #b5bcc2' }} onClick={ openItemsModal } > label: __( 'Add more items', 'tainacan' ),
<p style={{ margin: 0 }}> icon: <svg width="24" height="24" viewBox="0 -2 12 16">
<svg width="24" height="24" viewBox="0 -2 12 16">
<path <path
d="M8.8,1.2H1.2V10H0V1.2C0,0.6,0.6,0,1.2,0h7.5V1.2z M3.8,2.5c-0.7,0-1.2,0.6-1.2,1.3v8.8c0,0.7,0.6,1.2,1.2,1.2h6.9 d="M8.8,1.2H1.2V10H0V1.2C0,0.6,0.6,0,1.2,0h7.5V1.2z M3.8,2.5c-0.7,0-1.2,0.6-1.2,1.3v8.8c0,0.7,0.6,1.2,1.2,1.2h6.9
c0.7,0,1.2-0.6,1.2-1.2V6.3L8.1,2.5H3.8z M7.5,3.4L11,6.9H7.5V3.4z"/> c0.7,0,1.2-0.6,1.2-1.2V6.3L8.1,2.5H3.8z M7.5,3.4L11,6.9H7.5V3.4z"/>
</svg> </svg>,
</p>&nbsp; onClick: openItemsModal
{ __( 'Add more items', 'tainacan' ) } })
</Button>
:
<ToolbarGroup>
{ tainacan_blocks.wp_version < '5.5' ?
<Button style={{ whiteSpace: 'nowrap' }} onClick={ openItemsModal } >
<p>
<svg width="24" height="24" viewBox="0 -2 12 16">
<path
d="M8.8,1.2H1.2V10H0V1.2C0,0.6,0.6,0,1.2,0h7.5V1.2z M3.8,2.5c-0.7,0-1.2,0.6-1.2,1.3v8.8c0,0.7,0.6,1.2,1.2,1.2h6.9
c0.7,0,1.2-0.6,1.2-1.2V6.3L8.1,2.5H3.8z M7.5,3.4L11,6.9H7.5V3.4z"/>
</svg>
</p>&nbsp;
{ __( 'Add more items', 'tainacan' ) }
</Button>
:
<ToolbarButton onClick={ openItemsModal } >
<p>
<svg width="24" height="24" viewBox="0 -2 12 16">
<path
d="M8.8,1.2H1.2V10H0V1.2C0,0.6,0.6,0,1.2,0h7.5V1.2z M3.8,2.5c-0.7,0-1.2,0.6-1.2,1.3v8.8c0,0.7,0.6,1.2,1.2,1.2h6.9
c0.7,0,1.2-0.6,1.2-1.2V6.3L8.1,2.5H3.8z M7.5,3.4L11,6.9H7.5V3.4z"/>
</svg>
</p>&nbsp;
{ __( 'Add more items', 'tainacan' ) }
</ToolbarButton>
}
</ToolbarGroup>
: null } : null }
</BlockControls> </BlockControls>
</div> </div>

View File

@ -2,10 +2,11 @@ const { registerBlockType } = wp.blocks;
const { __ } = wp.i18n; const { __ } = wp.i18n;
const { RangeControl, TextControl, Toolbar, ToolbarGroup, ToolbarButton, SelectControl, Button, ToggleControl, Placeholder, ColorPicker, ColorPalette, BaseControl, PanelBody } = wp.components; const { RangeControl, TextControl, Toolbar, SelectControl, Button, ToggleControl, Placeholder, ColorPicker, ColorPalette, BaseControl, PanelBody } = wp.components;
const { InspectorControls, BlockControls } = wp.editor; const { InspectorControls, BlockControls } = wp.editor;
import TainacanBlocksCompatToolbar from '../../js/tainacan-blocks-compat-toolbar.js';
import SearchBarModal from './search-bar-modal.js'; import SearchBarModal from './search-bar-modal.js';
registerBlockType('tainacan/search-bar', { registerBlockType('tainacan/search-bar', {
@ -319,13 +320,10 @@ registerBlockType('tainacan/search-bar', {
<div> <div>
<BlockControls> <BlockControls>
<Toolbar controls={ alignmentControls } /> <Toolbar controls={ alignmentControls } />
{ collectionId ? ( { collectionId ?
tainacan_blocks.wp_version < '5.4' ? TainacanBlocksCompatToolbar({
<Button style={{ whiteSpace: 'nowrap', alignItems: 'center', borderTop: '1px solid #b5bcc2' }} onClick={ () => openSearchBarModal() } > label:__('Configure search source', 'tainacan'),
<p style={{ margin: 0 }}> icon: <svg width="24" height="24" viewBox="-2 -4 20 20">
<span class="icon">
<i>
<svg width="24" height="24" viewBox="-2 -4 20 20">
<path d="M0,5.8C0,5,0.2,4.2,0.5,3.5s0.7-1.3,1.2-1.8s1.1-0.9,1.8-1.2C4.2,0.1,5,0,5.8,0S7.3,0.1,8,0.5 <path d="M0,5.8C0,5,0.2,4.2,0.5,3.5s0.7-1.3,1.2-1.8s1.1-0.9,1.8-1.2C4.2,0.1,5,0,5.8,0S7.3,0.1,8,0.5
c0.7,0.3,1.3,0.7,1.8,1.2s0.9,1.1,1.2,1.8c0.5,1.2,0.5,2.5,0.2,3.7c0,0.2-0.1,0.4-0.2,0.6c0,0.1-0.2,0.6-0.2,0.6 c0.7,0.3,1.3,0.7,1.8,1.2s0.9,1.1,1.2,1.8c0.5,1.2,0.5,2.5,0.2,3.7c0,0.2-0.1,0.4-0.2,0.6c0,0.1-0.2,0.6-0.2,0.6
c0.6,0.6,1.3,1.3,1.9,1.9c0.7,0.7,1.3,1.3,2,2c0,0,0.3,0.2,0.3,0.3c0,0.3-0.1,0.7-0.3,1c-0.2,0.6-0.8,1-1.4,1.2 c0.6,0.6,1.3,1.3,1.9,1.9c0.7,0.7,1.3,1.3,2,2c0,0,0.3,0.2,0.3,0.3c0,0.3-0.1,0.7-0.3,1c-0.2,0.6-0.8,1-1.4,1.2
@ -333,56 +331,10 @@ registerBlockType('tainacan/search-bar', {
C1.2,9.3,0.8,8.7,0.5,8S0,6.6,0,5.8z M1.6,5.8c0,0.4,0.1,0.9,0.2,1.3C2.1,8.2,3,9.2,4.1,9.6c0.5,0.2,1,0.3,1.6,0.3 C1.2,9.3,0.8,8.7,0.5,8S0,6.6,0,5.8z M1.6,5.8c0,0.4,0.1,0.9,0.2,1.3C2.1,8.2,3,9.2,4.1,9.6c0.5,0.2,1,0.3,1.6,0.3
c0.6,0,1.1-0.1,1.6-0.3C8.7,9,9.7,7.6,9.8,6c0.1-1.5-0.6-3.1-2-3.9c-0.9-0.5-2-0.6-3-0.4C4.6,1.8,4.4,1.9,4.1,2 c0.6,0,1.1-0.1,1.6-0.3C8.7,9,9.7,7.6,9.8,6c0.1-1.5-0.6-3.1-2-3.9c-0.9-0.5-2-0.6-3-0.4C4.6,1.8,4.4,1.9,4.1,2
c-0.5,0.2-1,0.5-1.4,0.9C2,3.7,1.6,4.7,1.6,5.8z"/> c-0.5,0.2-1,0.5-1.4,0.9C2,3.7,1.6,4.7,1.6,5.8z"/>
</svg> </svg>,
</i> onClick: openSearchBarModal
</span> })
</p>&nbsp; : null }
{__('Configure search source', 'tainacan')}
</Button>
:
<ToolbarGroup>
{ tainacan_blocks.wp_version < '5.5' ?
<Button style={{ whiteSpace: 'nowrap' }} onClick={ () => openSearchBarModal() }>
<p>
<span class="icon">
<i>
<svg width="24" height="24" viewBox="-2 -4 20 20">
<path d="M0,5.8C0,5,0.2,4.2,0.5,3.5s0.7-1.3,1.2-1.8s1.1-0.9,1.8-1.2C4.2,0.1,5,0,5.8,0S7.3,0.1,8,0.5
c0.7,0.3,1.3,0.7,1.8,1.2s0.9,1.1,1.2,1.8c0.5,1.2,0.5,2.5,0.2,3.7c0,0.2-0.1,0.4-0.2,0.6c0,0.1-0.2,0.6-0.2,0.6
c0.6,0.6,1.3,1.3,1.9,1.9c0.7,0.7,1.3,1.3,2,2c0,0,0.3,0.2,0.3,0.3c0,0.3-0.1,0.7-0.3,1c-0.2,0.6-0.8,1-1.4,1.2
c-0.1,0-0.6,0.2-0.6,0.1c0,0-4.2-4.2-4.2-4.2c0,0-0.8,0.3-0.8,0.4c-1.3,0.4-2.8,0.5-4.1-0.1c-0.7-0.3-1.3-0.7-1.8-1.2
C1.2,9.3,0.8,8.7,0.5,8S0,6.6,0,5.8z M1.6,5.8c0,0.4,0.1,0.9,0.2,1.3C2.1,8.2,3,9.2,4.1,9.6c0.5,0.2,1,0.3,1.6,0.3
c0.6,0,1.1-0.1,1.6-0.3C8.7,9,9.7,7.6,9.8,6c0.1-1.5-0.6-3.1-2-3.9c-0.9-0.5-2-0.6-3-0.4C4.6,1.8,4.4,1.9,4.1,2
c-0.5,0.2-1,0.5-1.4,0.9C2,3.7,1.6,4.7,1.6,5.8z"/>
</svg>
</i>
</span>
</p>&nbsp;
{__('Configure search source', 'tainacan')}
</Button>
:
<ToolbarButton onClick={ () => openSearchBarModal() }>
<p>
<span class="icon">
<i>
<svg width="24" height="24" viewBox="-2 -4 20 20">
<path d="M0,5.8C0,5,0.2,4.2,0.5,3.5s0.7-1.3,1.2-1.8s1.1-0.9,1.8-1.2C4.2,0.1,5,0,5.8,0S7.3,0.1,8,0.5
c0.7,0.3,1.3,0.7,1.8,1.2s0.9,1.1,1.2,1.8c0.5,1.2,0.5,2.5,0.2,3.7c0,0.2-0.1,0.4-0.2,0.6c0,0.1-0.2,0.6-0.2,0.6
c0.6,0.6,1.3,1.3,1.9,1.9c0.7,0.7,1.3,1.3,2,2c0,0,0.3,0.2,0.3,0.3c0,0.3-0.1,0.7-0.3,1c-0.2,0.6-0.8,1-1.4,1.2
c-0.1,0-0.6,0.2-0.6,0.1c0,0-4.2-4.2-4.2-4.2c0,0-0.8,0.3-0.8,0.4c-1.3,0.4-2.8,0.5-4.1-0.1c-0.7-0.3-1.3-0.7-1.8-1.2
C1.2,9.3,0.8,8.7,0.5,8S0,6.6,0,5.8z M1.6,5.8c0,0.4,0.1,0.9,0.2,1.3C2.1,8.2,3,9.2,4.1,9.6c0.5,0.2,1,0.3,1.6,0.3
c0.6,0,1.1-0.1,1.6-0.3C8.7,9,9.7,7.6,9.8,6c0.1-1.5-0.6-3.1-2-3.9c-0.9-0.5-2-0.6-3-0.4C4.6,1.8,4.4,1.9,4.1,2
c-0.5,0.2-1,0.5-1.4,0.9C2,3.7,1.6,4.7,1.6,5.8z"/>
</svg>
</i>
</span>
</p>&nbsp;
{__('Configure search source', 'tainacan')}
</ToolbarButton>
}
</ToolbarGroup>
): null
}
</BlockControls> </BlockControls>
</div> </div>

View File

@ -2,7 +2,7 @@ const { registerBlockType } = wp.blocks;
const { __ } = wp.i18n; const { __ } = wp.i18n;
const { RangeControl, Spinner, Button, BaseControl, ToggleControl, SelectControl, Placeholder, IconButton, PanelBody, ToolbarGroup, ToolbarButton } = wp.components; const { RangeControl, Spinner, Button, BaseControl, ToggleControl, SelectControl, Placeholder, IconButton, PanelBody } = wp.components;
const { InspectorControls, BlockControls } = wp.editor; const { InspectorControls, BlockControls } = wp.editor;
@ -10,6 +10,7 @@ import TermsModal from '../terms-list/terms-modal.js';
import tainacan from '../../js/axios.js'; import tainacan from '../../js/axios.js';
import axios from 'axios'; import axios from 'axios';
import qs from 'qs'; import qs from 'qs';
import TainacanBlocksCompatToolbar from '../../js/tainacan-blocks-compat-toolbar.js';
registerBlockType('tainacan/carousel-terms-list', { registerBlockType('tainacan/carousel-terms-list', {
title: __('Tainacan Terms Carousel', 'tainacan'), title: __('Tainacan Terms Carousel', 'tainacan'),
@ -308,49 +309,18 @@ registerBlockType('tainacan/carousel-terms-list', {
{ terms.length ? { terms.length ?
<BlockControls> <BlockControls>
{ tainacan_blocks.wp_version < '5.4' ? {
<Button style={{ whiteSpace: 'nowrap', alignItems: 'center', borderTop: '1px solid #b5bcc2' }} onClick={ () => openCarouselModal() } > TainacanBlocksCompatToolbar({
<p style={{ margin: 0 }}> label: __('Add more terms', 'tainacan'),
<svg icon: <svg
xmlns="http://www.w3.org/2000/svg" xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24" viewBox="0 -2 24 24"
height="24px" height="24px"
width="24px"> width="24px">
<path d="M21.43,14.64,19.32,17a2.57,2.57,0,0,1-2,1H12.05a6,6,0,0,0-6-6H6V10.64A2.59,2.59,0,0,1,8.59,8H17.3a2.57,2.57,0,0,1,2,1l2.11,2.38A2.59,2.59,0,0,1,21.43,14.64ZM4,4A2,2,0,0,0,2,6v7.63a5.74,5.74,0,0,1,2-1.2V6H16V4ZM7,15.05v6.06l3.06-3.06ZM5,21.11V15.05L1.94,18.11Z"/> <path d="M21.43,14.64,19.32,17a2.57,2.57,0,0,1-2,1H12.05a6,6,0,0,0-6-6H6V10.64A2.59,2.59,0,0,1,8.59,8H17.3a2.57,2.57,0,0,1,2,1l2.11,2.38A2.59,2.59,0,0,1,21.43,14.64ZM4,4A2,2,0,0,0,2,6v7.63a5.74,5.74,0,0,1,2-1.2V6H16V4ZM7,15.05v6.06l3.06-3.06ZM5,21.11V15.05L1.94,18.11Z"/>
</svg> </svg>,
</p>&nbsp; onClick: openCarouselModal
{ __('Add more terms', 'tainacan') } })
</Button>
:
<ToolbarGroup>
{ tainacan_blocks.wp_version < '5.5' ?
<Button style={{ whiteSpace: 'nowrap' }} onClick={ () => openCarouselModal() } >
<p>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
height="24px"
width="24px">
<path d="M21.43,14.64,19.32,17a2.57,2.57,0,0,1-2,1H12.05a6,6,0,0,0-6-6H6V10.64A2.59,2.59,0,0,1,8.59,8H17.3a2.57,2.57,0,0,1,2,1l2.11,2.38A2.59,2.59,0,0,1,21.43,14.64ZM4,4A2,2,0,0,0,2,6v7.63a5.74,5.74,0,0,1,2-1.2V6H16V4ZM7,15.05v6.06l3.06-3.06ZM5,21.11V15.05L1.94,18.11Z"/>
</svg>
</p>&nbsp;
{ __('Add more terms', 'tainacan') }
</Button>
:
<ToolbarButton onClick={ () => openCarouselModal() } >
<p>
<svg
xmlns="http://www.w3.org/2000/svg"
viewBox="0 0 24 24"
height="24px"
width="24px">
<path d="M21.43,14.64,19.32,17a2.57,2.57,0,0,1-2,1H12.05a6,6,0,0,0-6-6H6V10.64A2.59,2.59,0,0,1,8.59,8H17.3a2.57,2.57,0,0,1,2,1l2.11,2.38A2.59,2.59,0,0,1,21.43,14.64ZM4,4A2,2,0,0,0,2,6v7.63a5.74,5.74,0,0,1,2-1.2V6H16V4ZM7,15.05v6.06l3.06-3.06ZM5,21.11V15.05L1.94,18.11Z"/>
</svg>
</p>&nbsp;
{ __('Add more terms', 'tainacan') }
</ToolbarButton>
}
</ToolbarGroup>
} }
</BlockControls> </BlockControls>
: null } : null }

View File

@ -2,10 +2,11 @@ const { registerBlockType } = wp.blocks;
const { __ } = wp.i18n; const { __ } = wp.i18n;
const { IconButton, Button, ToggleControl, Placeholder, Toolbar, ToolbarGroup, PanelBody, ToolbarButton } = wp.components; const { IconButton, Button, ToggleControl, Placeholder, Toolbar, PanelBody } = wp.components;
const { InspectorControls, BlockControls } = wp.editor; const { InspectorControls, BlockControls } = wp.editor;
import TainacanBlocksCompatToolbar from '../../js/tainacan-blocks-compat-toolbar.js';
import TermsModal from './terms-modal.js'; import TermsModal from './terms-modal.js';
registerBlockType('tainacan/terms-list', { registerBlockType('tainacan/terms-list', {
@ -216,40 +217,14 @@ registerBlockType('tainacan/terms-list', {
<BlockControls> <BlockControls>
<Toolbar controls={ layoutControls } /> <Toolbar controls={ layoutControls } />
{ selectedTermsHTML.length ? { selectedTermsHTML.length ?
tainacan_blocks.wp_version < '5.4' ? TainacanBlocksCompatToolbar({
<Button style={{ whiteSpace: 'nowrap', alignItems: 'center', borderTop: '1px solid #b5bcc2' }} onClick={ openTermsModal } > label: __( 'Select terms', 'tainacan' ),
<p style={{ margin: 0 }}> icon: <svg width="24" height="24" viewBox="0 -3 12 17">
<svg width="24" height="24" viewBox="0 -3 12 17">
<path <path
d="M 4.4,2.5 H 0 V 0 h 4.4 l 1.2,1.3 z m -1.9,5 v 3.1 H 5 v 1.2 H 1.3 v -8 H 2.5 V 6.3 H 5 V 7.6 H 2.5 Z m 8.2,0.7 H 6.3 V 5.7 h 4.4 l 1.2,1.2 z M 11.9,11.3 10.7,10 H 6.3 v 2.5 h 4.4 z"/> d="M 4.4,2.5 H 0 V 0 h 4.4 l 1.2,1.3 z m -1.9,5 v 3.1 H 5 v 1.2 H 1.3 v -8 H 2.5 V 6.3 H 5 V 7.6 H 2.5 Z m 8.2,0.7 H 6.3 V 5.7 h 4.4 l 1.2,1.2 z M 11.9,11.3 10.7,10 H 6.3 v 2.5 h 4.4 z"/>
</svg> </svg>,
</p>&nbsp; onClick: openTermsModal
{ __( 'Select terms', 'tainacan' ) } })
</Button>
:
<ToolbarGroup>
{ tainacan_blocks.wp_version < '5.5' ?
<Button style={{ whiteSpace: 'nowrap' }} onClick={ openTermsModal } >
<p>
<svg width="24" height="24" viewBox="0 -3 12 17">
<path
d="M 4.4,2.5 H 0 V 0 h 4.4 l 1.2,1.3 z m -1.9,5 v 3.1 H 5 v 1.2 H 1.3 v -8 H 2.5 V 6.3 H 5 V 7.6 H 2.5 Z m 8.2,0.7 H 6.3 V 5.7 h 4.4 l 1.2,1.2 z M 11.9,11.3 10.7,10 H 6.3 v 2.5 h 4.4 z"/>
</svg>
</p>&nbsp;
{ __( 'Select terms', 'tainacan' ) }
</Button>
:
<ToolbarButton onClick={ openTermsModal } >
<p>
<svg width="24" height="24" viewBox="0 -3 12 17">
<path
d="M 4.4,2.5 H 0 V 0 h 4.4 l 1.2,1.3 z m -1.9,5 v 3.1 H 5 v 1.2 H 1.3 v -8 H 2.5 V 6.3 H 5 V 7.6 H 2.5 Z m 8.2,0.7 H 6.3 V 5.7 h 4.4 l 1.2,1.2 z M 11.9,11.3 10.7,10 H 6.3 v 2.5 h 4.4 z"/>
</svg>
</p>&nbsp;
{ __( 'Select terms', 'tainacan' ) }
</ToolbarButton>
}
</ToolbarGroup>
: null } : null }
</BlockControls> </BlockControls>
</div> </div>

View File

@ -35,7 +35,7 @@ module.exports = {
block_carousel_terms_list: './src/views/gutenberg-blocks/tainacan-terms/carousel-terms-list/index.js', block_carousel_terms_list: './src/views/gutenberg-blocks/tainacan-terms/carousel-terms-list/index.js',
block_carousel_terms_list_theme: './src/views/gutenberg-blocks/tainacan-terms/carousel-terms-list/carousel-terms-list-theme.js', block_carousel_terms_list_theme: './src/views/gutenberg-blocks/tainacan-terms/carousel-terms-list/carousel-terms-list-theme.js',
tainacan_blocks_category_icon: './src/views/gutenberg-blocks/tainacan-blocks-category-icon.js' tainacan_blocks_category_icon: './src/views/gutenberg-blocks/js/tainacan-blocks-category-icon.js'
}, },
output: { output: {
path: path.resolve(__dirname, './src/assets/js/'), path: path.resolve(__dirname, './src/assets/js/'),