@ckeditor/ckeditor5-ui 40.0.0 → 40.1.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/LICENSE.md +3 -3
- package/lang/translations/pt-br.po +1 -1
- package/lang/translations/ug.po +26 -26
- package/package.json +3 -3
- package/src/arialiveannouncer.d.ts +94 -0
- package/src/arialiveannouncer.js +113 -0
- package/src/augmentation.d.ts +86 -86
- package/src/augmentation.js +5 -5
- package/src/autocomplete/autocompleteview.d.ts +81 -81
- package/src/autocomplete/autocompleteview.js +153 -146
- package/src/bindings/addkeyboardhandlingforgrid.d.ts +27 -27
- package/src/bindings/addkeyboardhandlingforgrid.js +107 -107
- package/src/bindings/clickoutsidehandler.d.ts +28 -28
- package/src/bindings/clickoutsidehandler.js +36 -36
- package/src/bindings/csstransitiondisablermixin.d.ts +40 -40
- package/src/bindings/csstransitiondisablermixin.js +55 -55
- package/src/bindings/injectcsstransitiondisabler.d.ts +59 -59
- package/src/bindings/injectcsstransitiondisabler.js +71 -71
- package/src/bindings/preventdefault.d.ts +33 -33
- package/src/bindings/preventdefault.js +34 -34
- package/src/bindings/submithandler.d.ts +57 -57
- package/src/bindings/submithandler.js +47 -47
- package/src/button/button.d.ts +172 -178
- package/src/button/button.js +5 -5
- package/src/button/buttonlabel.d.ts +34 -34
- package/src/button/buttonlabel.js +5 -5
- package/src/button/buttonlabelview.d.ts +31 -31
- package/src/button/buttonlabelview.js +42 -42
- package/src/button/buttonview.d.ts +181 -185
- package/src/button/buttonview.js +217 -219
- package/src/button/switchbuttonview.d.ts +45 -45
- package/src/button/switchbuttonview.js +75 -75
- package/src/colorgrid/colorgridview.d.ts +132 -132
- package/src/colorgrid/colorgridview.js +124 -124
- package/src/colorgrid/colortileview.d.ts +28 -28
- package/src/colorgrid/colortileview.js +40 -40
- package/src/colorgrid/utils.d.ts +47 -47
- package/src/colorgrid/utils.js +84 -84
- package/src/colorpicker/colorpickerview.d.ts +137 -137
- package/src/colorpicker/colorpickerview.js +270 -270
- package/src/colorpicker/utils.d.ts +43 -43
- package/src/colorpicker/utils.js +99 -99
- package/src/colorselector/colorgridsfragmentview.d.ts +194 -194
- package/src/colorselector/colorgridsfragmentview.js +289 -289
- package/src/colorselector/colorpickerfragmentview.d.ts +128 -128
- package/src/colorselector/colorpickerfragmentview.js +205 -205
- package/src/colorselector/colorselectorview.d.ts +242 -242
- package/src/colorselector/colorselectorview.js +256 -256
- package/src/colorselector/documentcolorcollection.d.ts +70 -70
- package/src/colorselector/documentcolorcollection.js +42 -42
- package/src/componentfactory.d.ts +81 -81
- package/src/componentfactory.js +104 -104
- package/src/dropdown/button/dropdownbutton.d.ts +25 -25
- package/src/dropdown/button/dropdownbutton.js +5 -5
- package/src/dropdown/button/dropdownbuttonview.d.ts +48 -48
- package/src/dropdown/button/dropdownbuttonview.js +66 -66
- package/src/dropdown/button/splitbuttonview.d.ts +161 -161
- package/src/dropdown/button/splitbuttonview.js +152 -152
- package/src/dropdown/dropdownpanelfocusable.d.ts +21 -21
- package/src/dropdown/dropdownpanelfocusable.js +5 -5
- package/src/dropdown/dropdownpanelview.d.ts +62 -62
- package/src/dropdown/dropdownpanelview.js +97 -97
- package/src/dropdown/dropdownview.d.ts +315 -315
- package/src/dropdown/dropdownview.js +379 -379
- package/src/dropdown/utils.d.ts +235 -235
- package/src/dropdown/utils.js +463 -458
- package/src/editableui/editableuiview.d.ts +72 -72
- package/src/editableui/editableuiview.js +112 -112
- package/src/editableui/inline/inlineeditableuiview.d.ts +40 -40
- package/src/editableui/inline/inlineeditableuiview.js +48 -48
- package/src/editorui/bodycollection.d.ts +55 -55
- package/src/editorui/bodycollection.js +84 -84
- package/src/editorui/boxed/boxededitoruiview.d.ts +40 -40
- package/src/editorui/boxed/boxededitoruiview.js +81 -81
- package/src/editorui/editorui.d.ts +288 -282
- package/src/editorui/editorui.js +412 -410
- package/src/editorui/editoruiview.d.ts +39 -39
- package/src/editorui/editoruiview.js +38 -38
- package/src/editorui/poweredby.d.ts +71 -71
- package/src/editorui/poweredby.js +276 -276
- package/src/focuscycler.d.ts +226 -226
- package/src/focuscycler.js +245 -245
- package/src/formheader/formheaderview.d.ts +59 -59
- package/src/formheader/formheaderview.js +69 -69
- package/src/highlightedtext/highlightedtextview.d.ts +38 -38
- package/src/highlightedtext/highlightedtextview.js +102 -102
- package/src/icon/iconview.d.ts +85 -85
- package/src/icon/iconview.js +114 -114
- package/src/iframe/iframeview.d.ts +50 -50
- package/src/iframe/iframeview.js +63 -63
- package/src/index.d.ts +73 -73
- package/src/index.js +70 -70
- package/src/input/inputbase.d.ts +107 -107
- package/src/input/inputbase.js +110 -110
- package/src/input/inputview.d.ts +36 -36
- package/src/input/inputview.js +24 -24
- package/src/inputnumber/inputnumberview.d.ts +49 -49
- package/src/inputnumber/inputnumberview.js +40 -40
- package/src/inputtext/inputtextview.d.ts +18 -18
- package/src/inputtext/inputtextview.js +27 -27
- package/src/label/labelview.d.ts +36 -36
- package/src/label/labelview.js +41 -41
- package/src/labeledfield/labeledfieldview.d.ts +187 -187
- package/src/labeledfield/labeledfieldview.js +157 -157
- package/src/labeledfield/utils.d.ts +123 -123
- package/src/labeledfield/utils.js +176 -176
- package/src/labeledinput/labeledinputview.d.ts +125 -125
- package/src/labeledinput/labeledinputview.js +125 -125
- package/src/list/listitemgroupview.d.ts +59 -51
- package/src/list/listitemgroupview.js +63 -75
- package/src/list/listitemview.d.ts +36 -36
- package/src/list/listitemview.js +42 -42
- package/src/list/listseparatorview.d.ts +18 -18
- package/src/list/listseparatorview.js +28 -28
- package/src/list/listview.d.ts +122 -122
- package/src/list/listview.js +187 -187
- package/src/model.d.ts +22 -22
- package/src/model.js +31 -31
- package/src/notification/notification.d.ts +211 -211
- package/src/notification/notification.js +187 -187
- package/src/panel/balloon/balloonpanelview.d.ts +685 -685
- package/src/panel/balloon/balloonpanelview.js +1010 -1010
- package/src/panel/balloon/contextualballoon.d.ts +299 -299
- package/src/panel/balloon/contextualballoon.js +572 -572
- package/src/panel/sticky/stickypanelview.d.ts +156 -156
- package/src/panel/sticky/stickypanelview.js +234 -234
- package/src/search/filteredview.d.ts +31 -31
- package/src/search/filteredview.js +5 -5
- package/src/search/searchinfoview.d.ts +45 -45
- package/src/search/searchinfoview.js +59 -59
- package/src/search/searchresultsview.d.ts +54 -54
- package/src/search/searchresultsview.js +65 -65
- package/src/search/text/searchtextqueryview.d.ts +76 -76
- package/src/search/text/searchtextqueryview.js +75 -75
- package/src/search/text/searchtextview.d.ts +219 -219
- package/src/search/text/searchtextview.js +201 -201
- package/src/spinner/spinnerview.d.ts +25 -25
- package/src/spinner/spinnerview.js +38 -38
- package/src/template.d.ts +942 -942
- package/src/template.js +1294 -1294
- package/src/textarea/textareaview.d.ts +88 -88
- package/src/textarea/textareaview.js +142 -140
- package/src/toolbar/balloon/balloontoolbar.d.ts +122 -122
- package/src/toolbar/balloon/balloontoolbar.js +300 -300
- package/src/toolbar/block/blockbuttonview.d.ts +35 -35
- package/src/toolbar/block/blockbuttonview.js +41 -41
- package/src/toolbar/block/blocktoolbar.d.ts +161 -161
- package/src/toolbar/block/blocktoolbar.js +395 -395
- package/src/toolbar/normalizetoolbarconfig.d.ts +40 -40
- package/src/toolbar/normalizetoolbarconfig.js +52 -51
- package/src/toolbar/toolbarlinebreakview.d.ts +18 -18
- package/src/toolbar/toolbarlinebreakview.js +28 -28
- package/src/toolbar/toolbarseparatorview.d.ts +18 -18
- package/src/toolbar/toolbarseparatorview.js +28 -28
- package/src/toolbar/toolbarview.d.ts +266 -266
- package/src/toolbar/toolbarview.js +719 -719
- package/src/tooltipmanager.d.ts +180 -180
- package/src/tooltipmanager.js +353 -353
- package/src/view.d.ts +422 -422
- package/src/view.js +396 -396
- package/src/viewcollection.d.ts +139 -139
- package/src/viewcollection.js +206 -206
- package/theme/components/arialiveannouncer/arialiveannouncer.css +10 -0
- package/theme/components/button/button.css +9 -1
- package/theme/components/formheader/formheader.css +0 -4
package/src/viewcollection.js
CHANGED
|
@@ -1,206 +1,206 @@
|
|
|
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 ui/viewcollection
|
|
7
|
-
*/
|
|
8
|
-
import { CKEditorError, Collection } from '@ckeditor/ckeditor5-utils';
|
|
9
|
-
/**
|
|
10
|
-
* Collects {@link module:ui/view~View} instances.
|
|
11
|
-
*
|
|
12
|
-
* ```ts
|
|
13
|
-
* const parentView = new ParentView( locale );
|
|
14
|
-
* const collection = new ViewCollection( locale );
|
|
15
|
-
*
|
|
16
|
-
* collection.setParent( parentView.element );
|
|
17
|
-
*
|
|
18
|
-
* const viewA = new ChildView( locale );
|
|
19
|
-
* const viewB = new ChildView( locale );
|
|
20
|
-
* ```
|
|
21
|
-
*
|
|
22
|
-
* View collection renders and manages view {@link module:ui/view~View#element elements}:
|
|
23
|
-
*
|
|
24
|
-
* ```ts
|
|
25
|
-
* collection.add( viewA );
|
|
26
|
-
* collection.add( viewB );
|
|
27
|
-
*
|
|
28
|
-
* console.log( parentView.element.firsChild ); // -> viewA.element
|
|
29
|
-
* console.log( parentView.element.lastChild ); // -> viewB.element
|
|
30
|
-
* ```
|
|
31
|
-
*
|
|
32
|
-
* It {@link module:ui/viewcollection~ViewCollection#delegate propagates} DOM events too:
|
|
33
|
-
*
|
|
34
|
-
* ```ts
|
|
35
|
-
* // Delegate #click and #keydown events from viewA and viewB to the parentView.
|
|
36
|
-
* collection.delegate( 'click' ).to( parentView );
|
|
37
|
-
*
|
|
38
|
-
* parentView.on( 'click', ( evt ) => {
|
|
39
|
-
* console.log( `${ evt.source } has been clicked.` );
|
|
40
|
-
* } );
|
|
41
|
-
*
|
|
42
|
-
* // This event will be delegated to the parentView.
|
|
43
|
-
* viewB.fire( 'click' );
|
|
44
|
-
* ```
|
|
45
|
-
*
|
|
46
|
-
* **Note**: A view collection can be used directly in the {@link module:ui/template~TemplateDefinition definition}
|
|
47
|
-
* of a {@link module:ui/template~Template template}.
|
|
48
|
-
*/
|
|
49
|
-
export default class ViewCollection extends Collection {
|
|
50
|
-
/**
|
|
51
|
-
* Creates a new instance of the {@link module:ui/viewcollection~ViewCollection}.
|
|
52
|
-
*
|
|
53
|
-
* @param initialItems The initial items of the collection.
|
|
54
|
-
*/
|
|
55
|
-
constructor(initialItems = []) {
|
|
56
|
-
super(initialItems, {
|
|
57
|
-
// An #id Number attribute should be legal and not break the `ViewCollection` instance.
|
|
58
|
-
// https://github.com/ckeditor/ckeditor5-ui/issues/93
|
|
59
|
-
idProperty: 'viewUid'
|
|
60
|
-
});
|
|
61
|
-
// Handle {@link module:ui/view~View#element} in DOM when a new view is added to the collection.
|
|
62
|
-
this.on('add', (evt, view, index) => {
|
|
63
|
-
this._renderViewIntoCollectionParent(view, index);
|
|
64
|
-
});
|
|
65
|
-
// Handle {@link module:ui/view~View#element} in DOM when a view is removed from the collection.
|
|
66
|
-
this.on('remove', (evt, view) => {
|
|
67
|
-
if (view.element && this._parentElement) {
|
|
68
|
-
view.element.remove();
|
|
69
|
-
}
|
|
70
|
-
});
|
|
71
|
-
this._parentElement = null;
|
|
72
|
-
}
|
|
73
|
-
/**
|
|
74
|
-
* Destroys the view collection along with child views.
|
|
75
|
-
* See the view {@link module:ui/view~View#destroy} method.
|
|
76
|
-
*/
|
|
77
|
-
destroy() {
|
|
78
|
-
this.map(view => view.destroy());
|
|
79
|
-
}
|
|
80
|
-
/**
|
|
81
|
-
* Sets the parent HTML element of this collection. When parent is set, {@link #add adding} and
|
|
82
|
-
* {@link #remove removing} views in the collection synchronizes their
|
|
83
|
-
* {@link module:ui/view~View#element elements} in the parent element.
|
|
84
|
-
*
|
|
85
|
-
* @param element A new parent element.
|
|
86
|
-
*/
|
|
87
|
-
setParent(elementOrDocFragment) {
|
|
88
|
-
this._parentElement = elementOrDocFragment;
|
|
89
|
-
// Take care of the initial collection items passed to the constructor.
|
|
90
|
-
for (const view of this) {
|
|
91
|
-
this._renderViewIntoCollectionParent(view);
|
|
92
|
-
}
|
|
93
|
-
}
|
|
94
|
-
/**
|
|
95
|
-
* Delegates selected events coming from within views in the collection to any
|
|
96
|
-
* {@link module:utils/emittermixin~Emitter}.
|
|
97
|
-
*
|
|
98
|
-
* For the following views and collection:
|
|
99
|
-
*
|
|
100
|
-
* ```ts
|
|
101
|
-
* const viewA = new View();
|
|
102
|
-
* const viewB = new View();
|
|
103
|
-
* const viewC = new View();
|
|
104
|
-
*
|
|
105
|
-
* const views = parentView.createCollection();
|
|
106
|
-
*
|
|
107
|
-
* views.delegate( 'eventX' ).to( viewB );
|
|
108
|
-
* views.delegate( 'eventX', 'eventY' ).to( viewC );
|
|
109
|
-
*
|
|
110
|
-
* views.add( viewA );
|
|
111
|
-
* ```
|
|
112
|
-
*
|
|
113
|
-
* the `eventX` is delegated (fired by) `viewB` and `viewC` along with `customData`:
|
|
114
|
-
*
|
|
115
|
-
* ```ts
|
|
116
|
-
* viewA.fire( 'eventX', customData );
|
|
117
|
-
* ```
|
|
118
|
-
*
|
|
119
|
-
* and `eventY` is delegated (fired by) `viewC` along with `customData`:
|
|
120
|
-
*
|
|
121
|
-
* ```ts
|
|
122
|
-
* viewA.fire( 'eventY', customData );
|
|
123
|
-
* ```
|
|
124
|
-
*
|
|
125
|
-
* See {@link module:utils/emittermixin~Emitter#delegate}.
|
|
126
|
-
*
|
|
127
|
-
* @param events {@link module:ui/view~View} event names to be delegated to another
|
|
128
|
-
* {@link module:utils/emittermixin~Emitter}.
|
|
129
|
-
* @returns Object with `to` property, a function which accepts the destination
|
|
130
|
-
* of {@link module:utils/emittermixin~Emitter#delegate delegated} events.
|
|
131
|
-
*/
|
|
132
|
-
delegate(...events) {
|
|
133
|
-
if (!events.length || !isStringArray(events)) {
|
|
134
|
-
/**
|
|
135
|
-
* All event names must be strings.
|
|
136
|
-
*
|
|
137
|
-
* @error ui-viewcollection-delegate-wrong-events
|
|
138
|
-
*/
|
|
139
|
-
throw new CKEditorError('ui-viewcollection-delegate-wrong-events', this);
|
|
140
|
-
}
|
|
141
|
-
return {
|
|
142
|
-
to: dest => {
|
|
143
|
-
// Activate delegating on existing views in this collection.
|
|
144
|
-
for (const view of this) {
|
|
145
|
-
for (const evtName of events) {
|
|
146
|
-
view.delegate(evtName).to(dest);
|
|
147
|
-
}
|
|
148
|
-
}
|
|
149
|
-
// Activate delegating on future views in this collection.
|
|
150
|
-
this.on('add', (evt, view) => {
|
|
151
|
-
for (const evtName of events) {
|
|
152
|
-
view.delegate(evtName).to(dest);
|
|
153
|
-
}
|
|
154
|
-
});
|
|
155
|
-
// Deactivate delegating when view is removed from this collection.
|
|
156
|
-
this.on('remove', (evt, view) => {
|
|
157
|
-
for (const evtName of events) {
|
|
158
|
-
view.stopDelegating(evtName, dest);
|
|
159
|
-
}
|
|
160
|
-
});
|
|
161
|
-
}
|
|
162
|
-
};
|
|
163
|
-
}
|
|
164
|
-
/**
|
|
165
|
-
* This method {@link module:ui/view~View#render renders} a new view added to the collection.
|
|
166
|
-
*
|
|
167
|
-
* If the {@link #_parentElement parent element} of the collection is set, this method also adds
|
|
168
|
-
* the view's {@link module:ui/view~View#element} as a child of the parent in DOM at a specified index.
|
|
169
|
-
*
|
|
170
|
-
* **Note**: If index is not specified, the view's element is pushed as the last child
|
|
171
|
-
* of the parent element.
|
|
172
|
-
*
|
|
173
|
-
* @param view A new view added to the collection.
|
|
174
|
-
* @param index An index the view holds in the collection. When not specified,
|
|
175
|
-
* the view is added at the end.
|
|
176
|
-
*/
|
|
177
|
-
_renderViewIntoCollectionParent(view, index) {
|
|
178
|
-
if (!view.isRendered) {
|
|
179
|
-
view.render();
|
|
180
|
-
}
|
|
181
|
-
if (view.element && this._parentElement) {
|
|
182
|
-
this._parentElement.insertBefore(view.element, this._parentElement.children[index]);
|
|
183
|
-
}
|
|
184
|
-
}
|
|
185
|
-
/**
|
|
186
|
-
* Removes a child view from the collection. If the {@link #setParent parent element} of the
|
|
187
|
-
* collection has been set, the {@link module:ui/view~View#element element} of the view is also removed
|
|
188
|
-
* in DOM, reflecting the order of the collection.
|
|
189
|
-
*
|
|
190
|
-
* See the {@link #add} method.
|
|
191
|
-
*
|
|
192
|
-
* @param subject The view to remove, its id or index in the collection.
|
|
193
|
-
* @returns The removed view.
|
|
194
|
-
*/
|
|
195
|
-
remove(subject) {
|
|
196
|
-
return super.remove(subject);
|
|
197
|
-
}
|
|
198
|
-
}
|
|
199
|
-
/**
|
|
200
|
-
* Check if all entries of the array are of `String` type.
|
|
201
|
-
*
|
|
202
|
-
* @param arr An array to be checked.
|
|
203
|
-
*/
|
|
204
|
-
function isStringArray(arr) {
|
|
205
|
-
return arr.every(a => typeof a == 'string');
|
|
206
|
-
}
|
|
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 ui/viewcollection
|
|
7
|
+
*/
|
|
8
|
+
import { CKEditorError, Collection } from '@ckeditor/ckeditor5-utils';
|
|
9
|
+
/**
|
|
10
|
+
* Collects {@link module:ui/view~View} instances.
|
|
11
|
+
*
|
|
12
|
+
* ```ts
|
|
13
|
+
* const parentView = new ParentView( locale );
|
|
14
|
+
* const collection = new ViewCollection( locale );
|
|
15
|
+
*
|
|
16
|
+
* collection.setParent( parentView.element );
|
|
17
|
+
*
|
|
18
|
+
* const viewA = new ChildView( locale );
|
|
19
|
+
* const viewB = new ChildView( locale );
|
|
20
|
+
* ```
|
|
21
|
+
*
|
|
22
|
+
* View collection renders and manages view {@link module:ui/view~View#element elements}:
|
|
23
|
+
*
|
|
24
|
+
* ```ts
|
|
25
|
+
* collection.add( viewA );
|
|
26
|
+
* collection.add( viewB );
|
|
27
|
+
*
|
|
28
|
+
* console.log( parentView.element.firsChild ); // -> viewA.element
|
|
29
|
+
* console.log( parentView.element.lastChild ); // -> viewB.element
|
|
30
|
+
* ```
|
|
31
|
+
*
|
|
32
|
+
* It {@link module:ui/viewcollection~ViewCollection#delegate propagates} DOM events too:
|
|
33
|
+
*
|
|
34
|
+
* ```ts
|
|
35
|
+
* // Delegate #click and #keydown events from viewA and viewB to the parentView.
|
|
36
|
+
* collection.delegate( 'click' ).to( parentView );
|
|
37
|
+
*
|
|
38
|
+
* parentView.on( 'click', ( evt ) => {
|
|
39
|
+
* console.log( `${ evt.source } has been clicked.` );
|
|
40
|
+
* } );
|
|
41
|
+
*
|
|
42
|
+
* // This event will be delegated to the parentView.
|
|
43
|
+
* viewB.fire( 'click' );
|
|
44
|
+
* ```
|
|
45
|
+
*
|
|
46
|
+
* **Note**: A view collection can be used directly in the {@link module:ui/template~TemplateDefinition definition}
|
|
47
|
+
* of a {@link module:ui/template~Template template}.
|
|
48
|
+
*/
|
|
49
|
+
export default class ViewCollection extends Collection {
|
|
50
|
+
/**
|
|
51
|
+
* Creates a new instance of the {@link module:ui/viewcollection~ViewCollection}.
|
|
52
|
+
*
|
|
53
|
+
* @param initialItems The initial items of the collection.
|
|
54
|
+
*/
|
|
55
|
+
constructor(initialItems = []) {
|
|
56
|
+
super(initialItems, {
|
|
57
|
+
// An #id Number attribute should be legal and not break the `ViewCollection` instance.
|
|
58
|
+
// https://github.com/ckeditor/ckeditor5-ui/issues/93
|
|
59
|
+
idProperty: 'viewUid'
|
|
60
|
+
});
|
|
61
|
+
// Handle {@link module:ui/view~View#element} in DOM when a new view is added to the collection.
|
|
62
|
+
this.on('add', (evt, view, index) => {
|
|
63
|
+
this._renderViewIntoCollectionParent(view, index);
|
|
64
|
+
});
|
|
65
|
+
// Handle {@link module:ui/view~View#element} in DOM when a view is removed from the collection.
|
|
66
|
+
this.on('remove', (evt, view) => {
|
|
67
|
+
if (view.element && this._parentElement) {
|
|
68
|
+
view.element.remove();
|
|
69
|
+
}
|
|
70
|
+
});
|
|
71
|
+
this._parentElement = null;
|
|
72
|
+
}
|
|
73
|
+
/**
|
|
74
|
+
* Destroys the view collection along with child views.
|
|
75
|
+
* See the view {@link module:ui/view~View#destroy} method.
|
|
76
|
+
*/
|
|
77
|
+
destroy() {
|
|
78
|
+
this.map(view => view.destroy());
|
|
79
|
+
}
|
|
80
|
+
/**
|
|
81
|
+
* Sets the parent HTML element of this collection. When parent is set, {@link #add adding} and
|
|
82
|
+
* {@link #remove removing} views in the collection synchronizes their
|
|
83
|
+
* {@link module:ui/view~View#element elements} in the parent element.
|
|
84
|
+
*
|
|
85
|
+
* @param element A new parent element.
|
|
86
|
+
*/
|
|
87
|
+
setParent(elementOrDocFragment) {
|
|
88
|
+
this._parentElement = elementOrDocFragment;
|
|
89
|
+
// Take care of the initial collection items passed to the constructor.
|
|
90
|
+
for (const view of this) {
|
|
91
|
+
this._renderViewIntoCollectionParent(view);
|
|
92
|
+
}
|
|
93
|
+
}
|
|
94
|
+
/**
|
|
95
|
+
* Delegates selected events coming from within views in the collection to any
|
|
96
|
+
* {@link module:utils/emittermixin~Emitter}.
|
|
97
|
+
*
|
|
98
|
+
* For the following views and collection:
|
|
99
|
+
*
|
|
100
|
+
* ```ts
|
|
101
|
+
* const viewA = new View();
|
|
102
|
+
* const viewB = new View();
|
|
103
|
+
* const viewC = new View();
|
|
104
|
+
*
|
|
105
|
+
* const views = parentView.createCollection();
|
|
106
|
+
*
|
|
107
|
+
* views.delegate( 'eventX' ).to( viewB );
|
|
108
|
+
* views.delegate( 'eventX', 'eventY' ).to( viewC );
|
|
109
|
+
*
|
|
110
|
+
* views.add( viewA );
|
|
111
|
+
* ```
|
|
112
|
+
*
|
|
113
|
+
* the `eventX` is delegated (fired by) `viewB` and `viewC` along with `customData`:
|
|
114
|
+
*
|
|
115
|
+
* ```ts
|
|
116
|
+
* viewA.fire( 'eventX', customData );
|
|
117
|
+
* ```
|
|
118
|
+
*
|
|
119
|
+
* and `eventY` is delegated (fired by) `viewC` along with `customData`:
|
|
120
|
+
*
|
|
121
|
+
* ```ts
|
|
122
|
+
* viewA.fire( 'eventY', customData );
|
|
123
|
+
* ```
|
|
124
|
+
*
|
|
125
|
+
* See {@link module:utils/emittermixin~Emitter#delegate}.
|
|
126
|
+
*
|
|
127
|
+
* @param events {@link module:ui/view~View} event names to be delegated to another
|
|
128
|
+
* {@link module:utils/emittermixin~Emitter}.
|
|
129
|
+
* @returns Object with `to` property, a function which accepts the destination
|
|
130
|
+
* of {@link module:utils/emittermixin~Emitter#delegate delegated} events.
|
|
131
|
+
*/
|
|
132
|
+
delegate(...events) {
|
|
133
|
+
if (!events.length || !isStringArray(events)) {
|
|
134
|
+
/**
|
|
135
|
+
* All event names must be strings.
|
|
136
|
+
*
|
|
137
|
+
* @error ui-viewcollection-delegate-wrong-events
|
|
138
|
+
*/
|
|
139
|
+
throw new CKEditorError('ui-viewcollection-delegate-wrong-events', this);
|
|
140
|
+
}
|
|
141
|
+
return {
|
|
142
|
+
to: dest => {
|
|
143
|
+
// Activate delegating on existing views in this collection.
|
|
144
|
+
for (const view of this) {
|
|
145
|
+
for (const evtName of events) {
|
|
146
|
+
view.delegate(evtName).to(dest);
|
|
147
|
+
}
|
|
148
|
+
}
|
|
149
|
+
// Activate delegating on future views in this collection.
|
|
150
|
+
this.on('add', (evt, view) => {
|
|
151
|
+
for (const evtName of events) {
|
|
152
|
+
view.delegate(evtName).to(dest);
|
|
153
|
+
}
|
|
154
|
+
});
|
|
155
|
+
// Deactivate delegating when view is removed from this collection.
|
|
156
|
+
this.on('remove', (evt, view) => {
|
|
157
|
+
for (const evtName of events) {
|
|
158
|
+
view.stopDelegating(evtName, dest);
|
|
159
|
+
}
|
|
160
|
+
});
|
|
161
|
+
}
|
|
162
|
+
};
|
|
163
|
+
}
|
|
164
|
+
/**
|
|
165
|
+
* This method {@link module:ui/view~View#render renders} a new view added to the collection.
|
|
166
|
+
*
|
|
167
|
+
* If the {@link #_parentElement parent element} of the collection is set, this method also adds
|
|
168
|
+
* the view's {@link module:ui/view~View#element} as a child of the parent in DOM at a specified index.
|
|
169
|
+
*
|
|
170
|
+
* **Note**: If index is not specified, the view's element is pushed as the last child
|
|
171
|
+
* of the parent element.
|
|
172
|
+
*
|
|
173
|
+
* @param view A new view added to the collection.
|
|
174
|
+
* @param index An index the view holds in the collection. When not specified,
|
|
175
|
+
* the view is added at the end.
|
|
176
|
+
*/
|
|
177
|
+
_renderViewIntoCollectionParent(view, index) {
|
|
178
|
+
if (!view.isRendered) {
|
|
179
|
+
view.render();
|
|
180
|
+
}
|
|
181
|
+
if (view.element && this._parentElement) {
|
|
182
|
+
this._parentElement.insertBefore(view.element, this._parentElement.children[index]);
|
|
183
|
+
}
|
|
184
|
+
}
|
|
185
|
+
/**
|
|
186
|
+
* Removes a child view from the collection. If the {@link #setParent parent element} of the
|
|
187
|
+
* collection has been set, the {@link module:ui/view~View#element element} of the view is also removed
|
|
188
|
+
* in DOM, reflecting the order of the collection.
|
|
189
|
+
*
|
|
190
|
+
* See the {@link #add} method.
|
|
191
|
+
*
|
|
192
|
+
* @param subject The view to remove, its id or index in the collection.
|
|
193
|
+
* @returns The removed view.
|
|
194
|
+
*/
|
|
195
|
+
remove(subject) {
|
|
196
|
+
return super.remove(subject);
|
|
197
|
+
}
|
|
198
|
+
}
|
|
199
|
+
/**
|
|
200
|
+
* Check if all entries of the array are of `String` type.
|
|
201
|
+
*
|
|
202
|
+
* @param arr An array to be checked.
|
|
203
|
+
*/
|
|
204
|
+
function isStringArray(arr) {
|
|
205
|
+
return arr.every(a => typeof a == 'string');
|
|
206
|
+
}
|
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
/*
|
|
2
|
+
* 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
|
+
.ck.ck-aria-live-announcer {
|
|
7
|
+
position: absolute;
|
|
8
|
+
left: -10000px;
|
|
9
|
+
top: -10000px;
|
|
10
|
+
}
|
|
@@ -4,6 +4,7 @@
|
|
|
4
4
|
*/
|
|
5
5
|
|
|
6
6
|
@import "../../mixins/_unselectable.css";
|
|
7
|
+
@import "../../mixins/_dir.css";
|
|
7
8
|
|
|
8
9
|
.ck.ck-button,
|
|
9
10
|
a.ck.ck-button {
|
|
@@ -12,7 +13,14 @@ a.ck.ck-button {
|
|
|
12
13
|
position: relative;
|
|
13
14
|
display: inline-flex;
|
|
14
15
|
align-items: center;
|
|
15
|
-
|
|
16
|
+
|
|
17
|
+
@mixin ck-dir ltr {
|
|
18
|
+
justify-content: left;
|
|
19
|
+
}
|
|
20
|
+
|
|
21
|
+
@mixin ck-dir rtl {
|
|
22
|
+
justify-content: right;
|
|
23
|
+
}
|
|
16
24
|
|
|
17
25
|
& .ck-button__label {
|
|
18
26
|
display: none;
|