@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.
Files changed (124) hide show
  1. package/CHANGELOG.md +4 -4
  2. package/package.json +30 -24
  3. package/src/controller/datacontroller.js +467 -561
  4. package/src/controller/editingcontroller.js +168 -204
  5. package/src/conversion/conversion.js +541 -565
  6. package/src/conversion/conversionhelpers.js +24 -28
  7. package/src/conversion/downcastdispatcher.js +457 -686
  8. package/src/conversion/downcasthelpers.js +1583 -1965
  9. package/src/conversion/mapper.js +518 -707
  10. package/src/conversion/modelconsumable.js +240 -283
  11. package/src/conversion/upcastdispatcher.js +372 -718
  12. package/src/conversion/upcasthelpers.js +707 -818
  13. package/src/conversion/viewconsumable.js +524 -581
  14. package/src/dataprocessor/basichtmlwriter.js +12 -16
  15. package/src/dataprocessor/dataprocessor.js +5 -0
  16. package/src/dataprocessor/htmldataprocessor.js +100 -116
  17. package/src/dataprocessor/htmlwriter.js +1 -18
  18. package/src/dataprocessor/xmldataprocessor.js +116 -137
  19. package/src/dev-utils/model.js +260 -352
  20. package/src/dev-utils/operationreplayer.js +106 -126
  21. package/src/dev-utils/utils.js +34 -51
  22. package/src/dev-utils/view.js +632 -753
  23. package/src/index.js +0 -11
  24. package/src/model/batch.js +111 -127
  25. package/src/model/differ.js +988 -1233
  26. package/src/model/document.js +340 -449
  27. package/src/model/documentfragment.js +327 -364
  28. package/src/model/documentselection.js +996 -1189
  29. package/src/model/element.js +306 -410
  30. package/src/model/history.js +224 -262
  31. package/src/model/item.js +5 -0
  32. package/src/model/liveposition.js +84 -145
  33. package/src/model/liverange.js +108 -185
  34. package/src/model/markercollection.js +379 -480
  35. package/src/model/model.js +883 -1034
  36. package/src/model/node.js +419 -463
  37. package/src/model/nodelist.js +175 -201
  38. package/src/model/operation/attributeoperation.js +153 -182
  39. package/src/model/operation/detachoperation.js +64 -83
  40. package/src/model/operation/insertoperation.js +135 -166
  41. package/src/model/operation/markeroperation.js +114 -140
  42. package/src/model/operation/mergeoperation.js +163 -191
  43. package/src/model/operation/moveoperation.js +157 -187
  44. package/src/model/operation/nooperation.js +28 -38
  45. package/src/model/operation/operation.js +106 -125
  46. package/src/model/operation/operationfactory.js +30 -34
  47. package/src/model/operation/renameoperation.js +109 -135
  48. package/src/model/operation/rootattributeoperation.js +155 -188
  49. package/src/model/operation/splitoperation.js +196 -232
  50. package/src/model/operation/transform.js +1833 -2204
  51. package/src/model/operation/utils.js +140 -204
  52. package/src/model/position.js +899 -1053
  53. package/src/model/range.js +910 -1028
  54. package/src/model/rootelement.js +77 -97
  55. package/src/model/schema.js +1189 -1835
  56. package/src/model/selection.js +745 -862
  57. package/src/model/text.js +90 -114
  58. package/src/model/textproxy.js +204 -240
  59. package/src/model/treewalker.js +316 -397
  60. package/src/model/typecheckable.js +16 -0
  61. package/src/model/utils/autoparagraphing.js +32 -44
  62. package/src/model/utils/deletecontent.js +334 -418
  63. package/src/model/utils/findoptimalinsertionrange.js +25 -36
  64. package/src/model/utils/getselectedcontent.js +96 -118
  65. package/src/model/utils/insertcontent.js +654 -773
  66. package/src/model/utils/insertobject.js +96 -119
  67. package/src/model/utils/modifyselection.js +120 -158
  68. package/src/model/utils/selection-post-fixer.js +153 -201
  69. package/src/model/writer.js +1305 -1474
  70. package/src/view/attributeelement.js +189 -225
  71. package/src/view/containerelement.js +75 -85
  72. package/src/view/document.js +172 -215
  73. package/src/view/documentfragment.js +200 -249
  74. package/src/view/documentselection.js +338 -367
  75. package/src/view/domconverter.js +1370 -1617
  76. package/src/view/downcastwriter.js +1747 -2076
  77. package/src/view/editableelement.js +81 -97
  78. package/src/view/element.js +739 -890
  79. package/src/view/elementdefinition.js +5 -0
  80. package/src/view/emptyelement.js +82 -92
  81. package/src/view/filler.js +35 -50
  82. package/src/view/item.js +5 -0
  83. package/src/view/matcher.js +260 -559
  84. package/src/view/node.js +274 -360
  85. package/src/view/observer/arrowkeysobserver.js +19 -28
  86. package/src/view/observer/bubblingemittermixin.js +120 -263
  87. package/src/view/observer/bubblingeventinfo.js +47 -55
  88. package/src/view/observer/clickobserver.js +7 -13
  89. package/src/view/observer/compositionobserver.js +14 -24
  90. package/src/view/observer/domeventdata.js +57 -67
  91. package/src/view/observer/domeventobserver.js +40 -64
  92. package/src/view/observer/fakeselectionobserver.js +81 -96
  93. package/src/view/observer/focusobserver.js +45 -61
  94. package/src/view/observer/inputobserver.js +7 -13
  95. package/src/view/observer/keyobserver.js +17 -27
  96. package/src/view/observer/mouseobserver.js +7 -14
  97. package/src/view/observer/mutationobserver.js +220 -315
  98. package/src/view/observer/observer.js +81 -102
  99. package/src/view/observer/selectionobserver.js +191 -246
  100. package/src/view/observer/tabobserver.js +23 -36
  101. package/src/view/placeholder.js +128 -173
  102. package/src/view/position.js +350 -401
  103. package/src/view/range.js +453 -513
  104. package/src/view/rawelement.js +85 -112
  105. package/src/view/renderer.js +874 -1018
  106. package/src/view/rooteditableelement.js +80 -90
  107. package/src/view/selection.js +608 -689
  108. package/src/view/styles/background.js +43 -44
  109. package/src/view/styles/border.js +220 -276
  110. package/src/view/styles/margin.js +8 -17
  111. package/src/view/styles/padding.js +8 -16
  112. package/src/view/styles/utils.js +127 -160
  113. package/src/view/stylesmap.js +728 -905
  114. package/src/view/text.js +102 -126
  115. package/src/view/textproxy.js +144 -170
  116. package/src/view/treewalker.js +383 -479
  117. package/src/view/typecheckable.js +19 -0
  118. package/src/view/uielement.js +166 -187
  119. package/src/view/upcastwriter.js +395 -449
  120. package/src/view/view.js +569 -664
  121. package/src/dataprocessor/dataprocessor.jsdoc +0 -64
  122. package/src/model/item.jsdoc +0 -14
  123. package/src/view/elementdefinition.jsdoc +0 -59
  124. 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( stylesProcessor ) {
35
- stylesProcessor.setNormalizer( 'background', normalizeBackground );
36
- stylesProcessor.setNormalizer( 'background-color', value => ( { path: 'background.color', value } ) );
37
- stylesProcessor.setReducer( 'background', value => {
38
- const ret = [];
39
-
40
- ret.push( [ 'background-color', value.color ] );
41
-
42
- return ret;
43
- } );
44
-
45
- stylesProcessor.setStyleRelation( 'background', [ 'background-color' ] );
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
- function normalizeBackground( value ) {
49
- const background = {};
50
-
51
- const parts = getShorthandValues( value );
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( stylesProcessor ) {
45
- stylesProcessor.setNormalizer( 'border', borderNormalizer );
46
-
47
- // Border-position shorthands.
48
- stylesProcessor.setNormalizer( 'border-top', getBorderPositionNormalizer( 'top' ) );
49
- stylesProcessor.setNormalizer( 'border-right', getBorderPositionNormalizer( 'right' ) );
50
- stylesProcessor.setNormalizer( 'border-bottom', getBorderPositionNormalizer( 'bottom' ) );
51
- stylesProcessor.setNormalizer( 'border-left', getBorderPositionNormalizer( 'left' ) );
52
-
53
- // Border-property shorthands.
54
- stylesProcessor.setNormalizer( 'border-color', getBorderPropertyNormalizer( 'color' ) );
55
- stylesProcessor.setNormalizer( 'border-width', getBorderPropertyNormalizer( 'width' ) );
56
- stylesProcessor.setNormalizer( 'border-style', getBorderPropertyNormalizer( 'style' ) );
57
-
58
- // Border longhands.
59
- stylesProcessor.setNormalizer( 'border-top-color', getBorderPropertyPositionNormalizer( 'color', 'top' ) );
60
- stylesProcessor.setNormalizer( 'border-top-style', getBorderPropertyPositionNormalizer( 'style', 'top' ) );
61
- stylesProcessor.setNormalizer( 'border-top-width', getBorderPropertyPositionNormalizer( 'width', 'top' ) );
62
-
63
- stylesProcessor.setNormalizer( 'border-right-color', getBorderPropertyPositionNormalizer( 'color', 'right' ) );
64
- stylesProcessor.setNormalizer( 'border-right-style', getBorderPropertyPositionNormalizer( 'style', 'right' ) );
65
- stylesProcessor.setNormalizer( 'border-right-width', getBorderPropertyPositionNormalizer( 'width', 'right' ) );
66
-
67
- stylesProcessor.setNormalizer( 'border-bottom-color', getBorderPropertyPositionNormalizer( 'color', 'bottom' ) );
68
- stylesProcessor.setNormalizer( 'border-bottom-style', getBorderPropertyPositionNormalizer( 'style', 'bottom' ) );
69
- stylesProcessor.setNormalizer( 'border-bottom-width', getBorderPropertyPositionNormalizer( 'width', 'bottom' ) );
70
-
71
- stylesProcessor.setNormalizer( 'border-left-color', getBorderPropertyPositionNormalizer( 'color', 'left' ) );
72
- stylesProcessor.setNormalizer( 'border-left-style', getBorderPropertyPositionNormalizer( 'style', 'left' ) );
73
- stylesProcessor.setNormalizer( 'border-left-width', getBorderPropertyPositionNormalizer( 'width', 'left' ) );
74
-
75
- stylesProcessor.setExtractor( 'border-top', getBorderPositionExtractor( 'top' ) );
76
- stylesProcessor.setExtractor( 'border-right', getBorderPositionExtractor( 'right' ) );
77
- stylesProcessor.setExtractor( 'border-bottom', getBorderPositionExtractor( 'bottom' ) );
78
- stylesProcessor.setExtractor( 'border-left', getBorderPositionExtractor( 'left' ) );
79
-
80
- stylesProcessor.setExtractor( 'border-top-color', 'border.color.top' );
81
- stylesProcessor.setExtractor( 'border-right-color', 'border.color.right' );
82
- stylesProcessor.setExtractor( 'border-bottom-color', 'border.color.bottom' );
83
- stylesProcessor.setExtractor( 'border-left-color', 'border.color.left' );
84
-
85
- stylesProcessor.setExtractor( 'border-top-width', 'border.width.top' );
86
- stylesProcessor.setExtractor( 'border-right-width', 'border.width.right' );
87
- stylesProcessor.setExtractor( 'border-bottom-width', 'border.width.bottom' );
88
- stylesProcessor.setExtractor( 'border-left-width', 'border.width.left' );
89
-
90
- stylesProcessor.setExtractor( 'border-top-style', 'border.style.top' );
91
- stylesProcessor.setExtractor( 'border-right-style', 'border.style.right' );
92
- stylesProcessor.setExtractor( 'border-bottom-style', 'border.style.bottom' );
93
- stylesProcessor.setExtractor( 'border-left-style', 'border.style.left' );
94
-
95
- stylesProcessor.setReducer( 'border-color', getBoxSidesValueReducer( 'border-color' ) );
96
- stylesProcessor.setReducer( 'border-style', getBoxSidesValueReducer( 'border-style' ) );
97
- stylesProcessor.setReducer( 'border-width', getBoxSidesValueReducer( 'border-width' ) );
98
- stylesProcessor.setReducer( 'border-top', getBorderPositionReducer( 'top' ) );
99
- stylesProcessor.setReducer( 'border-right', getBorderPositionReducer( 'right' ) );
100
- stylesProcessor.setReducer( 'border-bottom', getBorderPositionReducer( 'bottom' ) );
101
- stylesProcessor.setReducer( 'border-left', getBorderPositionReducer( 'left' ) );
102
- stylesProcessor.setReducer( 'border', getBorderReducer() );
103
-
104
- stylesProcessor.setStyleRelation( 'border', [
105
- 'border-color', 'border-style', 'border-width',
106
- 'border-top', 'border-right', 'border-bottom', 'border-left',
107
- 'border-top-color', 'border-right-color', 'border-bottom-color', 'border-left-color',
108
- 'border-top-style', 'border-right-style', 'border-bottom-style', 'border-left-style',
109
- 'border-top-width', 'border-right-width', 'border-bottom-width', 'border-left-width'
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
- function borderNormalizer( value ) {
129
- const { color, style, width } = normalizeBorderShorthand( value );
130
-
131
- return {
132
- path: 'border',
133
- value: {
134
- color: getBoxSidesValues( color ),
135
- style: getBoxSidesValues( style ),
136
- width: getBoxSidesValues( width )
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
- function getBorderPositionNormalizer( side ) {
142
- return value => {
143
- const { color, style, width } = normalizeBorderShorthand( value );
144
-
145
- const border = {};
146
-
147
- if ( color !== undefined ) {
148
- border.color = { [ side ]: color };
149
- }
150
-
151
- if ( style !== undefined ) {
152
- border.style = { [ side ]: style };
153
- }
154
-
155
- if ( width !== undefined ) {
156
- border.width = { [ side ]: width };
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
- function getBorderPropertyNormalizer( propertyName ) {
167
- return value => {
168
- return {
169
- path: 'border',
170
- value: toBorderPropertyShorthand( value, propertyName )
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
- function toBorderPropertyShorthand( value, property ) {
176
- return {
177
- [ property ]: getBoxSidesValues( value )
178
- };
147
+ function toBorderPropertyShorthand(value, property) {
148
+ return {
149
+ [property]: getBoxSidesValues(value)
150
+ };
179
151
  }
180
-
181
- function getBorderPropertyPositionNormalizer( property, side ) {
182
- return value => {
183
- return {
184
- path: 'border',
185
- value: {
186
- [ property ]: {
187
- [ side ]: value
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
- function getBorderPositionExtractor( which ) {
195
- return ( name, styles ) => {
196
- if ( styles.border ) {
197
- return extractBorderPosition( styles.border, which );
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
- function extractBorderPosition( border, which ) {
203
- const value = {};
204
-
205
- if ( border.width && border.width[ which ] ) {
206
- value.width = border.width[ which ];
207
- }
208
-
209
- if ( border.style && border.style[ which ] ) {
210
- value.style = border.style[ which ];
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
- function normalizeBorderShorthand( string ) {
221
- const result = {};
222
-
223
- const parts = getShorthandValues( string );
224
-
225
- for ( const part of parts ) {
226
- if ( isLength( part ) || /thin|medium|thick/.test( part ) ) {
227
- result.width = part;
228
- } else if ( isLineStyle( part ) ) {
229
- result.style = part;
230
- } else {
231
- result.color = part;
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
- return value => {
266
- const topStyles = extractBorderPosition( value, 'top' );
267
- const rightStyles = extractBorderPosition( value, 'right' );
268
- const bottomStyles = extractBorderPosition( value, 'bottom' );
269
- const leftStyles = extractBorderPosition( value, 'left' );
270
-
271
- const borderStyles = [ topStyles, rightStyles, bottomStyles, leftStyles ];
272
-
273
- const borderStylesByType = {
274
- width: getReducedStyleValueForType( borderStyles, 'width' ),
275
- style: getReducedStyleValueForType( borderStyles, 'style' ),
276
- color: getReducedStyleValueForType( borderStyles, 'color' )
277
- };
278
-
279
- // Try reducing to a single `border:` property.
280
- const reducedBorderStyle = reduceBorderPosition( borderStylesByType, 'all' );
281
-
282
- if ( reducedBorderStyle.length ) {
283
- return reducedBorderStyle;
284
- }
285
-
286
- // Try reducing to `border-style:`, `border-width:`, `border-color:` properties.
287
- const reducedStyleTypes = Object.entries( borderStylesByType ).reduce( ( reducedStyleTypes, [ type, value ] ) => {
288
- if ( value ) {
289
- reducedStyleTypes.push( [ `border-${ type }`, value ] );
290
-
291
- // Remove it from the full set to not include it in the most specific properties later.
292
- borderStyles.forEach( style => ( style[ type ] = null ) );
293
- }
294
-
295
- return reducedStyleTypes;
296
- }, [] );
297
-
298
- // The reduced properties (by type) and all that remains that could not be reduced.
299
- return [
300
- ...reducedStyleTypes,
301
- ...reduceBorderPosition( topStyles, 'top' ),
302
- ...reduceBorderPosition( rightStyles, 'right' ),
303
- ...reduceBorderPosition( bottomStyles, 'bottom' ),
304
- ...reduceBorderPosition( leftStyles, 'left' )
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
- function getBorderPositionReducer( which ) {
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( value, which ) {
332
- const borderTypes = [];
333
-
334
- if ( value && value.width ) {
335
- borderTypes.push( 'width' );
336
- }
337
-
338
- if ( value && value.style ) {
339
- borderTypes.push( 'style' );
340
- }
341
-
342
- if ( value && value.color ) {
343
- borderTypes.push( 'color' );
344
- }
345
-
346
- if ( borderTypes.length == 3 ) {
347
- const borderValue = borderTypes.map( item => value[ item ] ).join( ' ' );
348
-
349
- return [
350
- which == 'all' ? [ 'border', borderValue ] : [ `border-${ which }`, borderValue ]
351
- ];
352
- }
353
-
354
- // We are unable to reduce to a single `border:` property.
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
  }