@ckeditor/ckeditor5-table 0.0.0-nightly-20251125.0 → 0.0.0-nightly-20251126.0

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.
Files changed (37) hide show
  1. package/build/table.js +1 -1
  2. package/dist/index-content.css +30 -1
  3. package/dist/index-editor.css +181 -88
  4. package/dist/index.css +300 -158
  5. package/dist/index.css.map +1 -1
  6. package/dist/index.js +12442 -9941
  7. package/dist/index.js.map +1 -1
  8. package/lang/contexts.json +6 -0
  9. package/package.json +9 -9
  10. package/src/augmentation.d.ts +7 -0
  11. package/src/converters/downcast.d.ts +26 -1
  12. package/src/converters/downcast.js +129 -3
  13. package/src/converters/tableproperties.d.ts +43 -1
  14. package/src/converters/tableproperties.js +186 -0
  15. package/src/converters/upcasttable.js +2 -11
  16. package/src/index.d.ts +5 -1
  17. package/src/index.js +5 -0
  18. package/src/plaintableoutput.js +0 -91
  19. package/src/tablecellproperties/tablecellpropertiesuiexperimental.d.ts +128 -0
  20. package/src/tablecellproperties/tablecellpropertiesuiexperimental.js +386 -0
  21. package/src/tablecellproperties/ui/tablecellpropertiesviewexperimental.d.ts +237 -0
  22. package/src/tablecellproperties/ui/tablecellpropertiesviewexperimental.js +633 -0
  23. package/src/tableconfig.d.ts +187 -10
  24. package/src/tableediting.d.ts +5 -0
  25. package/src/tableediting.js +28 -1
  26. package/src/tableproperties/tablepropertiesediting.js +250 -5
  27. package/src/tableproperties/tablepropertiesuiexperimental.d.ts +136 -0
  28. package/src/tableproperties/tablepropertiesuiexperimental.js +375 -0
  29. package/src/tableproperties/ui/tablepropertiesviewexperimental.d.ts +216 -0
  30. package/src/tableproperties/ui/tablepropertiesviewexperimental.js +544 -0
  31. package/src/utils/structure.d.ts +5 -1
  32. package/src/utils/structure.js +10 -0
  33. package/src/utils/ui/table-propertiesexperimental.d.ts +215 -0
  34. package/src/utils/ui/table-propertiesexperimental.js +391 -0
  35. package/theme/formrow-experimental.css +15 -0
  36. package/theme/tableform-experimental.css +61 -0
  37. package/theme/tableproperties-experimental.css +78 -0
@@ -32,6 +32,7 @@
32
32
  "Padding": "The label for the input that allows configuring the padding of a table cell.",
33
33
  "Dimensions": "The label describing a group of form fields that allows setting dimensions of a table or a table cell.",
34
34
  "Table cell text alignment": "The label for the group of toolbars that allows configuring the text alignment in a table cell.",
35
+ "Table Alignment": "The label for the toolbar that allows configuring the alignment of a table.",
35
36
  "Alignment": "The label for the toolbar that allows configuring the alignment of a table.",
36
37
  "Horizontal text alignment toolbar": "The label used by assistive technologies describing a toolbar that allows configuring the horizontal text alignment in a table cell.",
37
38
  "Vertical text alignment toolbar": "The label used by assistive technologies describing a toolbar that allows configuring the vertical text alignment in a table cell.",
@@ -52,6 +53,11 @@
52
53
  "Align cell text to the top": "The label used by assistive technologies describing a button that aligns the table cell text to the top.",
53
54
  "Align cell text to the middle": "The label used by assistive technologies describing a button that aligns the table cell text to the middle.",
54
55
  "Align cell text to the bottom": "The label used by assistive technologies describing a button that aligns the table cell text to the bottom.",
56
+ "Align table to the left with text wrapping": "The label used by assistive technologies describing a button that aligns the table to the left as an inline element, allowing text to wrap around it.",
57
+ "Center table with no text wrapping": "The label used by assistive technologies describing a button that centers the table as a block element with no text wrapping.",
58
+ "Align table to the right with text wrapping": "The label used by assistive technologies describing a button that aligns the table to the right as an inline element, allowing text to wrap around it.",
59
+ "Align table to the left with no text wrapping": "The label used by assistive technologies describing a button that aligns the table to the left as a block element with no text wrapping.",
60
+ "Align table to the right with no text wrapping": "The label used by assistive technologies describing a button that aligns the table to the right as a block element with no text wrapping.",
55
61
  "Align table to the left": "The label used by assistive technologies describing a button that aligns the table to the left.",
56
62
  "Center table": "The label used by assistive technologies describing a button that centers the table.",
57
63
  "Align table to the right": "The label used by assistive technologies describing a button that aligns the table to the right.",
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@ckeditor/ckeditor5-table",
3
- "version": "0.0.0-nightly-20251125.0",
3
+ "version": "0.0.0-nightly-20251126.0",
4
4
  "description": "Table feature for CKEditor 5.",
5
5
  "keywords": [
6
6
  "ckeditor",
@@ -13,14 +13,14 @@
13
13
  "type": "module",
14
14
  "main": "src/index.js",
15
15
  "dependencies": {
16
- "ckeditor5": "0.0.0-nightly-20251125.0",
17
- "@ckeditor/ckeditor5-clipboard": "0.0.0-nightly-20251125.0",
18
- "@ckeditor/ckeditor5-core": "0.0.0-nightly-20251125.0",
19
- "@ckeditor/ckeditor5-engine": "0.0.0-nightly-20251125.0",
20
- "@ckeditor/ckeditor5-icons": "0.0.0-nightly-20251125.0",
21
- "@ckeditor/ckeditor5-ui": "0.0.0-nightly-20251125.0",
22
- "@ckeditor/ckeditor5-utils": "0.0.0-nightly-20251125.0",
23
- "@ckeditor/ckeditor5-widget": "0.0.0-nightly-20251125.0",
16
+ "ckeditor5": "0.0.0-nightly-20251126.0",
17
+ "@ckeditor/ckeditor5-clipboard": "0.0.0-nightly-20251126.0",
18
+ "@ckeditor/ckeditor5-core": "0.0.0-nightly-20251126.0",
19
+ "@ckeditor/ckeditor5-engine": "0.0.0-nightly-20251126.0",
20
+ "@ckeditor/ckeditor5-icons": "0.0.0-nightly-20251126.0",
21
+ "@ckeditor/ckeditor5-ui": "0.0.0-nightly-20251126.0",
22
+ "@ckeditor/ckeditor5-utils": "0.0.0-nightly-20251126.0",
23
+ "@ckeditor/ckeditor5-widget": "0.0.0-nightly-20251126.0",
24
24
  "es-toolkit": "1.39.5"
25
25
  },
26
26
  "author": "CKSource (http://cksource.com/)",
@@ -15,6 +15,13 @@ declare module '@ckeditor/ckeditor5-engine' {
15
15
  * This will be enabled by default in the future CKEditor 5 releases.
16
16
  */
17
17
  upcastTableBorderZeroAttributes?: boolean;
18
+ /**
19
+ * When enabled, the the {@link module:table/tableproperties/tablepropertiesediting~TablePropertiesEditing table properties feature}
20
+ * will support extended alignment options for tables, i.e. `blockLeft` and `blockRight`, using CSS `margin` property.
21
+ *
22
+ * This will be enabled by default in the future CKEditor 5 releases.
23
+ */
24
+ useExtendedTableBlockAlignment?: boolean;
18
25
  }
19
26
  }
20
27
  declare module '@ckeditor/ckeditor5-core' {
@@ -2,7 +2,11 @@
2
2
  * @license Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
3
3
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
4
4
  */
5
- import type { ModelElement, DowncastElementCreatorFunction } from 'ckeditor5/src/engine.js';
5
+ /**
6
+ * @module table/converters/downcast
7
+ */
8
+ import { type Editor } from 'ckeditor5/src/core.js';
9
+ import type { ViewElement, ModelElement, DowncastElementCreatorFunction, DowncastConversionApi } from 'ckeditor5/src/engine.js';
6
10
  import { type TableUtils } from '../tableutils.js';
7
11
  import type { TableConversionAdditionalSlot } from '../tableediting.js';
8
12
  /**
@@ -58,6 +62,27 @@ export declare function convertParagraphInTableCell(options?: {
58
62
  * @internal
59
63
  */
60
64
  export declare function isSingleParagraphWithoutAttributes(modelElement: ModelElement): boolean;
65
+ /**
66
+ * Downcasts a plain table (also used in the clipboard pipeline).
67
+ */
68
+ export declare function convertPlainTable(editor: Editor): DowncastElementCreatorFunction;
69
+ /**
70
+ * Downcasts a plain table caption (also used in the clipboard pipeline).
71
+ */
72
+ export declare function convertPlainTableCaption(editor: Editor): DowncastElementCreatorFunction;
73
+ /**
74
+ * Downcasts a plain table.
75
+ *
76
+ * @param table Table model element.
77
+ * @param conversionApi The conversion API object.
78
+ * @param defaultTableProperties Normalized default table properties.
79
+ * @returns Created element.
80
+ */
81
+ export declare function downcastPlainTable(table: ModelElement, conversionApi: DowncastConversionApi, editor: Editor): ViewElement;
82
+ /**
83
+ * Registers border and background attributes converters for plain tables or when the clipboard pipeline is used.
84
+ */
85
+ export declare function downcastTableBorderAndBackgroundAttributes(editor: Editor): void;
61
86
  /**
62
87
  * Options for the downcast table conversion.
63
88
  *
@@ -2,11 +2,10 @@
2
2
  * @license Copyright (c) 2003-2025, CKSource Holding sp. z o.o. All rights reserved.
3
3
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
4
4
  */
5
- /**
6
- * @module table/converters/downcast
7
- */
8
5
  import { toWidget, toWidgetEditable } from 'ckeditor5/src/widget.js';
9
6
  import { TableWalker } from './../tablewalker.js';
7
+ import { downcastTableAlignmentConfig } from './tableproperties.js';
8
+ import { getNormalizedDefaultTableProperties } from '../utils/table-properties.js';
10
9
  /**
11
10
  * Model table element to view table element conversion helper.
12
11
  *
@@ -158,3 +157,130 @@ function hasAnyAttribute(element) {
158
157
  }
159
158
  return false;
160
159
  }
160
+ /**
161
+ * Downcasts a plain table (also used in the clipboard pipeline).
162
+ */
163
+ export function convertPlainTable(editor) {
164
+ return (table, conversionApi) => {
165
+ const hasPlainTableOutput = editor.plugins.has('PlainTableOutput');
166
+ const isClipboardPipeline = conversionApi.options.isClipboardPipeline;
167
+ const useExtendedAlignment = editor.config.get('experimentalFlags.useExtendedTableBlockAlignment');
168
+ if (!hasPlainTableOutput && !(useExtendedAlignment && isClipboardPipeline)) {
169
+ return null;
170
+ }
171
+ return downcastPlainTable(table, conversionApi, editor);
172
+ };
173
+ }
174
+ /**
175
+ * Downcasts a plain table caption (also used in the clipboard pipeline).
176
+ */
177
+ export function convertPlainTableCaption(editor) {
178
+ return (modelElement, { writer, options }) => {
179
+ const hasPlainTableOutput = editor.plugins.has('PlainTableOutput');
180
+ const isClipboardPipeline = options.isClipboardPipeline;
181
+ const useExtendedAlignment = editor.config.get('experimentalFlags.useExtendedTableBlockAlignment');
182
+ if (!hasPlainTableOutput && !(useExtendedAlignment && isClipboardPipeline)) {
183
+ return null;
184
+ }
185
+ if (modelElement.parent.name === 'table') {
186
+ return writer.createContainerElement('caption');
187
+ }
188
+ return null;
189
+ };
190
+ }
191
+ /**
192
+ * Downcasts a plain table.
193
+ *
194
+ * @param table Table model element.
195
+ * @param conversionApi The conversion API object.
196
+ * @param defaultTableProperties Normalized default table properties.
197
+ * @returns Created element.
198
+ */
199
+ export function downcastPlainTable(table, conversionApi, editor) {
200
+ const writer = conversionApi.writer;
201
+ const headingRows = table.getAttribute('headingRows') || 0;
202
+ // Table head rows slot.
203
+ const headRowsSlot = writer.createSlot((element) => element.is('element', 'tableRow') && element.index < headingRows);
204
+ // Table body rows slot.
205
+ const bodyRowsSlot = writer.createSlot((element) => element.is('element', 'tableRow') && element.index >= headingRows);
206
+ // Table children slot.
207
+ const childrenSlot = writer.createSlot((element) => !element.is('element', 'tableRow'));
208
+ // Table <thead> element with all the heading rows.
209
+ const theadElement = writer.createContainerElement('thead', null, headRowsSlot);
210
+ // Table <tbody> element with all the body rows.
211
+ const tbodyElement = writer.createContainerElement('tbody', null, bodyRowsSlot);
212
+ // Table contents element containing <thead> and <tbody> when necessary.
213
+ const tableContentElements = [];
214
+ if (headingRows) {
215
+ tableContentElements.push(theadElement);
216
+ }
217
+ if (headingRows < table.childCount) {
218
+ tableContentElements.push(tbodyElement);
219
+ }
220
+ const tableAttributes = { class: 'table' };
221
+ if (editor.plugins.has('TableProperties') && conversionApi.options.isClipboardPipeline) {
222
+ const defaultTableProperties = getNormalizedDefaultTableProperties(editor.config.get('table.tableProperties.defaultProperties'), {
223
+ includeAlignmentProperty: true
224
+ });
225
+ const tableAlignment = table.getAttribute('tableAlignment');
226
+ let localDefaultValue = defaultTableProperties.alignment;
227
+ if (table.getAttribute('tableType') === 'layout') {
228
+ localDefaultValue = '';
229
+ }
230
+ const tableAlignmentValue = tableAlignment || localDefaultValue;
231
+ if (tableAlignmentValue) {
232
+ tableAttributes.class += ' ' + downcastTableAlignmentConfig[tableAlignmentValue].className;
233
+ tableAttributes.style = downcastTableAlignmentConfig[tableAlignmentValue].style;
234
+ if (downcastTableAlignmentConfig[tableAlignmentValue].align !== undefined) {
235
+ tableAttributes.align = downcastTableAlignmentConfig[tableAlignmentValue].align;
236
+ }
237
+ }
238
+ }
239
+ // Create table structure.
240
+ //
241
+ // <table>
242
+ // {children-slot-like-caption}
243
+ // <thead>
244
+ // {table-head-rows-slot}
245
+ // </thead>
246
+ // <tbody>
247
+ // {table-body-rows-slot}
248
+ // </tbody>
249
+ // </table>
250
+ return writer.createContainerElement('table', tableAttributes, [childrenSlot, ...tableContentElements]);
251
+ }
252
+ /**
253
+ * Registers border and background attributes converters for plain tables or when the clipboard pipeline is used.
254
+ */
255
+ export function downcastTableBorderAndBackgroundAttributes(editor) {
256
+ const modelAttributes = {
257
+ 'border-width': 'tableBorderWidth',
258
+ 'border-color': 'tableBorderColor',
259
+ 'border-style': 'tableBorderStyle',
260
+ 'background-color': 'tableBackgroundColor'
261
+ };
262
+ for (const [styleName, modelAttribute] of Object.entries(modelAttributes)) {
263
+ editor.conversion.for('dataDowncast').add(dispatcher => {
264
+ return dispatcher.on(`attribute:${modelAttribute}:table`, (evt, data, conversionApi) => {
265
+ const { item, attributeNewValue } = data;
266
+ const { mapper, writer } = conversionApi;
267
+ const hasPlainTableOutput = editor.plugins.has('PlainTableOutput');
268
+ const isClipboardPipeline = conversionApi.options.isClipboardPipeline;
269
+ const useExtendedAlignment = editor.config.get('experimentalFlags.useExtendedTableBlockAlignment');
270
+ if (!hasPlainTableOutput && !(useExtendedAlignment && isClipboardPipeline)) {
271
+ return;
272
+ }
273
+ if (!conversionApi.consumable.consume(item, evt.name)) {
274
+ return;
275
+ }
276
+ const table = mapper.toViewElement(item);
277
+ if (attributeNewValue) {
278
+ writer.setStyle(styleName, attributeNewValue, table);
279
+ }
280
+ else {
281
+ writer.removeStyle(styleName, table);
282
+ }
283
+ }, { priority: 'high' });
284
+ });
285
+ }
286
+ }
@@ -6,7 +6,7 @@
6
6
  * @module table/converters/tableproperties
7
7
  */
8
8
  import type { Editor } from 'ckeditor5/src/core.js';
9
- import type { Conversion, UpcastConversionData, ViewElement } from 'ckeditor5/src/engine.js';
9
+ import type { Conversion, UpcastConversionData, ViewElement, Consumables } from 'ckeditor5/src/engine.js';
10
10
  /**
11
11
  * Conversion helper for upcasting attributes using normalized styles.
12
12
  *
@@ -75,3 +75,45 @@ export declare function downcastTableAttribute(conversion: Conversion, options:
75
75
  * @internal
76
76
  */
77
77
  export declare function getDefaultValueAdjusted(defaultValue: string, layoutTableDefault: string, data: UpcastConversionData<ViewElement>): string;
78
+ /**
79
+ * Default table alignment options.
80
+ */
81
+ export declare const DEFAULT_TABLE_ALIGNMENT_OPTIONS: {
82
+ left: {
83
+ className: string;
84
+ };
85
+ center: {
86
+ className: string;
87
+ };
88
+ right: {
89
+ className: string;
90
+ };
91
+ blockLeft: {
92
+ className: string;
93
+ };
94
+ blockRight: {
95
+ className: string;
96
+ };
97
+ };
98
+ /**
99
+ * Configuration for upcasting table alignment from view to model.
100
+ */
101
+ export declare const upcastTableAlignmentConfig: Array<UpcastTableAlignmentConfig>;
102
+ export declare const downcastTableAlignmentConfig: Record<TableAlignmentValues, {
103
+ align: string | undefined;
104
+ style: string;
105
+ className: string;
106
+ }>;
107
+ type UpcastTableAlignmentConfig = {
108
+ view: {
109
+ name: RegExp | string;
110
+ styles?: Record<string, RegExp | string>;
111
+ attributes?: Record<string, RegExp | string>;
112
+ key?: string;
113
+ value?: RegExp | string;
114
+ };
115
+ getAlign: ((viewElement: ViewElement) => string | undefined) | (() => string);
116
+ getConsumables: (viewElement: ViewElement) => Consumables;
117
+ };
118
+ export type TableAlignmentValues = 'left' | 'center' | 'right' | 'blockLeft' | 'blockRight';
119
+ export {};
@@ -3,6 +3,8 @@
3
3
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
4
4
  */
5
5
  import { first } from 'ckeditor5/src/utils.js';
6
+ const ALIGN_VALUES_REG_EXP = /^(left|center|right)$/;
7
+ const FLOAT_VALUES_REG_EXP = /^(left|none|right)$/;
6
8
  /**
7
9
  * Conversion helper for upcasting attributes using normalized styles.
8
10
  *
@@ -256,3 +258,187 @@ function reduceBoxSidesValue(style) {
256
258
  }
257
259
  return topSideStyle;
258
260
  }
261
+ /**
262
+ * Default table alignment options.
263
+ */
264
+ export const DEFAULT_TABLE_ALIGNMENT_OPTIONS = {
265
+ left: { className: 'table-style-align-left' },
266
+ center: { className: 'table-style-align-center' },
267
+ right: { className: 'table-style-align-right' },
268
+ blockLeft: { className: 'table-style-block-align-left' },
269
+ blockRight: { className: 'table-style-block-align-right' }
270
+ };
271
+ /**
272
+ * Configuration for upcasting table alignment from view to model.
273
+ */
274
+ export const upcastTableAlignmentConfig = [
275
+ // Support for the `float:*;` CSS definition for the table alignment.
276
+ {
277
+ view: {
278
+ name: /^(table|figure)$/,
279
+ styles: {
280
+ float: FLOAT_VALUES_REG_EXP
281
+ }
282
+ },
283
+ getAlign: (viewElement) => {
284
+ let align = viewElement.getStyle('float');
285
+ if (align === 'none') {
286
+ align = 'center';
287
+ }
288
+ return align;
289
+ },
290
+ getConsumables(viewElement) {
291
+ const float = viewElement.getStyle('float');
292
+ const styles = ['float'];
293
+ if (float === 'left' && viewElement.hasStyle('margin-right')) {
294
+ styles.push('margin-right');
295
+ }
296
+ else if (float === 'right' && viewElement.hasStyle('margin-left')) {
297
+ styles.push('margin-left');
298
+ }
299
+ return { styles };
300
+ }
301
+ },
302
+ // Support for the `margin-left:auto; margin-right:auto;` CSS definition for the table alignment.
303
+ {
304
+ view: {
305
+ name: /^(table|figure)$/,
306
+ styles: {
307
+ 'margin-left': 'auto',
308
+ 'margin-right': 'auto'
309
+ }
310
+ },
311
+ getAlign: () => 'center',
312
+ getConsumables: () => {
313
+ return { styles: ['margin-left', 'margin-right'] };
314
+ }
315
+ },
316
+ // Support for the left alignment using CSS classes.
317
+ {
318
+ view: {
319
+ name: /^(table|figure)$/,
320
+ key: 'class',
321
+ value: 'table-style-align-left'
322
+ },
323
+ getAlign: () => 'left',
324
+ getConsumables() {
325
+ return { classes: DEFAULT_TABLE_ALIGNMENT_OPTIONS.left.className };
326
+ }
327
+ },
328
+ // Support for the right alignment using CSS classes.
329
+ {
330
+ view: {
331
+ name: /^(table|figure)$/,
332
+ key: 'class',
333
+ value: DEFAULT_TABLE_ALIGNMENT_OPTIONS.right.className
334
+ },
335
+ getAlign: () => 'right',
336
+ getConsumables() {
337
+ return { classes: DEFAULT_TABLE_ALIGNMENT_OPTIONS.right.className };
338
+ }
339
+ },
340
+ // Support for the center alignment using CSS classes.
341
+ {
342
+ view: {
343
+ name: /^(table|figure)$/,
344
+ key: 'class',
345
+ value: DEFAULT_TABLE_ALIGNMENT_OPTIONS.center.className
346
+ },
347
+ getAlign: () => 'center',
348
+ getConsumables() {
349
+ return { classes: DEFAULT_TABLE_ALIGNMENT_OPTIONS.center.className };
350
+ }
351
+ },
352
+ // Support for the block alignment left using CSS classes.
353
+ {
354
+ view: {
355
+ name: /^(table|figure)$/,
356
+ key: 'class',
357
+ value: DEFAULT_TABLE_ALIGNMENT_OPTIONS.blockLeft.className
358
+ },
359
+ getAlign: () => 'blockLeft',
360
+ getConsumables() {
361
+ return { classes: DEFAULT_TABLE_ALIGNMENT_OPTIONS.blockLeft.className };
362
+ }
363
+ },
364
+ // Support for the block alignment right using CSS classes.
365
+ {
366
+ view: {
367
+ name: /^(table|figure)$/,
368
+ key: 'class',
369
+ value: DEFAULT_TABLE_ALIGNMENT_OPTIONS.blockRight.className
370
+ },
371
+ getAlign: () => 'blockRight',
372
+ getConsumables() {
373
+ return { classes: DEFAULT_TABLE_ALIGNMENT_OPTIONS.blockRight.className };
374
+ }
375
+ },
376
+ // Support for the block alignment left using margin CSS styles.
377
+ {
378
+ view: {
379
+ name: /^(table|figure)$/,
380
+ styles: {
381
+ 'margin-left': '0',
382
+ 'margin-right': 'auto'
383
+ }
384
+ },
385
+ getAlign: () => 'blockLeft',
386
+ getConsumables() {
387
+ return { styles: ['margin-left', 'margin-right'] };
388
+ }
389
+ },
390
+ // Support for the block alignment right using margin CSS styles.
391
+ {
392
+ view: {
393
+ name: /^(table|figure)$/,
394
+ styles: {
395
+ 'margin-left': 'auto',
396
+ 'margin-right': '0'
397
+ }
398
+ },
399
+ getAlign: () => 'blockRight',
400
+ getConsumables() {
401
+ return { styles: ['margin-left', 'margin-right'] };
402
+ }
403
+ },
404
+ // Support for the `align` attribute as the backward compatibility while pasting from other sources.
405
+ {
406
+ view: {
407
+ name: 'table',
408
+ attributes: {
409
+ align: ALIGN_VALUES_REG_EXP
410
+ }
411
+ },
412
+ getAlign: (viewElement) => viewElement.getAttribute('align'),
413
+ getConsumables() {
414
+ return { attributes: 'align' };
415
+ }
416
+ }
417
+ ];
418
+ export const downcastTableAlignmentConfig = {
419
+ center: {
420
+ align: 'center',
421
+ style: 'margin-left: auto; margin-right: auto;',
422
+ className: 'table-style-align-center'
423
+ },
424
+ left: {
425
+ align: 'left',
426
+ style: 'float: left;',
427
+ className: 'table-style-align-left'
428
+ },
429
+ right: {
430
+ align: 'right',
431
+ style: 'float: right;',
432
+ className: 'table-style-align-right'
433
+ },
434
+ blockLeft: {
435
+ align: undefined,
436
+ style: 'margin-left: 0; margin-right: auto;',
437
+ className: DEFAULT_TABLE_ALIGNMENT_OPTIONS.blockLeft.className
438
+ },
439
+ blockRight: {
440
+ align: undefined,
441
+ style: 'margin-left: auto; margin-right: 0;',
442
+ className: DEFAULT_TABLE_ALIGNMENT_OPTIONS.blockRight.className
443
+ }
444
+ };
@@ -3,6 +3,7 @@
3
3
  * For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
4
4
  */
5
5
  import { createEmptyTableCell } from '../utils/common.js';
6
+ import { getViewTableFromWrapper } from '../utils/structure.js';
6
7
  import { first } from 'ckeditor5/src/utils.js';
7
8
  /**
8
9
  * Returns a function that converts the table view representation:
@@ -27,7 +28,7 @@ export function upcastTableFigure() {
27
28
  return;
28
29
  }
29
30
  // Find a table element inside the figure element.
30
- const viewTable = getViewTableFromFigure(data.viewItem);
31
+ const viewTable = getViewTableFromWrapper(data.viewItem);
31
32
  // Do not convert if table element is absent or was already converted.
32
33
  if (!viewTable || !conversionApi.consumable.test(viewTable, { name: true })) {
33
34
  return;
@@ -152,16 +153,6 @@ export function ensureParagraphInTableCell(elementName) {
152
153
  }, { priority: 'low' });
153
154
  };
154
155
  }
155
- /**
156
- * Get view `<table>` element from the view widget (`<figure>`).
157
- */
158
- function getViewTableFromFigure(figureView) {
159
- for (const figureChild of figureView.getChildren()) {
160
- if (figureChild.is('element', 'table')) {
161
- return figureChild;
162
- }
163
- }
164
- }
165
156
  /**
166
157
  * Scans table rows and extracts required metadata from the table:
167
158
  *
package/src/index.d.ts CHANGED
@@ -34,6 +34,10 @@ export { TableUtils, type TableIndexesObject } from './tableutils.js';
34
34
  export { TableColumnResize } from './tablecolumnresize.js';
35
35
  export { TableColumnResizeEditing } from './tablecolumnresize/tablecolumnresizeediting.js';
36
36
  export { TableWidthsCommand, type TableWidthsCommandOptions } from './tablecolumnresize/tablewidthscommand.js';
37
+ export { TablePropertiesUIExperimental } from './tableproperties/tablepropertiesuiexperimental.js';
38
+ export { TablePropertiesViewExperimental, type TablePropertiesViewOptionsExperimental } from './tableproperties/ui/tablepropertiesviewexperimental.js';
39
+ export { TableCellPropertiesUIExperimental } from './tablecellproperties/tablecellpropertiesuiexperimental.js';
40
+ export { TableCellPropertiesViewExperimental, type TableCellPropertiesViewOptionsExperimental } from './tablecellproperties/ui/tablecellpropertiesviewexperimental.js';
37
41
  export { InsertColumnCommand } from './commands/insertcolumncommand.js';
38
42
  export { InsertRowCommand } from './commands/insertrowcommand.js';
39
43
  export { InsertTableCommand } from './commands/inserttablecommand.js';
@@ -68,7 +72,7 @@ export { TableHeightCommand } from './tableproperties/commands/tableheightcomman
68
72
  export { TableWidthCommand } from './tableproperties/commands/tablewidthcommand.js';
69
73
  export { TablePropertyCommand, type TablePropertyCommandExecuteOptions } from './tableproperties/commands/tablepropertycommand.js';
70
74
  export type { ViewDocumentTableMouseMoveEvent, ViewDocumentTableMouseLeaveEvent } from './tablemouse/mouseeventsobserver.js';
71
- export type { TableConfig, TablePropertiesConfig, TablePropertiesOptions, TableCellPropertiesConfig, TableColorConfig, TableCellPropertiesOptions, TableLayoutConfig, TableCaptionConfig, TableType } from './tableconfig.js';
75
+ export type { TableConfig, TableAlignmentConfig, TablePropertiesConfig, TablePropertiesOptions, TableCellPropertiesConfig, TableColorConfig, TableCellPropertiesOptions, TableLayoutConfig, TableCaptionConfig, TableType } from './tableconfig.js';
72
76
  export { downcastTable as _downcastTable, downcastRow as _downcastTableRow, downcastCell as _downcastTableCell, convertParagraphInTableCell as _convertParagraphInTableCell, isSingleParagraphWithoutAttributes as _isSingleTableParagraphWithoutAttributes } from './converters/downcast.js';
73
77
  export type { DowncastTableOptions as _DowncastTableOptions } from './converters/downcast.js';
74
78
  export { injectTableCaptionPostFixer as _injectTableCaptionPostFixer } from './converters/table-caption-post-fixer.js';
package/src/index.js CHANGED
@@ -34,6 +34,11 @@ export { TableUtils } from './tableutils.js';
34
34
  export { TableColumnResize } from './tablecolumnresize.js';
35
35
  export { TableColumnResizeEditing } from './tablecolumnresize/tablecolumnresizeediting.js';
36
36
  export { TableWidthsCommand } from './tablecolumnresize/tablewidthscommand.js';
37
+ // [experimental] Remove in the v48.
38
+ export { TablePropertiesUIExperimental } from './tableproperties/tablepropertiesuiexperimental.js';
39
+ export { TablePropertiesViewExperimental } from './tableproperties/ui/tablepropertiesviewexperimental.js';
40
+ export { TableCellPropertiesUIExperimental } from './tablecellproperties/tablecellpropertiesuiexperimental.js';
41
+ export { TableCellPropertiesViewExperimental } from './tablecellproperties/ui/tablecellpropertiesviewexperimental.js';
37
42
  export { InsertColumnCommand } from './commands/insertcolumncommand.js';
38
43
  export { InsertRowCommand } from './commands/insertrowcommand.js';
39
44
  export { InsertTableCommand } from './commands/inserttablecommand.js';