diff --git a/src/ColumnsBlock/ColumnsBlockEdit.jsx b/src/ColumnsBlock/ColumnsBlockEdit.jsx
index f00e826..e410884 100644
--- a/src/ColumnsBlock/ColumnsBlockEdit.jsx
+++ b/src/ColumnsBlock/ColumnsBlockEdit.jsx
@@ -15,6 +15,7 @@ import ColumnVariations from './ColumnVariations';
import EditBlockWrapper from './EditBlockWrapper';
import { COLUMNSBLOCK } from '@eeacms/volto-columns-block/constants';
+import { variants } from '@eeacms/volto-columns-block/grid';
import { makeStyleSchema, getStyle } from '@eeacms/volto-columns-block/Styles';
import tuneSVG from '@plone/volto/icons/tune.svg';
@@ -118,6 +119,20 @@ class ColumnsBlockEdit extends React.Component {
}
};
+ getColumnsBlockSchema = () => {
+ const schema = ColumnsBlockSchema();
+ const { data } = this.props;
+ const { gridCols } = data;
+ console.log('gridcols', gridCols);
+ const available_variants = variants.filter(
+ ({ defaultData }) => defaultData.gridCols.length === gridCols.length,
+ );
+ schema.properties.layout.choices = available_variants.map(
+ ({ defaultData, title }) => [defaultData.gridCols, title],
+ );
+ return schema;
+ };
+
render() {
const { block, data, onChangeBlock, pathname, selected } = this.props;
@@ -223,12 +238,16 @@ class ColumnsBlockEdit extends React.Component {
<>
colId)
+ .indexOf(this.state.activeColumn) + 1
+ }`}
onChangeField={this.onChangeColumnSettings}
formData={
data?.coldata?.columns?.[this.state.activeColumn]
@@ -238,8 +257,8 @@ class ColumnsBlockEdit extends React.Component {
>
) : (
{
onChangeBlock(block, {
...data,
diff --git a/src/ColumnsBlock/schema.js b/src/ColumnsBlock/schema.js
index f8982d1..4b9b2f5 100644
--- a/src/ColumnsBlock/schema.js
+++ b/src/ColumnsBlock/schema.js
@@ -15,13 +15,13 @@ export const ColumnSchema = {
required: [],
};
-export const ColumnsBlockSchema = {
+export const ColumnsBlockSchema = () => ({
title: 'Columns block',
fieldsets: [
{
id: 'default',
title: 'Default',
- fields: ['block_title', 'coldata'], // 'nrColumns'
+ fields: ['coldata', 'layout'], // 'nrColumns', 'block_title'
},
],
properties: {
@@ -34,6 +34,10 @@ export const ColumnsBlockSchema = {
type: 'columns',
schema: ColumnSchema,
},
+ layout: {
+ title: 'Layout',
+ choices: [],
+ },
},
required: ['title'],
-};
+});