@ckeditor/ckeditor5-engine 35.0.1 → 35.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/CHANGELOG.md +4 -4
- package/package.json +30 -24
- package/src/controller/datacontroller.js +467 -561
- package/src/controller/editingcontroller.js +168 -204
- package/src/conversion/conversion.js +541 -565
- package/src/conversion/conversionhelpers.js +24 -28
- package/src/conversion/downcastdispatcher.js +457 -686
- package/src/conversion/downcasthelpers.js +1583 -1965
- package/src/conversion/mapper.js +518 -707
- package/src/conversion/modelconsumable.js +240 -283
- package/src/conversion/upcastdispatcher.js +372 -718
- package/src/conversion/upcasthelpers.js +707 -818
- package/src/conversion/viewconsumable.js +524 -581
- package/src/dataprocessor/basichtmlwriter.js +12 -16
- package/src/dataprocessor/dataprocessor.js +5 -0
- package/src/dataprocessor/htmldataprocessor.js +100 -116
- package/src/dataprocessor/htmlwriter.js +1 -18
- package/src/dataprocessor/xmldataprocessor.js +116 -137
- package/src/dev-utils/model.js +260 -352
- package/src/dev-utils/operationreplayer.js +106 -126
- package/src/dev-utils/utils.js +34 -51
- package/src/dev-utils/view.js +632 -753
- package/src/index.js +0 -11
- package/src/model/batch.js +111 -127
- package/src/model/differ.js +988 -1233
- package/src/model/document.js +340 -449
- package/src/model/documentfragment.js +327 -364
- package/src/model/documentselection.js +996 -1189
- package/src/model/element.js +306 -410
- package/src/model/history.js +224 -262
- package/src/model/item.js +5 -0
- package/src/model/liveposition.js +84 -145
- package/src/model/liverange.js +108 -185
- package/src/model/markercollection.js +379 -480
- package/src/model/model.js +883 -1034
- package/src/model/node.js +419 -463
- package/src/model/nodelist.js +175 -201
- package/src/model/operation/attributeoperation.js +153 -182
- package/src/model/operation/detachoperation.js +64 -83
- package/src/model/operation/insertoperation.js +135 -166
- package/src/model/operation/markeroperation.js +114 -140
- package/src/model/operation/mergeoperation.js +163 -191
- package/src/model/operation/moveoperation.js +157 -187
- package/src/model/operation/nooperation.js +28 -38
- package/src/model/operation/operation.js +106 -125
- package/src/model/operation/operationfactory.js +30 -34
- package/src/model/operation/renameoperation.js +109 -135
- package/src/model/operation/rootattributeoperation.js +155 -188
- package/src/model/operation/splitoperation.js +196 -232
- package/src/model/operation/transform.js +1833 -2204
- package/src/model/operation/utils.js +140 -204
- package/src/model/position.js +899 -1053
- package/src/model/range.js +910 -1028
- package/src/model/rootelement.js +77 -97
- package/src/model/schema.js +1189 -1835
- package/src/model/selection.js +745 -862
- package/src/model/text.js +90 -114
- package/src/model/textproxy.js +204 -240
- package/src/model/treewalker.js +316 -397
- package/src/model/typecheckable.js +16 -0
- package/src/model/utils/autoparagraphing.js +32 -44
- package/src/model/utils/deletecontent.js +334 -418
- package/src/model/utils/findoptimalinsertionrange.js +25 -36
- package/src/model/utils/getselectedcontent.js +96 -118
- package/src/model/utils/insertcontent.js +654 -773
- package/src/model/utils/insertobject.js +96 -119
- package/src/model/utils/modifyselection.js +120 -158
- package/src/model/utils/selection-post-fixer.js +153 -201
- package/src/model/writer.js +1305 -1474
- package/src/view/attributeelement.js +189 -225
- package/src/view/containerelement.js +75 -85
- package/src/view/document.js +172 -215
- package/src/view/documentfragment.js +200 -249
- package/src/view/documentselection.js +338 -367
- package/src/view/domconverter.js +1370 -1617
- package/src/view/downcastwriter.js +1747 -2076
- package/src/view/editableelement.js +81 -97
- package/src/view/element.js +739 -890
- package/src/view/elementdefinition.js +5 -0
- package/src/view/emptyelement.js +82 -92
- package/src/view/filler.js +35 -50
- package/src/view/item.js +5 -0
- package/src/view/matcher.js +260 -559
- package/src/view/node.js +274 -360
- package/src/view/observer/arrowkeysobserver.js +19 -28
- package/src/view/observer/bubblingemittermixin.js +120 -263
- package/src/view/observer/bubblingeventinfo.js +47 -55
- package/src/view/observer/clickobserver.js +7 -13
- package/src/view/observer/compositionobserver.js +14 -24
- package/src/view/observer/domeventdata.js +57 -67
- package/src/view/observer/domeventobserver.js +40 -64
- package/src/view/observer/fakeselectionobserver.js +81 -96
- package/src/view/observer/focusobserver.js +45 -61
- package/src/view/observer/inputobserver.js +7 -13
- package/src/view/observer/keyobserver.js +17 -27
- package/src/view/observer/mouseobserver.js +7 -14
- package/src/view/observer/mutationobserver.js +220 -315
- package/src/view/observer/observer.js +81 -102
- package/src/view/observer/selectionobserver.js +191 -246
- package/src/view/observer/tabobserver.js +23 -36
- package/src/view/placeholder.js +128 -173
- package/src/view/position.js +350 -401
- package/src/view/range.js +453 -513
- package/src/view/rawelement.js +85 -112
- package/src/view/renderer.js +874 -1018
- package/src/view/rooteditableelement.js +80 -90
- package/src/view/selection.js +608 -689
- package/src/view/styles/background.js +43 -44
- package/src/view/styles/border.js +220 -276
- package/src/view/styles/margin.js +8 -17
- package/src/view/styles/padding.js +8 -16
- package/src/view/styles/utils.js +127 -160
- package/src/view/stylesmap.js +728 -905
- package/src/view/text.js +102 -126
- package/src/view/textproxy.js +144 -170
- package/src/view/treewalker.js +383 -479
- package/src/view/typecheckable.js +19 -0
- package/src/view/uielement.js +166 -187
- package/src/view/upcastwriter.js +395 -449
- package/src/view/view.js +569 -664
- package/src/dataprocessor/dataprocessor.jsdoc +0 -64
- package/src/model/item.jsdoc +0 -14
- package/src/view/elementdefinition.jsdoc +0 -59
- package/src/view/item.jsdoc +0 -14
|
@@ -2,13 +2,7 @@
|
|
|
2
2
|
* @license Copyright (c) 2003-2022, CKSource Holding sp. z o.o. All rights reserved.
|
|
3
3
|
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
|
|
4
4
|
*/
|
|
5
|
-
|
|
6
|
-
/**
|
|
7
|
-
* @module engine/view/styles/background
|
|
8
|
-
*/
|
|
9
|
-
|
|
10
5
|
import { getShorthandValues, isAttachment, isColor, isPosition, isRepeat, isURL } from './utils';
|
|
11
|
-
|
|
12
6
|
/**
|
|
13
7
|
* Adds a background CSS styles processing rules.
|
|
14
8
|
*
|
|
@@ -31,43 +25,48 @@ import { getShorthandValues, isAttachment, isColor, isPosition, isRepeat, isURL
|
|
|
31
25
|
*
|
|
32
26
|
* @param {module:engine/view/stylesmap~StylesProcessor} stylesProcessor
|
|
33
27
|
*/
|
|
34
|
-
export function addBackgroundRules(
|
|
35
|
-
|
|
36
|
-
|
|
37
|
-
|
|
38
|
-
|
|
39
|
-
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
28
|
+
export function addBackgroundRules(stylesProcessor) {
|
|
29
|
+
stylesProcessor.setNormalizer('background', getBackgroundNormalizer());
|
|
30
|
+
stylesProcessor.setNormalizer('background-color', getBackgroundColorNormalizer());
|
|
31
|
+
stylesProcessor.setReducer('background', getBackgroundReducer());
|
|
32
|
+
stylesProcessor.setStyleRelation('background', ['background-color']);
|
|
33
|
+
}
|
|
34
|
+
function getBackgroundNormalizer() {
|
|
35
|
+
return value => {
|
|
36
|
+
const background = {};
|
|
37
|
+
const parts = getShorthandValues(value);
|
|
38
|
+
for (const part of parts) {
|
|
39
|
+
if (isRepeat(part)) {
|
|
40
|
+
background.repeat = background.repeat || [];
|
|
41
|
+
background.repeat.push(part);
|
|
42
|
+
}
|
|
43
|
+
else if (isPosition(part)) {
|
|
44
|
+
background.position = background.position || [];
|
|
45
|
+
background.position.push(part);
|
|
46
|
+
}
|
|
47
|
+
else if (isAttachment(part)) {
|
|
48
|
+
background.attachment = part;
|
|
49
|
+
}
|
|
50
|
+
else if (isColor(part)) {
|
|
51
|
+
background.color = part;
|
|
52
|
+
}
|
|
53
|
+
else if (isURL(part)) {
|
|
54
|
+
background.image = part;
|
|
55
|
+
}
|
|
56
|
+
}
|
|
57
|
+
return {
|
|
58
|
+
path: 'background',
|
|
59
|
+
value: background
|
|
60
|
+
};
|
|
61
|
+
};
|
|
62
|
+
}
|
|
63
|
+
function getBackgroundColorNormalizer() {
|
|
64
|
+
return value => ({ path: 'background.color', value });
|
|
46
65
|
}
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
for ( const part of parts ) {
|
|
54
|
-
if ( isRepeat( part ) ) {
|
|
55
|
-
background.repeat = background.repeat || [];
|
|
56
|
-
background.repeat.push( part );
|
|
57
|
-
} else if ( isPosition( part ) ) {
|
|
58
|
-
background.position = background.position || [];
|
|
59
|
-
background.position.push( part );
|
|
60
|
-
} else if ( isAttachment( part ) ) {
|
|
61
|
-
background.attachment = part;
|
|
62
|
-
} else if ( isColor( part ) ) {
|
|
63
|
-
background.color = part;
|
|
64
|
-
} else if ( isURL( part ) ) {
|
|
65
|
-
background.image = part;
|
|
66
|
-
}
|
|
67
|
-
}
|
|
68
|
-
|
|
69
|
-
return {
|
|
70
|
-
path: 'background',
|
|
71
|
-
value: background
|
|
72
|
-
};
|
|
66
|
+
function getBackgroundReducer() {
|
|
67
|
+
return value => {
|
|
68
|
+
const ret = [];
|
|
69
|
+
ret.push(['background-color', value.color]);
|
|
70
|
+
return ret;
|
|
71
|
+
};
|
|
73
72
|
}
|
|
@@ -2,13 +2,7 @@
|
|
|
2
2
|
* @license Copyright (c) 2003-2022, CKSource Holding sp. z o.o. All rights reserved.
|
|
3
3
|
* For licensing, see LICENSE.md or https://ckeditor.com/legal/ckeditor-oss-license
|
|
4
4
|
*/
|
|
5
|
-
|
|
6
|
-
/**
|
|
7
|
-
* @module engine/view/styles/border
|
|
8
|
-
*/
|
|
9
|
-
|
|
10
5
|
import { getShorthandValues, getBoxSidesValueReducer, getBoxSidesValues, isLength, isLineStyle } from './utils';
|
|
11
|
-
|
|
12
6
|
/**
|
|
13
7
|
* Adds a border CSS styles processing rules.
|
|
14
8
|
*
|
|
@@ -41,200 +35,168 @@ import { getShorthandValues, getBoxSidesValueReducer, getBoxSidesValues, isLengt
|
|
|
41
35
|
*
|
|
42
36
|
* @param {module:engine/view/stylesmap~StylesProcessor} stylesProcessor
|
|
43
37
|
*/
|
|
44
|
-
export function addBorderRules(
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
60
|
-
|
|
61
|
-
|
|
62
|
-
|
|
63
|
-
|
|
64
|
-
|
|
65
|
-
|
|
66
|
-
|
|
67
|
-
|
|
68
|
-
|
|
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
|
-
stylesProcessor.setStyleRelation( 'border-color', [
|
|
113
|
-
'border-top-color', 'border-right-color', 'border-bottom-color', 'border-left-color'
|
|
114
|
-
] );
|
|
115
|
-
stylesProcessor.setStyleRelation( 'border-style', [
|
|
116
|
-
'border-top-style', 'border-right-style', 'border-bottom-style', 'border-left-style'
|
|
117
|
-
] );
|
|
118
|
-
stylesProcessor.setStyleRelation( 'border-width', [
|
|
119
|
-
'border-top-width', 'border-right-width', 'border-bottom-width', 'border-left-width'
|
|
120
|
-
] );
|
|
121
|
-
|
|
122
|
-
stylesProcessor.setStyleRelation( 'border-top', [ 'border-top-color', 'border-top-style', 'border-top-width' ] );
|
|
123
|
-
stylesProcessor.setStyleRelation( 'border-right', [ 'border-right-color', 'border-right-style', 'border-right-width' ] );
|
|
124
|
-
stylesProcessor.setStyleRelation( 'border-bottom', [ 'border-bottom-color', 'border-bottom-style', 'border-bottom-width' ] );
|
|
125
|
-
stylesProcessor.setStyleRelation( 'border-left', [ 'border-left-color', 'border-left-style', 'border-left-width' ] );
|
|
38
|
+
export function addBorderRules(stylesProcessor) {
|
|
39
|
+
stylesProcessor.setNormalizer('border', getBorderNormalizer());
|
|
40
|
+
// Border-position shorthands.
|
|
41
|
+
stylesProcessor.setNormalizer('border-top', getBorderPositionNormalizer('top'));
|
|
42
|
+
stylesProcessor.setNormalizer('border-right', getBorderPositionNormalizer('right'));
|
|
43
|
+
stylesProcessor.setNormalizer('border-bottom', getBorderPositionNormalizer('bottom'));
|
|
44
|
+
stylesProcessor.setNormalizer('border-left', getBorderPositionNormalizer('left'));
|
|
45
|
+
// Border-property shorthands.
|
|
46
|
+
stylesProcessor.setNormalizer('border-color', getBorderPropertyNormalizer('color'));
|
|
47
|
+
stylesProcessor.setNormalizer('border-width', getBorderPropertyNormalizer('width'));
|
|
48
|
+
stylesProcessor.setNormalizer('border-style', getBorderPropertyNormalizer('style'));
|
|
49
|
+
// Border longhands.
|
|
50
|
+
stylesProcessor.setNormalizer('border-top-color', getBorderPropertyPositionNormalizer('color', 'top'));
|
|
51
|
+
stylesProcessor.setNormalizer('border-top-style', getBorderPropertyPositionNormalizer('style', 'top'));
|
|
52
|
+
stylesProcessor.setNormalizer('border-top-width', getBorderPropertyPositionNormalizer('width', 'top'));
|
|
53
|
+
stylesProcessor.setNormalizer('border-right-color', getBorderPropertyPositionNormalizer('color', 'right'));
|
|
54
|
+
stylesProcessor.setNormalizer('border-right-style', getBorderPropertyPositionNormalizer('style', 'right'));
|
|
55
|
+
stylesProcessor.setNormalizer('border-right-width', getBorderPropertyPositionNormalizer('width', 'right'));
|
|
56
|
+
stylesProcessor.setNormalizer('border-bottom-color', getBorderPropertyPositionNormalizer('color', 'bottom'));
|
|
57
|
+
stylesProcessor.setNormalizer('border-bottom-style', getBorderPropertyPositionNormalizer('style', 'bottom'));
|
|
58
|
+
stylesProcessor.setNormalizer('border-bottom-width', getBorderPropertyPositionNormalizer('width', 'bottom'));
|
|
59
|
+
stylesProcessor.setNormalizer('border-left-color', getBorderPropertyPositionNormalizer('color', 'left'));
|
|
60
|
+
stylesProcessor.setNormalizer('border-left-style', getBorderPropertyPositionNormalizer('style', 'left'));
|
|
61
|
+
stylesProcessor.setNormalizer('border-left-width', getBorderPropertyPositionNormalizer('width', 'left'));
|
|
62
|
+
stylesProcessor.setExtractor('border-top', getBorderPositionExtractor('top'));
|
|
63
|
+
stylesProcessor.setExtractor('border-right', getBorderPositionExtractor('right'));
|
|
64
|
+
stylesProcessor.setExtractor('border-bottom', getBorderPositionExtractor('bottom'));
|
|
65
|
+
stylesProcessor.setExtractor('border-left', getBorderPositionExtractor('left'));
|
|
66
|
+
stylesProcessor.setExtractor('border-top-color', 'border.color.top');
|
|
67
|
+
stylesProcessor.setExtractor('border-right-color', 'border.color.right');
|
|
68
|
+
stylesProcessor.setExtractor('border-bottom-color', 'border.color.bottom');
|
|
69
|
+
stylesProcessor.setExtractor('border-left-color', 'border.color.left');
|
|
70
|
+
stylesProcessor.setExtractor('border-top-width', 'border.width.top');
|
|
71
|
+
stylesProcessor.setExtractor('border-right-width', 'border.width.right');
|
|
72
|
+
stylesProcessor.setExtractor('border-bottom-width', 'border.width.bottom');
|
|
73
|
+
stylesProcessor.setExtractor('border-left-width', 'border.width.left');
|
|
74
|
+
stylesProcessor.setExtractor('border-top-style', 'border.style.top');
|
|
75
|
+
stylesProcessor.setExtractor('border-right-style', 'border.style.right');
|
|
76
|
+
stylesProcessor.setExtractor('border-bottom-style', 'border.style.bottom');
|
|
77
|
+
stylesProcessor.setExtractor('border-left-style', 'border.style.left');
|
|
78
|
+
stylesProcessor.setReducer('border-color', getBoxSidesValueReducer('border-color'));
|
|
79
|
+
stylesProcessor.setReducer('border-style', getBoxSidesValueReducer('border-style'));
|
|
80
|
+
stylesProcessor.setReducer('border-width', getBoxSidesValueReducer('border-width'));
|
|
81
|
+
stylesProcessor.setReducer('border-top', getBorderPositionReducer('top'));
|
|
82
|
+
stylesProcessor.setReducer('border-right', getBorderPositionReducer('right'));
|
|
83
|
+
stylesProcessor.setReducer('border-bottom', getBorderPositionReducer('bottom'));
|
|
84
|
+
stylesProcessor.setReducer('border-left', getBorderPositionReducer('left'));
|
|
85
|
+
stylesProcessor.setReducer('border', getBorderReducer());
|
|
86
|
+
stylesProcessor.setStyleRelation('border', [
|
|
87
|
+
'border-color', 'border-style', 'border-width',
|
|
88
|
+
'border-top', 'border-right', 'border-bottom', 'border-left',
|
|
89
|
+
'border-top-color', 'border-right-color', 'border-bottom-color', 'border-left-color',
|
|
90
|
+
'border-top-style', 'border-right-style', 'border-bottom-style', 'border-left-style',
|
|
91
|
+
'border-top-width', 'border-right-width', 'border-bottom-width', 'border-left-width'
|
|
92
|
+
]);
|
|
93
|
+
stylesProcessor.setStyleRelation('border-color', [
|
|
94
|
+
'border-top-color', 'border-right-color', 'border-bottom-color', 'border-left-color'
|
|
95
|
+
]);
|
|
96
|
+
stylesProcessor.setStyleRelation('border-style', [
|
|
97
|
+
'border-top-style', 'border-right-style', 'border-bottom-style', 'border-left-style'
|
|
98
|
+
]);
|
|
99
|
+
stylesProcessor.setStyleRelation('border-width', [
|
|
100
|
+
'border-top-width', 'border-right-width', 'border-bottom-width', 'border-left-width'
|
|
101
|
+
]);
|
|
102
|
+
stylesProcessor.setStyleRelation('border-top', ['border-top-color', 'border-top-style', 'border-top-width']);
|
|
103
|
+
stylesProcessor.setStyleRelation('border-right', ['border-right-color', 'border-right-style', 'border-right-width']);
|
|
104
|
+
stylesProcessor.setStyleRelation('border-bottom', ['border-bottom-color', 'border-bottom-style', 'border-bottom-width']);
|
|
105
|
+
stylesProcessor.setStyleRelation('border-left', ['border-left-color', 'border-left-style', 'border-left-width']);
|
|
126
106
|
}
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
107
|
+
function getBorderNormalizer() {
|
|
108
|
+
return value => {
|
|
109
|
+
const { color, style, width } = normalizeBorderShorthand(value);
|
|
110
|
+
return {
|
|
111
|
+
path: 'border',
|
|
112
|
+
value: {
|
|
113
|
+
color: getBoxSidesValues(color),
|
|
114
|
+
style: getBoxSidesValues(style),
|
|
115
|
+
width: getBoxSidesValues(width)
|
|
116
|
+
}
|
|
117
|
+
};
|
|
118
|
+
};
|
|
139
119
|
}
|
|
140
|
-
|
|
141
|
-
|
|
142
|
-
|
|
143
|
-
|
|
144
|
-
|
|
145
|
-
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
return {
|
|
160
|
-
path: 'border',
|
|
161
|
-
value: border
|
|
162
|
-
};
|
|
163
|
-
};
|
|
120
|
+
function getBorderPositionNormalizer(side) {
|
|
121
|
+
return value => {
|
|
122
|
+
const { color, style, width } = normalizeBorderShorthand(value);
|
|
123
|
+
const border = {};
|
|
124
|
+
if (color !== undefined) {
|
|
125
|
+
border.color = { [side]: color };
|
|
126
|
+
}
|
|
127
|
+
if (style !== undefined) {
|
|
128
|
+
border.style = { [side]: style };
|
|
129
|
+
}
|
|
130
|
+
if (width !== undefined) {
|
|
131
|
+
border.width = { [side]: width };
|
|
132
|
+
}
|
|
133
|
+
return {
|
|
134
|
+
path: 'border',
|
|
135
|
+
value: border
|
|
136
|
+
};
|
|
137
|
+
};
|
|
164
138
|
}
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
169
|
-
|
|
170
|
-
|
|
171
|
-
|
|
172
|
-
};
|
|
139
|
+
function getBorderPropertyNormalizer(propertyName) {
|
|
140
|
+
return value => {
|
|
141
|
+
return {
|
|
142
|
+
path: 'border',
|
|
143
|
+
value: toBorderPropertyShorthand(value, propertyName)
|
|
144
|
+
};
|
|
145
|
+
};
|
|
173
146
|
}
|
|
174
|
-
|
|
175
|
-
|
|
176
|
-
|
|
177
|
-
|
|
178
|
-
};
|
|
147
|
+
function toBorderPropertyShorthand(value, property) {
|
|
148
|
+
return {
|
|
149
|
+
[property]: getBoxSidesValues(value)
|
|
150
|
+
};
|
|
179
151
|
}
|
|
180
|
-
|
|
181
|
-
|
|
182
|
-
|
|
183
|
-
|
|
184
|
-
|
|
185
|
-
|
|
186
|
-
|
|
187
|
-
|
|
188
|
-
|
|
189
|
-
|
|
190
|
-
|
|
191
|
-
};
|
|
152
|
+
function getBorderPropertyPositionNormalizer(property, side) {
|
|
153
|
+
return value => {
|
|
154
|
+
return {
|
|
155
|
+
path: 'border',
|
|
156
|
+
value: {
|
|
157
|
+
[property]: {
|
|
158
|
+
[side]: value
|
|
159
|
+
}
|
|
160
|
+
}
|
|
161
|
+
};
|
|
162
|
+
};
|
|
192
163
|
}
|
|
193
|
-
|
|
194
|
-
|
|
195
|
-
|
|
196
|
-
|
|
197
|
-
|
|
198
|
-
|
|
199
|
-
};
|
|
164
|
+
function getBorderPositionExtractor(which) {
|
|
165
|
+
return (name, styles) => {
|
|
166
|
+
if (styles.border) {
|
|
167
|
+
return extractBorderPosition(styles.border, which);
|
|
168
|
+
}
|
|
169
|
+
};
|
|
200
170
|
}
|
|
201
|
-
|
|
202
|
-
|
|
203
|
-
|
|
204
|
-
|
|
205
|
-
|
|
206
|
-
|
|
207
|
-
|
|
208
|
-
|
|
209
|
-
|
|
210
|
-
|
|
211
|
-
|
|
212
|
-
|
|
213
|
-
if ( border.color && border.color[ which ] ) {
|
|
214
|
-
value.color = border.color[ which ];
|
|
215
|
-
}
|
|
216
|
-
|
|
217
|
-
return value;
|
|
171
|
+
function extractBorderPosition(border, which) {
|
|
172
|
+
const value = {};
|
|
173
|
+
if (border.width && border.width[which]) {
|
|
174
|
+
value.width = border.width[which];
|
|
175
|
+
}
|
|
176
|
+
if (border.style && border.style[which]) {
|
|
177
|
+
value.style = border.style[which];
|
|
178
|
+
}
|
|
179
|
+
if (border.color && border.color[which]) {
|
|
180
|
+
value.color = border.color[which];
|
|
181
|
+
}
|
|
182
|
+
return value;
|
|
218
183
|
}
|
|
219
|
-
|
|
220
|
-
|
|
221
|
-
|
|
222
|
-
|
|
223
|
-
|
|
224
|
-
|
|
225
|
-
|
|
226
|
-
|
|
227
|
-
|
|
228
|
-
|
|
229
|
-
|
|
230
|
-
|
|
231
|
-
|
|
232
|
-
|
|
233
|
-
|
|
234
|
-
|
|
235
|
-
return result;
|
|
184
|
+
function normalizeBorderShorthand(string) {
|
|
185
|
+
const result = {};
|
|
186
|
+
const parts = getShorthandValues(string);
|
|
187
|
+
for (const part of parts) {
|
|
188
|
+
if (isLength(part) || /thin|medium|thick/.test(part)) {
|
|
189
|
+
result.width = part;
|
|
190
|
+
}
|
|
191
|
+
else if (isLineStyle(part)) {
|
|
192
|
+
result.style = part;
|
|
193
|
+
}
|
|
194
|
+
else {
|
|
195
|
+
result.color = part;
|
|
196
|
+
}
|
|
197
|
+
}
|
|
198
|
+
return result;
|
|
236
199
|
}
|
|
237
|
-
|
|
238
200
|
// The border reducer factory.
|
|
239
201
|
//
|
|
240
202
|
// It tries to produce the most optimal output for the specified styles.
|
|
@@ -262,62 +224,51 @@ function normalizeBorderShorthand( string ) {
|
|
|
262
224
|
//
|
|
263
225
|
// @returns {Function}
|
|
264
226
|
function getBorderReducer() {
|
|
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
|
-
// @param {Array.<Object>} styles The array of objects with `style`, `color`, `width` properties.
|
|
309
|
-
// @param {'width'|'style'|'color'} type
|
|
310
|
-
function getReducedStyleValueForType( styles, type ) {
|
|
311
|
-
return styles
|
|
312
|
-
.map( style => style[ type ] )
|
|
313
|
-
.reduce( ( result, style ) => result == style ? result : null );
|
|
314
|
-
}
|
|
227
|
+
return value => {
|
|
228
|
+
const topStyles = extractBorderPosition(value, 'top');
|
|
229
|
+
const rightStyles = extractBorderPosition(value, 'right');
|
|
230
|
+
const bottomStyles = extractBorderPosition(value, 'bottom');
|
|
231
|
+
const leftStyles = extractBorderPosition(value, 'left');
|
|
232
|
+
const borderStyles = [topStyles, rightStyles, bottomStyles, leftStyles];
|
|
233
|
+
const borderStylesByType = {
|
|
234
|
+
width: getReducedStyleValueForType(borderStyles, 'width'),
|
|
235
|
+
style: getReducedStyleValueForType(borderStyles, 'style'),
|
|
236
|
+
color: getReducedStyleValueForType(borderStyles, 'color')
|
|
237
|
+
};
|
|
238
|
+
// Try reducing to a single `border:` property.
|
|
239
|
+
const reducedBorderStyle = reduceBorderPosition(borderStylesByType, 'all');
|
|
240
|
+
if (reducedBorderStyle.length) {
|
|
241
|
+
return reducedBorderStyle;
|
|
242
|
+
}
|
|
243
|
+
// Try reducing to `border-style:`, `border-width:`, `border-color:` properties.
|
|
244
|
+
const reducedStyleTypes = Object.entries(borderStylesByType).reduce((reducedStyleTypes, [type, value]) => {
|
|
245
|
+
if (value) {
|
|
246
|
+
reducedStyleTypes.push([`border-${type}`, value]);
|
|
247
|
+
// Remove it from the full set to not include it in the most specific properties later.
|
|
248
|
+
borderStyles.forEach(style => delete style[type]);
|
|
249
|
+
}
|
|
250
|
+
return reducedStyleTypes;
|
|
251
|
+
}, []);
|
|
252
|
+
// The reduced properties (by type) and all that remains that could not be reduced.
|
|
253
|
+
return [
|
|
254
|
+
...reducedStyleTypes,
|
|
255
|
+
...reduceBorderPosition(topStyles, 'top'),
|
|
256
|
+
...reduceBorderPosition(rightStyles, 'right'),
|
|
257
|
+
...reduceBorderPosition(bottomStyles, 'bottom'),
|
|
258
|
+
...reduceBorderPosition(leftStyles, 'left')
|
|
259
|
+
];
|
|
260
|
+
};
|
|
261
|
+
// @param {Array.<Object>} styles The array of objects with `style`, `color`, `width` properties.
|
|
262
|
+
// @param {'width'|'style'|'color'} type
|
|
263
|
+
function getReducedStyleValueForType(styles, type) {
|
|
264
|
+
return styles
|
|
265
|
+
.map(style => style[type])
|
|
266
|
+
.reduce((result, style) => result == style ? result : null);
|
|
267
|
+
}
|
|
315
268
|
}
|
|
316
|
-
|
|
317
|
-
|
|
318
|
-
return value => reduceBorderPosition( value, which );
|
|
269
|
+
function getBorderPositionReducer(which) {
|
|
270
|
+
return value => reduceBorderPosition(value, which);
|
|
319
271
|
}
|
|
320
|
-
|
|
321
272
|
// Returns an array with reduced border styles depending on the specified values.
|
|
322
273
|
//
|
|
323
274
|
// If all border properties (width, style, color) are specified, the returned selector will be
|
|
@@ -328,35 +279,28 @@ function getBorderPositionReducer( which ) {
|
|
|
328
279
|
// @param {Object|null} value Styles if defined.
|
|
329
280
|
// @param {'top'|'right'|'bottom'|'left'|'all'} which The border position.
|
|
330
281
|
// @returns {Array}
|
|
331
|
-
function reduceBorderPosition(
|
|
332
|
-
|
|
333
|
-
|
|
334
|
-
|
|
335
|
-
|
|
336
|
-
|
|
337
|
-
|
|
338
|
-
|
|
339
|
-
|
|
340
|
-
|
|
341
|
-
|
|
342
|
-
|
|
343
|
-
|
|
344
|
-
|
|
345
|
-
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
|
|
351
|
-
|
|
352
|
-
|
|
353
|
-
|
|
354
|
-
|
|
355
|
-
if ( which == 'all' ) {
|
|
356
|
-
return [];
|
|
357
|
-
}
|
|
358
|
-
|
|
359
|
-
return borderTypes.map( type => {
|
|
360
|
-
return [ `border-${ which }-${ type }`, value[ type ] ];
|
|
361
|
-
} );
|
|
282
|
+
function reduceBorderPosition(value, which) {
|
|
283
|
+
const borderTypes = [];
|
|
284
|
+
if (value && (value.width)) {
|
|
285
|
+
borderTypes.push('width');
|
|
286
|
+
}
|
|
287
|
+
if (value && (value.style)) {
|
|
288
|
+
borderTypes.push('style');
|
|
289
|
+
}
|
|
290
|
+
if (value && (value.color)) {
|
|
291
|
+
borderTypes.push('color');
|
|
292
|
+
}
|
|
293
|
+
if (borderTypes.length == 3) {
|
|
294
|
+
const borderValue = borderTypes.map(item => value[item]).join(' ');
|
|
295
|
+
return [
|
|
296
|
+
which == 'all' ? ['border', borderValue] : [`border-${which}`, borderValue]
|
|
297
|
+
];
|
|
298
|
+
}
|
|
299
|
+
// We are unable to reduce to a single `border:` property.
|
|
300
|
+
if (which == 'all') {
|
|
301
|
+
return [];
|
|
302
|
+
}
|
|
303
|
+
return borderTypes.map(type => {
|
|
304
|
+
return [`border-${which}-${type}`, value[type]];
|
|
305
|
+
});
|
|
362
306
|
}
|