@openui5/sap.ui.layout 1.133.1 → 1.135.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/.reuse/dep5 +0 -7
- package/THIRDPARTY.txt +2 -23
- package/package.json +2 -2
- package/src/sap/ui/layout/.library +1 -1
- package/src/sap/ui/layout/AlignedFlowLayout.js +1 -1
- package/src/sap/ui/layout/AssociativeSplitter.js +1 -1
- package/src/sap/ui/layout/BlockLayout.js +1 -1
- package/src/sap/ui/layout/BlockLayoutCell.js +1 -1
- package/src/sap/ui/layout/BlockLayoutCellData.js +1 -1
- package/src/sap/ui/layout/BlockLayoutRow.js +1 -1
- package/src/sap/ui/layout/DynamicSideContent.js +1 -1
- package/src/sap/ui/layout/FixFlex.js +1 -1
- package/src/sap/ui/layout/Grid.js +1 -1
- package/src/sap/ui/layout/GridData.js +1 -1
- package/src/sap/ui/layout/GridRenderer.js +1 -1
- package/src/sap/ui/layout/HorizontalLayout.js +1 -1
- package/src/sap/ui/layout/PaneContainer.js +1 -1
- package/src/sap/ui/layout/ResponsiveFlowLayout.js +1 -1
- package/src/sap/ui/layout/ResponsiveFlowLayoutData.js +1 -1
- package/src/sap/ui/layout/ResponsiveSplitter.js +1 -1
- package/src/sap/ui/layout/ResponsiveSplitterPage.js +1 -1
- package/src/sap/ui/layout/SplitPane.js +1 -1
- package/src/sap/ui/layout/Splitter.js +1 -1
- package/src/sap/ui/layout/SplitterLayoutData.js +1 -1
- package/src/sap/ui/layout/VerticalLayout.js +1 -1
- package/src/sap/ui/layout/changeHandler/AddFormContainer.js +1 -1
- package/src/sap/ui/layout/changeHandler/AddFormField.js +1 -1
- package/src/sap/ui/layout/changeHandler/AddSimpleFormField.js +1 -1
- package/src/sap/ui/layout/changeHandler/AddSimpleFormGroup.js +1 -1
- package/src/sap/ui/layout/changeHandler/HideSimpleForm.js +1 -1
- package/src/sap/ui/layout/changeHandler/MoveSimpleForm.js +1 -1
- package/src/sap/ui/layout/changeHandler/RenameFormContainer.js +1 -1
- package/src/sap/ui/layout/changeHandler/RenameSimpleForm.js +1 -1
- package/src/sap/ui/layout/changeHandler/UnhideSimpleForm.js +1 -1
- package/src/sap/ui/layout/cssgrid/CSSGrid.js +2 -2
- package/src/sap/ui/layout/cssgrid/GridBasicLayout.js +2 -2
- package/src/sap/ui/layout/cssgrid/GridBoxLayout.js +1 -1
- package/src/sap/ui/layout/cssgrid/GridItemLayoutData.js +1 -1
- package/src/sap/ui/layout/cssgrid/GridLayoutBase.js +1 -1
- package/src/sap/ui/layout/cssgrid/GridLayoutDelegate.js +1 -1
- package/src/sap/ui/layout/cssgrid/GridResponsiveLayout.js +1 -1
- package/src/sap/ui/layout/cssgrid/GridSettings.js +2 -2
- package/src/sap/ui/layout/cssgrid/ResponsiveColumnItemLayoutData.js +1 -1
- package/src/sap/ui/layout/cssgrid/ResponsiveColumnLayout.js +1 -1
- package/src/sap/ui/layout/designtime/messagebundle_fr_CA.properties +1 -1
- package/src/sap/ui/layout/form/ColumnContainerData.js +1 -1
- package/src/sap/ui/layout/form/ColumnElementData.js +1 -1
- package/src/sap/ui/layout/form/ColumnLayout.js +7 -1
- package/src/sap/ui/layout/form/ColumnLayoutRenderer.js +40 -17
- package/src/sap/ui/layout/form/Form.js +4 -2
- package/src/sap/ui/layout/form/FormContainer.js +1 -1
- package/src/sap/ui/layout/form/FormElement.js +1 -1
- package/src/sap/ui/layout/form/FormLayout.js +15 -2
- package/src/sap/ui/layout/form/FormLayoutRenderer.js +35 -22
- package/src/sap/ui/layout/form/FormRenderer.js +3 -18
- package/src/sap/ui/layout/form/GridContainerData.js +1 -1
- package/src/sap/ui/layout/form/GridElementData.js +1 -1
- package/src/sap/ui/layout/form/GridLayout.js +1 -1
- package/src/sap/ui/layout/form/ResponsiveGridLayout.js +2 -2
- package/src/sap/ui/layout/form/ResponsiveLayout.js +2 -2
- package/src/sap/ui/layout/form/SemanticFormElement.js +1 -1
- package/src/sap/ui/layout/form/SimpleForm.js +5 -1
- package/src/sap/ui/layout/form/SimpleFormRenderer.js +3 -1
- package/src/sap/ui/layout/library.js +5 -21
- package/src/sap/ui/layout/themes/base/ColumnLayout.less +5 -4
- package/src/sap/ui/layout/themes/base/FormLayout.less +1 -0
- package/LICENSES/LicenseRef-tzdata-PublicDomain.txt +0 -5
package/.reuse/dep5
CHANGED
|
@@ -364,13 +364,6 @@ Copyright:
|
|
|
364
364
|
License: Apache-2.0 and ISC
|
|
365
365
|
Comment: these files contain content from SAP and node-lru-cache: LRUPersistentCache.js is overall written by SAP, but portions ('Least Recently Used' logic) are taken from the node-lru-cache project (see https://github.com/isaacs/node-lru-cache/blob/v2.7.3/README.md) and modified.
|
|
366
366
|
|
|
367
|
-
Files: src/sap.ui.core/test/sap/ui/core/qunit/i18n/helper/_timezones.js
|
|
368
|
-
Copyright:
|
|
369
|
-
2009-2024 SAP SE or an SAP affiliate company and OpenUI5 contributors
|
|
370
|
-
Arthur David Olson, Paul Eggert and other contributors
|
|
371
|
-
License: Apache-2.0 and LicenseRef-tzdata-PublicDomain
|
|
372
|
-
Comment: these files contain content from SAP and Time Zone Database: _timezones.js is overall written by SAP, but the list of IANA timezone IDs is taken from the Timezone Database
|
|
373
|
-
|
|
374
367
|
|
|
375
368
|
# Library: sap.ui.documentation:
|
|
376
369
|
|
package/THIRDPARTY.txt
CHANGED
|
@@ -22,7 +22,7 @@ Contained in: src/sap.m/test/sap/m/qunit/_thirdparty/qunit-composite.css
|
|
|
22
22
|
|
|
23
23
|
Library: sap.ui.codeeditor:
|
|
24
24
|
|
|
25
|
-
Component: Ace (Ajax.org Cloud9 Editor), version: 1.
|
|
25
|
+
Component: Ace (Ajax.org Cloud9 Editor), version: 1.36.5
|
|
26
26
|
Copyright: 2010, Ajax.org B.V.
|
|
27
27
|
License: BSD-3-Clause
|
|
28
28
|
License Text: https://github.com/SAP/openui5/blob/master/LICENSES/BSD-3-Clause.txt
|
|
@@ -342,12 +342,6 @@ License: ISC
|
|
|
342
342
|
License Text: https://github.com/SAP/openui5/blob/master/LICENSES/ISC.txt
|
|
343
343
|
Contained in: src/sap.ui.core/src/sap/ui/core/cache/LRUPersistentCache.js
|
|
344
344
|
|
|
345
|
-
Component: Time Zone Database, version: 2024b
|
|
346
|
-
Copyright: Arthur David Olson, Paul Eggert and other contributors
|
|
347
|
-
License: LicenseRef-tzdata-PublicDomain
|
|
348
|
-
License Text: https://github.com/SAP/openui5/blob/master/LICENSES/LicenseRef-tzdata-PublicDomain.txt
|
|
349
|
-
Contained in: src/sap.ui.core/test/sap/ui/core/qunit/i18n/helper/_timezones.js
|
|
350
|
-
|
|
351
345
|
|
|
352
346
|
Library: sap.ui.documentation:
|
|
353
347
|
|
|
@@ -468,7 +462,7 @@ License: Apache-2.0
|
|
|
468
462
|
License Text: https://github.com/SAP/openui5/blob/master/LICENSES/Apache-2.0.txt
|
|
469
463
|
Contained in: lib/jsdoc/ui5/plugin.js
|
|
470
464
|
|
|
471
|
-
Component: SAP Theming Base Content, version: 11.
|
|
465
|
+
Component: SAP Theming Base Content, version: 11.28.2
|
|
472
466
|
Copyright: SAP SE or an SAP affiliate company and Theming Base Content contributors
|
|
473
467
|
License: Apache-2.0
|
|
474
468
|
License Text: https://github.com/SAP/openui5/blob/master/LICENSES/Apache-2.0.txt
|
|
@@ -1015,21 +1009,6 @@ END of license: LicenseRef-Unicode-3.0
|
|
|
1015
1009
|
=================================
|
|
1016
1010
|
|
|
1017
1011
|
|
|
1018
|
-
=================================
|
|
1019
|
-
BEGIN of license: LicenseRef-tzdata-PublicDomain
|
|
1020
|
-
=================================
|
|
1021
|
-
|
|
1022
|
-
Unless specified below, all files in the tz code and data (including
|
|
1023
|
-
this LICENSE file) are in the public domain.
|
|
1024
|
-
|
|
1025
|
-
If the files date.c, newstrftime.3, and strftime.c are present, they
|
|
1026
|
-
contain material derived from BSD and use the BSD 3-clause license.
|
|
1027
|
-
|
|
1028
|
-
=================================
|
|
1029
|
-
END of license: LicenseRef-tzdata-PublicDomain
|
|
1030
|
-
=================================
|
|
1031
|
-
|
|
1032
|
-
|
|
1033
1012
|
=================================
|
|
1034
1013
|
BEGIN of license: MIT
|
|
1035
1014
|
=================================
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@openui5/sap.ui.layout",
|
|
3
|
-
"version": "1.
|
|
3
|
+
"version": "1.135.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.
|
|
17
|
+
"@openui5/sap.ui.core": "1.135.0"
|
|
18
18
|
}
|
|
19
19
|
}
|
|
@@ -6,7 +6,7 @@
|
|
|
6
6
|
<copyright>OpenUI5
|
|
7
7
|
* (c) Copyright 2009-2025 SAP SE or an SAP affiliate company.
|
|
8
8
|
* Licensed under the Apache License, Version 2.0 - see LICENSE.txt.</copyright>
|
|
9
|
-
<version>1.
|
|
9
|
+
<version>1.135.0</version>
|
|
10
10
|
|
|
11
11
|
<documentation>SAPUI5 library with layout controls.</documentation>
|
|
12
12
|
|
|
@@ -96,7 +96,7 @@ sap.ui.define([
|
|
|
96
96
|
* @see {@link https://developer.mozilla.org/en-US/docs/Web/CSS/CSS_Grid_Layout MDN web docs: CSS Grid Layout}
|
|
97
97
|
*
|
|
98
98
|
* @author SAP SE
|
|
99
|
-
* @version 1.
|
|
99
|
+
* @version 1.135.0
|
|
100
100
|
*
|
|
101
101
|
* @extends sap.ui.core.Control
|
|
102
102
|
* @implements sap.ui.layout.cssgrid.IGridConfigurable
|
|
@@ -142,7 +142,7 @@ sap.ui.define([
|
|
|
142
142
|
* Sets the value for the CSS display:grid property {@link https://developer.mozilla.org/en-US/docs/Web/CSS/grid-gap MDN web docs: grid-gap}
|
|
143
143
|
* It is a shorthand for gridRowGap and gridColumnGap. If some of them is set, the gridGap value will have less priority and will be overwritten.
|
|
144
144
|
*/
|
|
145
|
-
gridGap: { type: "sap.ui.
|
|
145
|
+
gridGap: { type: "sap.ui.core.CSSGapShortHand", defaultValue: "" },
|
|
146
146
|
|
|
147
147
|
/**
|
|
148
148
|
* Sets the value for the CSS display:grid property {@link https://developer.mozilla.org/en-US/docs/Web/CSS/grid-auto-rows MDN web docs: grid-auto-rows}
|
|
@@ -21,7 +21,7 @@ sap.ui.define([
|
|
|
21
21
|
* Applies a sap.ui.layout.cssgrid.GridSettings to a provided DOM element or Control.
|
|
22
22
|
*
|
|
23
23
|
* @author SAP SE
|
|
24
|
-
* @version 1.
|
|
24
|
+
* @version 1.135.0
|
|
25
25
|
*
|
|
26
26
|
* @extends sap.ui.layout.cssgrid.GridLayoutBase
|
|
27
27
|
*
|
|
@@ -58,7 +58,7 @@ sap.ui.define([
|
|
|
58
58
|
/**
|
|
59
59
|
* Sets the value for the CSS display:grid property {@link https://developer.mozilla.org/en-US/docs/Web/CSS/grid-gap MDN web docs: grid-gap}
|
|
60
60
|
*/
|
|
61
|
-
gridGap: { type: "sap.ui.
|
|
61
|
+
gridGap: { type: "sap.ui.core.CSSGapShortHand", defaultValue: "" },
|
|
62
62
|
|
|
63
63
|
/**
|
|
64
64
|
* Sets the value for the CSS display:grid property {@link https://developer.mozilla.org/en-US/docs/Web/CSS/grid-auto-rows MDN web docs: grid-auto-rows}
|
|
@@ -22,7 +22,7 @@ sap.ui.define([
|
|
|
22
22
|
* Have to possibility to hold multiple sap.ui.layout.cssgrid.GridSettings and apply the currently active GridSettings.
|
|
23
23
|
*
|
|
24
24
|
* @author SAP SE
|
|
25
|
-
* @version 1.
|
|
25
|
+
* @version 1.135.0
|
|
26
26
|
*
|
|
27
27
|
* @extends sap.ui.layout.cssgrid.GridLayoutBase
|
|
28
28
|
*
|
|
@@ -20,7 +20,7 @@ sap.ui.define([
|
|
|
20
20
|
* Holds a set of CSS display:grid properties
|
|
21
21
|
*
|
|
22
22
|
* @author SAP SE
|
|
23
|
-
* @version 1.
|
|
23
|
+
* @version 1.135.0
|
|
24
24
|
*
|
|
25
25
|
* @extends sap.ui.base.ManagedObject
|
|
26
26
|
*
|
|
@@ -57,7 +57,7 @@ sap.ui.define([
|
|
|
57
57
|
/**
|
|
58
58
|
* Sets the value for the CSS display:grid property {@link https://developer.mozilla.org/en-US/docs/Web/CSS/grid-gap MDN web docs: grid-gap}
|
|
59
59
|
*/
|
|
60
|
-
gridGap: { type: "sap.ui.
|
|
60
|
+
gridGap: { type: "sap.ui.core.CSSGapShortHand", defaultValue: "" },
|
|
61
61
|
|
|
62
62
|
/**
|
|
63
63
|
* Sets the value for the CSS display:grid property {@link https://developer.mozilla.org/en-US/docs/Web/CSS/grid-auto-rows MDN web docs: grid-auto-rows}
|
|
@@ -1,5 +1,5 @@
|
|
|
1
1
|
|
|
2
|
-
MSG_REMOVING_TOOLBAR=La zone d'en-t\u00EAte de ce groupe contient des \u00E9l\u00E9ments suppl\u00E9mentaires. Si vous
|
|
2
|
+
MSG_REMOVING_TOOLBAR=La zone d'en-t\u00EAte de ce groupe contient des \u00E9l\u00E9ments suppl\u00E9mentaires. Si vous retirez le groupe, ces \u00E9l\u00E9ments seront perdus. Voulez-vous quand m\u00EAme retirer le groupe?
|
|
3
3
|
|
|
4
4
|
GROUP_CONTROL_NAME=Groupe
|
|
5
5
|
GROUP_CONTROL_NAME_PLURAL=Groupes
|
|
@@ -60,7 +60,7 @@ sap.ui.define([
|
|
|
60
60
|
* This control cannot be used stand-alone, it just renders a {@link sap.ui.layout.form.Form Form} control,
|
|
61
61
|
* so it must be assigned to a {@link sap.ui.layout.form.Form Form} control using the <code>layout</code> aggregation.
|
|
62
62
|
* @extends sap.ui.layout.form.FormLayout
|
|
63
|
-
* @version 1.
|
|
63
|
+
* @version 1.135.0
|
|
64
64
|
*
|
|
65
65
|
* @constructor
|
|
66
66
|
* @public
|
|
@@ -697,6 +697,12 @@ sap.ui.define([
|
|
|
697
697
|
|
|
698
698
|
};
|
|
699
699
|
|
|
700
|
+
ColumnLayout.prototype.invalidateEditableChange = function() {
|
|
701
|
+
|
|
702
|
+
return true; // display-mode renders <dl>
|
|
703
|
+
|
|
704
|
+
};
|
|
705
|
+
|
|
700
706
|
return ColumnLayout;
|
|
701
707
|
|
|
702
708
|
});
|
|
@@ -63,6 +63,8 @@ sap.ui.define([
|
|
|
63
63
|
var oToolbar = oContainer.getToolbar();
|
|
64
64
|
var oTitle = oContainer.getTitle();
|
|
65
65
|
var oOptions = oLayout._getContainerSize(oContainer);
|
|
66
|
+
const bEditable = oContainer.getProperty("_editable");
|
|
67
|
+
const sContentNode = bEditable ? "div" : "dl";
|
|
66
68
|
|
|
67
69
|
oContainer._checkProperties();
|
|
68
70
|
|
|
@@ -109,17 +111,31 @@ sap.ui.define([
|
|
|
109
111
|
oRm.attr('title', oContainer.getTooltip_AsString());
|
|
110
112
|
}
|
|
111
113
|
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
114
|
+
if (bEditable || bExpandable || oToolbar) {
|
|
115
|
+
// in display mode render accessibility attributes on content-node. If expandable or toolbar in disply mode, role "region" is needed to annonce region if focus goes to button or inside toolbar
|
|
116
|
+
const oForm = oContainer.getParent();
|
|
117
|
+
let sRole = "form";
|
|
118
|
+
|
|
119
|
+
if (bEditable && !oLayout.isContainerLabelled(oContainer) && oForm.getFormContainers().length === 1) {
|
|
120
|
+
sRole = ""; // Container has no title and is only one container, no role needed as set on Form-level
|
|
121
|
+
} else if (!bEditable && (bExpandable || oToolbar)) {
|
|
122
|
+
sRole = "region"; // to announce region if Expander is focused or focus moves inside Toolbar
|
|
123
|
+
}
|
|
124
|
+
|
|
125
|
+
// In edit mode let every container render role, even without title (expect there is only one container). So screenreader also announces forms structure. (Was not possible for some older layouts.)
|
|
126
|
+
this.writeAccessibilityStateContainer(oRm, oContainer, sRole);
|
|
127
|
+
}
|
|
115
128
|
|
|
116
129
|
oRm.openEnd();
|
|
117
130
|
|
|
118
131
|
this.renderHeader(oRm, oToolbar, oTitle, oContainer._oExpandButton, bExpandable, oLayout._sFormSubTitleSize, oContainer.getId());
|
|
119
132
|
|
|
120
|
-
oRm.openStart(
|
|
121
|
-
.class("sapUiFormCLContainerCont")
|
|
122
|
-
|
|
133
|
+
oRm.openStart(sContentNode, oContainer.getId() + "-content")
|
|
134
|
+
.class("sapUiFormCLContainerCont");
|
|
135
|
+
if (!bEditable && !bExpandable && !oToolbar) {
|
|
136
|
+
this.writeAccessibilityStateContainer(oRm, oContainer, ""); // no role needed on <dl>
|
|
137
|
+
}
|
|
138
|
+
oRm.openEnd();
|
|
123
139
|
|
|
124
140
|
var aElements = oContainer.getVisibleFormElements();
|
|
125
141
|
for (var i = 0; i < aElements.length; i++) {
|
|
@@ -138,8 +154,8 @@ sap.ui.define([
|
|
|
138
154
|
}
|
|
139
155
|
}
|
|
140
156
|
|
|
141
|
-
oRm.close(
|
|
142
|
-
oRm.close("div");
|
|
157
|
+
oRm.close(sContentNode); // Container content
|
|
158
|
+
oRm.close("div"); // Container
|
|
143
159
|
|
|
144
160
|
};
|
|
145
161
|
|
|
@@ -147,6 +163,8 @@ sap.ui.define([
|
|
|
147
163
|
|
|
148
164
|
var oLabel = oElement.getLabelControl();
|
|
149
165
|
var oOptions;
|
|
166
|
+
const bEditable = oElement.getProperty("_editable");
|
|
167
|
+
const sFieldsNode = bEditable ? "div" : "dd";
|
|
150
168
|
|
|
151
169
|
oRm.openStart("div", oElement);
|
|
152
170
|
oRm.class("sapUiFormCLElement");
|
|
@@ -157,7 +175,7 @@ sap.ui.define([
|
|
|
157
175
|
|
|
158
176
|
if (oLabel) {
|
|
159
177
|
oOptions = oLayout._getFieldSize(oLabel);
|
|
160
|
-
_renderLabel(oRm, oLabel, oOptions);
|
|
178
|
+
_renderLabel(oRm, oElement, oLabel, oOptions);
|
|
161
179
|
}
|
|
162
180
|
|
|
163
181
|
var aFields = oElement.getFieldsForRendering();
|
|
@@ -168,7 +186,7 @@ sap.ui.define([
|
|
|
168
186
|
throw new Error(oField + " is not a valid Form content! Only use valid content in " + oLayout);
|
|
169
187
|
}
|
|
170
188
|
oOptions = oLayout._getFieldSize(oField);
|
|
171
|
-
oRm.openStart(
|
|
189
|
+
oRm.openStart(sFieldsNode);
|
|
172
190
|
oRm.class("sapUiFormCLCellsS" + oOptions.S.Size);
|
|
173
191
|
oRm.class("sapUiFormCLCellsL" + oOptions.L.Size);
|
|
174
192
|
if (oOptions.S.Break) {
|
|
@@ -187,7 +205,7 @@ sap.ui.define([
|
|
|
187
205
|
|
|
188
206
|
oRm.renderControl(oField);
|
|
189
207
|
|
|
190
|
-
oRm.close(
|
|
208
|
+
oRm.close(sFieldsNode);
|
|
191
209
|
}
|
|
192
210
|
}
|
|
193
211
|
oRm.close("div");
|
|
@@ -201,6 +219,8 @@ sap.ui.define([
|
|
|
201
219
|
var iColumns = 12;
|
|
202
220
|
var iSizeS = iColumns;
|
|
203
221
|
var iSizeL = iColumns;
|
|
222
|
+
const bEditable = oElement.getProperty("_editable");
|
|
223
|
+
const sFieldsNode = bEditable ? "div" : "dd";
|
|
204
224
|
|
|
205
225
|
oRm.openStart("div", oElement);
|
|
206
226
|
oRm.class("sapUiFormCLElement").class("sapUiFormCLSemanticElement");
|
|
@@ -211,7 +231,7 @@ sap.ui.define([
|
|
|
211
231
|
|
|
212
232
|
if (oLabel) {
|
|
213
233
|
oOptions = oLayout._getFieldSize(oLabel);
|
|
214
|
-
_renderLabel(oRm, oLabel, oOptions);
|
|
234
|
+
_renderLabel(oRm, oElement, oLabel, oOptions);
|
|
215
235
|
if (oOptions.S.Size < iSizeS) {
|
|
216
236
|
iSizeS = iSizeS - oOptions.S.Size;
|
|
217
237
|
}
|
|
@@ -220,7 +240,7 @@ sap.ui.define([
|
|
|
220
240
|
}
|
|
221
241
|
}
|
|
222
242
|
|
|
223
|
-
oRm.openStart(
|
|
243
|
+
oRm.openStart(sFieldsNode);
|
|
224
244
|
oRm.class("sapUiFormCLCellsS" + iSizeS);
|
|
225
245
|
oRm.class("sapUiFormCLCellsL" + iSizeL);
|
|
226
246
|
oRm.openEnd();
|
|
@@ -236,14 +256,17 @@ sap.ui.define([
|
|
|
236
256
|
}
|
|
237
257
|
}
|
|
238
258
|
|
|
239
|
-
oRm.close(
|
|
259
|
+
oRm.close(sFieldsNode);
|
|
240
260
|
oRm.close("div");
|
|
241
261
|
|
|
242
262
|
};
|
|
243
263
|
|
|
244
|
-
function _renderLabel(oRm, oLabel, oOptions) {
|
|
264
|
+
function _renderLabel(oRm, oElement, oLabel, oOptions) {
|
|
265
|
+
|
|
266
|
+
const bEditable = oElement.getProperty("_editable");
|
|
267
|
+
const sLabelNode = bEditable ? "div" : "dt";
|
|
245
268
|
|
|
246
|
-
oRm.openStart(
|
|
269
|
+
oRm.openStart(sLabelNode)
|
|
247
270
|
.class("sapUiFormElementLbl")
|
|
248
271
|
.class("sapUiFormCLCellsS" + oOptions.S.Size)
|
|
249
272
|
.class("sapUiFormCLCellsL" + oOptions.L.Size)
|
|
@@ -251,7 +274,7 @@ sap.ui.define([
|
|
|
251
274
|
|
|
252
275
|
oRm.renderControl(oLabel);
|
|
253
276
|
|
|
254
|
-
oRm.close(
|
|
277
|
+
oRm.close(sLabelNode);
|
|
255
278
|
|
|
256
279
|
}
|
|
257
280
|
|
|
@@ -44,7 +44,7 @@ sap.ui.define([
|
|
|
44
44
|
* @extends sap.ui.core.Control
|
|
45
45
|
*
|
|
46
46
|
* @author SAP SE
|
|
47
|
-
* @version 1.
|
|
47
|
+
* @version 1.135.0
|
|
48
48
|
*
|
|
49
49
|
* @constructor
|
|
50
50
|
* @public
|
|
@@ -199,7 +199,9 @@ sap.ui.define([
|
|
|
199
199
|
|
|
200
200
|
Form.prototype.setEditable = function(bEditable) {
|
|
201
201
|
|
|
202
|
-
this.
|
|
202
|
+
const oLayout = this.getLayout();
|
|
203
|
+
const bSuppressInvalidate = !oLayout?.invalidateEditableChange();
|
|
204
|
+
this.setProperty("editable", bEditable, bSuppressInvalidate);
|
|
203
205
|
|
|
204
206
|
return this;
|
|
205
207
|
|
|
@@ -37,7 +37,7 @@ sap.ui.define([
|
|
|
37
37
|
* @extends sap.ui.core.Control
|
|
38
38
|
*
|
|
39
39
|
* @author SAP SE
|
|
40
|
-
* @version 1.
|
|
40
|
+
* @version 1.135.0
|
|
41
41
|
*
|
|
42
42
|
* @constructor
|
|
43
43
|
* @public
|
|
@@ -1056,7 +1056,7 @@ sap.ui.define([
|
|
|
1056
1056
|
* This is used to determine the role for screenreader support
|
|
1057
1057
|
*
|
|
1058
1058
|
* @param {sap.ui.layout.form.FormContainer} oContainer FormContainer
|
|
1059
|
-
* @return {boolean} <code>true</code> if the
|
|
1059
|
+
* @return {boolean} <code>true</code> if the <code>FormContainer</code> is labelled
|
|
1060
1060
|
* @private
|
|
1061
1061
|
* @since: 1.126.0
|
|
1062
1062
|
*/
|
|
@@ -1066,6 +1066,19 @@ sap.ui.define([
|
|
|
1066
1066
|
|
|
1067
1067
|
};
|
|
1068
1068
|
|
|
1069
|
+
/**
|
|
1070
|
+
* Defines if the rendering of the layout depends on the <code>editable</code> property.
|
|
1071
|
+
*
|
|
1072
|
+
* @return {boolean} <code>true</code> if the switching <code>editable</code> must trigger re-rendering
|
|
1073
|
+
* @private
|
|
1074
|
+
* @since: 1.135.0
|
|
1075
|
+
*/
|
|
1076
|
+
FormLayout.prototype.invalidateEditableChange = function() {
|
|
1077
|
+
|
|
1078
|
+
return false;
|
|
1079
|
+
|
|
1080
|
+
};
|
|
1081
|
+
|
|
1069
1082
|
return FormLayout;
|
|
1070
1083
|
|
|
1071
1084
|
});
|
|
@@ -110,7 +110,7 @@ sap.ui.define([
|
|
|
110
110
|
rm.attr('title', oContainer.getTooltip_AsString());
|
|
111
111
|
}
|
|
112
112
|
|
|
113
|
-
this.writeAccessibilityStateContainer(rm, oContainer,
|
|
113
|
+
this.writeAccessibilityStateContainer(rm, oContainer, oLayout.isContainerLabelled(oContainer) ? "form" : "");
|
|
114
114
|
|
|
115
115
|
rm.openEnd();
|
|
116
116
|
|
|
@@ -200,10 +200,9 @@ sap.ui.define([
|
|
|
200
200
|
const bRenderExpander = bExpander && oExpandButton;
|
|
201
201
|
|
|
202
202
|
if (bRenderExpander) {
|
|
203
|
-
// if expander is
|
|
203
|
+
// if expander is rendered put a DIV around expander and title. (If expander inside title the screenreader announcement is somehow strange.)
|
|
204
204
|
rm.openStart("div", sContentId + "--head");
|
|
205
205
|
rm.class("sapUiFormTitle");
|
|
206
|
-
// rm.class("sapUiFormTitle" + sLevel);
|
|
207
206
|
rm.class("sapUiFormTitleExpandable");
|
|
208
207
|
rm.openEnd();
|
|
209
208
|
rm.renderControl(oExpandButton);
|
|
@@ -286,38 +285,52 @@ sap.ui.define([
|
|
|
286
285
|
|
|
287
286
|
};
|
|
288
287
|
|
|
289
|
-
|
|
288
|
+
/**
|
|
290
289
|
* Writes the accessibility attributes for FormContainers.
|
|
291
|
-
* @param {sap.ui.core.RenderManager} rm
|
|
292
|
-
* @param {sap.ui.layout.form.FormContainer} oContainer
|
|
293
|
-
* @param {
|
|
290
|
+
* @param {sap.ui.core.RenderManager} rm the RenderManager that can be used for writing to the Render-Output-Buffer
|
|
291
|
+
* @param {sap.ui.layout.form.FormContainer} oContainer <code>FormContainer</code> to write accessibility attributes
|
|
292
|
+
* @param {string} sRole if set the given role is rendered, if no role given the DOM node needs no role (e.g. Container has no title)
|
|
294
293
|
*/
|
|
295
|
-
FormLayoutRenderer.writeAccessibilityStateContainer = function(rm, oContainer,
|
|
294
|
+
FormLayoutRenderer.writeAccessibilityStateContainer = function(rm, oContainer, sRole){
|
|
296
295
|
|
|
297
|
-
|
|
298
|
-
|
|
299
|
-
|
|
296
|
+
const mAriaProps = {};
|
|
297
|
+
const sTitleID = this.getTitleId(oContainer);
|
|
298
|
+
if (sTitleID) {
|
|
299
|
+
mAriaProps["labelledby"] = {value: sTitleID, append: true};
|
|
300
|
+
}
|
|
301
|
+
|
|
302
|
+
if (sRole) {
|
|
303
|
+
mAriaProps["role"] = sRole;
|
|
304
|
+
}
|
|
305
|
+
|
|
306
|
+
rm.accessibilityState(oContainer, mAriaProps);
|
|
307
|
+
|
|
308
|
+
};
|
|
309
|
+
|
|
310
|
+
/**
|
|
311
|
+
* Determines the ID if the title of Form or Container used for aria-labelledby
|
|
312
|
+
* @param {sap.ui.layout.form.Form|sap.ui.layout.form.FormContainer} oContainer <code>Form</code> or <code>FormContainer</code> to determine the ID of it's title
|
|
313
|
+
* @returns {string} title ID
|
|
314
|
+
*/
|
|
315
|
+
FormLayoutRenderer.getTitleId = function(oContainer){
|
|
316
|
+
|
|
317
|
+
const oTitle = oContainer.getTitle();
|
|
318
|
+
const oToolbar = oContainer.getToolbar();
|
|
319
|
+
let sID = "";
|
|
300
320
|
if (oToolbar) {
|
|
301
321
|
if (!oContainer.getAriaLabelledBy() || oContainer.getAriaLabelledBy().length == 0) {
|
|
302
322
|
// no aria-label -> use Title of Toolbar
|
|
303
|
-
|
|
304
|
-
mAriaProps["labelledby"] = {value: sToolbarTitleID, append: true};
|
|
323
|
+
sID = FormHelper.getToolbarTitle(oToolbar); // FormHelper must already be initialized by FormLayout
|
|
305
324
|
}
|
|
306
325
|
} else if (oTitle) {
|
|
307
|
-
var sId = "";
|
|
308
326
|
if (typeof oTitle == "string") {
|
|
309
|
-
|
|
327
|
+
sID = oContainer.getId() + "--title";
|
|
310
328
|
} else {
|
|
311
|
-
|
|
329
|
+
sID = oTitle.getId();
|
|
312
330
|
}
|
|
313
|
-
mAriaProps["labelledby"] = {value: sId, append: true};
|
|
314
|
-
}
|
|
315
|
-
|
|
316
|
-
if (!bNoRole) {
|
|
317
|
-
mAriaProps["role"] = "form";
|
|
318
331
|
}
|
|
319
332
|
|
|
320
|
-
|
|
333
|
+
return sID;
|
|
321
334
|
|
|
322
335
|
};
|
|
323
336
|
|
|
@@ -65,24 +65,9 @@ sap.ui.define([
|
|
|
65
65
|
rm.attr('title', oForm.getTooltip_AsString());
|
|
66
66
|
}
|
|
67
67
|
|
|
68
|
-
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
if (!oForm.getAriaLabelledBy() || oForm.getAriaLabelledBy().length == 0) {
|
|
72
|
-
// no aria-label -> use Title of Toolbar
|
|
73
|
-
var sToolbarTitleID = FormHelper.getToolbarTitle(oToolbar); // FormHelper must already be initialized by Form
|
|
74
|
-
mAriaProps["labelledby"] = sToolbarTitleID;
|
|
75
|
-
}
|
|
76
|
-
} else if (oTitle) {
|
|
77
|
-
var sId = "";
|
|
78
|
-
if (typeof oTitle == "string") {
|
|
79
|
-
sId = oForm.getId() + "--title";
|
|
80
|
-
} else {
|
|
81
|
-
sId = oTitle.getId();
|
|
82
|
-
}
|
|
83
|
-
mAriaProps["labelledby"] = {value: sId, append: true};
|
|
84
|
-
} else if (oForm._sSuggestedTitleId) {
|
|
85
|
-
mAriaProps["labelledby"] = {value: oForm._sSuggestedTitleId, append: true};
|
|
68
|
+
const sTitleID = oLayout?.getRenderer().getTitleId(oForm) || oForm._sSuggestedTitleId;
|
|
69
|
+
if (sTitleID) {
|
|
70
|
+
mAriaProps["labelledby"] = {value: sTitleID, append: true};
|
|
86
71
|
}
|
|
87
72
|
|
|
88
73
|
rm.accessibilityState(oForm, mAriaProps);
|
|
@@ -55,7 +55,7 @@ sap.ui.define([
|
|
|
55
55
|
*
|
|
56
56
|
* This control cannot be used stand-alone, it just renders a {@link sap.ui.layout.form.Form Form}, so it must be assigned to a {@link sap.ui.layout.form.Form Form} using the <code>layout</code> aggregation.
|
|
57
57
|
* @extends sap.ui.layout.form.FormLayout
|
|
58
|
-
* @version 1.
|
|
58
|
+
* @version 1.135.0
|
|
59
59
|
*
|
|
60
60
|
* @constructor
|
|
61
61
|
* @public
|
|
@@ -289,7 +289,7 @@ sap.ui.define([
|
|
|
289
289
|
oRm.attr('title', sTooltip);
|
|
290
290
|
}
|
|
291
291
|
|
|
292
|
-
oLayout.getRenderer().writeAccessibilityStateContainer(oRm, oContainer,
|
|
292
|
+
oLayout.getRenderer().writeAccessibilityStateContainer(oRm, oContainer, "form"); // if Container-Panel used render always a role
|
|
293
293
|
|
|
294
294
|
oRm.openEnd();
|
|
295
295
|
|
|
@@ -52,7 +52,7 @@ sap.ui.define([
|
|
|
52
52
|
* @extends sap.ui.layout.form.FormLayout
|
|
53
53
|
*
|
|
54
54
|
* @author SAP SE
|
|
55
|
-
* @version 1.
|
|
55
|
+
* @version 1.135.0
|
|
56
56
|
*
|
|
57
57
|
* @constructor
|
|
58
58
|
* @public
|
|
@@ -186,7 +186,7 @@ sap.ui.define([
|
|
|
186
186
|
oRm.attr('title', sTooltip);
|
|
187
187
|
}
|
|
188
188
|
|
|
189
|
-
oLayout.getRenderer().writeAccessibilityStateContainer(oRm, oContainer,
|
|
189
|
+
oLayout.getRenderer().writeAccessibilityStateContainer(oRm, oContainer, "form"); // if Container-Panel used render always a role
|
|
190
190
|
|
|
191
191
|
oRm.openEnd();
|
|
192
192
|
|
|
@@ -69,7 +69,7 @@ sap.ui.define([
|
|
|
69
69
|
* <b>Note:</b> If a more complex form is needed, use the <code>{@link sap.ui.layout.form.Form Form}</code> control instead.
|
|
70
70
|
*
|
|
71
71
|
* @extends sap.ui.core.Control
|
|
72
|
-
* @version 1.
|
|
72
|
+
* @version 1.135.0
|
|
73
73
|
*
|
|
74
74
|
* @constructor
|
|
75
75
|
* @public
|
|
@@ -1319,6 +1319,10 @@ sap.ui.define([
|
|
|
1319
1319
|
_addLayoutData.call(this);
|
|
1320
1320
|
if (this.getDomRef()) {
|
|
1321
1321
|
_updateLayout.call(this);
|
|
1322
|
+
var oForm = this.getAggregation("form");
|
|
1323
|
+
if (!oForm.getDomRef()) { // Form not rendered right now - invalidate to trigger rendering
|
|
1324
|
+
this.invalidate();
|
|
1325
|
+
}
|
|
1322
1326
|
}
|
|
1323
1327
|
}
|
|
1324
1328
|
|
|
@@ -33,7 +33,9 @@ sap.ui.define([],
|
|
|
33
33
|
.style("width", oControl.getWidth())
|
|
34
34
|
.openEnd(); // div element
|
|
35
35
|
var oForm = oControl.getAggregation("form");
|
|
36
|
-
|
|
36
|
+
if (oForm.getLayout()) { // render Form after Layout is loaded
|
|
37
|
+
oRm.renderControl(oForm);
|
|
38
|
+
}
|
|
37
39
|
oRm.close("div");
|
|
38
40
|
oControl._bChangedByMe = false;
|
|
39
41
|
|
|
@@ -21,14 +21,14 @@ sap.ui.define([
|
|
|
21
21
|
* @namespace
|
|
22
22
|
* @alias sap.ui.layout
|
|
23
23
|
* @author SAP SE
|
|
24
|
-
* @version 1.
|
|
24
|
+
* @version 1.135.0
|
|
25
25
|
* @since 1.15
|
|
26
26
|
* @public
|
|
27
27
|
*/
|
|
28
28
|
var thisLib = Library.init({
|
|
29
29
|
apiVersion: 2,
|
|
30
30
|
name : "sap.ui.layout",
|
|
31
|
-
version: "1.
|
|
31
|
+
version: "1.135.0",
|
|
32
32
|
dependencies: ["sap.ui.core"],
|
|
33
33
|
designtime: "sap/ui/layout/designtime/library.designtime",
|
|
34
34
|
types: [
|
|
@@ -829,29 +829,13 @@ sap.ui.define([
|
|
|
829
829
|
*
|
|
830
830
|
* @see {@link https://developer.mozilla.org/en-US/docs/Web/CSS/gap}
|
|
831
831
|
* @since 1.60.0
|
|
832
|
+
* @extends sap.ui.core.CSSSizeShortHand
|
|
832
833
|
* @public
|
|
834
|
+
* @deprecated since 1.135 use {@link sap.ui.core.CSSGapShortHand} instead
|
|
833
835
|
* @namespace
|
|
834
836
|
* @final
|
|
835
837
|
*/
|
|
836
|
-
thisLib.cssgrid.CSSGridGapShortHand = DataType.createType("sap.ui.layout.cssgrid.CSSGridGapShortHand", {
|
|
837
|
-
isValid: function (vValue) {
|
|
838
|
-
var bResult = true,
|
|
839
|
-
aValues = vValue.split(/\s+/);
|
|
840
|
-
|
|
841
|
-
aValues.forEach(function (sValue) {
|
|
842
|
-
if (!library.CSSSize.isValid(sValue)) {
|
|
843
|
-
bResult = false;
|
|
844
|
-
}
|
|
845
|
-
});
|
|
846
|
-
|
|
847
|
-
return bResult;
|
|
848
|
-
},
|
|
849
|
-
parseValue: function (sValue) {
|
|
850
|
-
return sValue.trim().split(/\s+/).join(" ");
|
|
851
|
-
}
|
|
852
|
-
},
|
|
853
|
-
DataType.getType("string")
|
|
854
|
-
);
|
|
838
|
+
thisLib.cssgrid.CSSGridGapShortHand = DataType.createType("sap.ui.layout.cssgrid.CSSGridGapShortHand", {}, DataType.getType("sap.ui.core.CSSGapShortHand"));
|
|
855
839
|
|
|
856
840
|
/**
|
|
857
841
|
* @classdesc A string type that represents one or two grid lines. Used to define the position and size of a single grid item.
|
|
@@ -161,7 +161,7 @@ html.sap-phone .sapUiFormCL > .sapUiFormCLContent > .sapUiFormCLContainer:not(:l
|
|
|
161
161
|
visibility: hidden;
|
|
162
162
|
}
|
|
163
163
|
|
|
164
|
-
.sapUiFormCLElement >
|
|
164
|
+
.sapUiFormCLElement > * {
|
|
165
165
|
float: left;
|
|
166
166
|
padding: 0 0.25rem;
|
|
167
167
|
box-sizing: border-box;
|
|
@@ -241,14 +241,15 @@ html[data-sap-ui-browser^="sf"] .sapUiFormEdit .sapUiFormCLElement {
|
|
|
241
241
|
|
|
242
242
|
/* display mode */
|
|
243
243
|
/* in display only mode add padding to controls as they don't have one */
|
|
244
|
-
.sapUiForm:not(.sapUiFormEdit) .sapUiFormCLElement >
|
|
244
|
+
.sapUiForm:not(.sapUiFormEdit) .sapUiFormCLElement > *{
|
|
245
245
|
padding-top: 0.25rem;
|
|
246
246
|
padding-bottom: 0.25rem;
|
|
247
247
|
font-size: 1px; /* as browser adds some px to text to meet font-size */
|
|
248
|
+
margin: 0; /* As <dd> would add a margin */
|
|
248
249
|
}
|
|
249
250
|
|
|
250
|
-
.sapUiForm:not(.sapUiFormEdit) .sapUiFormCLElement >
|
|
251
|
-
.sapUiForm:not(.sapUiFormEdit) .sapUiFormCLElement >
|
|
251
|
+
.sapUiForm:not(.sapUiFormEdit) .sapUiFormCLElement > * .sapUiIcon:not(.sapMBtnIcon),
|
|
252
|
+
.sapUiForm:not(.sapUiFormEdit) .sapUiFormCLElement > * .sapMCbBg{
|
|
252
253
|
font-size: @sapUiFontSize; /* to set default font size on icons */
|
|
253
254
|
}
|
|
254
255
|
|