@openui5/sap.ui.layout 1.106.0 → 1.107.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 (58) hide show
  1. package/package.json +2 -2
  2. package/src/sap/ui/layout/.library +1 -1
  3. package/src/sap/ui/layout/AlignedFlowLayout.js +4 -3
  4. package/src/sap/ui/layout/AssociativeSplitter.js +1 -1
  5. package/src/sap/ui/layout/BlockLayout.js +29 -26
  6. package/src/sap/ui/layout/BlockLayoutCell.js +4 -3
  7. package/src/sap/ui/layout/BlockLayoutCellData.js +1 -2
  8. package/src/sap/ui/layout/BlockLayoutRow.js +4 -3
  9. package/src/sap/ui/layout/DynamicSideContent.js +84 -80
  10. package/src/sap/ui/layout/DynamicSideContentRenderer.js +3 -3
  11. package/src/sap/ui/layout/FixFlex.js +9 -7
  12. package/src/sap/ui/layout/Grid.js +74 -71
  13. package/src/sap/ui/layout/GridData.js +1 -2
  14. package/src/sap/ui/layout/GridRenderer.js +1 -1
  15. package/src/sap/ui/layout/HorizontalLayout.js +22 -19
  16. package/src/sap/ui/layout/PaneContainer.js +1 -1
  17. package/src/sap/ui/layout/ResponsiveFlowLayout.js +35 -30
  18. package/src/sap/ui/layout/ResponsiveFlowLayoutData.js +1 -2
  19. package/src/sap/ui/layout/ResponsiveSplitter.js +1 -1
  20. package/src/sap/ui/layout/ResponsiveSplitterPage.js +1 -1
  21. package/src/sap/ui/layout/SplitPane.js +1 -1
  22. package/src/sap/ui/layout/Splitter.js +6 -5
  23. package/src/sap/ui/layout/SplitterLayoutData.js +1 -2
  24. package/src/sap/ui/layout/VerticalLayout.js +29 -26
  25. package/src/sap/ui/layout/changeHandler/AddFormContainer.js +1 -1
  26. package/src/sap/ui/layout/changeHandler/AddFormField.js +1 -1
  27. package/src/sap/ui/layout/changeHandler/AddSimpleFormField.js +8 -3
  28. package/src/sap/ui/layout/changeHandler/AddSimpleFormGroup.js +7 -2
  29. package/src/sap/ui/layout/changeHandler/HideSimpleForm.js +6 -12
  30. package/src/sap/ui/layout/changeHandler/MoveSimpleForm.js +13 -13
  31. package/src/sap/ui/layout/changeHandler/RenameFormContainer.js +1 -1
  32. package/src/sap/ui/layout/changeHandler/RenameSimpleForm.js +6 -4
  33. package/src/sap/ui/layout/changeHandler/UnhideSimpleForm.js +3 -2
  34. package/src/sap/ui/layout/cssgrid/CSSGrid.js +1 -2
  35. package/src/sap/ui/layout/cssgrid/GridBasicLayout.js +1 -2
  36. package/src/sap/ui/layout/cssgrid/GridBoxLayout.js +1 -2
  37. package/src/sap/ui/layout/cssgrid/GridItemLayoutData.js +1 -2
  38. package/src/sap/ui/layout/cssgrid/GridLayoutBase.js +1 -2
  39. package/src/sap/ui/layout/cssgrid/GridLayoutDelegate.js +1 -1
  40. package/src/sap/ui/layout/cssgrid/GridResponsiveLayout.js +1 -2
  41. package/src/sap/ui/layout/cssgrid/GridSettings.js +1 -2
  42. package/src/sap/ui/layout/cssgrid/ResponsiveColumnItemLayoutData.js +1 -2
  43. package/src/sap/ui/layout/cssgrid/ResponsiveColumnLayout.js +1 -2
  44. package/src/sap/ui/layout/form/ColumnContainerData.js +1 -2
  45. package/src/sap/ui/layout/form/ColumnElementData.js +1 -2
  46. package/src/sap/ui/layout/form/ColumnLayout.js +41 -38
  47. package/src/sap/ui/layout/form/Form.js +78 -75
  48. package/src/sap/ui/layout/form/FormContainer.js +1 -2
  49. package/src/sap/ui/layout/form/FormElement.js +1 -3
  50. package/src/sap/ui/layout/form/FormLayout.js +22 -18
  51. package/src/sap/ui/layout/form/GridContainerData.js +1 -2
  52. package/src/sap/ui/layout/form/GridElementData.js +1 -2
  53. package/src/sap/ui/layout/form/GridLayout.js +19 -16
  54. package/src/sap/ui/layout/form/ResponsiveGridLayout.js +138 -135
  55. package/src/sap/ui/layout/form/ResponsiveLayout.js +15 -12
  56. package/src/sap/ui/layout/form/SemanticFormElement.js +1 -2
  57. package/src/sap/ui/layout/form/SimpleForm.js +437 -404
  58. package/src/sap/ui/layout/library.js +2 -25
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@openui5/sap.ui.layout",
3
- "version": "1.106.0",
3
+ "version": "1.107.0",
4
4
  "description": "OpenUI5 UI Library sap.ui.layout",
5
5
  "author": "SAP SE (https://www.sap.com)",
6
6
  "license": "Apache-2.0",
@@ -14,6 +14,6 @@
14
14
  "url": "https://github.com/SAP/openui5.git"
15
15
  },
16
16
  "dependencies": {
17
- "@openui5/sap.ui.core": "1.106.0"
17
+ "@openui5/sap.ui.core": "1.107.0"
18
18
  }
19
19
  }
@@ -6,7 +6,7 @@
6
6
  <copyright>OpenUI5
7
7
  * (c) Copyright 2009-2022 SAP SE or an SAP affiliate company.
8
8
  * Licensed under the Apache License, Version 2.0 - see LICENSE.txt.</copyright>
9
- <version>1.106.0</version>
9
+ <version>1.107.0</version>
10
10
 
11
11
  <documentation>SAPUI5 library with layout controls.</documentation>
12
12
 
@@ -40,7 +40,7 @@ sap.ui.define([
40
40
  * @extends sap.ui.core.Control
41
41
  *
42
42
  * @author SAP SE
43
- * @version 1.106.0
43
+ * @version 1.107.0
44
44
  *
45
45
  * @constructor
46
46
  * @private
@@ -48,7 +48,6 @@ sap.ui.define([
48
48
  *
49
49
  * @since 1.48
50
50
  * @alias sap.ui.layout.AlignedFlowLayout
51
- * @ui5-metamodel This control will also be described in the UI5 (legacy) design time meta model.
52
51
  */
53
52
  var AlignedFlowLayout = Control.extend("sap.ui.layout.AlignedFlowLayout", {
54
53
  metadata: {
@@ -96,7 +95,9 @@ sap.ui.define([
96
95
  multiple: true
97
96
  }
98
97
  }
99
- }
98
+ },
99
+
100
+ renderer: AlignedFlowLayoutRenderer
100
101
  });
101
102
 
102
103
  /**
@@ -24,7 +24,7 @@ sap.ui.define([
24
24
  * @extends sap.ui.layout.Splitter
25
25
  *
26
26
  * @author SAP SE
27
- * @version 1.106.0
27
+ * @version 1.107.0
28
28
  *
29
29
  * @constructor
30
30
  * @private
@@ -63,40 +63,43 @@ sap.ui.define([
63
63
  * @extends sap.ui.core.Control
64
64
  *
65
65
  * @author SAP SE
66
- * @version 1.106.0
66
+ * @version 1.107.0
67
67
  *
68
68
  * @constructor
69
69
  * @public
70
70
  * @since 1.34
71
71
  * @alias sap.ui.layout.BlockLayout
72
72
  * @see {@link fiori:https://experience.sap.com/fiori-design-web/block-layout/ Block Layout}
73
- * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
74
73
  */
75
- var BlockLayout = Control.extend("sap.ui.layout.BlockLayout", { metadata : {
76
-
77
- library : "sap.ui.layout",
78
- properties : {
79
- /**
80
- * Determines the background used for the Layout
81
- * @since 1.42
82
- */
83
- background: { type: "sap.ui.layout.BlockBackgroundType", group: "Appearance", defaultValue: "Default" },
84
-
85
- /**
86
- * Keeps the font-size of the contents as is, independent from the screen size.
87
- * @since 1.52
88
- */
89
- keepFontSize: { type: "boolean", group:"Behavior", defaultValue: false}
74
+ var BlockLayout = Control.extend("sap.ui.layout.BlockLayout", {
75
+ metadata : {
76
+
77
+ library : "sap.ui.layout",
78
+ properties : {
79
+ /**
80
+ * Determines the background used for the Layout
81
+ * @since 1.42
82
+ */
83
+ background: { type: "sap.ui.layout.BlockBackgroundType", group: "Appearance", defaultValue: "Default" },
84
+
85
+ /**
86
+ * Keeps the font-size of the contents as is, independent from the screen size.
87
+ * @since 1.52
88
+ */
89
+ keepFontSize: { type: "boolean", group:"Behavior", defaultValue: false}
90
+ },
91
+ defaultAggregation : "content",
92
+ aggregations : {
93
+ /**
94
+ * The Rows to be included in the content of the control
95
+ */
96
+ content: { type: "sap.ui.layout.BlockLayoutRow", multiple: true }
97
+ },
98
+ designtime: "sap/ui/layout/designtime/BlockLayout.designtime"
90
99
  },
91
- defaultAggregation : "content",
92
- aggregations : {
93
- /**
94
- * The Rows to be included in the content of the control
95
- */
96
- content: { type: "sap.ui.layout.BlockLayoutRow", multiple: true }
97
- },
98
- designtime: "sap/ui/layout/designtime/BlockLayout.designtime"
99
- }});
100
+
101
+ renderer: BlockLayoutRenderer
102
+ });
100
103
 
101
104
  /**
102
105
  * Breakpoints used for the parent container of the Layout, to determine the inner representation of the rows.
@@ -26,13 +26,12 @@ sap.ui.define([
26
26
  * @extends sap.ui.core.Control
27
27
  *
28
28
  * @author SAP SE
29
- * @version 1.106.0
29
+ * @version 1.107.0
30
30
  *
31
31
  * @constructor
32
32
  * @public
33
33
  * @since 1.34
34
34
  * @alias sap.ui.layout.BlockLayoutCell
35
- * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
36
35
  */
37
36
  var BlockLayoutCell = Control.extend("sap.ui.layout.BlockLayoutCell", {
38
37
  metadata: {
@@ -98,7 +97,9 @@ sap.ui.define([
98
97
  titleLink: {type: "sap.ui.core.Control", multiple : false}
99
98
  },
100
99
  designtime: "sap/ui/layout/designtime/BlockLayoutCell.designtime"
101
- }
100
+ },
101
+
102
+ renderer: BlockLayoutCellRenderer
102
103
  });
103
104
 
104
105
  BlockLayoutCell.prototype.setLayoutData = function (oLayoutData) {
@@ -18,12 +18,11 @@ sap.ui.define(['sap/ui/core/LayoutData', './library'],
18
18
  * @class
19
19
  * Holds layout data for the BlockLayoutCells contents.
20
20
  * @extends sap.ui.core.LayoutData
21
- * @version 1.106.0
21
+ * @version 1.107.0
22
22
  * @constructor
23
23
  * @public
24
24
  * @since 1.50.0
25
25
  * @alias sap.ui.layout.BlockLayoutCellData
26
- * @ui5-metamodel This control/element also will be described in the UI5 (legacy) design time metamodel
27
26
  */
28
27
  var BlockLayoutCellData = LayoutData.extend("sap.ui.layout.BlockLayoutCellData", { metadata : {
29
28
  library : "sap.ui.layout",
@@ -32,13 +32,12 @@ sap.ui.define([
32
32
  * @extends sap.ui.core.Control
33
33
  *
34
34
  * @author SAP SE
35
- * @version 1.106.0
35
+ * @version 1.107.0
36
36
  *
37
37
  * @constructor
38
38
  * @public
39
39
  * @since 1.34
40
40
  * @alias sap.ui.layout.BlockLayoutRow
41
- * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
42
41
  */
43
42
  var BlockLayoutRow = Control.extend("sap.ui.layout.BlockLayoutRow", {
44
43
  metadata: {
@@ -80,7 +79,9 @@ sap.ui.define([
80
79
  accentCells: {type: "sap.ui.layout.BlockLayoutCell", multiple: true, singularName: "accentCell"}
81
80
  },
82
81
  designtime: "sap/ui/layout/designtime/BlockLayoutRow.designtime"
83
- }
82
+ },
83
+
84
+ renderer: BlockLayoutRowRenderer
84
85
  });
85
86
 
86
87
  BlockLayoutRow.prototype.init = function () {
@@ -94,7 +94,7 @@ sap.ui.define([
94
94
  * @extends sap.ui.core.Control
95
95
  *
96
96
  * @author SAP SE
97
- * @version 1.106.0
97
+ * @version 1.107.0
98
98
  *
99
99
  * @constructor
100
100
  * @public
@@ -102,88 +102,92 @@ sap.ui.define([
102
102
  * @alias sap.ui.layout.DynamicSideContent
103
103
  * @see {@link fiori:https://experience.sap.com/fiori-design-web/dynamic-side-content/ Dynamic Side Content}
104
104
  */
105
- var DynamicSideContent = Control.extend("sap.ui.layout.DynamicSideContent", /** @lends sap.ui.layout.DynamicSideContent.prototype */ { metadata : {
106
- library : "sap.ui.layout",
107
- properties : {
108
-
109
- /**
110
- * Determines whether the side content is visible or hidden.
111
- *
112
- * <b>Note:</b> If both <code>showSideContent</code> and <code>showMainContent</code> properties are set to <code>true</code>,
113
- * use the <code>toggle</code> method for showing the side content on phone.
114
- */
115
- showSideContent : {type : "boolean", group : "Appearance", defaultValue : true},
116
-
117
- /**
118
- * Determines whether the main content is visible or hidden.
119
- */
120
- showMainContent : {type : "boolean", group : "Appearance", defaultValue : true},
121
-
122
- /**
123
- * Determines on which breakpoints the side content is visible.
124
- */
125
- sideContentVisibility : {type : "sap.ui.layout.SideContentVisibility", group : "Appearance", defaultValue : SideContentVisibility.ShowAboveS},
126
-
127
- /**
128
- * Determines on which breakpoints the side content falls down below the main content.
129
- */
130
- sideContentFallDown : {type : "sap.ui.layout.SideContentFallDown", group : "Appearance", defaultValue : SideContentFallDown.OnMinimumWidth},
131
-
132
- /**
133
- * Defines whether the control is in equal split mode. In this mode, the side and the main content
134
- * take 50:50 percent of the container on all screen sizes except for phone, where the main and
135
- * side contents are switching visibility using the toggle method.
136
- */
137
- equalSplit : {type : "boolean", group : "Appearance", defaultValue : false},
138
-
139
- /**
140
- * If set to TRUE, then not the media Query (device screen size) but the size of the container, surrounding the control, defines the current range.
141
- */
142
- containerQuery : {type : "boolean", group : "Behavior", defaultValue : false},
143
-
144
- /**
145
- * Determines whether the side content is on the left or on the right side of the main content.
146
- * @since 1.36
147
- */
148
- sideContentPosition : {type : "sap.ui.layout.SideContentPosition", group : "Appearance", defaultValue : SideContentPosition.End},
149
-
150
- /**
151
- * Defiles the main content span size
152
- */
153
- mcSpan: { type: "int", defaultValue: 0, visibility: "hidden" },
154
-
155
- /**
156
- * Defines the side content span size
157
- */
158
- scSpan: { type: "int", defaultValue: 0, visibility: "hidden" }
159
- },
160
- defaultAggregation : "mainContent",
161
- events : {
162
- /**
163
- * Fires when the current breakpoint has been changed.
164
- * @since 1.32
165
- */
166
- breakpointChanged : {
167
- parameters : {
168
- currentBreakpoint : {type : "string"}
105
+ var DynamicSideContent = Control.extend("sap.ui.layout.DynamicSideContent", /** @lends sap.ui.layout.DynamicSideContent.prototype */ {
106
+ metadata : {
107
+ library : "sap.ui.layout",
108
+ properties : {
109
+
110
+ /**
111
+ * Determines whether the side content is visible or hidden.
112
+ *
113
+ * <b>Note:</b> If both <code>showSideContent</code> and <code>showMainContent</code> properties are set to <code>true</code>,
114
+ * use the <code>toggle</code> method for showing the side content on phone.
115
+ */
116
+ showSideContent : {type : "boolean", group : "Appearance", defaultValue : true},
117
+
118
+ /**
119
+ * Determines whether the main content is visible or hidden.
120
+ */
121
+ showMainContent : {type : "boolean", group : "Appearance", defaultValue : true},
122
+
123
+ /**
124
+ * Determines on which breakpoints the side content is visible.
125
+ */
126
+ sideContentVisibility : {type : "sap.ui.layout.SideContentVisibility", group : "Appearance", defaultValue : SideContentVisibility.ShowAboveS},
127
+
128
+ /**
129
+ * Determines on which breakpoints the side content falls down below the main content.
130
+ */
131
+ sideContentFallDown : {type : "sap.ui.layout.SideContentFallDown", group : "Appearance", defaultValue : SideContentFallDown.OnMinimumWidth},
132
+
133
+ /**
134
+ * Defines whether the control is in equal split mode. In this mode, the side and the main content
135
+ * take 50:50 percent of the container on all screen sizes except for phone, where the main and
136
+ * side contents are switching visibility using the toggle method.
137
+ */
138
+ equalSplit : {type : "boolean", group : "Appearance", defaultValue : false},
139
+
140
+ /**
141
+ * If set to TRUE, then not the media Query (device screen size) but the size of the container, surrounding the control, defines the current range.
142
+ */
143
+ containerQuery : {type : "boolean", group : "Behavior", defaultValue : false},
144
+
145
+ /**
146
+ * Determines whether the side content is on the left or on the right side of the main content.
147
+ * @since 1.36
148
+ */
149
+ sideContentPosition : {type : "sap.ui.layout.SideContentPosition", group : "Appearance", defaultValue : SideContentPosition.End},
150
+
151
+ /**
152
+ * Defiles the main content span size
153
+ */
154
+ mcSpan: { type: "int", defaultValue: 0, visibility: "hidden" },
155
+
156
+ /**
157
+ * Defines the side content span size
158
+ */
159
+ scSpan: { type: "int", defaultValue: 0, visibility: "hidden" }
160
+ },
161
+ defaultAggregation : "mainContent",
162
+ events : {
163
+ /**
164
+ * Fires when the current breakpoint has been changed.
165
+ * @since 1.32
166
+ */
167
+ breakpointChanged : {
168
+ parameters : {
169
+ currentBreakpoint : {type : "string"}
170
+ }
169
171
  }
170
- }
172
+ },
173
+ aggregations : {
174
+
175
+ /**
176
+ * Main content controls.
177
+ */
178
+ mainContent : {type: "sap.ui.core.Control", multiple: true},
179
+
180
+ /**
181
+ * Side content controls.
182
+ */
183
+ sideContent : {type: "sap.ui.core.Control", multiple: true}
184
+ },
185
+ designTime: "sap/ui/layout/designtime/DynamicSideContent.designtime",
186
+ dnd: { draggable: false, droppable: true }
171
187
  },
172
- aggregations : {
173
188
 
174
- /**
175
- * Main content controls.
176
- */
177
- mainContent : {type: "sap.ui.core.Control", multiple: true},
178
-
179
- /**
180
- * Side content controls.
181
- */
182
- sideContent : {type: "sap.ui.core.Control", multiple: true}
183
- },
184
- designTime: "sap/ui/layout/designtime/DynamicSideContent.designtime",
185
- dnd: { draggable: false, droppable: true }
186
- }});
189
+ renderer: DynamicSideContentRenderer
190
+ });
187
191
 
188
192
  var S = "S",
189
193
  M = "M",
@@ -5,8 +5,8 @@
5
5
  */
6
6
 
7
7
  // Provides default renderer for control sap.ui.layout.DynamicSideContent
8
- sap.ui.define(["sap/ui/layout/library", "sap/ui/Device"],
9
- function(library, Device) {
8
+ sap.ui.define(["sap/ui/layout/library", "sap/ui/Device", "sap/ui/core/Configuration"],
9
+ function(library, Device, Configuration) {
10
10
  "use strict";
11
11
 
12
12
  // shortcut for sap.ui.layout.SideContentPosition
@@ -38,7 +38,7 @@ sap.ui.define(["sap/ui/layout/library", "sap/ui/Device"],
38
38
  DynamicSideContentRenderer.renderSubControls = function (oRm, oSideControl) {
39
39
  var iSideContentId = oSideControl.getId(),
40
40
  bShouldSetHeight = oSideControl._shouldSetHeight(),
41
- bPageRTL = sap.ui.getCore().getConfiguration().getRTL(),
41
+ bPageRTL = Configuration.getRTL(),
42
42
  position = oSideControl.getSideContentPosition();
43
43
 
44
44
  if ((position === SideContentPosition.Begin && !bPageRTL) || (bPageRTL && position === SideContentPosition.End)) {
@@ -10,13 +10,14 @@ sap.ui.define([
10
10
  "sap/ui/core/EnabledPropagator",
11
11
  "sap/ui/core/ResizeHandler",
12
12
  "sap/ui/core/delegate/ScrollEnablement",
13
- "sap/ui/layout/library",
14
- "./FixFlexRenderer"
15
- ], function (
13
+ "./FixFlexRenderer",
14
+ "sap/ui/layout/library"
15
+ ], function(
16
16
  Control,
17
17
  EnabledPropagator,
18
18
  ResizeHandler,
19
- ScrollEnablement
19
+ ScrollEnablement,
20
+ FixFlexRenderer
20
21
  ) {
21
22
  "use strict";
22
23
 
@@ -52,13 +53,12 @@ sap.ui.define([
52
53
  * @extends sap.ui.core.Control
53
54
  *
54
55
  * @author SAP SE
55
- * @version 1.106.0
56
+ * @version 1.107.0
56
57
  *
57
58
  * @constructor
58
59
  * @public
59
60
  * @since 1.25.0
60
61
  * @alias sap.ui.layout.FixFlex
61
- * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
62
62
  */
63
63
  var FixFlex = Control.extend("sap.ui.layout.FixFlex", /** @lends sap.ui.layout.FixFlex.prototype */ {
64
64
  metadata: {
@@ -102,7 +102,9 @@ sap.ui.define([
102
102
  },
103
103
  designtime: "sap/ui/layout/designtime/FixFlex.designtime",
104
104
  dnd: { draggable: false, droppable: true }
105
- }
105
+ },
106
+
107
+ renderer: FixFlexRenderer
106
108
  });
107
109
 
108
110
  EnabledPropagator.call(FixFlex.prototype);
@@ -59,7 +59,7 @@ sap.ui.define([
59
59
  * @extends sap.ui.core.Control
60
60
  *
61
61
  * @author SAP SE
62
- * @version 1.106.0
62
+ * @version 1.107.0
63
63
  *
64
64
  * @constructor
65
65
  * @public
@@ -67,79 +67,82 @@ sap.ui.define([
67
67
  * @see {@link topic:43ae317cf39640a88bc8be979d2671df Grid}
68
68
  * @see {@link topic:32d4b9c2b981425dbc374d3e9d5d0c2e Grid Controls}
69
69
  * @alias sap.ui.layout.Grid
70
- * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
71
70
  */
72
- var Grid = Control.extend("sap.ui.layout.Grid", /** @lends sap.ui.layout.Grid.prototype */ { metadata : {
73
-
74
- library : "sap.ui.layout",
75
- properties : {
76
-
77
- /**
78
- * Optional. Defines the width of the <code>Grid</code>. If not specified, then 100%.
79
- */
80
- width : {type : "sap.ui.core.CSSSize", group : "Dimension", defaultValue : '100%'},
81
-
82
- /**
83
- * Optional. Defines the vertical spacing between the rows in the <code>Grid</code>.
84
- * In rem, allowed values are 0, 0.5, 1 and 2.
85
- */
86
- vSpacing : {type : "float", group : "Dimension", defaultValue : 1},
87
-
88
- /**
89
- * Optional. Defines the horizontal spacing between the content in the <code>Grid</code>.
90
- * In rem, allowed values are 0, 0.5 , 1 or 2.
91
- */
92
- hSpacing : {type : "float", group : "Dimension", defaultValue : 1},
93
-
94
- /**
95
- * Optional. Defines the position of the <code>Grid</code> in the window or surrounding container.
96
- */
97
- position : {type : "sap.ui.layout.GridPosition", group : "Dimension", defaultValue : "Left"},
98
-
99
- /**
100
- * Optional. A string type that represents the span values of the <code>Grid</code> for
101
- * large, medium and small screens. Allowed values are separated by space Letters L, M or S followed
102
- * by number of columns from 1 to 12 that the container has to take, for example, <code>L2 M4 S6</code>,
103
- * <code>M12</code>, <code>s10</code> or <code>l4 m4</code>.
104
- *
105
- * <b>Note:</b> The parameters must be provided in the order <large medium small>.
106
- */
107
- defaultSpan : {type : "sap.ui.layout.GridSpan", group : "Behavior", defaultValue : "XL3 L3 M6 S12"},
108
-
109
- /**
110
- * Optional. Defines default for the whole Grid numbers of empty columns before the current span begins.
111
- * It can be defined for large, medium and small screens. Allowed values are separated by space Letters
112
- * L, M or S followed by number of columns from 0 to 11 that the container has to take, for example,
113
- * <code>L2 M4 S6</code>, <code>M11</code>, <code>s10</code> or <code>l4 m4</code>.
114
- *
115
- * <b>Note:</b> The parameters must be provided in the order <large medium small>.
116
- */
117
- defaultIndent : {type : "sap.ui.layout.GridIndent", group : "Behavior", defaultValue : "XL0 L0 M0 S0"},
118
-
119
- /**
120
- * If set to <code>true</code>, the current range (large, medium or small) is defined by the size of the
121
- * container surrounding the <code>Grid</code> instead of the device screen size (media Query).
122
- */
123
- containerQuery : {type : "boolean", group : "Behavior", defaultValue : false}
71
+ var Grid = Control.extend("sap.ui.layout.Grid", /** @lends sap.ui.layout.Grid.prototype */ {
72
+ metadata : {
73
+
74
+ library : "sap.ui.layout",
75
+ properties : {
76
+
77
+ /**
78
+ * Optional. Defines the width of the <code>Grid</code>. If not specified, then 100%.
79
+ */
80
+ width : {type : "sap.ui.core.CSSSize", group : "Dimension", defaultValue : '100%'},
81
+
82
+ /**
83
+ * Optional. Defines the vertical spacing between the rows in the <code>Grid</code>.
84
+ * In rem, allowed values are 0, 0.5, 1 and 2.
85
+ */
86
+ vSpacing : {type : "float", group : "Dimension", defaultValue : 1},
87
+
88
+ /**
89
+ * Optional. Defines the horizontal spacing between the content in the <code>Grid</code>.
90
+ * In rem, allowed values are 0, 0.5 , 1 or 2.
91
+ */
92
+ hSpacing : {type : "float", group : "Dimension", defaultValue : 1},
93
+
94
+ /**
95
+ * Optional. Defines the position of the <code>Grid</code> in the window or surrounding container.
96
+ */
97
+ position : {type : "sap.ui.layout.GridPosition", group : "Dimension", defaultValue : "Left"},
98
+
99
+ /**
100
+ * Optional. A string type that represents the span values of the <code>Grid</code> for
101
+ * large, medium and small screens. Allowed values are separated by space Letters L, M or S followed
102
+ * by number of columns from 1 to 12 that the container has to take, for example, <code>L2 M4 S6</code>,
103
+ * <code>M12</code>, <code>s10</code> or <code>l4 m4</code>.
104
+ *
105
+ * <b>Note:</b> The parameters must be provided in the order <large medium small>.
106
+ */
107
+ defaultSpan : {type : "sap.ui.layout.GridSpan", group : "Behavior", defaultValue : "XL3 L3 M6 S12"},
108
+
109
+ /**
110
+ * Optional. Defines default for the whole Grid numbers of empty columns before the current span begins.
111
+ * It can be defined for large, medium and small screens. Allowed values are separated by space Letters
112
+ * L, M or S followed by number of columns from 0 to 11 that the container has to take, for example,
113
+ * <code>L2 M4 S6</code>, <code>M11</code>, <code>s10</code> or <code>l4 m4</code>.
114
+ *
115
+ * <b>Note:</b> The parameters must be provided in the order <large medium small>.
116
+ */
117
+ defaultIndent : {type : "sap.ui.layout.GridIndent", group : "Behavior", defaultValue : "XL0 L0 M0 S0"},
118
+
119
+ /**
120
+ * If set to <code>true</code>, the current range (large, medium or small) is defined by the size of the
121
+ * container surrounding the <code>Grid</code> instead of the device screen size (media Query).
122
+ */
123
+ containerQuery : {type : "boolean", group : "Behavior", defaultValue : false}
124
+ },
125
+ defaultAggregation : "content",
126
+ aggregations : {
127
+
128
+ /**
129
+ * Controls that are placed into Grid layout.
130
+ */
131
+ content : {type : "sap.ui.core.Control", multiple : true, singularName : "content"}
132
+ },
133
+ associations: {
134
+
135
+ /**
136
+ * Association to controls / IDs that label this control (see WAI-ARIA attribute <code>aria-labelledby</code>).
137
+ * @since 1.48.7
138
+ */
139
+ ariaLabelledBy: { type: "sap.ui.core.Control", multiple: true, singularName: "ariaLabelledBy" }
140
+ },
141
+ designtime: "sap/ui/layout/designtime/Grid.designtime"
124
142
  },
125
- defaultAggregation : "content",
126
- aggregations : {
127
143
 
128
- /**
129
- * Controls that are placed into Grid layout.
130
- */
131
- content : {type : "sap.ui.core.Control", multiple : true, singularName : "content"}
132
- },
133
- associations: {
134
-
135
- /**
136
- * Association to controls / IDs that label this control (see WAI-ARIA attribute <code>aria-labelledby</code>).
137
- * @since 1.48.7
138
- */
139
- ariaLabelledBy: { type: "sap.ui.core.Control", multiple: true, singularName: "ariaLabelledBy" }
140
- },
141
- designtime: "sap/ui/layout/designtime/Grid.designtime"
142
- }});
144
+ renderer: GridRenderer
145
+ });
143
146
 
144
147
  (function() {
145
148
 
@@ -28,7 +28,7 @@ sap.ui.define(['sap/ui/core/LayoutData', './library', "sap/base/Log"],
28
28
  * @extends sap.ui.core.LayoutData
29
29
  *
30
30
  * @author SAP SE
31
- * @version 1.106.0
31
+ * @version 1.107.0
32
32
  *
33
33
  * @constructor
34
34
  * @public
@@ -36,7 +36,6 @@ sap.ui.define(['sap/ui/core/LayoutData', './library', "sap/base/Log"],
36
36
  * @see {@link topic:43ae317cf39640a88bc8be979d2671df Grid}
37
37
  * @see {@link topic:32d4b9c2b981425dbc374d3e9d5d0c2e Grid Controls}
38
38
  * @alias sap.ui.layout.GridData
39
- * @ui5-metamodel This control/element also will be described in the UI5 (legacy) designtime metamodel
40
39
  */
41
40
  var GridData = LayoutData.extend("sap.ui.layout.GridData", /** @lends sap.ui.layout.GridData.prototype */ { metadata : {
42
41
 
@@ -15,7 +15,7 @@ sap.ui.define(["sap/ui/Device", "sap/ui/layout/library"],
15
15
  /**
16
16
  * @author SAP SE
17
17
  * @version
18
- * 1.106.0
18
+ * 1.107.0
19
19
  * @namespace
20
20
  */
21
21
  var GridRenderer = {