1 | "use strict";
|
2 |
|
3 | var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
|
4 |
|
5 | Object.defineProperty(exports, "__esModule", {
|
6 | value: true
|
7 | });
|
8 | exports.settings = exports.name = void 0;
|
9 |
|
10 | var _element = require("@wordpress/element");
|
11 |
|
12 | var _classnames = _interopRequireDefault(require("classnames"));
|
13 |
|
14 | var _i18n = require("@wordpress/i18n");
|
15 |
|
16 | var _blocks = require("@wordpress/blocks");
|
17 |
|
18 | var _components = require("@wordpress/components");
|
19 |
|
20 | var _blockEditor = require("@wordpress/block-editor");
|
21 |
|
22 | var _edit = _interopRequireDefault(require("./edit"));
|
23 |
|
24 |
|
25 |
|
26 |
|
27 |
|
28 |
|
29 |
|
30 |
|
31 |
|
32 |
|
33 |
|
34 |
|
35 | var tableContentPasteSchema = {
|
36 | tr: {
|
37 | allowEmpty: true,
|
38 | children: {
|
39 | th: {
|
40 | allowEmpty: true,
|
41 | children: (0, _blocks.getPhrasingContentSchema)()
|
42 | },
|
43 | td: {
|
44 | allowEmpty: true,
|
45 | children: (0, _blocks.getPhrasingContentSchema)()
|
46 | }
|
47 | }
|
48 | }
|
49 | };
|
50 | var tablePasteSchema = {
|
51 | table: {
|
52 | children: {
|
53 | thead: {
|
54 | allowEmpty: true,
|
55 | children: tableContentPasteSchema
|
56 | },
|
57 | tfoot: {
|
58 | allowEmpty: true,
|
59 | children: tableContentPasteSchema
|
60 | },
|
61 | tbody: {
|
62 | allowEmpty: true,
|
63 | children: tableContentPasteSchema
|
64 | }
|
65 | }
|
66 | }
|
67 | };
|
68 |
|
69 | function getTableSectionAttributeSchema(section) {
|
70 | return {
|
71 | type: 'array',
|
72 | default: [],
|
73 | source: 'query',
|
74 | selector: "t".concat(section, " tr"),
|
75 | query: {
|
76 | cells: {
|
77 | type: 'array',
|
78 | default: [],
|
79 | source: 'query',
|
80 | selector: 'td,th',
|
81 | query: {
|
82 | content: {
|
83 | type: 'string',
|
84 | source: 'html'
|
85 | },
|
86 | tag: {
|
87 | type: 'string',
|
88 | default: 'td',
|
89 | source: 'tag'
|
90 | }
|
91 | }
|
92 | }
|
93 | }
|
94 | };
|
95 | }
|
96 |
|
97 | var name = 'core/table';
|
98 | exports.name = name;
|
99 | var settings = {
|
100 | title: (0, _i18n.__)('Table'),
|
101 | description: (0, _i18n.__)('Insert a table — perfect for sharing charts and data.'),
|
102 | icon: (0, _element.createElement)(_components.SVG, {
|
103 | viewBox: "0 0 24 24",
|
104 | xmlns: "http://www.w3.org/2000/svg"
|
105 | }, (0, _element.createElement)(_components.Path, {
|
106 | fill: "none",
|
107 | d: "M0 0h24v24H0V0z"
|
108 | }), (0, _element.createElement)(_components.G, null, (0, _element.createElement)(_components.Path, {
|
109 | d: "M20 3H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h15c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2zm0 2v3H5V5h15zm-5 14h-5v-9h5v9zM5 10h3v9H5v-9zm12 9v-9h3v9h-3z"
|
110 | }))),
|
111 | category: 'formatting',
|
112 | attributes: {
|
113 | hasFixedLayout: {
|
114 | type: 'boolean',
|
115 | default: false
|
116 | },
|
117 | backgroundColor: {
|
118 | type: 'string'
|
119 | },
|
120 | head: getTableSectionAttributeSchema('head'),
|
121 | body: getTableSectionAttributeSchema('body'),
|
122 | foot: getTableSectionAttributeSchema('foot')
|
123 | },
|
124 | styles: [{
|
125 | name: 'regular',
|
126 | label: (0, _i18n._x)('Default', 'block style'),
|
127 | isDefault: true
|
128 | }, {
|
129 | name: 'stripes',
|
130 | label: (0, _i18n.__)('Stripes')
|
131 | }],
|
132 | supports: {
|
133 | align: true
|
134 | },
|
135 | transforms: {
|
136 | from: [{
|
137 | type: 'raw',
|
138 | selector: 'table',
|
139 | schema: tablePasteSchema
|
140 | }]
|
141 | },
|
142 | edit: _edit.default,
|
143 | save: function save(_ref) {
|
144 | var attributes = _ref.attributes;
|
145 | var hasFixedLayout = attributes.hasFixedLayout,
|
146 | head = attributes.head,
|
147 | body = attributes.body,
|
148 | foot = attributes.foot,
|
149 | backgroundColor = attributes.backgroundColor;
|
150 | var isEmpty = !head.length && !body.length && !foot.length;
|
151 |
|
152 | if (isEmpty) {
|
153 | return null;
|
154 | }
|
155 |
|
156 | var backgroundClass = (0, _blockEditor.getColorClassName)('background-color', backgroundColor);
|
157 | var classes = (0, _classnames.default)(backgroundClass, {
|
158 | 'has-fixed-layout': hasFixedLayout,
|
159 | 'has-background': !!backgroundClass
|
160 | });
|
161 |
|
162 | var Section = function Section(_ref2) {
|
163 | var type = _ref2.type,
|
164 | rows = _ref2.rows;
|
165 |
|
166 | if (!rows.length) {
|
167 | return null;
|
168 | }
|
169 |
|
170 | var Tag = "t".concat(type);
|
171 | return (0, _element.createElement)(Tag, null, rows.map(function (_ref3, rowIndex) {
|
172 | var cells = _ref3.cells;
|
173 | return (0, _element.createElement)("tr", {
|
174 | key: rowIndex
|
175 | }, cells.map(function (_ref4, cellIndex) {
|
176 | var content = _ref4.content,
|
177 | tag = _ref4.tag;
|
178 | return (0, _element.createElement)(_blockEditor.RichText.Content, {
|
179 | tagName: tag,
|
180 | value: content,
|
181 | key: cellIndex
|
182 | });
|
183 | }));
|
184 | }));
|
185 | };
|
186 |
|
187 | return (0, _element.createElement)("table", {
|
188 | className: classes
|
189 | }, (0, _element.createElement)(Section, {
|
190 | type: "head",
|
191 | rows: head
|
192 | }), (0, _element.createElement)(Section, {
|
193 | type: "body",
|
194 | rows: body
|
195 | }), (0, _element.createElement)(Section, {
|
196 | type: "foot",
|
197 | rows: foot
|
198 | }));
|
199 | }
|
200 | };
|
201 | exports.settings = settings;
|
202 |
|
\ | No newline at end of file |