@ckeditor/ckeditor5-alignment 40.0.0 → 40.2.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.
- package/CHANGELOG.md +19 -19
- package/LICENSE.md +2 -2
- package/package.json +2 -2
- package/src/alignment.d.ts +29 -29
- package/src/alignment.js +33 -33
- package/src/alignmentcommand.d.ts +43 -43
- package/src/alignmentcommand.js +88 -88
- package/src/alignmentconfig.d.ts +72 -72
- package/src/alignmentconfig.js +5 -5
- package/src/alignmentediting.d.ts +26 -26
- package/src/alignmentediting.js +147 -147
- package/src/alignmentui.d.ts +45 -45
- package/src/alignmentui.js +124 -124
- package/src/augmentation.d.ts +23 -23
- package/src/augmentation.js +5 -5
- package/src/index.d.ts +13 -13
- package/src/index.js +11 -11
- package/src/utils.d.ts +39 -39
- package/src/utils.js +118 -118
- package/build/alignment.js.map +0 -1
package/src/alignmentconfig.d.ts
CHANGED
|
@@ -1,72 +1,72 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
|
|
3
|
-
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
|
|
4
|
-
*/
|
|
5
|
-
/**
|
|
6
|
-
* @module alignment/alignmentconfig
|
|
7
|
-
*/
|
|
8
|
-
/**
|
|
9
|
-
* The configuration of the {@link module:alignment/alignment~Alignment alignment feature}.
|
|
10
|
-
*
|
|
11
|
-
* ```ts
|
|
12
|
-
* ClassicEditor
|
|
13
|
-
* .create( editorElement, {
|
|
14
|
-
* alignment: {
|
|
15
|
-
* options: [ 'left', 'right' ]
|
|
16
|
-
* }
|
|
17
|
-
* } )
|
|
18
|
-
* .then( ... )
|
|
19
|
-
* .catch( ... );
|
|
20
|
-
* ```
|
|
21
|
-
*
|
|
22
|
-
* See {@link module:core/editor/editorconfig~EditorConfig all editor configuration options}.
|
|
23
|
-
*/
|
|
24
|
-
export interface AlignmentConfig {
|
|
25
|
-
options?: Array<SupportedOption | AlignmentFormat>;
|
|
26
|
-
}
|
|
27
|
-
/**
|
|
28
|
-
* Available alignment options.
|
|
29
|
-
*
|
|
30
|
-
* The available options are: `'left'`, `'right'`, `'center'` and `'justify'`. Other values are ignored.
|
|
31
|
-
*
|
|
32
|
-
* **Note:** It is recommended to always use `'left'` or `'right'` as these are default values which the user should
|
|
33
|
-
* normally be able to choose depending on the
|
|
34
|
-
* {@glink features/ui-language#setting-the-language-of-the-content language of the editor content}.
|
|
35
|
-
*
|
|
36
|
-
* ```ts
|
|
37
|
-
* ClassicEditor
|
|
38
|
-
* .create( editorElement, {
|
|
39
|
-
* alignment: {
|
|
40
|
-
* options: [ 'left', 'right' ]
|
|
41
|
-
* }
|
|
42
|
-
* } )
|
|
43
|
-
* .then( ... )
|
|
44
|
-
* .catch( ... );
|
|
45
|
-
* ```
|
|
46
|
-
*
|
|
47
|
-
* By default the alignment is set inline using the `text-align` CSS property. To further customize the alignment,
|
|
48
|
-
* you can provide names of classes for each alignment option using the `className` property.
|
|
49
|
-
*
|
|
50
|
-
* **Note:** Once you define the `className` property for one option, you need to specify it for all other options.
|
|
51
|
-
*
|
|
52
|
-
* ```ts
|
|
53
|
-
* ClassicEditor
|
|
54
|
-
* .create( editorElement, {
|
|
55
|
-
* alignment: {
|
|
56
|
-
* options: [
|
|
57
|
-
* { name: 'left', className: 'my-align-left' },
|
|
58
|
-
* { name: 'right', className: 'my-align-right' }
|
|
59
|
-
* ]
|
|
60
|
-
* }
|
|
61
|
-
* } )
|
|
62
|
-
* .then( ... )
|
|
63
|
-
* .catch( ... );
|
|
64
|
-
* ```
|
|
65
|
-
*
|
|
66
|
-
* See the demo of {@glink features/text-alignment#configuring-alignment-options custom alignment options}.
|
|
67
|
-
*/
|
|
68
|
-
export type AlignmentFormat = {
|
|
69
|
-
name: SupportedOption;
|
|
70
|
-
className?: string;
|
|
71
|
-
};
|
|
72
|
-
export type SupportedOption = 'left' | 'right' | 'center' | 'justify';
|
|
1
|
+
/**
|
|
2
|
+
* @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
|
|
3
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
|
|
4
|
+
*/
|
|
5
|
+
/**
|
|
6
|
+
* @module alignment/alignmentconfig
|
|
7
|
+
*/
|
|
8
|
+
/**
|
|
9
|
+
* The configuration of the {@link module:alignment/alignment~Alignment alignment feature}.
|
|
10
|
+
*
|
|
11
|
+
* ```ts
|
|
12
|
+
* ClassicEditor
|
|
13
|
+
* .create( editorElement, {
|
|
14
|
+
* alignment: {
|
|
15
|
+
* options: [ 'left', 'right' ]
|
|
16
|
+
* }
|
|
17
|
+
* } )
|
|
18
|
+
* .then( ... )
|
|
19
|
+
* .catch( ... );
|
|
20
|
+
* ```
|
|
21
|
+
*
|
|
22
|
+
* See {@link module:core/editor/editorconfig~EditorConfig all editor configuration options}.
|
|
23
|
+
*/
|
|
24
|
+
export interface AlignmentConfig {
|
|
25
|
+
options?: Array<SupportedOption | AlignmentFormat>;
|
|
26
|
+
}
|
|
27
|
+
/**
|
|
28
|
+
* Available alignment options.
|
|
29
|
+
*
|
|
30
|
+
* The available options are: `'left'`, `'right'`, `'center'` and `'justify'`. Other values are ignored.
|
|
31
|
+
*
|
|
32
|
+
* **Note:** It is recommended to always use `'left'` or `'right'` as these are default values which the user should
|
|
33
|
+
* normally be able to choose depending on the
|
|
34
|
+
* {@glink features/ui-language#setting-the-language-of-the-content language of the editor content}.
|
|
35
|
+
*
|
|
36
|
+
* ```ts
|
|
37
|
+
* ClassicEditor
|
|
38
|
+
* .create( editorElement, {
|
|
39
|
+
* alignment: {
|
|
40
|
+
* options: [ 'left', 'right' ]
|
|
41
|
+
* }
|
|
42
|
+
* } )
|
|
43
|
+
* .then( ... )
|
|
44
|
+
* .catch( ... );
|
|
45
|
+
* ```
|
|
46
|
+
*
|
|
47
|
+
* By default the alignment is set inline using the `text-align` CSS property. To further customize the alignment,
|
|
48
|
+
* you can provide names of classes for each alignment option using the `className` property.
|
|
49
|
+
*
|
|
50
|
+
* **Note:** Once you define the `className` property for one option, you need to specify it for all other options.
|
|
51
|
+
*
|
|
52
|
+
* ```ts
|
|
53
|
+
* ClassicEditor
|
|
54
|
+
* .create( editorElement, {
|
|
55
|
+
* alignment: {
|
|
56
|
+
* options: [
|
|
57
|
+
* { name: 'left', className: 'my-align-left' },
|
|
58
|
+
* { name: 'right', className: 'my-align-right' }
|
|
59
|
+
* ]
|
|
60
|
+
* }
|
|
61
|
+
* } )
|
|
62
|
+
* .then( ... )
|
|
63
|
+
* .catch( ... );
|
|
64
|
+
* ```
|
|
65
|
+
*
|
|
66
|
+
* See the demo of {@glink features/text-alignment#configuring-alignment-options custom alignment options}.
|
|
67
|
+
*/
|
|
68
|
+
export type AlignmentFormat = {
|
|
69
|
+
name: SupportedOption;
|
|
70
|
+
className?: string;
|
|
71
|
+
};
|
|
72
|
+
export type SupportedOption = 'left' | 'right' | 'center' | 'justify';
|
package/src/alignmentconfig.js
CHANGED
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
|
|
3
|
-
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
|
|
4
|
-
*/
|
|
5
|
-
export {};
|
|
1
|
+
/**
|
|
2
|
+
* @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
|
|
3
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
|
|
4
|
+
*/
|
|
5
|
+
export {};
|
|
@@ -1,26 +1,26 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
|
|
3
|
-
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
|
|
4
|
-
*/
|
|
5
|
-
/**
|
|
6
|
-
* @module alignment/alignmentediting
|
|
7
|
-
*/
|
|
8
|
-
import { Plugin, type Editor } from 'ckeditor5/src/core';
|
|
9
|
-
/**
|
|
10
|
-
* The alignment editing feature. It introduces the {@link module:alignment/alignmentcommand~AlignmentCommand command} and adds
|
|
11
|
-
* the `alignment` attribute for block elements in the {@link module:engine/model/model~Model model}.
|
|
12
|
-
*/
|
|
13
|
-
export default class AlignmentEditing extends Plugin {
|
|
14
|
-
/**
|
|
15
|
-
* @inheritDoc
|
|
16
|
-
*/
|
|
17
|
-
static get pluginName(): "AlignmentEditing";
|
|
18
|
-
/**
|
|
19
|
-
* @inheritDoc
|
|
20
|
-
*/
|
|
21
|
-
constructor(editor: Editor);
|
|
22
|
-
/**
|
|
23
|
-
* @inheritDoc
|
|
24
|
-
*/
|
|
25
|
-
init(): void;
|
|
26
|
-
}
|
|
1
|
+
/**
|
|
2
|
+
* @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
|
|
3
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
|
|
4
|
+
*/
|
|
5
|
+
/**
|
|
6
|
+
* @module alignment/alignmentediting
|
|
7
|
+
*/
|
|
8
|
+
import { Plugin, type Editor } from 'ckeditor5/src/core';
|
|
9
|
+
/**
|
|
10
|
+
* The alignment editing feature. It introduces the {@link module:alignment/alignmentcommand~AlignmentCommand command} and adds
|
|
11
|
+
* the `alignment` attribute for block elements in the {@link module:engine/model/model~Model model}.
|
|
12
|
+
*/
|
|
13
|
+
export default class AlignmentEditing extends Plugin {
|
|
14
|
+
/**
|
|
15
|
+
* @inheritDoc
|
|
16
|
+
*/
|
|
17
|
+
static get pluginName(): "AlignmentEditing";
|
|
18
|
+
/**
|
|
19
|
+
* @inheritDoc
|
|
20
|
+
*/
|
|
21
|
+
constructor(editor: Editor);
|
|
22
|
+
/**
|
|
23
|
+
* @inheritDoc
|
|
24
|
+
*/
|
|
25
|
+
init(): void;
|
|
26
|
+
}
|
package/src/alignmentediting.js
CHANGED
|
@@ -1,147 +1,147 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
|
|
3
|
-
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
|
|
4
|
-
*/
|
|
5
|
-
/**
|
|
6
|
-
* @module alignment/alignmentediting
|
|
7
|
-
*/
|
|
8
|
-
import { Plugin } from 'ckeditor5/src/core';
|
|
9
|
-
import AlignmentCommand from './alignmentcommand';
|
|
10
|
-
import { isDefault, isSupported, normalizeAlignmentOptions, supportedOptions } from './utils';
|
|
11
|
-
/**
|
|
12
|
-
* The alignment editing feature. It introduces the {@link module:alignment/alignmentcommand~AlignmentCommand command} and adds
|
|
13
|
-
* the `alignment` attribute for block elements in the {@link module:engine/model/model~Model model}.
|
|
14
|
-
*/
|
|
15
|
-
export default class AlignmentEditing extends Plugin {
|
|
16
|
-
/**
|
|
17
|
-
* @inheritDoc
|
|
18
|
-
*/
|
|
19
|
-
static get pluginName() {
|
|
20
|
-
return 'AlignmentEditing';
|
|
21
|
-
}
|
|
22
|
-
/**
|
|
23
|
-
* @inheritDoc
|
|
24
|
-
*/
|
|
25
|
-
constructor(editor) {
|
|
26
|
-
super(editor);
|
|
27
|
-
editor.config.define('alignment', {
|
|
28
|
-
options: supportedOptions.map(option => ({ name: option }))
|
|
29
|
-
});
|
|
30
|
-
}
|
|
31
|
-
/**
|
|
32
|
-
* @inheritDoc
|
|
33
|
-
*/
|
|
34
|
-
init() {
|
|
35
|
-
const editor = this.editor;
|
|
36
|
-
const locale = editor.locale;
|
|
37
|
-
const schema = editor.model.schema;
|
|
38
|
-
const options = normalizeAlignmentOptions(editor.config.get('alignment.options'));
|
|
39
|
-
// Filter out unsupported options and those that are redundant, e.g. `left` in LTR / `right` in RTL mode.
|
|
40
|
-
const optionsToConvert = options.filter(option => isSupported(option.name) && !isDefault(option.name, locale));
|
|
41
|
-
// Once there is at least one `className` defined, we switch to alignment with classes.
|
|
42
|
-
const shouldUseClasses = optionsToConvert.some(option => !!option.className);
|
|
43
|
-
// Allow alignment attribute on all blocks.
|
|
44
|
-
schema.extend('$block', { allowAttributes: 'alignment' });
|
|
45
|
-
editor.model.schema.setAttributeProperties('alignment', { isFormatting: true });
|
|
46
|
-
if (shouldUseClasses) {
|
|
47
|
-
editor.conversion.attributeToAttribute(buildClassDefinition(optionsToConvert));
|
|
48
|
-
}
|
|
49
|
-
else {
|
|
50
|
-
// Downcast inline styles.
|
|
51
|
-
editor.conversion.for('downcast').attributeToAttribute(buildDowncastInlineDefinition(optionsToConvert));
|
|
52
|
-
}
|
|
53
|
-
const upcastInlineDefinitions = buildUpcastInlineDefinitions(optionsToConvert);
|
|
54
|
-
// Always upcast from inline styles.
|
|
55
|
-
for (const definition of upcastInlineDefinitions) {
|
|
56
|
-
editor.conversion.for('upcast').attributeToAttribute(definition);
|
|
57
|
-
}
|
|
58
|
-
const upcastCompatibilityDefinitions = buildUpcastCompatibilityDefinitions(optionsToConvert);
|
|
59
|
-
// Always upcast from deprecated `align` attribute.
|
|
60
|
-
for (const definition of upcastCompatibilityDefinitions) {
|
|
61
|
-
editor.conversion.for('upcast').attributeToAttribute(definition);
|
|
62
|
-
}
|
|
63
|
-
editor.commands.add('alignment', new AlignmentCommand(editor));
|
|
64
|
-
}
|
|
65
|
-
}
|
|
66
|
-
/**
|
|
67
|
-
* Prepare downcast conversion definition for inline alignment styling.
|
|
68
|
-
*/
|
|
69
|
-
function buildDowncastInlineDefinition(options) {
|
|
70
|
-
const view = {};
|
|
71
|
-
for (const { name } of options) {
|
|
72
|
-
view[name] = {
|
|
73
|
-
key: 'style',
|
|
74
|
-
value: {
|
|
75
|
-
'text-align': name
|
|
76
|
-
}
|
|
77
|
-
};
|
|
78
|
-
}
|
|
79
|
-
const definition = {
|
|
80
|
-
model: {
|
|
81
|
-
key: 'alignment',
|
|
82
|
-
values: options.map(option => option.name)
|
|
83
|
-
},
|
|
84
|
-
view
|
|
85
|
-
};
|
|
86
|
-
return definition;
|
|
87
|
-
}
|
|
88
|
-
/**
|
|
89
|
-
* Prepare upcast definitions for inline alignment styles.
|
|
90
|
-
*/
|
|
91
|
-
function buildUpcastInlineDefinitions(options) {
|
|
92
|
-
const definitions = [];
|
|
93
|
-
for (const { name } of options) {
|
|
94
|
-
definitions.push({
|
|
95
|
-
view: {
|
|
96
|
-
key: 'style',
|
|
97
|
-
value: {
|
|
98
|
-
'text-align': name
|
|
99
|
-
}
|
|
100
|
-
},
|
|
101
|
-
model: {
|
|
102
|
-
key: 'alignment',
|
|
103
|
-
value: name
|
|
104
|
-
}
|
|
105
|
-
});
|
|
106
|
-
}
|
|
107
|
-
return definitions;
|
|
108
|
-
}
|
|
109
|
-
/**
|
|
110
|
-
* Prepare upcast definitions for deprecated `align` attribute.
|
|
111
|
-
*/
|
|
112
|
-
function buildUpcastCompatibilityDefinitions(options) {
|
|
113
|
-
const definitions = [];
|
|
114
|
-
for (const { name } of options) {
|
|
115
|
-
definitions.push({
|
|
116
|
-
view: {
|
|
117
|
-
key: 'align',
|
|
118
|
-
value: name
|
|
119
|
-
},
|
|
120
|
-
model: {
|
|
121
|
-
key: 'alignment',
|
|
122
|
-
value: name
|
|
123
|
-
}
|
|
124
|
-
});
|
|
125
|
-
}
|
|
126
|
-
return definitions;
|
|
127
|
-
}
|
|
128
|
-
/**
|
|
129
|
-
* Prepare conversion definitions for upcast and downcast alignment with classes.
|
|
130
|
-
*/
|
|
131
|
-
function buildClassDefinition(options) {
|
|
132
|
-
const view = {};
|
|
133
|
-
for (const option of options) {
|
|
134
|
-
view[option.name] = {
|
|
135
|
-
key: 'class',
|
|
136
|
-
value: option.className
|
|
137
|
-
};
|
|
138
|
-
}
|
|
139
|
-
const definition = {
|
|
140
|
-
model: {
|
|
141
|
-
key: 'alignment',
|
|
142
|
-
values: options.map(option => option.name)
|
|
143
|
-
},
|
|
144
|
-
view
|
|
145
|
-
};
|
|
146
|
-
return definition;
|
|
147
|
-
}
|
|
1
|
+
/**
|
|
2
|
+
* @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
|
|
3
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
|
|
4
|
+
*/
|
|
5
|
+
/**
|
|
6
|
+
* @module alignment/alignmentediting
|
|
7
|
+
*/
|
|
8
|
+
import { Plugin } from 'ckeditor5/src/core';
|
|
9
|
+
import AlignmentCommand from './alignmentcommand';
|
|
10
|
+
import { isDefault, isSupported, normalizeAlignmentOptions, supportedOptions } from './utils';
|
|
11
|
+
/**
|
|
12
|
+
* The alignment editing feature. It introduces the {@link module:alignment/alignmentcommand~AlignmentCommand command} and adds
|
|
13
|
+
* the `alignment` attribute for block elements in the {@link module:engine/model/model~Model model}.
|
|
14
|
+
*/
|
|
15
|
+
export default class AlignmentEditing extends Plugin {
|
|
16
|
+
/**
|
|
17
|
+
* @inheritDoc
|
|
18
|
+
*/
|
|
19
|
+
static get pluginName() {
|
|
20
|
+
return 'AlignmentEditing';
|
|
21
|
+
}
|
|
22
|
+
/**
|
|
23
|
+
* @inheritDoc
|
|
24
|
+
*/
|
|
25
|
+
constructor(editor) {
|
|
26
|
+
super(editor);
|
|
27
|
+
editor.config.define('alignment', {
|
|
28
|
+
options: supportedOptions.map(option => ({ name: option }))
|
|
29
|
+
});
|
|
30
|
+
}
|
|
31
|
+
/**
|
|
32
|
+
* @inheritDoc
|
|
33
|
+
*/
|
|
34
|
+
init() {
|
|
35
|
+
const editor = this.editor;
|
|
36
|
+
const locale = editor.locale;
|
|
37
|
+
const schema = editor.model.schema;
|
|
38
|
+
const options = normalizeAlignmentOptions(editor.config.get('alignment.options'));
|
|
39
|
+
// Filter out unsupported options and those that are redundant, e.g. `left` in LTR / `right` in RTL mode.
|
|
40
|
+
const optionsToConvert = options.filter(option => isSupported(option.name) && !isDefault(option.name, locale));
|
|
41
|
+
// Once there is at least one `className` defined, we switch to alignment with classes.
|
|
42
|
+
const shouldUseClasses = optionsToConvert.some(option => !!option.className);
|
|
43
|
+
// Allow alignment attribute on all blocks.
|
|
44
|
+
schema.extend('$block', { allowAttributes: 'alignment' });
|
|
45
|
+
editor.model.schema.setAttributeProperties('alignment', { isFormatting: true });
|
|
46
|
+
if (shouldUseClasses) {
|
|
47
|
+
editor.conversion.attributeToAttribute(buildClassDefinition(optionsToConvert));
|
|
48
|
+
}
|
|
49
|
+
else {
|
|
50
|
+
// Downcast inline styles.
|
|
51
|
+
editor.conversion.for('downcast').attributeToAttribute(buildDowncastInlineDefinition(optionsToConvert));
|
|
52
|
+
}
|
|
53
|
+
const upcastInlineDefinitions = buildUpcastInlineDefinitions(optionsToConvert);
|
|
54
|
+
// Always upcast from inline styles.
|
|
55
|
+
for (const definition of upcastInlineDefinitions) {
|
|
56
|
+
editor.conversion.for('upcast').attributeToAttribute(definition);
|
|
57
|
+
}
|
|
58
|
+
const upcastCompatibilityDefinitions = buildUpcastCompatibilityDefinitions(optionsToConvert);
|
|
59
|
+
// Always upcast from deprecated `align` attribute.
|
|
60
|
+
for (const definition of upcastCompatibilityDefinitions) {
|
|
61
|
+
editor.conversion.for('upcast').attributeToAttribute(definition);
|
|
62
|
+
}
|
|
63
|
+
editor.commands.add('alignment', new AlignmentCommand(editor));
|
|
64
|
+
}
|
|
65
|
+
}
|
|
66
|
+
/**
|
|
67
|
+
* Prepare downcast conversion definition for inline alignment styling.
|
|
68
|
+
*/
|
|
69
|
+
function buildDowncastInlineDefinition(options) {
|
|
70
|
+
const view = {};
|
|
71
|
+
for (const { name } of options) {
|
|
72
|
+
view[name] = {
|
|
73
|
+
key: 'style',
|
|
74
|
+
value: {
|
|
75
|
+
'text-align': name
|
|
76
|
+
}
|
|
77
|
+
};
|
|
78
|
+
}
|
|
79
|
+
const definition = {
|
|
80
|
+
model: {
|
|
81
|
+
key: 'alignment',
|
|
82
|
+
values: options.map(option => option.name)
|
|
83
|
+
},
|
|
84
|
+
view
|
|
85
|
+
};
|
|
86
|
+
return definition;
|
|
87
|
+
}
|
|
88
|
+
/**
|
|
89
|
+
* Prepare upcast definitions for inline alignment styles.
|
|
90
|
+
*/
|
|
91
|
+
function buildUpcastInlineDefinitions(options) {
|
|
92
|
+
const definitions = [];
|
|
93
|
+
for (const { name } of options) {
|
|
94
|
+
definitions.push({
|
|
95
|
+
view: {
|
|
96
|
+
key: 'style',
|
|
97
|
+
value: {
|
|
98
|
+
'text-align': name
|
|
99
|
+
}
|
|
100
|
+
},
|
|
101
|
+
model: {
|
|
102
|
+
key: 'alignment',
|
|
103
|
+
value: name
|
|
104
|
+
}
|
|
105
|
+
});
|
|
106
|
+
}
|
|
107
|
+
return definitions;
|
|
108
|
+
}
|
|
109
|
+
/**
|
|
110
|
+
* Prepare upcast definitions for deprecated `align` attribute.
|
|
111
|
+
*/
|
|
112
|
+
function buildUpcastCompatibilityDefinitions(options) {
|
|
113
|
+
const definitions = [];
|
|
114
|
+
for (const { name } of options) {
|
|
115
|
+
definitions.push({
|
|
116
|
+
view: {
|
|
117
|
+
key: 'align',
|
|
118
|
+
value: name
|
|
119
|
+
},
|
|
120
|
+
model: {
|
|
121
|
+
key: 'alignment',
|
|
122
|
+
value: name
|
|
123
|
+
}
|
|
124
|
+
});
|
|
125
|
+
}
|
|
126
|
+
return definitions;
|
|
127
|
+
}
|
|
128
|
+
/**
|
|
129
|
+
* Prepare conversion definitions for upcast and downcast alignment with classes.
|
|
130
|
+
*/
|
|
131
|
+
function buildClassDefinition(options) {
|
|
132
|
+
const view = {};
|
|
133
|
+
for (const option of options) {
|
|
134
|
+
view[option.name] = {
|
|
135
|
+
key: 'class',
|
|
136
|
+
value: option.className
|
|
137
|
+
};
|
|
138
|
+
}
|
|
139
|
+
const definition = {
|
|
140
|
+
model: {
|
|
141
|
+
key: 'alignment',
|
|
142
|
+
values: options.map(option => option.name)
|
|
143
|
+
},
|
|
144
|
+
view
|
|
145
|
+
};
|
|
146
|
+
return definition;
|
|
147
|
+
}
|
package/src/alignmentui.d.ts
CHANGED
|
@@ -1,45 +1,45 @@
|
|
|
1
|
-
/**
|
|
2
|
-
* @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
|
|
3
|
-
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
|
|
4
|
-
*/
|
|
5
|
-
/**
|
|
6
|
-
* @module alignment/alignmentui
|
|
7
|
-
*/
|
|
8
|
-
import { Plugin } from 'ckeditor5/src/core';
|
|
9
|
-
import type { SupportedOption } from './alignmentconfig';
|
|
10
|
-
/**
|
|
11
|
-
* The default alignment UI plugin.
|
|
12
|
-
*
|
|
13
|
-
* It introduces the `'alignment:left'`, `'alignment:right'`, `'alignment:center'` and `'alignment:justify'` buttons
|
|
14
|
-
* and the `'alignment'` dropdown.
|
|
15
|
-
*/
|
|
16
|
-
export default class AlignmentUI extends Plugin {
|
|
17
|
-
/**
|
|
18
|
-
* Returns the localized option titles provided by the plugin.
|
|
19
|
-
*
|
|
20
|
-
* The following localized titles corresponding with
|
|
21
|
-
* {@link module:alignment/alignmentconfig~AlignmentConfig#options} are available:
|
|
22
|
-
*
|
|
23
|
-
* * `'left'`,
|
|
24
|
-
* * `'right'`,
|
|
25
|
-
* * `'center'`,
|
|
26
|
-
* * `'justify'`.
|
|
27
|
-
*
|
|
28
|
-
* @readonly
|
|
29
|
-
*/
|
|
30
|
-
get localizedOptionTitles(): Record<SupportedOption, string>;
|
|
31
|
-
/**
|
|
32
|
-
* @inheritDoc
|
|
33
|
-
*/
|
|
34
|
-
static get pluginName(): "AlignmentUI";
|
|
35
|
-
/**
|
|
36
|
-
* @inheritDoc
|
|
37
|
-
*/
|
|
38
|
-
init(): void;
|
|
39
|
-
/**
|
|
40
|
-
* Helper method for initializing the button and linking it with an appropriate command.
|
|
41
|
-
*
|
|
42
|
-
* @param option The name of the alignment option for which the button is added.
|
|
43
|
-
*/
|
|
44
|
-
private _addButton;
|
|
45
|
-
}
|
|
1
|
+
/**
|
|
2
|
+
* @license Copyright (c) 2003-2023, CKSource Holding sp. z o.o. All rights reserved.
|
|
3
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
|
|
4
|
+
*/
|
|
5
|
+
/**
|
|
6
|
+
* @module alignment/alignmentui
|
|
7
|
+
*/
|
|
8
|
+
import { Plugin } from 'ckeditor5/src/core';
|
|
9
|
+
import type { SupportedOption } from './alignmentconfig';
|
|
10
|
+
/**
|
|
11
|
+
* The default alignment UI plugin.
|
|
12
|
+
*
|
|
13
|
+
* It introduces the `'alignment:left'`, `'alignment:right'`, `'alignment:center'` and `'alignment:justify'` buttons
|
|
14
|
+
* and the `'alignment'` dropdown.
|
|
15
|
+
*/
|
|
16
|
+
export default class AlignmentUI extends Plugin {
|
|
17
|
+
/**
|
|
18
|
+
* Returns the localized option titles provided by the plugin.
|
|
19
|
+
*
|
|
20
|
+
* The following localized titles corresponding with
|
|
21
|
+
* {@link module:alignment/alignmentconfig~AlignmentConfig#options} are available:
|
|
22
|
+
*
|
|
23
|
+
* * `'left'`,
|
|
24
|
+
* * `'right'`,
|
|
25
|
+
* * `'center'`,
|
|
26
|
+
* * `'justify'`.
|
|
27
|
+
*
|
|
28
|
+
* @readonly
|
|
29
|
+
*/
|
|
30
|
+
get localizedOptionTitles(): Record<SupportedOption, string>;
|
|
31
|
+
/**
|
|
32
|
+
* @inheritDoc
|
|
33
|
+
*/
|
|
34
|
+
static get pluginName(): "AlignmentUI";
|
|
35
|
+
/**
|
|
36
|
+
* @inheritDoc
|
|
37
|
+
*/
|
|
38
|
+
init(): void;
|
|
39
|
+
/**
|
|
40
|
+
* Helper method for initializing the button and linking it with an appropriate command.
|
|
41
|
+
*
|
|
42
|
+
* @param option The name of the alignment option for which the button is added.
|
|
43
|
+
*/
|
|
44
|
+
private _addButton;
|
|
45
|
+
}
|