@ckeditor/ckeditor5-heading 48.2.0 → 48.3.0-alpha.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/dist/augmentation.d.ts +28 -28
- package/dist/heading.d.ts +31 -31
- package/dist/headingbuttonsui.d.ts +46 -46
- package/dist/headingcommand.d.ts +43 -43
- package/dist/headingconfig.d.ts +112 -112
- package/dist/headingediting.d.ts +41 -41
- package/dist/headingui.d.ts +21 -21
- package/dist/index.css.map +1 -1
- package/dist/index.d.ts +15 -15
- package/dist/index.js +874 -987
- package/dist/index.js.map +1 -1
- package/dist/title.d.ts +122 -122
- package/dist/utils.d.ts +16 -16
- package/package.json +8 -8
package/dist/index.js
CHANGED
|
@@ -2,1027 +2,914 @@
|
|
|
2
2
|
* @license Copyright (c) 2003-2026, 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 { Command, Plugin } from
|
|
6
|
-
import { Paragraph } from
|
|
7
|
-
import {
|
|
8
|
-
import {
|
|
9
|
-
import {
|
|
10
|
-
import { ViewDowncastWriter, enableViewPlaceholder, hideViewPlaceholder, needsViewPlaceholder, showViewPlaceholder } from
|
|
5
|
+
import { Command, Plugin } from "@ckeditor/ckeditor5-core";
|
|
6
|
+
import { Paragraph } from "@ckeditor/ckeditor5-paragraph";
|
|
7
|
+
import { Collection, first, logWarning, priorities } from "@ckeditor/ckeditor5-utils";
|
|
8
|
+
import { ButtonView, MenuBarMenuListItemButtonView, MenuBarMenuListItemView, MenuBarMenuListView, MenuBarMenuView, UIModel, addListToDropdown, createDropdown } from "@ckeditor/ckeditor5-ui";
|
|
9
|
+
import { IconHeading1, IconHeading2, IconHeading3, IconHeading4, IconHeading5, IconHeading6 } from "@ckeditor/ckeditor5-icons";
|
|
10
|
+
import { ViewDowncastWriter, enableViewPlaceholder, hideViewPlaceholder, needsViewPlaceholder, showViewPlaceholder } from "@ckeditor/ckeditor5-engine";
|
|
11
11
|
|
|
12
12
|
/**
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
17
|
-
|
|
18
|
-
|
|
19
|
-
|
|
20
|
-
|
|
21
|
-
|
|
22
|
-
|
|
23
|
-
|
|
24
|
-
|
|
25
|
-
|
|
26
|
-
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
32
|
-
|
|
33
|
-
|
|
34
|
-
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
13
|
+
* @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
|
|
14
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
15
|
+
*/
|
|
16
|
+
/**
|
|
17
|
+
* @module heading/headingcommand
|
|
18
|
+
*/
|
|
19
|
+
/**
|
|
20
|
+
* The heading command. It is used by the {@link module:heading/heading~Heading heading feature} to apply headings.
|
|
21
|
+
*/
|
|
22
|
+
var HeadingCommand = class extends Command {
|
|
23
|
+
/**
|
|
24
|
+
* Set of defined model's elements names that this command support.
|
|
25
|
+
* See {@link module:heading/headingconfig~HeadingOption}.
|
|
26
|
+
*/
|
|
27
|
+
modelElements;
|
|
28
|
+
/**
|
|
29
|
+
* Creates an instance of the command.
|
|
30
|
+
*
|
|
31
|
+
* @param editor Editor instance.
|
|
32
|
+
* @param modelElements Names of the element which this command can apply in the model.
|
|
33
|
+
*/
|
|
34
|
+
constructor(editor, modelElements) {
|
|
35
|
+
super(editor);
|
|
36
|
+
this.modelElements = modelElements;
|
|
37
|
+
}
|
|
38
|
+
/**
|
|
39
|
+
* @inheritDoc
|
|
40
|
+
*/
|
|
41
|
+
refresh() {
|
|
42
|
+
const block = first(this.editor.model.document.selection.getSelectedBlocks());
|
|
43
|
+
this.value = !!block && this.modelElements.includes(block.name) && block.name;
|
|
44
|
+
this.isEnabled = !!block && this.modelElements.some((heading) => checkCanBecomeHeading(block, heading, this.editor.model.schema));
|
|
45
|
+
}
|
|
46
|
+
/**
|
|
47
|
+
* Executes the command. Applies the heading to the selected blocks or, if the first selected
|
|
48
|
+
* block is a heading already, turns selected headings (of this level only) to paragraphs.
|
|
49
|
+
*
|
|
50
|
+
* @param options.value Name of the element which this command will apply in the model.
|
|
51
|
+
* @fires execute
|
|
52
|
+
*/
|
|
53
|
+
execute(options) {
|
|
54
|
+
const model = this.editor.model;
|
|
55
|
+
const document = model.document;
|
|
56
|
+
const modelElement = options.value;
|
|
57
|
+
model.change((writer) => {
|
|
58
|
+
const blocks = Array.from(document.selection.getSelectedBlocks()).filter((block) => {
|
|
59
|
+
return checkCanBecomeHeading(block, modelElement, model.schema);
|
|
60
|
+
});
|
|
61
|
+
for (const block of blocks) if (!block.is("element", modelElement)) writer.rename(block, modelElement);
|
|
62
|
+
});
|
|
63
|
+
}
|
|
64
|
+
};
|
|
57
65
|
/**
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
66
|
+
* Checks whether the given block can be replaced by a specific heading.
|
|
67
|
+
*
|
|
68
|
+
* @param block A block to be tested.
|
|
69
|
+
* @param heading Command element name in the model.
|
|
70
|
+
* @param schema The schema of the document.
|
|
71
|
+
*/
|
|
72
|
+
function checkCanBecomeHeading(block, heading, schema) {
|
|
73
|
+
return schema.checkChild(block.parent, heading) && !schema.isObject(block);
|
|
65
74
|
}
|
|
66
75
|
|
|
67
|
-
const defaultModelElement = 'paragraph';
|
|
68
76
|
/**
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
77
|
-
|
|
78
|
-
|
|
79
|
-
|
|
80
|
-
|
|
81
|
-
|
|
82
|
-
|
|
83
|
-
|
|
84
|
-
|
|
85
|
-
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
123
|
-
|
|
124
|
-
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
converterPriority: priorities.low + 1
|
|
173
|
-
});
|
|
174
|
-
}
|
|
175
|
-
}
|
|
77
|
+
* @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
|
|
78
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
79
|
+
*/
|
|
80
|
+
/**
|
|
81
|
+
* @module heading/headingediting
|
|
82
|
+
*/
|
|
83
|
+
const defaultModelElement = "paragraph";
|
|
84
|
+
/**
|
|
85
|
+
* The headings engine feature. It handles switching between block formats – headings and paragraph.
|
|
86
|
+
* This class represents the engine part of the heading feature. See also {@link module:heading/heading~Heading}.
|
|
87
|
+
* It introduces `heading1`-`headingN` commands which allow to convert paragraphs into headings.
|
|
88
|
+
*/
|
|
89
|
+
var HeadingEditing = class extends Plugin {
|
|
90
|
+
/**
|
|
91
|
+
* @inheritDoc
|
|
92
|
+
*/
|
|
93
|
+
static get pluginName() {
|
|
94
|
+
return "HeadingEditing";
|
|
95
|
+
}
|
|
96
|
+
/**
|
|
97
|
+
* @inheritDoc
|
|
98
|
+
*/
|
|
99
|
+
static get isOfficialPlugin() {
|
|
100
|
+
return true;
|
|
101
|
+
}
|
|
102
|
+
/**
|
|
103
|
+
* @inheritDoc
|
|
104
|
+
*/
|
|
105
|
+
constructor(editor) {
|
|
106
|
+
super(editor);
|
|
107
|
+
editor.config.define("heading", { options: [
|
|
108
|
+
{
|
|
109
|
+
model: "paragraph",
|
|
110
|
+
title: "Paragraph",
|
|
111
|
+
class: "ck-heading_paragraph"
|
|
112
|
+
},
|
|
113
|
+
{
|
|
114
|
+
model: "heading1",
|
|
115
|
+
view: "h2",
|
|
116
|
+
title: "Heading 1",
|
|
117
|
+
class: "ck-heading_heading1"
|
|
118
|
+
},
|
|
119
|
+
{
|
|
120
|
+
model: "heading2",
|
|
121
|
+
view: "h3",
|
|
122
|
+
title: "Heading 2",
|
|
123
|
+
class: "ck-heading_heading2"
|
|
124
|
+
},
|
|
125
|
+
{
|
|
126
|
+
model: "heading3",
|
|
127
|
+
view: "h4",
|
|
128
|
+
title: "Heading 3",
|
|
129
|
+
class: "ck-heading_heading3"
|
|
130
|
+
}
|
|
131
|
+
] });
|
|
132
|
+
}
|
|
133
|
+
/**
|
|
134
|
+
* @inheritDoc
|
|
135
|
+
*/
|
|
136
|
+
static get requires() {
|
|
137
|
+
return [Paragraph];
|
|
138
|
+
}
|
|
139
|
+
/**
|
|
140
|
+
* @inheritDoc
|
|
141
|
+
*/
|
|
142
|
+
init() {
|
|
143
|
+
const editor = this.editor;
|
|
144
|
+
const options = editor.config.get("heading.options");
|
|
145
|
+
const modelElements = [];
|
|
146
|
+
for (const option of options) {
|
|
147
|
+
if (option.model === "paragraph") continue;
|
|
148
|
+
editor.model.schema.register(option.model, { inheritAllFrom: "$block" });
|
|
149
|
+
editor.conversion.elementToElement(option);
|
|
150
|
+
modelElements.push(option.model);
|
|
151
|
+
}
|
|
152
|
+
this._addDefaultH1Conversion(editor);
|
|
153
|
+
editor.commands.add("heading", new HeadingCommand(editor, modelElements));
|
|
154
|
+
}
|
|
155
|
+
/**
|
|
156
|
+
* @inheritDoc
|
|
157
|
+
*/
|
|
158
|
+
afterInit() {
|
|
159
|
+
const editor = this.editor;
|
|
160
|
+
const enterCommand = editor.commands.get("enter");
|
|
161
|
+
const options = editor.config.get("heading.options");
|
|
162
|
+
if (enterCommand) this.listenTo(enterCommand, "afterExecute", (evt, data) => {
|
|
163
|
+
const positionParent = editor.model.document.selection.getFirstPosition().parent;
|
|
164
|
+
if (options.some((option) => positionParent.is("element", option.model)) && !positionParent.is("element", defaultModelElement) && positionParent.childCount === 0) data.writer.rename(positionParent, defaultModelElement);
|
|
165
|
+
});
|
|
166
|
+
}
|
|
167
|
+
/**
|
|
168
|
+
* Adds default conversion for `h1` -> `heading1` with a low priority.
|
|
169
|
+
*
|
|
170
|
+
* @param editor Editor instance on which to add the `h1` conversion.
|
|
171
|
+
*/
|
|
172
|
+
_addDefaultH1Conversion(editor) {
|
|
173
|
+
editor.conversion.for("upcast").elementToElement({
|
|
174
|
+
model: "heading1",
|
|
175
|
+
view: "h1",
|
|
176
|
+
converterPriority: priorities.low + 1
|
|
177
|
+
});
|
|
178
|
+
}
|
|
179
|
+
};
|
|
176
180
|
|
|
177
181
|
/**
|
|
178
|
-
|
|
179
|
-
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
|
|
192
|
-
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
|
|
200
|
-
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
return option;
|
|
208
|
-
});
|
|
182
|
+
* @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
|
|
183
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
184
|
+
*/
|
|
185
|
+
/**
|
|
186
|
+
* Returns heading options as defined in `config.heading.options` but processed to consider
|
|
187
|
+
* the editor localization, i.e. to display {@link module:heading/headingconfig~HeadingOption}
|
|
188
|
+
* in the correct language.
|
|
189
|
+
*
|
|
190
|
+
* Note: The reason behind this method is that there is no way to use {@link module:utils/locale~Locale#t}
|
|
191
|
+
* when the user configuration is defined because the editor does not exist yet.
|
|
192
|
+
*
|
|
193
|
+
* @internal
|
|
194
|
+
*/
|
|
195
|
+
function getLocalizedOptions(editor) {
|
|
196
|
+
const t = editor.t;
|
|
197
|
+
const localizedTitles = {
|
|
198
|
+
"Paragraph": t("Paragraph"),
|
|
199
|
+
"Heading 1": t("Heading 1"),
|
|
200
|
+
"Heading 2": t("Heading 2"),
|
|
201
|
+
"Heading 3": t("Heading 3"),
|
|
202
|
+
"Heading 4": t("Heading 4"),
|
|
203
|
+
"Heading 5": t("Heading 5"),
|
|
204
|
+
"Heading 6": t("Heading 6")
|
|
205
|
+
};
|
|
206
|
+
return editor.config.get("heading.options").map((option) => {
|
|
207
|
+
const title = localizedTitles[option.title];
|
|
208
|
+
if (title && title != option.title) option.title = title;
|
|
209
|
+
return option;
|
|
210
|
+
});
|
|
209
211
|
}
|
|
210
212
|
|
|
211
213
|
/**
|
|
212
|
-
|
|
213
|
-
|
|
214
|
-
|
|
215
|
-
|
|
216
|
-
|
|
217
|
-
|
|
218
|
-
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
|
|
236
|
-
|
|
237
|
-
|
|
238
|
-
|
|
239
|
-
|
|
240
|
-
|
|
241
|
-
|
|
242
|
-
|
|
243
|
-
|
|
244
|
-
|
|
245
|
-
|
|
246
|
-
|
|
247
|
-
|
|
248
|
-
|
|
249
|
-
|
|
250
|
-
|
|
251
|
-
|
|
252
|
-
|
|
253
|
-
|
|
254
|
-
|
|
255
|
-
|
|
256
|
-
|
|
257
|
-
|
|
258
|
-
|
|
259
|
-
|
|
260
|
-
|
|
261
|
-
|
|
262
|
-
|
|
263
|
-
|
|
264
|
-
|
|
265
|
-
|
|
266
|
-
|
|
267
|
-
|
|
268
|
-
|
|
269
|
-
|
|
270
|
-
|
|
271
|
-
|
|
272
|
-
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
|
|
280
|
-
|
|
281
|
-
|
|
282
|
-
|
|
283
|
-
|
|
284
|
-
|
|
285
|
-
|
|
286
|
-
|
|
287
|
-
|
|
288
|
-
|
|
289
|
-
|
|
290
|
-
|
|
291
|
-
|
|
292
|
-
|
|
293
|
-
|
|
294
|
-
|
|
295
|
-
|
|
296
|
-
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
300
|
-
|
|
301
|
-
|
|
302
|
-
|
|
303
|
-
|
|
304
|
-
|
|
305
|
-
|
|
306
|
-
|
|
307
|
-
|
|
308
|
-
|
|
309
|
-
|
|
310
|
-
|
|
311
|
-
|
|
312
|
-
|
|
313
|
-
|
|
314
|
-
|
|
315
|
-
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
|
|
319
|
-
|
|
320
|
-
|
|
321
|
-
|
|
322
|
-
|
|
323
|
-
|
|
324
|
-
|
|
325
|
-
|
|
326
|
-
|
|
327
|
-
|
|
328
|
-
|
|
329
|
-
|
|
330
|
-
|
|
331
|
-
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
buttonView.delegate('execute').to(menuView);
|
|
351
|
-
buttonView.on('execute', ()=>{
|
|
352
|
-
const commandName = option.model === 'paragraph' ? 'paragraph' : 'heading';
|
|
353
|
-
editor.execute(commandName, {
|
|
354
|
-
value: option.model
|
|
355
|
-
});
|
|
356
|
-
editor.editing.view.focus();
|
|
357
|
-
});
|
|
358
|
-
if (option.model === 'paragraph') {
|
|
359
|
-
buttonView.bind('isOn').to(paragraphCommand, 'value');
|
|
360
|
-
commands.push(paragraphCommand);
|
|
361
|
-
} else {
|
|
362
|
-
buttonView.bind('isOn').to(headingCommand, 'value', (value)=>value === option.model);
|
|
363
|
-
}
|
|
364
|
-
}
|
|
365
|
-
menuView.bind('isEnabled').toMany(commands, 'isEnabled', (...areEnabled)=>{
|
|
366
|
-
return areEnabled.some((isEnabled)=>isEnabled);
|
|
367
|
-
});
|
|
368
|
-
return menuView;
|
|
369
|
-
});
|
|
370
|
-
}
|
|
371
|
-
}
|
|
214
|
+
* @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
|
|
215
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
216
|
+
*/
|
|
217
|
+
/**
|
|
218
|
+
* @module heading/headingui
|
|
219
|
+
*/
|
|
220
|
+
/**
|
|
221
|
+
* The headings UI feature. It introduces the `headings` dropdown.
|
|
222
|
+
*/
|
|
223
|
+
var HeadingUI = class extends Plugin {
|
|
224
|
+
/**
|
|
225
|
+
* @inheritDoc
|
|
226
|
+
*/
|
|
227
|
+
static get pluginName() {
|
|
228
|
+
return "HeadingUI";
|
|
229
|
+
}
|
|
230
|
+
/**
|
|
231
|
+
* @inheritDoc
|
|
232
|
+
*/
|
|
233
|
+
static get isOfficialPlugin() {
|
|
234
|
+
return true;
|
|
235
|
+
}
|
|
236
|
+
/**
|
|
237
|
+
* @inheritDoc
|
|
238
|
+
*/
|
|
239
|
+
init() {
|
|
240
|
+
const editor = this.editor;
|
|
241
|
+
const t = editor.t;
|
|
242
|
+
const options = getLocalizedOptions(editor);
|
|
243
|
+
const defaultTitle = t("Choose heading");
|
|
244
|
+
const accessibleLabel = t("Heading");
|
|
245
|
+
editor.ui.componentFactory.add("heading", (locale) => {
|
|
246
|
+
const titles = {};
|
|
247
|
+
const itemDefinitions = new Collection();
|
|
248
|
+
const headingCommand = editor.commands.get("heading");
|
|
249
|
+
const paragraphCommand = editor.commands.get("paragraph");
|
|
250
|
+
const commands = [headingCommand];
|
|
251
|
+
for (const option of options) {
|
|
252
|
+
const def = {
|
|
253
|
+
type: "button",
|
|
254
|
+
model: new UIModel({
|
|
255
|
+
label: option.title,
|
|
256
|
+
class: option.class,
|
|
257
|
+
role: "menuitemradio",
|
|
258
|
+
withText: true
|
|
259
|
+
})
|
|
260
|
+
};
|
|
261
|
+
if (option.model === "paragraph") {
|
|
262
|
+
def.model.bind("isOn").to(paragraphCommand, "value");
|
|
263
|
+
def.model.set("commandName", "paragraph");
|
|
264
|
+
commands.push(paragraphCommand);
|
|
265
|
+
} else {
|
|
266
|
+
def.model.bind("isOn").to(headingCommand, "value", (value) => value === option.model);
|
|
267
|
+
def.model.set({
|
|
268
|
+
commandName: "heading",
|
|
269
|
+
commandValue: option.model
|
|
270
|
+
});
|
|
271
|
+
}
|
|
272
|
+
itemDefinitions.add(def);
|
|
273
|
+
titles[option.model] = option.title;
|
|
274
|
+
}
|
|
275
|
+
const dropdownView = createDropdown(locale);
|
|
276
|
+
addListToDropdown(dropdownView, itemDefinitions, {
|
|
277
|
+
ariaLabel: accessibleLabel,
|
|
278
|
+
role: "menu"
|
|
279
|
+
});
|
|
280
|
+
dropdownView.buttonView.set({
|
|
281
|
+
ariaLabel: accessibleLabel,
|
|
282
|
+
ariaLabelledBy: void 0,
|
|
283
|
+
isOn: false,
|
|
284
|
+
withText: true,
|
|
285
|
+
tooltip: accessibleLabel
|
|
286
|
+
});
|
|
287
|
+
dropdownView.extendTemplate({ attributes: { class: ["ck-heading-dropdown"] } });
|
|
288
|
+
dropdownView.bind("isEnabled").toMany(commands, "isEnabled", (...areEnabled) => {
|
|
289
|
+
return areEnabled.some((isEnabled) => isEnabled);
|
|
290
|
+
});
|
|
291
|
+
dropdownView.buttonView.bind("label").to(headingCommand, "value", paragraphCommand, "value", (heading, paragraph) => {
|
|
292
|
+
const whichModel = paragraph ? "paragraph" : heading;
|
|
293
|
+
if (typeof whichModel === "boolean") return defaultTitle;
|
|
294
|
+
if (!titles[whichModel]) return defaultTitle;
|
|
295
|
+
return titles[whichModel];
|
|
296
|
+
});
|
|
297
|
+
dropdownView.buttonView.bind("ariaLabel").to(headingCommand, "value", paragraphCommand, "value", (heading, paragraph) => {
|
|
298
|
+
const whichModel = paragraph ? "paragraph" : heading;
|
|
299
|
+
if (typeof whichModel === "boolean") return accessibleLabel;
|
|
300
|
+
if (!titles[whichModel]) return accessibleLabel;
|
|
301
|
+
return `${titles[whichModel]}, ${accessibleLabel}`;
|
|
302
|
+
});
|
|
303
|
+
this.listenTo(dropdownView, "execute", (evt) => {
|
|
304
|
+
const { commandName, commandValue } = evt.source;
|
|
305
|
+
editor.execute(commandName, commandValue ? { value: commandValue } : void 0);
|
|
306
|
+
editor.editing.view.focus();
|
|
307
|
+
});
|
|
308
|
+
return dropdownView;
|
|
309
|
+
});
|
|
310
|
+
editor.ui.componentFactory.add("menuBar:heading", (locale) => {
|
|
311
|
+
const menuView = new MenuBarMenuView(locale);
|
|
312
|
+
const headingCommand = editor.commands.get("heading");
|
|
313
|
+
const paragraphCommand = editor.commands.get("paragraph");
|
|
314
|
+
const commands = [headingCommand];
|
|
315
|
+
const listView = new MenuBarMenuListView(locale);
|
|
316
|
+
menuView.set({ class: "ck-heading-dropdown" });
|
|
317
|
+
listView.set({
|
|
318
|
+
ariaLabel: t("Heading"),
|
|
319
|
+
role: "menu"
|
|
320
|
+
});
|
|
321
|
+
menuView.buttonView.set({ label: t("Heading") });
|
|
322
|
+
menuView.panelView.children.add(listView);
|
|
323
|
+
for (const option of options) {
|
|
324
|
+
const listItemView = new MenuBarMenuListItemView(locale, menuView);
|
|
325
|
+
const buttonView = new MenuBarMenuListItemButtonView(locale);
|
|
326
|
+
listItemView.children.add(buttonView);
|
|
327
|
+
listView.items.add(listItemView);
|
|
328
|
+
buttonView.set({
|
|
329
|
+
isToggleable: true,
|
|
330
|
+
label: option.title,
|
|
331
|
+
role: "menuitemradio",
|
|
332
|
+
class: option.class
|
|
333
|
+
});
|
|
334
|
+
buttonView.delegate("execute").to(menuView);
|
|
335
|
+
buttonView.on("execute", () => {
|
|
336
|
+
const commandName = option.model === "paragraph" ? "paragraph" : "heading";
|
|
337
|
+
editor.execute(commandName, { value: option.model });
|
|
338
|
+
editor.editing.view.focus();
|
|
339
|
+
});
|
|
340
|
+
if (option.model === "paragraph") {
|
|
341
|
+
buttonView.bind("isOn").to(paragraphCommand, "value");
|
|
342
|
+
commands.push(paragraphCommand);
|
|
343
|
+
} else buttonView.bind("isOn").to(headingCommand, "value", (value) => value === option.model);
|
|
344
|
+
}
|
|
345
|
+
menuView.bind("isEnabled").toMany(commands, "isEnabled", (...areEnabled) => {
|
|
346
|
+
return areEnabled.some((isEnabled) => isEnabled);
|
|
347
|
+
});
|
|
348
|
+
return menuView;
|
|
349
|
+
});
|
|
350
|
+
}
|
|
351
|
+
};
|
|
372
352
|
|
|
373
353
|
/**
|
|
374
|
-
|
|
375
|
-
|
|
376
|
-
|
|
377
|
-
|
|
378
|
-
|
|
379
|
-
|
|
380
|
-
|
|
381
|
-
|
|
382
|
-
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
|
|
391
|
-
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
354
|
+
* @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
|
|
355
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
356
|
+
*/
|
|
357
|
+
/**
|
|
358
|
+
* @module heading/heading
|
|
359
|
+
*/
|
|
360
|
+
/**
|
|
361
|
+
* The headings feature.
|
|
362
|
+
*
|
|
363
|
+
* For a detailed overview, check the {@glink features/headings Headings feature} guide
|
|
364
|
+
* and the {@glink api/heading package page}.
|
|
365
|
+
*
|
|
366
|
+
* This is a "glue" plugin which loads the {@link module:heading/headingediting~HeadingEditing heading editing feature}
|
|
367
|
+
* and {@link module:heading/headingui~HeadingUI heading UI feature}.
|
|
368
|
+
*
|
|
369
|
+
* @extends module:core/plugin~Plugin
|
|
370
|
+
*/
|
|
371
|
+
var Heading = class extends Plugin {
|
|
372
|
+
/**
|
|
373
|
+
* @inheritDoc
|
|
374
|
+
*/
|
|
375
|
+
static get requires() {
|
|
376
|
+
return [HeadingEditing, HeadingUI];
|
|
377
|
+
}
|
|
378
|
+
/**
|
|
379
|
+
* @inheritDoc
|
|
380
|
+
*/
|
|
381
|
+
static get pluginName() {
|
|
382
|
+
return "Heading";
|
|
383
|
+
}
|
|
384
|
+
/**
|
|
385
|
+
* @inheritDoc
|
|
386
|
+
*/
|
|
387
|
+
static get isOfficialPlugin() {
|
|
388
|
+
return true;
|
|
389
|
+
}
|
|
390
|
+
};
|
|
403
391
|
|
|
404
|
-
const defaultIcons = /* #__PURE__ */ (()=>({
|
|
405
|
-
heading1: IconHeading1,
|
|
406
|
-
heading2: IconHeading2,
|
|
407
|
-
heading3: IconHeading3,
|
|
408
|
-
heading4: IconHeading4,
|
|
409
|
-
heading5: IconHeading5,
|
|
410
|
-
heading6: IconHeading6
|
|
411
|
-
}))();
|
|
412
392
|
/**
|
|
413
|
-
|
|
414
|
-
|
|
415
|
-
|
|
416
|
-
|
|
417
|
-
|
|
418
|
-
|
|
419
|
-
|
|
420
|
-
|
|
421
|
-
|
|
422
|
-
|
|
423
|
-
|
|
424
|
-
|
|
425
|
-
|
|
426
|
-
|
|
427
|
-
|
|
428
|
-
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
|
|
436
|
-
|
|
437
|
-
|
|
438
|
-
|
|
439
|
-
|
|
440
|
-
|
|
441
|
-
|
|
442
|
-
|
|
443
|
-
|
|
444
|
-
|
|
445
|
-
|
|
446
|
-
|
|
447
|
-
|
|
448
|
-
|
|
449
|
-
|
|
450
|
-
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
459
|
-
|
|
460
|
-
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
472
|
-
|
|
473
|
-
|
|
393
|
+
* @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
|
|
394
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
395
|
+
*/
|
|
396
|
+
/**
|
|
397
|
+
* @module heading/headingbuttonsui
|
|
398
|
+
*/
|
|
399
|
+
const defaultIcons = /* #__PURE__ */ (() => ({
|
|
400
|
+
heading1: IconHeading1,
|
|
401
|
+
heading2: IconHeading2,
|
|
402
|
+
heading3: IconHeading3,
|
|
403
|
+
heading4: IconHeading4,
|
|
404
|
+
heading5: IconHeading5,
|
|
405
|
+
heading6: IconHeading6
|
|
406
|
+
}))();
|
|
407
|
+
/**
|
|
408
|
+
* The `HeadingButtonsUI` plugin defines a set of UI buttons that can be used instead of the
|
|
409
|
+
* standard drop down component.
|
|
410
|
+
*
|
|
411
|
+
* This feature is not enabled by default by the {@link module:heading/heading~Heading} plugin and needs to be
|
|
412
|
+
* installed manually to the editor configuration.
|
|
413
|
+
*
|
|
414
|
+
* Plugin introduces button UI elements, which names are same as `model` property from {@link module:heading/headingconfig~HeadingOption}.
|
|
415
|
+
*
|
|
416
|
+
* ```ts
|
|
417
|
+
* ClassicEditor
|
|
418
|
+
* .create( {
|
|
419
|
+
* plugins: [ ..., Heading, Paragraph, HeadingButtonsUI, ParagraphButtonUI ]
|
|
420
|
+
* heading: {
|
|
421
|
+
* options: [
|
|
422
|
+
* { model: 'paragraph', title: 'Paragraph', class: 'ck-heading_paragraph' },
|
|
423
|
+
* { model: 'heading1', view: 'h2', title: 'Heading 1', class: 'ck-heading_heading1' },
|
|
424
|
+
* { model: 'heading2', view: 'h3', title: 'Heading 2', class: 'ck-heading_heading2' },
|
|
425
|
+
* { model: 'heading3', view: 'h4', title: 'Heading 3', class: 'ck-heading_heading3' }
|
|
426
|
+
* ]
|
|
427
|
+
* },
|
|
428
|
+
* toolbar: [ 'paragraph', 'heading1', 'heading2', 'heading3' ]
|
|
429
|
+
* } )
|
|
430
|
+
* .then( ... )
|
|
431
|
+
* .catch( ... );
|
|
432
|
+
* ```
|
|
433
|
+
*
|
|
434
|
+
* NOTE: The `'paragraph'` button is defined in by the {@link module:paragraph/paragraphbuttonui~ParagraphButtonUI} plugin
|
|
435
|
+
* which needs to be loaded manually as well.
|
|
436
|
+
*
|
|
437
|
+
* It is possible to use custom icons by providing `icon` config option in {@link module:heading/headingconfig~HeadingOption}.
|
|
438
|
+
* For the default configuration standard icons are used.
|
|
439
|
+
*/
|
|
440
|
+
var HeadingButtonsUI = class extends Plugin {
|
|
441
|
+
/**
|
|
442
|
+
* @inheritDoc
|
|
443
|
+
*/
|
|
444
|
+
init() {
|
|
445
|
+
getLocalizedOptions(this.editor).filter((item) => item.model !== "paragraph").map((item) => this._createButton(item));
|
|
446
|
+
}
|
|
447
|
+
/**
|
|
448
|
+
* Creates single button view from provided configuration option.
|
|
449
|
+
*/
|
|
450
|
+
_createButton(option) {
|
|
451
|
+
const editor = this.editor;
|
|
452
|
+
editor.ui.componentFactory.add(option.model, (locale) => {
|
|
453
|
+
const view = new ButtonView(locale);
|
|
454
|
+
const command = editor.commands.get("heading");
|
|
455
|
+
view.label = option.title;
|
|
456
|
+
view.icon = option.icon || defaultIcons[option.model];
|
|
457
|
+
view.tooltip = true;
|
|
458
|
+
view.isToggleable = true;
|
|
459
|
+
view.bind("isEnabled").to(command);
|
|
460
|
+
view.bind("isOn").to(command, "value", (value) => value == option.model);
|
|
461
|
+
view.on("execute", () => {
|
|
462
|
+
editor.execute("heading", { value: option.model });
|
|
463
|
+
editor.editing.view.focus();
|
|
464
|
+
});
|
|
465
|
+
return view;
|
|
466
|
+
});
|
|
467
|
+
}
|
|
468
|
+
};
|
|
474
469
|
|
|
475
|
-
|
|
476
|
-
|
|
477
|
-
|
|
470
|
+
/**
|
|
471
|
+
* @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
|
|
472
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
473
|
+
*/
|
|
474
|
+
/**
|
|
475
|
+
* @module heading/title
|
|
476
|
+
*/
|
|
478
477
|
const titleLikeElements = new Set([
|
|
479
|
-
|
|
480
|
-
|
|
481
|
-
|
|
482
|
-
|
|
483
|
-
|
|
484
|
-
|
|
485
|
-
|
|
478
|
+
"paragraph",
|
|
479
|
+
"heading1",
|
|
480
|
+
"heading2",
|
|
481
|
+
"heading3",
|
|
482
|
+
"heading4",
|
|
483
|
+
"heading5",
|
|
484
|
+
"heading6"
|
|
486
485
|
]);
|
|
487
486
|
/**
|
|
488
|
-
|
|
489
|
-
|
|
490
|
-
|
|
491
|
-
|
|
492
|
-
|
|
493
|
-
|
|
494
|
-
|
|
495
|
-
|
|
496
|
-
|
|
497
|
-
|
|
498
|
-
|
|
499
|
-
|
|
500
|
-
|
|
501
|
-
|
|
502
|
-
|
|
503
|
-
|
|
504
|
-
|
|
505
|
-
|
|
506
|
-
|
|
507
|
-
|
|
508
|
-
|
|
509
|
-
|
|
510
|
-
|
|
511
|
-
|
|
512
|
-
|
|
513
|
-
|
|
514
|
-
|
|
515
|
-
|
|
516
|
-
|
|
517
|
-
|
|
518
|
-
|
|
519
|
-
|
|
520
|
-
|
|
521
|
-
|
|
522
|
-
|
|
523
|
-
|
|
524
|
-
|
|
525
|
-
|
|
526
|
-
|
|
527
|
-
|
|
528
|
-
|
|
529
|
-
|
|
530
|
-
|
|
531
|
-
|
|
532
|
-
|
|
533
|
-
|
|
534
|
-
|
|
535
|
-
|
|
536
|
-
|
|
537
|
-
|
|
538
|
-
|
|
539
|
-
|
|
540
|
-
|
|
541
|
-
|
|
542
|
-
|
|
543
|
-
|
|
544
|
-
|
|
545
|
-
|
|
546
|
-
|
|
547
|
-
|
|
548
|
-
|
|
549
|
-
|
|
550
|
-
|
|
551
|
-
|
|
552
|
-
|
|
553
|
-
|
|
554
|
-
|
|
555
|
-
|
|
556
|
-
|
|
557
|
-
|
|
558
|
-
|
|
559
|
-
|
|
560
|
-
|
|
561
|
-
|
|
562
|
-
|
|
563
|
-
|
|
564
|
-
|
|
565
|
-
|
|
566
|
-
|
|
567
|
-
|
|
568
|
-
|
|
569
|
-
|
|
570
|
-
|
|
571
|
-
|
|
572
|
-
|
|
573
|
-
|
|
574
|
-
|
|
575
|
-
|
|
576
|
-
|
|
577
|
-
|
|
578
|
-
|
|
579
|
-
|
|
580
|
-
|
|
581
|
-
|
|
582
|
-
|
|
583
|
-
|
|
584
|
-
|
|
585
|
-
|
|
586
|
-
|
|
587
|
-
|
|
588
|
-
|
|
589
|
-
|
|
590
|
-
|
|
591
|
-
|
|
592
|
-
|
|
593
|
-
|
|
594
|
-
|
|
595
|
-
|
|
596
|
-
|
|
597
|
-
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
|
|
601
|
-
|
|
602
|
-
|
|
603
|
-
|
|
604
|
-
|
|
605
|
-
|
|
606
|
-
|
|
607
|
-
|
|
608
|
-
|
|
609
|
-
|
|
610
|
-
|
|
611
|
-
|
|
612
|
-
|
|
613
|
-
|
|
614
|
-
|
|
615
|
-
|
|
616
|
-
|
|
617
|
-
|
|
618
|
-
|
|
619
|
-
|
|
620
|
-
|
|
621
|
-
|
|
622
|
-
|
|
623
|
-
|
|
624
|
-
|
|
625
|
-
|
|
626
|
-
|
|
627
|
-
|
|
628
|
-
|
|
629
|
-
|
|
630
|
-
|
|
631
|
-
|
|
632
|
-
|
|
633
|
-
|
|
634
|
-
|
|
635
|
-
|
|
636
|
-
|
|
637
|
-
|
|
638
|
-
|
|
639
|
-
|
|
640
|
-
|
|
641
|
-
|
|
642
|
-
|
|
643
|
-
|
|
644
|
-
|
|
645
|
-
|
|
646
|
-
|
|
647
|
-
|
|
648
|
-
|
|
649
|
-
|
|
650
|
-
|
|
651
|
-
|
|
652
|
-
|
|
653
|
-
|
|
654
|
-
|
|
655
|
-
|
|
656
|
-
|
|
657
|
-
|
|
658
|
-
|
|
659
|
-
|
|
660
|
-
|
|
661
|
-
|
|
662
|
-
|
|
663
|
-
|
|
664
|
-
|
|
665
|
-
|
|
666
|
-
|
|
667
|
-
|
|
668
|
-
|
|
669
|
-
|
|
670
|
-
|
|
671
|
-
|
|
672
|
-
|
|
673
|
-
|
|
674
|
-
|
|
675
|
-
|
|
676
|
-
|
|
677
|
-
|
|
678
|
-
|
|
679
|
-
|
|
680
|
-
|
|
681
|
-
|
|
682
|
-
|
|
683
|
-
|
|
684
|
-
|
|
685
|
-
|
|
686
|
-
|
|
687
|
-
|
|
688
|
-
|
|
689
|
-
|
|
690
|
-
|
|
691
|
-
|
|
692
|
-
|
|
693
|
-
|
|
694
|
-
|
|
695
|
-
|
|
696
|
-
|
|
697
|
-
|
|
698
|
-
|
|
699
|
-
|
|
700
|
-
|
|
701
|
-
|
|
702
|
-
|
|
703
|
-
|
|
704
|
-
|
|
705
|
-
|
|
706
|
-
|
|
707
|
-
|
|
708
|
-
|
|
709
|
-
|
|
710
|
-
|
|
711
|
-
|
|
712
|
-
|
|
713
|
-
|
|
714
|
-
|
|
715
|
-
|
|
716
|
-
|
|
717
|
-
|
|
718
|
-
|
|
719
|
-
|
|
720
|
-
|
|
721
|
-
|
|
722
|
-
|
|
723
|
-
|
|
724
|
-
|
|
725
|
-
|
|
726
|
-
|
|
727
|
-
|
|
728
|
-
|
|
729
|
-
|
|
730
|
-
|
|
731
|
-
|
|
732
|
-
|
|
733
|
-
|
|
734
|
-
|
|
735
|
-
|
|
736
|
-
|
|
737
|
-
|
|
738
|
-
|
|
739
|
-
|
|
740
|
-
|
|
741
|
-
|
|
742
|
-
|
|
743
|
-
|
|
744
|
-
|
|
745
|
-
|
|
746
|
-
|
|
747
|
-
|
|
748
|
-
|
|
749
|
-
|
|
750
|
-
|
|
751
|
-
|
|
752
|
-
|
|
753
|
-
|
|
754
|
-
|
|
755
|
-
|
|
756
|
-
|
|
757
|
-
|
|
758
|
-
|
|
759
|
-
|
|
760
|
-
|
|
761
|
-
|
|
762
|
-
|
|
763
|
-
|
|
764
|
-
|
|
765
|
-
|
|
766
|
-
|
|
767
|
-
|
|
768
|
-
|
|
769
|
-
|
|
770
|
-
|
|
771
|
-
|
|
772
|
-
|
|
773
|
-
|
|
774
|
-
|
|
775
|
-
|
|
776
|
-
|
|
777
|
-
|
|
778
|
-
|
|
779
|
-
|
|
780
|
-
|
|
781
|
-
|
|
782
|
-
|
|
783
|
-
|
|
784
|
-
|
|
785
|
-
|
|
786
|
-
|
|
787
|
-
|
|
788
|
-
|
|
789
|
-
|
|
790
|
-
|
|
791
|
-
|
|
792
|
-
|
|
793
|
-
|
|
794
|
-
|
|
795
|
-
|
|
796
|
-
|
|
797
|
-
|
|
798
|
-
|
|
799
|
-
|
|
800
|
-
|
|
801
|
-
|
|
802
|
-
|
|
803
|
-
|
|
804
|
-
|
|
805
|
-
|
|
806
|
-
|
|
807
|
-
|
|
808
|
-
|
|
809
|
-
|
|
810
|
-
*/ _attachPlaceholders() {
|
|
811
|
-
const editor = this.editor;
|
|
812
|
-
const t = editor.t;
|
|
813
|
-
const view = editor.editing.view;
|
|
814
|
-
const sourceElement = editor.sourceElement;
|
|
815
|
-
const titlePlaceholder = editor.config.get('title.placeholder') || t('Type your title');
|
|
816
|
-
// Attach placeholder to the view title element.
|
|
817
|
-
editor.editing.downcastDispatcher.on('insert:title-content', (evt, data, conversionApi)=>{
|
|
818
|
-
const element = conversionApi.mapper.toViewElement(data.item);
|
|
819
|
-
element.placeholder = titlePlaceholder;
|
|
820
|
-
enableViewPlaceholder({
|
|
821
|
-
view,
|
|
822
|
-
element,
|
|
823
|
-
keepOnFocus: true
|
|
824
|
-
});
|
|
825
|
-
});
|
|
826
|
-
// Attach placeholder to first element after a title element and remove it if it's not needed anymore.
|
|
827
|
-
// First element after title can change, so we need to observe all changes keep placeholder in sync.
|
|
828
|
-
const bodyViewElements = new Map();
|
|
829
|
-
// This post-fixer runs after the model post-fixer, so we can assume that the second child in view root will always exist.
|
|
830
|
-
view.document.registerPostFixer((writer)=>{
|
|
831
|
-
let hasChanged = false;
|
|
832
|
-
for (const viewRoot of view.document.roots){
|
|
833
|
-
// `viewRoot` can be empty despite the model post-fixers if the model root was detached.
|
|
834
|
-
if (viewRoot.isEmpty) {
|
|
835
|
-
continue;
|
|
836
|
-
}
|
|
837
|
-
// Skip roots whose schema does not support the title structure (custom/inline root).
|
|
838
|
-
// Their view root won't have the expected title+body layout.
|
|
839
|
-
// A title-allowed root always has a paragraph body placeholder created by `_fixBodyElement`,
|
|
840
|
-
// so the second view child is guaranteed to exist once this guard passes.
|
|
841
|
-
const modelRoot = editor.editing.mapper.toModelElement(viewRoot);
|
|
842
|
-
if (!editor.model.schema.checkChild(modelRoot, 'title')) {
|
|
843
|
-
continue;
|
|
844
|
-
}
|
|
845
|
-
const body = viewRoot.getChild(1);
|
|
846
|
-
const oldBody = bodyViewElements.get(viewRoot.rootName);
|
|
847
|
-
// If body element has changed we need to disable placeholder on the previous element and enable on the new one.
|
|
848
|
-
if (body !== oldBody) {
|
|
849
|
-
if (oldBody) {
|
|
850
|
-
hideViewPlaceholder(writer, oldBody);
|
|
851
|
-
writer.removeAttribute('data-placeholder', oldBody);
|
|
852
|
-
}
|
|
853
|
-
const bodyPlaceholder = editor.config.get('roots')[viewRoot.rootName]?.placeholder || isTextArea(sourceElement) && sourceElement.getAttribute('placeholder') || t('Type or paste your content here.');
|
|
854
|
-
writer.setAttribute('data-placeholder', bodyPlaceholder, body);
|
|
855
|
-
bodyViewElements.set(viewRoot.rootName, body);
|
|
856
|
-
hasChanged = true;
|
|
857
|
-
}
|
|
858
|
-
// Then we need to display placeholder if it is needed.
|
|
859
|
-
// See: https://github.com/ckeditor/ckeditor5/issues/8689.
|
|
860
|
-
if (needsViewPlaceholder(body, true) && viewRoot.childCount === 2 && body.name === 'p') {
|
|
861
|
-
hasChanged = showViewPlaceholder(writer, body) ? true : hasChanged;
|
|
862
|
-
} else {
|
|
863
|
-
// Or hide if it is not needed.
|
|
864
|
-
hasChanged = hideViewPlaceholder(writer, body) ? true : hasChanged;
|
|
865
|
-
}
|
|
866
|
-
}
|
|
867
|
-
return hasChanged;
|
|
868
|
-
});
|
|
869
|
-
}
|
|
870
|
-
/**
|
|
871
|
-
* Creates navigation between the title and body sections using <kbd>Tab</kbd> and <kbd>Shift</kbd>+<kbd>Tab</kbd> keys.
|
|
872
|
-
*/ _attachTabPressHandling() {
|
|
873
|
-
const editor = this.editor;
|
|
874
|
-
const model = editor.model;
|
|
875
|
-
// Pressing <kbd>Tab</kbd> inside the title should move the caret to the body.
|
|
876
|
-
editor.keystrokes.set('TAB', (data, cancel)=>{
|
|
877
|
-
model.change((writer)=>{
|
|
878
|
-
const selection = model.document.selection;
|
|
879
|
-
const selectedElements = Array.from(selection.getSelectedBlocks());
|
|
880
|
-
if (selectedElements.length === 1 && selectedElements[0].is('element', 'title-content')) {
|
|
881
|
-
const root = selection.getFirstPosition().root;
|
|
882
|
-
const firstBodyElement = root.getChild(1);
|
|
883
|
-
writer.setSelection(firstBodyElement, 0);
|
|
884
|
-
cancel();
|
|
885
|
-
}
|
|
886
|
-
});
|
|
887
|
-
});
|
|
888
|
-
// Pressing <kbd>Shift</kbd>+<kbd>Tab</kbd> at the beginning of the body should move the caret to the title.
|
|
889
|
-
editor.keystrokes.set('SHIFT + TAB', (data, cancel)=>{
|
|
890
|
-
model.change((writer)=>{
|
|
891
|
-
const selection = model.document.selection;
|
|
892
|
-
if (!selection.isCollapsed) {
|
|
893
|
-
return;
|
|
894
|
-
}
|
|
895
|
-
const selectedElement = first(selection.getSelectedBlocks());
|
|
896
|
-
const selectionPosition = selection.getFirstPosition();
|
|
897
|
-
const root = editor.model.document.getRoot(selectionPosition.root.rootName);
|
|
898
|
-
// Root does not support the title structure (custom/inline root) — no title to jump to.
|
|
899
|
-
if (!model.schema.checkChild(root, 'title')) {
|
|
900
|
-
return;
|
|
901
|
-
}
|
|
902
|
-
const title = root.getChild(0);
|
|
903
|
-
const body = root.getChild(1);
|
|
904
|
-
if (selectedElement === body && selectionPosition.isAtStart) {
|
|
905
|
-
writer.setSelection(title.getChild(0), 0);
|
|
906
|
-
cancel();
|
|
907
|
-
}
|
|
908
|
-
});
|
|
909
|
-
});
|
|
910
|
-
}
|
|
911
|
-
}
|
|
487
|
+
* The Title plugin.
|
|
488
|
+
*
|
|
489
|
+
* It splits the document into `Title` and `Body` sections.
|
|
490
|
+
*/
|
|
491
|
+
var Title = class extends Plugin {
|
|
492
|
+
/**
|
|
493
|
+
* A reference to an empty paragraph in the body
|
|
494
|
+
* created when there is no element in the body for the placeholder purposes.
|
|
495
|
+
*/
|
|
496
|
+
_bodyPlaceholder = /* @__PURE__ */ new Map();
|
|
497
|
+
/**
|
|
498
|
+
* @inheritDoc
|
|
499
|
+
*/
|
|
500
|
+
static get pluginName() {
|
|
501
|
+
return "Title";
|
|
502
|
+
}
|
|
503
|
+
/**
|
|
504
|
+
* @inheritDoc
|
|
505
|
+
*/
|
|
506
|
+
static get isOfficialPlugin() {
|
|
507
|
+
return true;
|
|
508
|
+
}
|
|
509
|
+
/**
|
|
510
|
+
* @inheritDoc
|
|
511
|
+
*/
|
|
512
|
+
static get requires() {
|
|
513
|
+
return [Paragraph];
|
|
514
|
+
}
|
|
515
|
+
/**
|
|
516
|
+
* @inheritDoc
|
|
517
|
+
*/
|
|
518
|
+
init() {
|
|
519
|
+
const editor = this.editor;
|
|
520
|
+
const model = editor.model;
|
|
521
|
+
model.schema.register("title", {
|
|
522
|
+
isBlock: true,
|
|
523
|
+
allowIn: "$root"
|
|
524
|
+
});
|
|
525
|
+
model.schema.register("title-content", {
|
|
526
|
+
isBlock: true,
|
|
527
|
+
allowIn: "title",
|
|
528
|
+
allowAttributes: ["alignment"]
|
|
529
|
+
});
|
|
530
|
+
model.schema.extend("$text", { allowIn: "title-content" });
|
|
531
|
+
model.schema.addAttributeCheck((context) => {
|
|
532
|
+
if (context.endsWith("title-content $text")) return false;
|
|
533
|
+
});
|
|
534
|
+
editor.editing.mapper.on("modelToViewPosition", mapModelPositionToView(editor.editing.view));
|
|
535
|
+
editor.data.mapper.on("modelToViewPosition", mapModelPositionToView(editor.editing.view));
|
|
536
|
+
editor.conversion.for("downcast").elementToElement({
|
|
537
|
+
model: "title-content",
|
|
538
|
+
view: "h1"
|
|
539
|
+
});
|
|
540
|
+
editor.conversion.for("downcast").add((dispatcher) => dispatcher.on("insert:title", (evt, data, conversionApi) => {
|
|
541
|
+
conversionApi.consumable.consume(data.item, evt.name);
|
|
542
|
+
}));
|
|
543
|
+
editor.data.upcastDispatcher.on("element:h1", dataViewModelH1Insertion, { priority: "high" });
|
|
544
|
+
editor.data.upcastDispatcher.on("element:h2", dataViewModelH1Insertion, { priority: "high" });
|
|
545
|
+
editor.data.upcastDispatcher.on("element:h3", dataViewModelH1Insertion, { priority: "high" });
|
|
546
|
+
model.document.registerPostFixer((writer) => this._fixTitleContent(writer));
|
|
547
|
+
model.document.registerPostFixer((writer) => this._fixTitleElement(writer));
|
|
548
|
+
model.document.registerPostFixer((writer) => this._fixBodyElement(writer));
|
|
549
|
+
model.document.registerPostFixer((writer) => this._fixExtraParagraph(writer));
|
|
550
|
+
this._attachPlaceholders();
|
|
551
|
+
this._attachTabPressHandling();
|
|
552
|
+
this._warnIfNoSupportedRoot();
|
|
553
|
+
}
|
|
554
|
+
/**
|
|
555
|
+
* Logs a single warning when none of the editor's roots can host the title structure. The Title feature
|
|
556
|
+
* only operates on roots whose `modelElement` is the default `$root`; roots configured with a custom
|
|
557
|
+
* `modelElement` are silently skipped at runtime. If no root supports the structure, the plugin is
|
|
558
|
+
* effectively a no-op and the integrator likely wants to know.
|
|
559
|
+
*/
|
|
560
|
+
_warnIfNoSupportedRoot() {
|
|
561
|
+
const model = this.editor.model;
|
|
562
|
+
for (const root of model.document.getRoots()) if (model.schema.checkChild(root, "title")) return;
|
|
563
|
+
/**
|
|
564
|
+
* The Title feature was loaded, but none of the editor's roots supports the `title` element. The feature
|
|
565
|
+
* only operates on roots whose `modelElement` is the default `$root`; roots configured with a custom
|
|
566
|
+
* `modelElement` (including `$inlineRoot`) are silently skipped, so `getTitle()` / `getBody()` fall back
|
|
567
|
+
* to the regular data getter and no title structure is ever inserted.
|
|
568
|
+
*
|
|
569
|
+
* To use the Title feature, ensure at least one root uses the default `$root` model element. Otherwise,
|
|
570
|
+
* remove the Title plugin from this editor's plugin list.
|
|
571
|
+
*
|
|
572
|
+
* @error title-no-supported-root
|
|
573
|
+
*/
|
|
574
|
+
logWarning("title-no-supported-root");
|
|
575
|
+
}
|
|
576
|
+
/**
|
|
577
|
+
* Returns the title of the document. Note that because this plugin does not allow any formatting inside
|
|
578
|
+
* the title element, the output of this method will be a plain text, with no HTML tags.
|
|
579
|
+
*
|
|
580
|
+
* It is not recommended to use this method together with features that insert markers to the
|
|
581
|
+
* data output, like comments or track changes features. If such markers start in the title and end in the
|
|
582
|
+
* body, the result of this method might be incorrect.
|
|
583
|
+
*
|
|
584
|
+
* @param options Additional configuration passed to the conversion process.
|
|
585
|
+
* See {@link module:engine/controller/datacontroller~DataController#get `DataController#get`}.
|
|
586
|
+
* @returns The title of the document.
|
|
587
|
+
*/
|
|
588
|
+
getTitle(options = {}) {
|
|
589
|
+
const rootName = options.rootName ? options.rootName : void 0;
|
|
590
|
+
const titleElement = this._getTitleElement(rootName);
|
|
591
|
+
if (!titleElement) return "";
|
|
592
|
+
const titleContentElement = titleElement.getChild(0);
|
|
593
|
+
return this.editor.data.stringify(titleContentElement, options);
|
|
594
|
+
}
|
|
595
|
+
/**
|
|
596
|
+
* Returns the body of the document.
|
|
597
|
+
*
|
|
598
|
+
* Note that it is not recommended to use this method together with features that insert markers to the
|
|
599
|
+
* data output, like comments or track changes features. If such markers start in the title and end in the
|
|
600
|
+
* body, the result of this method might be incorrect.
|
|
601
|
+
*
|
|
602
|
+
* @param options Additional configuration passed to the conversion process.
|
|
603
|
+
* See {@link module:engine/controller/datacontroller~DataController#get `DataController#get`}.
|
|
604
|
+
* @returns The body of the document.
|
|
605
|
+
*/
|
|
606
|
+
getBody(options = {}) {
|
|
607
|
+
const editor = this.editor;
|
|
608
|
+
const data = editor.data;
|
|
609
|
+
const model = editor.model;
|
|
610
|
+
const rootName = options.rootName ? options.rootName : void 0;
|
|
611
|
+
const root = editor.model.document.getRoot(rootName);
|
|
612
|
+
if (!model.schema.checkChild(root, "title")) return data.get({
|
|
613
|
+
...options,
|
|
614
|
+
rootName: root.rootName
|
|
615
|
+
});
|
|
616
|
+
const firstChild = root.getChild(0);
|
|
617
|
+
if (!firstChild || !firstChild.is("element", "title")) return "";
|
|
618
|
+
const view = editor.editing.view;
|
|
619
|
+
const viewWriter = new ViewDowncastWriter(view.document);
|
|
620
|
+
const rootRange = model.createRangeIn(root);
|
|
621
|
+
const viewDocumentFragment = viewWriter.createDocumentFragment();
|
|
622
|
+
const bodyStartPosition = model.createPositionAfter(firstChild);
|
|
623
|
+
const bodyRange = model.createRange(bodyStartPosition, model.createPositionAt(root, "end"));
|
|
624
|
+
const markers = /* @__PURE__ */ new Map();
|
|
625
|
+
for (const marker of model.markers) {
|
|
626
|
+
const intersection = bodyRange.getIntersection(marker.getRange());
|
|
627
|
+
if (intersection) markers.set(marker.name, intersection);
|
|
628
|
+
}
|
|
629
|
+
data.mapper.clearBindings();
|
|
630
|
+
data.mapper.bindElements(root, viewDocumentFragment);
|
|
631
|
+
data.downcastDispatcher.convert(rootRange, markers, viewWriter, options);
|
|
632
|
+
viewWriter.remove(viewWriter.createRangeOn(viewDocumentFragment.getChild(0)));
|
|
633
|
+
return editor.data.processor.toData(viewDocumentFragment);
|
|
634
|
+
}
|
|
635
|
+
/**
|
|
636
|
+
* Returns the `title` element when it is in the document. Returns `undefined` otherwise.
|
|
637
|
+
*/
|
|
638
|
+
_getTitleElement(rootName) {
|
|
639
|
+
const model = this.editor.model;
|
|
640
|
+
const root = model.document.getRoot(rootName);
|
|
641
|
+
if (!model.schema.checkChild(root, "title")) return;
|
|
642
|
+
for (const child of root.getChildren()) if (isTitle(child)) return child;
|
|
643
|
+
}
|
|
644
|
+
/**
|
|
645
|
+
* Model post-fixer callback that ensures that `title` has only one `title-content` child.
|
|
646
|
+
* All additional children should be moved after the `title` element and renamed to a paragraph.
|
|
647
|
+
*/
|
|
648
|
+
_fixTitleContent(writer) {
|
|
649
|
+
let changed = false;
|
|
650
|
+
for (const rootName of this.editor.model.document.getRootNames()) {
|
|
651
|
+
const title = this._getTitleElement(rootName);
|
|
652
|
+
if (!title || title.maxOffset === 1) continue;
|
|
653
|
+
const titleChildren = Array.from(title.getChildren());
|
|
654
|
+
titleChildren.shift();
|
|
655
|
+
for (const titleChild of titleChildren) {
|
|
656
|
+
writer.move(writer.createRangeOn(titleChild), title, "after");
|
|
657
|
+
writer.rename(titleChild, "paragraph");
|
|
658
|
+
}
|
|
659
|
+
changed = true;
|
|
660
|
+
}
|
|
661
|
+
return changed;
|
|
662
|
+
}
|
|
663
|
+
/**
|
|
664
|
+
* Model post-fixer callback that creates a title element when it is missing,
|
|
665
|
+
* takes care of the correct position of it and removes additional title elements.
|
|
666
|
+
*/
|
|
667
|
+
_fixTitleElement(writer) {
|
|
668
|
+
let changed = false;
|
|
669
|
+
const model = this.editor.model;
|
|
670
|
+
for (const modelRoot of this.editor.model.document.getRoots()) {
|
|
671
|
+
if (!model.schema.checkChild(modelRoot, "title")) continue;
|
|
672
|
+
const titleElements = Array.from(modelRoot.getChildren()).filter(isTitle);
|
|
673
|
+
const firstTitleElement = titleElements[0];
|
|
674
|
+
const firstRootChild = modelRoot.getChild(0);
|
|
675
|
+
if (firstRootChild.is("element", "title")) {
|
|
676
|
+
if (titleElements.length > 1) {
|
|
677
|
+
fixAdditionalTitleElements(titleElements, writer, model);
|
|
678
|
+
changed = true;
|
|
679
|
+
}
|
|
680
|
+
continue;
|
|
681
|
+
}
|
|
682
|
+
if (!firstTitleElement && !titleLikeElements.has(firstRootChild.name)) {
|
|
683
|
+
const title = writer.createElement("title");
|
|
684
|
+
writer.insert(title, modelRoot);
|
|
685
|
+
writer.insertElement("title-content", title);
|
|
686
|
+
changed = true;
|
|
687
|
+
continue;
|
|
688
|
+
}
|
|
689
|
+
if (titleLikeElements.has(firstRootChild.name)) changeElementToTitle(firstRootChild, writer, model);
|
|
690
|
+
else writer.move(writer.createRangeOn(firstTitleElement), modelRoot, 0);
|
|
691
|
+
fixAdditionalTitleElements(titleElements, writer, model);
|
|
692
|
+
changed = true;
|
|
693
|
+
}
|
|
694
|
+
return changed;
|
|
695
|
+
}
|
|
696
|
+
/**
|
|
697
|
+
* Model post-fixer callback that adds an empty paragraph at the end of the document
|
|
698
|
+
* when it is needed for the placeholder purposes.
|
|
699
|
+
*/
|
|
700
|
+
_fixBodyElement(writer) {
|
|
701
|
+
const schema = this.editor.model.schema;
|
|
702
|
+
let changed = false;
|
|
703
|
+
for (const rootName of this.editor.model.document.getRootNames()) {
|
|
704
|
+
const modelRoot = this.editor.model.document.getRoot(rootName);
|
|
705
|
+
if (modelRoot.childCount < 2 && schema.checkChild(modelRoot, "title")) {
|
|
706
|
+
const placeholder = writer.createElement("paragraph");
|
|
707
|
+
writer.insert(placeholder, modelRoot, 1);
|
|
708
|
+
this._bodyPlaceholder.set(rootName, placeholder);
|
|
709
|
+
changed = true;
|
|
710
|
+
}
|
|
711
|
+
}
|
|
712
|
+
return changed;
|
|
713
|
+
}
|
|
714
|
+
/**
|
|
715
|
+
* Model post-fixer callback that removes a paragraph from the end of the document
|
|
716
|
+
* if it was created for the placeholder purposes and is not needed anymore.
|
|
717
|
+
*/
|
|
718
|
+
_fixExtraParagraph(writer) {
|
|
719
|
+
let changed = false;
|
|
720
|
+
for (const rootName of this.editor.model.document.getRootNames()) {
|
|
721
|
+
const root = this.editor.model.document.getRoot(rootName);
|
|
722
|
+
const placeholder = this._bodyPlaceholder.get(rootName);
|
|
723
|
+
if (!placeholder) continue;
|
|
724
|
+
if (shouldRemoveLastParagraph(placeholder, root)) {
|
|
725
|
+
this._bodyPlaceholder.delete(rootName);
|
|
726
|
+
writer.remove(placeholder);
|
|
727
|
+
changed = true;
|
|
728
|
+
}
|
|
729
|
+
}
|
|
730
|
+
return changed;
|
|
731
|
+
}
|
|
732
|
+
/**
|
|
733
|
+
* Attaches the `Title` and `Body` placeholders to the title and/or content.
|
|
734
|
+
*/
|
|
735
|
+
_attachPlaceholders() {
|
|
736
|
+
const editor = this.editor;
|
|
737
|
+
const t = editor.t;
|
|
738
|
+
const view = editor.editing.view;
|
|
739
|
+
const sourceElement = editor.sourceElement;
|
|
740
|
+
const titlePlaceholder = editor.config.get("title.placeholder") || t("Type your title");
|
|
741
|
+
editor.editing.downcastDispatcher.on("insert:title-content", (evt, data, conversionApi) => {
|
|
742
|
+
const element = conversionApi.mapper.toViewElement(data.item);
|
|
743
|
+
element.placeholder = titlePlaceholder;
|
|
744
|
+
enableViewPlaceholder({
|
|
745
|
+
view,
|
|
746
|
+
element,
|
|
747
|
+
keepOnFocus: true
|
|
748
|
+
});
|
|
749
|
+
});
|
|
750
|
+
const bodyViewElements = /* @__PURE__ */ new Map();
|
|
751
|
+
view.document.registerPostFixer((writer) => {
|
|
752
|
+
let hasChanged = false;
|
|
753
|
+
for (const viewRoot of view.document.roots) {
|
|
754
|
+
if (viewRoot.isEmpty) continue;
|
|
755
|
+
const modelRoot = editor.editing.mapper.toModelElement(viewRoot);
|
|
756
|
+
if (!editor.model.schema.checkChild(modelRoot, "title")) continue;
|
|
757
|
+
const body = viewRoot.getChild(1);
|
|
758
|
+
const oldBody = bodyViewElements.get(viewRoot.rootName);
|
|
759
|
+
if (body !== oldBody) {
|
|
760
|
+
if (oldBody) {
|
|
761
|
+
hideViewPlaceholder(writer, oldBody);
|
|
762
|
+
writer.removeAttribute("data-placeholder", oldBody);
|
|
763
|
+
}
|
|
764
|
+
const bodyPlaceholder = editor.config.get("roots")[viewRoot.rootName]?.placeholder || isTextArea(sourceElement) && sourceElement.getAttribute("placeholder") || t("Type or paste your content here.");
|
|
765
|
+
writer.setAttribute("data-placeholder", bodyPlaceholder, body);
|
|
766
|
+
bodyViewElements.set(viewRoot.rootName, body);
|
|
767
|
+
hasChanged = true;
|
|
768
|
+
}
|
|
769
|
+
if (needsViewPlaceholder(body, true) && viewRoot.childCount === 2 && body.name === "p") hasChanged = showViewPlaceholder(writer, body) ? true : hasChanged;
|
|
770
|
+
else hasChanged = hideViewPlaceholder(writer, body) ? true : hasChanged;
|
|
771
|
+
}
|
|
772
|
+
return hasChanged;
|
|
773
|
+
});
|
|
774
|
+
}
|
|
775
|
+
/**
|
|
776
|
+
* Creates navigation between the title and body sections using <kbd>Tab</kbd> and <kbd>Shift</kbd>+<kbd>Tab</kbd> keys.
|
|
777
|
+
*/
|
|
778
|
+
_attachTabPressHandling() {
|
|
779
|
+
const editor = this.editor;
|
|
780
|
+
const model = editor.model;
|
|
781
|
+
editor.keystrokes.set("TAB", (data, cancel) => {
|
|
782
|
+
model.change((writer) => {
|
|
783
|
+
const selection = model.document.selection;
|
|
784
|
+
const selectedElements = Array.from(selection.getSelectedBlocks());
|
|
785
|
+
if (selectedElements.length === 1 && selectedElements[0].is("element", "title-content")) {
|
|
786
|
+
const firstBodyElement = selection.getFirstPosition().root.getChild(1);
|
|
787
|
+
writer.setSelection(firstBodyElement, 0);
|
|
788
|
+
cancel();
|
|
789
|
+
}
|
|
790
|
+
});
|
|
791
|
+
});
|
|
792
|
+
editor.keystrokes.set("SHIFT + TAB", (data, cancel) => {
|
|
793
|
+
model.change((writer) => {
|
|
794
|
+
const selection = model.document.selection;
|
|
795
|
+
if (!selection.isCollapsed) return;
|
|
796
|
+
const selectedElement = first(selection.getSelectedBlocks());
|
|
797
|
+
const selectionPosition = selection.getFirstPosition();
|
|
798
|
+
const root = editor.model.document.getRoot(selectionPosition.root.rootName);
|
|
799
|
+
if (!model.schema.checkChild(root, "title")) return;
|
|
800
|
+
const title = root.getChild(0);
|
|
801
|
+
if (selectedElement === root.getChild(1) && selectionPosition.isAtStart) {
|
|
802
|
+
writer.setSelection(title.getChild(0), 0);
|
|
803
|
+
cancel();
|
|
804
|
+
}
|
|
805
|
+
});
|
|
806
|
+
});
|
|
807
|
+
}
|
|
808
|
+
};
|
|
912
809
|
/**
|
|
913
|
-
|
|
914
|
-
|
|
915
|
-
|
|
916
|
-
|
|
917
|
-
|
|
918
|
-
|
|
919
|
-
|
|
920
|
-
|
|
921
|
-
|
|
922
|
-
|
|
923
|
-
|
|
924
|
-
|
|
925
|
-
|
|
926
|
-
|
|
927
|
-
|
|
928
|
-
|
|
929
|
-
|
|
930
|
-
|
|
931
|
-
|
|
932
|
-
|
|
933
|
-
|
|
934
|
-
|
|
935
|
-
}
|
|
936
|
-
const modelWriter = conversionApi.writer;
|
|
937
|
-
const title = modelWriter.createElement('title');
|
|
938
|
-
const titleContent = modelWriter.createElement('title-content');
|
|
939
|
-
modelWriter.append(titleContent, title);
|
|
940
|
-
modelWriter.insert(title, modelCursor);
|
|
941
|
-
conversionApi.convertChildren(viewItem, titleContent);
|
|
942
|
-
conversionApi.updateConversionResult(title, data);
|
|
810
|
+
* A view-to-model converter for the h1 that appears at the beginning of the document (a title element).
|
|
811
|
+
*
|
|
812
|
+
* Matches only the synthetic upcast parent named `$root` (the default generic root element). Title is not supported
|
|
813
|
+
* for roots whose `modelElement` is customized, so this converter intentionally does not fire on them.
|
|
814
|
+
*
|
|
815
|
+
* @see module:engine/conversion/upcastdispatcher~UpcastDispatcher#event:element
|
|
816
|
+
* @param evt An object containing information about the fired event.
|
|
817
|
+
* @param data An object containing conversion input, a placeholder for conversion output and possibly other values.
|
|
818
|
+
* @param conversionApi Conversion interface to be used by the callback.
|
|
819
|
+
*/
|
|
820
|
+
function dataViewModelH1Insertion(evt, data, conversionApi) {
|
|
821
|
+
const modelCursor = data.modelCursor;
|
|
822
|
+
const viewItem = data.viewItem;
|
|
823
|
+
if (!modelCursor.isAtStart || !modelCursor.parent.is("element", "$root")) return;
|
|
824
|
+
if (!conversionApi.consumable.consume(viewItem, { name: true })) return;
|
|
825
|
+
const modelWriter = conversionApi.writer;
|
|
826
|
+
const title = modelWriter.createElement("title");
|
|
827
|
+
const titleContent = modelWriter.createElement("title-content");
|
|
828
|
+
modelWriter.append(titleContent, title);
|
|
829
|
+
modelWriter.insert(title, modelCursor);
|
|
830
|
+
conversionApi.convertChildren(viewItem, titleContent);
|
|
831
|
+
conversionApi.updateConversionResult(title, data);
|
|
943
832
|
}
|
|
944
833
|
/**
|
|
945
|
-
|
|
946
|
-
|
|
947
|
-
|
|
948
|
-
|
|
949
|
-
|
|
950
|
-
|
|
951
|
-
|
|
952
|
-
|
|
953
|
-
|
|
954
|
-
|
|
955
|
-
|
|
956
|
-
|
|
957
|
-
|
|
958
|
-
|
|
959
|
-
|
|
960
|
-
};
|
|
834
|
+
* Maps position from the beginning of the model `title` element to the beginning of the view `h1` element.
|
|
835
|
+
*
|
|
836
|
+
* ```html
|
|
837
|
+
* <title>^<title-content>Foo</title-content></title> -> <h1>^Foo</h1>
|
|
838
|
+
* ```
|
|
839
|
+
*/
|
|
840
|
+
function mapModelPositionToView(editingView) {
|
|
841
|
+
return (evt, data) => {
|
|
842
|
+
const positionParent = data.modelPosition.parent;
|
|
843
|
+
if (!positionParent.is("element", "title")) return;
|
|
844
|
+
const modelTitleElement = positionParent.parent;
|
|
845
|
+
const viewElement = data.mapper.toViewElement(modelTitleElement);
|
|
846
|
+
data.viewPosition = editingView.createPositionAt(viewElement, 0);
|
|
847
|
+
evt.stop();
|
|
848
|
+
};
|
|
961
849
|
}
|
|
962
850
|
/**
|
|
963
|
-
|
|
964
|
-
|
|
965
|
-
|
|
851
|
+
* @returns Returns true when given element is a title. Returns false otherwise.
|
|
852
|
+
*/
|
|
853
|
+
function isTitle(element) {
|
|
854
|
+
return element.is("element", "title");
|
|
966
855
|
}
|
|
967
856
|
/**
|
|
968
|
-
|
|
969
|
-
|
|
970
|
-
|
|
971
|
-
|
|
972
|
-
|
|
973
|
-
|
|
974
|
-
|
|
975
|
-
|
|
976
|
-
], writer);
|
|
857
|
+
* Changes the given element to the title element.
|
|
858
|
+
*/
|
|
859
|
+
function changeElementToTitle(element, writer, model) {
|
|
860
|
+
const title = writer.createElement("title");
|
|
861
|
+
writer.insert(title, element, "before");
|
|
862
|
+
writer.insert(element, title, 0);
|
|
863
|
+
writer.rename(element, "title-content");
|
|
864
|
+
model.schema.removeDisallowedAttributes([element], writer);
|
|
977
865
|
}
|
|
978
866
|
/**
|
|
979
|
-
|
|
980
|
-
|
|
981
|
-
|
|
982
|
-
|
|
983
|
-
|
|
984
|
-
|
|
985
|
-
|
|
986
|
-
|
|
987
|
-
|
|
988
|
-
|
|
989
|
-
|
|
990
|
-
return hasChanged;
|
|
867
|
+
* Loops over the list of title elements and fixes additional ones.
|
|
868
|
+
*
|
|
869
|
+
* @returns Returns true when there was any change. Returns false otherwise.
|
|
870
|
+
*/
|
|
871
|
+
function fixAdditionalTitleElements(titleElements, writer, model) {
|
|
872
|
+
let hasChanged = false;
|
|
873
|
+
for (const title of titleElements) if (title.index !== 0) {
|
|
874
|
+
fixTitleElement(title, writer, model);
|
|
875
|
+
hasChanged = true;
|
|
876
|
+
}
|
|
877
|
+
return hasChanged;
|
|
991
878
|
}
|
|
992
879
|
/**
|
|
993
|
-
|
|
994
|
-
|
|
995
|
-
|
|
996
|
-
|
|
997
|
-
|
|
998
|
-
|
|
999
|
-
|
|
1000
|
-
|
|
1001
|
-
|
|
1002
|
-
|
|
1003
|
-
|
|
1004
|
-
|
|
1005
|
-
model.schema.removeDisallowedAttributes([
|
|
1006
|
-
child
|
|
1007
|
-
], writer);
|
|
880
|
+
* Changes given title element to a paragraph or removes it when it is empty.
|
|
881
|
+
*/
|
|
882
|
+
function fixTitleElement(title, writer, model) {
|
|
883
|
+
const child = title.getChild(0);
|
|
884
|
+
if (child.isEmpty) {
|
|
885
|
+
writer.remove(title);
|
|
886
|
+
return;
|
|
887
|
+
}
|
|
888
|
+
writer.move(writer.createRangeOn(child), title, "before");
|
|
889
|
+
writer.rename(child, "paragraph");
|
|
890
|
+
writer.remove(title);
|
|
891
|
+
model.schema.removeDisallowedAttributes([child], writer);
|
|
1008
892
|
}
|
|
1009
893
|
/**
|
|
1010
|
-
|
|
1011
|
-
|
|
1012
|
-
|
|
1013
|
-
|
|
1014
|
-
|
|
1015
|
-
|
|
1016
|
-
|
|
1017
|
-
return false;
|
|
1018
|
-
}
|
|
1019
|
-
return true;
|
|
894
|
+
* Returns true when the last paragraph in the document was created only for the placeholder
|
|
895
|
+
* purpose and it's not needed anymore. Returns false otherwise.
|
|
896
|
+
*/
|
|
897
|
+
function shouldRemoveLastParagraph(placeholder, root) {
|
|
898
|
+
if (!placeholder.is("element", "paragraph") || placeholder.childCount) return false;
|
|
899
|
+
if (root.childCount <= 2 || root.getChild(root.childCount - 1) !== placeholder) return false;
|
|
900
|
+
return true;
|
|
1020
901
|
}
|
|
1021
902
|
/**
|
|
1022
|
-
|
|
1023
|
-
|
|
1024
|
-
|
|
903
|
+
* Returns true when given element is a DOM textarea.
|
|
904
|
+
*/
|
|
905
|
+
function isTextArea(sourceElement) {
|
|
906
|
+
return !!sourceElement && sourceElement.tagName.toLowerCase() === "textarea";
|
|
1025
907
|
}
|
|
1026
908
|
|
|
909
|
+
/**
|
|
910
|
+
* @license Copyright (c) 2003-2026, CKSource Holding sp. z o.o. All rights reserved.
|
|
911
|
+
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-licensing-options
|
|
912
|
+
*/
|
|
913
|
+
|
|
1027
914
|
export { Heading, HeadingButtonsUI, HeadingCommand, HeadingEditing, HeadingUI, Title, getLocalizedOptions as _getLocalizedHeadingOptions };
|
|
1028
|
-
//# sourceMappingURL=index.js.map
|
|
915
|
+
//# sourceMappingURL=index.js.map
|