UNPKG

4.55 kBJavaScriptView Raw
1import _toConsumableArray from "@babel/runtime/helpers/esm/toConsumableArray";
2import { createElement } from "@wordpress/element";
3
4/**
5 * External dependencies
6 */
7import { get, times } from 'lodash';
8/**
9 * WordPress dependencies
10 */
11
12import { createBlock } from '@wordpress/blocks';
13import { __ } from '@wordpress/i18n';
14import { PanelBody, RangeControl } from '@wordpress/components';
15import { Fragment } from '@wordpress/element';
16import { BlockControls, BlockAlignmentToolbar, InspectorControls, RichText } from '@wordpress/block-editor';
17import deprecated from '@wordpress/deprecated';
18export var name = 'core/text-columns';
19export var settings = {
20 // Disable insertion as this block is deprecated and ultimately replaced by the Columns block.
21 supports: {
22 inserter: false
23 },
24 title: __('Text Columns (deprecated)'),
25 description: __('This block is deprecated. Please use the Columns block instead.'),
26 icon: 'columns',
27 category: 'layout',
28 attributes: {
29 content: {
30 type: 'array',
31 source: 'query',
32 selector: 'p',
33 query: {
34 children: {
35 type: 'string',
36 source: 'html'
37 }
38 },
39 default: [{}, {}]
40 },
41 columns: {
42 type: 'number',
43 default: 2
44 },
45 width: {
46 type: 'string'
47 }
48 },
49 transforms: {
50 to: [{
51 type: 'block',
52 blocks: ['core/columns'],
53 transform: function transform(_ref) {
54 var className = _ref.className,
55 columns = _ref.columns,
56 content = _ref.content,
57 width = _ref.width;
58 return createBlock('core/columns', {
59 align: 'wide' === width || 'full' === width ? width : undefined,
60 className: className,
61 columns: columns
62 }, content.map(function (_ref2) {
63 var children = _ref2.children;
64 return createBlock('core/column', {}, [createBlock('core/paragraph', {
65 content: children
66 })]);
67 }));
68 }
69 }]
70 },
71 getEditWrapperProps: function getEditWrapperProps(attributes) {
72 var width = attributes.width;
73
74 if ('wide' === width || 'full' === width) {
75 return {
76 'data-align': width
77 };
78 }
79 },
80 edit: function edit(_ref3) {
81 var attributes = _ref3.attributes,
82 setAttributes = _ref3.setAttributes,
83 className = _ref3.className;
84 var width = attributes.width,
85 content = attributes.content,
86 columns = attributes.columns;
87 deprecated('The Text Columns block', {
88 alternative: 'the Columns block',
89 plugin: 'Gutenberg'
90 });
91 return createElement(Fragment, null, createElement(BlockControls, null, createElement(BlockAlignmentToolbar, {
92 value: width,
93 onChange: function onChange(nextWidth) {
94 return setAttributes({
95 width: nextWidth
96 });
97 },
98 controls: ['center', 'wide', 'full']
99 })), createElement(InspectorControls, null, createElement(PanelBody, null, createElement(RangeControl, {
100 label: __('Columns'),
101 value: columns,
102 onChange: function onChange(value) {
103 return setAttributes({
104 columns: value
105 });
106 },
107 min: 2,
108 max: 4,
109 required: true
110 }))), createElement("div", {
111 className: "".concat(className, " align").concat(width, " columns-").concat(columns)
112 }, times(columns, function (index) {
113 return createElement("div", {
114 className: "wp-block-column",
115 key: "column-".concat(index)
116 }, createElement(RichText, {
117 tagName: "p",
118 value: get(content, [index, 'children']),
119 onChange: function onChange(nextContent) {
120 setAttributes({
121 content: [].concat(_toConsumableArray(content.slice(0, index)), [{
122 children: nextContent
123 }], _toConsumableArray(content.slice(index + 1)))
124 });
125 },
126 placeholder: __('New Column')
127 }));
128 })));
129 },
130 save: function save(_ref4) {
131 var attributes = _ref4.attributes;
132 var width = attributes.width,
133 content = attributes.content,
134 columns = attributes.columns;
135 return createElement("div", {
136 className: "align".concat(width, " columns-").concat(columns)
137 }, times(columns, function (index) {
138 return createElement("div", {
139 className: "wp-block-column",
140 key: "column-".concat(index)
141 }, createElement(RichText.Content, {
142 tagName: "p",
143 value: get(content, [index, 'children'])
144 }));
145 }));
146 }
147};
148//# sourceMappingURL=index.js.map
\No newline at end of file