@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.
@@ -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';
@@ -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
+ }
@@ -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
+ }
@@ -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
+ }