@openui5/sap.ui.webc.common 1.111.6 → 1.112.1
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/package.json +2 -2
- package/src/sap/ui/webc/common/.library +2 -2
- package/src/sap/ui/webc/common/Configuration.js +6 -0
- package/src/sap/ui/webc/common/Icons.js +6 -0
- package/src/sap/ui/webc/common/WebComponent.js +1 -1
- package/src/sap/ui/webc/common/WebComponentMetadata.js +1 -1
- package/src/sap/ui/webc/common/library.js +3 -3
- package/src/sap/ui/webc/common/thirdparty/base/Boot.js +2 -11
- package/src/sap/ui/webc/common/thirdparty/base/CSP.js +3 -14
- package/src/sap/ui/webc/common/thirdparty/base/CustomElementsRegistry.js +0 -21
- package/src/sap/ui/webc/common/thirdparty/base/CustomElementsScopeUtils.js +5 -22
- package/src/sap/ui/webc/common/thirdparty/base/DOMObserver.js +5 -18
- package/src/sap/ui/webc/common/thirdparty/base/Device.js +2 -35
- package/src/sap/ui/webc/common/thirdparty/base/EventProvider.js +2 -21
- package/src/sap/ui/webc/common/thirdparty/base/FeaturesRegistry.js +0 -4
- package/src/sap/ui/webc/common/thirdparty/base/FontFace.js +4 -8
- package/src/sap/ui/webc/common/thirdparty/base/InitialConfiguration.js +13 -42
- package/src/sap/ui/webc/common/thirdparty/base/Keys.js +3 -138
- package/src/sap/ui/webc/common/thirdparty/base/ManagedStyles.js +0 -19
- package/src/sap/ui/webc/common/thirdparty/base/MediaRange.js +4 -8
- package/src/sap/ui/webc/common/thirdparty/base/PropertiesFileFormat.js +2 -16
- package/src/sap/ui/webc/common/thirdparty/base/Render.js +14 -35
- package/src/sap/ui/webc/common/thirdparty/base/RenderQueue.js +1 -16
- package/src/sap/ui/webc/common/thirdparty/base/RenderScheduler.js +2 -10
- package/src/sap/ui/webc/common/thirdparty/base/Runtimes.js +18 -34
- package/src/sap/ui/webc/common/thirdparty/base/StaticAreaItem.js +4 -25
- package/src/sap/ui/webc/common/thirdparty/base/SystemCSSVars.js +0 -3
- package/src/sap/ui/webc/common/thirdparty/base/UI5Element.js +104 -246
- package/src/sap/ui/webc/common/thirdparty/base/UI5ElementMetadata.js +39 -84
- package/src/sap/ui/webc/common/thirdparty/base/animations/AnimationQueue.js +0 -11
- package/src/sap/ui/webc/common/thirdparty/base/animations/animate.js +0 -8
- package/src/sap/ui/webc/common/thirdparty/base/animations/scroll.js +0 -4
- package/src/sap/ui/webc/common/thirdparty/base/animations/slideDown.js +9 -10
- package/src/sap/ui/webc/common/thirdparty/base/animations/slideUp.js +4 -7
- package/src/sap/ui/webc/common/thirdparty/base/asset-registries/Icons.js +9 -34
- package/src/sap/ui/webc/common/thirdparty/base/asset-registries/Illustrations.js +0 -8
- package/src/sap/ui/webc/common/thirdparty/base/asset-registries/LocaleData.js +36 -57
- package/src/sap/ui/webc/common/thirdparty/base/asset-registries/Themes.js +4 -27
- package/src/sap/ui/webc/common/thirdparty/base/asset-registries/i18n.js +12 -37
- package/src/sap/ui/webc/common/thirdparty/base/assets-meta/IconCollectionsAlias.js +0 -1
- package/src/sap/ui/webc/common/thirdparty/base/config/AnimationMode.js +0 -7
- package/src/sap/ui/webc/common/thirdparty/base/config/CalendarType.js +2 -7
- package/src/sap/ui/webc/common/thirdparty/base/config/FormatSettings.js +2 -4
- package/src/sap/ui/webc/common/thirdparty/base/config/Icons.js +3 -11
- package/src/sap/ui/webc/common/thirdparty/base/config/Language.js +4 -14
- package/src/sap/ui/webc/common/thirdparty/base/config/NoConflict.js +4 -14
- package/src/sap/ui/webc/common/thirdparty/base/config/RTL.js +2 -8
- package/src/sap/ui/webc/common/thirdparty/base/config/Theme.js +4 -15
- package/src/sap/ui/webc/common/thirdparty/base/delegate/ItemNavigation.js +8 -72
- package/src/sap/ui/webc/common/thirdparty/base/delegate/ResizeHandler.js +8 -23
- package/src/sap/ui/webc/common/thirdparty/base/delegate/ScrollEnablement.js +9 -34
- package/src/sap/ui/webc/common/thirdparty/base/features/F6Navigation.js +1 -20
- package/src/sap/ui/webc/common/thirdparty/base/features/OpenUI5Enablement.js +0 -17
- package/src/sap/ui/webc/common/thirdparty/base/features/OpenUI5Support.js +0 -32
- package/src/sap/ui/webc/common/thirdparty/base/generated/VersionInfo.js +1 -1
- package/src/sap/ui/webc/common/thirdparty/base/getSharedResource.js +1 -9
- package/src/sap/ui/webc/common/thirdparty/base/i18nBundle.js +4 -18
- package/src/sap/ui/webc/common/thirdparty/base/locale/Locale.js +0 -25
- package/src/sap/ui/webc/common/thirdparty/base/locale/RTLAwareRegistry.js +0 -4
- package/src/sap/ui/webc/common/thirdparty/base/locale/applyDirection.js +0 -2
- package/src/sap/ui/webc/common/thirdparty/base/locale/directionChange.js +2 -9
- package/src/sap/ui/webc/common/thirdparty/base/locale/getEffectiveDir.js +4 -9
- package/src/sap/ui/webc/common/thirdparty/base/locale/getLocale.js +3 -11
- package/src/sap/ui/webc/common/thirdparty/base/locale/languageChange.js +0 -8
- package/src/sap/ui/webc/common/thirdparty/base/locale/nextFallbackLocale.js +4 -8
- package/src/sap/ui/webc/common/thirdparty/base/locale/normalizeLocale.js +8 -14
- package/src/sap/ui/webc/common/thirdparty/base/renderer/LitRenderer.js +0 -11
- package/src/sap/ui/webc/common/thirdparty/base/renderer/directives/style-map.js +7 -21
- package/src/sap/ui/webc/common/thirdparty/base/renderer/executeTemplate.js +1 -6
- package/src/sap/ui/webc/common/thirdparty/base/theming/CustomStyle.js +2 -16
- package/src/sap/ui/webc/common/thirdparty/base/theming/ThemeLoaded.js +0 -8
- package/src/sap/ui/webc/common/thirdparty/base/theming/applyTheme.js +6 -21
- package/src/sap/ui/webc/common/thirdparty/base/theming/getConstructableStyle.js +1 -6
- package/src/sap/ui/webc/common/thirdparty/base/theming/getEffectiveLinksHrefs.js +0 -7
- package/src/sap/ui/webc/common/thirdparty/base/theming/getEffectiveStyle.js +0 -8
- package/src/sap/ui/webc/common/thirdparty/base/theming/getStylesString.js +0 -4
- package/src/sap/ui/webc/common/thirdparty/base/theming/getThemeDesignerTheme.js +4 -22
- package/src/sap/ui/webc/common/thirdparty/base/theming/preloadLinks.js +0 -5
- package/src/sap/ui/webc/common/thirdparty/base/thirdparty/_merge.js +10 -20
- package/src/sap/ui/webc/common/thirdparty/base/thirdparty/isPlainObject.js +0 -6
- package/src/sap/ui/webc/common/thirdparty/base/thirdparty/merge.js +0 -3
- package/src/sap/ui/webc/common/thirdparty/base/types/CSSColor.js +0 -4
- package/src/sap/ui/webc/common/thirdparty/base/types/CSSSize.js +0 -4
- package/src/sap/ui/webc/common/thirdparty/base/types/CalendarType.js +0 -5
- package/src/sap/ui/webc/common/thirdparty/base/types/DataType.js +0 -8
- package/src/sap/ui/webc/common/thirdparty/base/types/Float.js +0 -5
- package/src/sap/ui/webc/common/thirdparty/base/types/Integer.js +0 -5
- package/src/sap/ui/webc/common/thirdparty/base/types/InvisibleMessageMode.js +0 -6
- package/src/sap/ui/webc/common/thirdparty/base/types/ItemNavigationBehavior.js +0 -2
- package/src/sap/ui/webc/common/thirdparty/base/types/PopupState.js +0 -8
- package/src/sap/ui/webc/common/thirdparty/base/types/ValueState.js +0 -5
- package/src/sap/ui/webc/common/thirdparty/base/updateShadowRoot.js +0 -5
- package/src/sap/ui/webc/common/thirdparty/base/util/AriaLabelHelper.js +1 -9
- package/src/sap/ui/webc/common/thirdparty/base/util/Caret.js +0 -6
- package/src/sap/ui/webc/common/thirdparty/base/util/ColorConversion.js +29 -46
- package/src/sap/ui/webc/common/thirdparty/base/util/FetchHelper.js +0 -10
- package/src/sap/ui/webc/common/thirdparty/base/util/FocusableElements.js +2 -19
- package/src/sap/ui/webc/common/thirdparty/base/util/InvisibleMessage.js +3 -9
- package/src/sap/ui/webc/common/thirdparty/base/util/PopupUtils.js +0 -28
- package/src/sap/ui/webc/common/thirdparty/base/util/SlotsHelper.js +4 -15
- package/src/sap/ui/webc/common/thirdparty/base/util/StringHelper.js +0 -7
- package/src/sap/ui/webc/common/thirdparty/base/util/TabbableElements.js +0 -12
- package/src/sap/ui/webc/common/thirdparty/base/util/arraysAreEqual.js +0 -4
- package/src/sap/ui/webc/common/thirdparty/base/util/clamp.js +0 -2
- package/src/sap/ui/webc/common/thirdparty/base/util/createLinkInHead.js +0 -2
- package/src/sap/ui/webc/common/thirdparty/base/util/createStyleInHead.js +0 -2
- package/src/sap/ui/webc/common/thirdparty/base/util/debounce.js +1 -3
- package/src/sap/ui/webc/common/thirdparty/base/util/detectNavigatorLanguage.js +0 -4
- package/src/sap/ui/webc/common/thirdparty/base/util/escapeRegex.js +0 -2
- package/src/sap/ui/webc/common/thirdparty/base/util/findNodeOwner.js +0 -6
- package/src/sap/ui/webc/common/thirdparty/base/util/formatMessage.js +2 -7
- package/src/sap/ui/webc/common/thirdparty/base/util/generateHighlightedMarkup.js +9 -17
- package/src/sap/ui/webc/common/thirdparty/base/util/getActiveElement.js +0 -4
- package/src/sap/ui/webc/common/thirdparty/base/util/getClassCopy.js +0 -3
- package/src/sap/ui/webc/common/thirdparty/base/util/getDesigntimePropertyAsArray.js +0 -2
- package/src/sap/ui/webc/common/thirdparty/base/util/getEffectiveContentDensity.js +0 -2
- package/src/sap/ui/webc/common/thirdparty/base/util/getFileExtension.js +0 -4
- package/src/sap/ui/webc/common/thirdparty/base/util/getNormalizedTarget.js +0 -4
- package/src/sap/ui/webc/common/thirdparty/base/util/getSingletonElementInstance.js +0 -4
- package/src/sap/ui/webc/common/thirdparty/base/util/isDefaultSlotProvided.js +0 -2
- package/src/sap/ui/webc/common/thirdparty/base/util/isDescendantOf.js +0 -6
- package/src/sap/ui/webc/common/thirdparty/base/util/isElementInView.js +0 -2
- package/src/sap/ui/webc/common/thirdparty/base/util/isNodeClickable.js +0 -5
- package/src/sap/ui/webc/common/thirdparty/base/util/isNodeHidden.js +0 -3
- package/src/sap/ui/webc/common/thirdparty/base/util/isNodeTabbable.js +0 -9
- package/src/sap/ui/webc/common/thirdparty/base/util/isValidPropertyName.js +1 -3
- package/src/sap/ui/webc/common/thirdparty/base/util/setToArray.js +0 -2
- package/src/sap/ui/webc/common/thirdparty/base/util/whenDOMReady.js +0 -2
- package/src/sap/ui/webc/common/thirdparty/icons/generated/json-imports/i18n.js +0 -52
- package/src/sap/ui/webc/common/thirdparty/icons/json-imports/Icons.js +0 -5
- package/src/sap/ui/webc/common/thirdparty/icons-business-suite/json-imports/Icons.js +0 -3
- package/src/sap/ui/webc/common/thirdparty/icons-tnt/json-imports/Icons.js +0 -3
- package/src/sap/ui/webc/common/thirdparty/lit-html/directive-helpers.js +62 -70
- package/src/sap/ui/webc/common/thirdparty/lit-html/directive.js +11 -20
- package/src/sap/ui/webc/common/thirdparty/lit-html/directives/class-map.js +0 -10
- package/src/sap/ui/webc/common/thirdparty/lit-html/directives/if-defined.js +0 -2
- package/src/sap/ui/webc/common/thirdparty/lit-html/directives/repeat.js +55 -71
- package/src/sap/ui/webc/common/thirdparty/lit-html/directives/unsafe-html.js +0 -4
- package/src/sap/ui/webc/common/thirdparty/lit-html/lit-html.js +96 -171
- package/src/sap/ui/webc/common/thirdparty/lit-html/static.js +34 -40
- package/src/sap/ui/webc/common/thirdparty/localization/DateFormat.js +0 -2
- package/src/sap/ui/webc/common/thirdparty/localization/LocaleData.js +0 -2
- package/src/sap/ui/webc/common/thirdparty/localization/dates/CalendarDate.js +13 -56
- package/src/sap/ui/webc/common/thirdparty/localization/dates/ExtremeDates.js +0 -11
- package/src/sap/ui/webc/common/thirdparty/localization/dates/calculateWeekNumber.js +5 -8
- package/src/sap/ui/webc/common/thirdparty/localization/dates/getRoundedTimestamp.js +0 -3
- package/src/sap/ui/webc/common/thirdparty/localization/dates/getTodayUTCTimestamp.js +0 -3
- package/src/sap/ui/webc/common/thirdparty/localization/dates/modifyDateBy.js +0 -9
- package/src/sap/ui/webc/common/thirdparty/localization/getCachedLocaleDataInstance.js +0 -5
- package/src/sap/ui/webc/common/thirdparty/localization/locale/getLocaleData.js +1 -6
- package/src/sap/ui/webc/common/thirdparty/theming/generated/json-imports/Themes.js +0 -16
- package/ui5.yaml +7 -7
- package/src/sap/ui/webc/common/thirdparty/icons-business-suite/main-milestone.js +0 -25
- package/src/sap/ui/webc/common/thirdparty/icons-business-suite/main-sequence.js +0 -25
@@ -18,39 +18,35 @@ sap.ui.define(["exports", "./thirdparty/merge", "./Boot", "./UI5ElementMetadata"
|
|
18
18
|
_arraysAreEqual = _interopRequireDefault(_arraysAreEqual);
|
19
19
|
_getClassCopy = _interopRequireDefault(_getClassCopy);
|
20
20
|
_preloadLinks = _interopRequireDefault(_preloadLinks);
|
21
|
-
|
22
21
|
function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
|
23
|
-
|
24
22
|
let autoId = 0;
|
25
23
|
const elementTimeouts = new Map();
|
26
24
|
const uniqueDependenciesCache = new Map();
|
25
|
+
|
27
26
|
/**
|
28
27
|
* Triggers re-rendering of a UI5Element instance due to state change.
|
29
28
|
*
|
30
29
|
* @param changeInfo An object with information about the change that caused invalidation.
|
31
30
|
* @private
|
32
31
|
*/
|
33
|
-
|
34
32
|
function _invalidate(changeInfo) {
|
35
33
|
// Invalidation should be suppressed: 1) before the component is rendered for the first time 2) and during the execution of onBeforeRendering
|
36
34
|
// This is necessary not only as an optimization, but also to avoid infinite loops on invalidation between children and parents (when invalidateOnChildChange is used)
|
37
35
|
if (this._suppressInvalidation) {
|
38
36
|
return;
|
39
|
-
}
|
40
|
-
|
37
|
+
}
|
41
38
|
|
39
|
+
// Call the onInvalidation hook
|
42
40
|
this.onInvalidation(changeInfo);
|
43
|
-
|
44
41
|
this._changedState.push(changeInfo);
|
45
|
-
|
46
42
|
(0, _Render.renderDeferred)(this);
|
47
|
-
|
48
|
-
|
43
|
+
this._eventProvider.fireEvent("invalidate", {
|
44
|
+
...changeInfo,
|
49
45
|
target: this
|
50
46
|
});
|
51
47
|
}
|
52
|
-
|
53
48
|
let metadata = {};
|
49
|
+
|
54
50
|
/**
|
55
51
|
* Base class for all UI5 Web Components
|
56
52
|
*
|
@@ -61,133 +57,101 @@ sap.ui.define(["exports", "./thirdparty/merge", "./Boot", "./UI5ElementMetadata"
|
|
61
57
|
* @extends HTMLElement
|
62
58
|
* @public
|
63
59
|
*/
|
64
|
-
|
65
60
|
class UI5Element extends HTMLElement {
|
66
61
|
constructor() {
|
67
62
|
super();
|
68
63
|
this._changedState = []; // Filled on each invalidation, cleared on re-render (used for debugging)
|
69
|
-
|
70
64
|
this._suppressInvalidation = true; // A flag telling whether all invalidations should be ignored. Initialized with "true" because a UI5Element can not be invalidated until it is rendered for the first time
|
71
|
-
|
72
65
|
this._inDOM = false; // A flag telling whether the UI5Element is currently in the DOM tree of the document or not
|
73
|
-
|
74
66
|
this._fullyConnected = false; // A flag telling whether the UI5Element's onEnterDOM hook was called (since it's possible to have the element removed from DOM before that)
|
75
|
-
|
76
67
|
this._childChangeListeners = new Map(); // used to store lazy listeners per slot for the child change event of every child inside that slot
|
77
|
-
|
78
68
|
this._slotChangeListeners = new Map(); // used to store lazy listeners per slot for the slotchange event of all slot children inside that slot
|
79
|
-
|
80
69
|
this._eventProvider = new _EventProvider.default(); // used by parent components for listening to changes to child components
|
81
|
-
|
82
70
|
let deferredResolve;
|
83
71
|
this._domRefReadyPromise = new Promise(resolve => {
|
84
72
|
deferredResolve = resolve;
|
85
73
|
});
|
86
74
|
this._domRefReadyPromise._deferredResolve = deferredResolve;
|
87
|
-
|
88
75
|
this._initializeState();
|
89
|
-
|
90
76
|
this._upgradeAllProperties();
|
91
|
-
|
92
77
|
if (this.constructor._needsShadowDOM()) {
|
93
78
|
this.attachShadow({
|
94
79
|
mode: "open"
|
95
80
|
});
|
96
81
|
}
|
97
82
|
}
|
83
|
+
|
98
84
|
/**
|
99
85
|
* Returns a unique ID for this UI5 Element
|
100
86
|
*
|
101
87
|
* @deprecated - This property is not guaranteed in future releases
|
102
88
|
* @protected
|
103
89
|
*/
|
104
|
-
|
105
|
-
|
106
90
|
get _id() {
|
107
91
|
if (!this.__id) {
|
108
92
|
this.__id = `ui5wc_${++autoId}`;
|
109
93
|
}
|
110
|
-
|
111
94
|
return this.__id;
|
112
95
|
}
|
96
|
+
|
113
97
|
/**
|
114
98
|
* Do not call this method from derivatives of UI5Element, use "onEnterDOM" only
|
115
99
|
* @private
|
116
100
|
*/
|
117
|
-
|
118
|
-
|
119
101
|
async connectedCallback() {
|
120
102
|
this.setAttribute(this.constructor.getMetadata().getPureTag(), "");
|
121
|
-
|
122
103
|
if (this.constructor.getMetadata().supportsF6FastNavigation()) {
|
123
104
|
this.setAttribute("data-sap-ui-fastnavgroup", "true");
|
124
105
|
}
|
125
|
-
|
126
106
|
const slotsAreManaged = this.constructor.getMetadata().slotsAreManaged();
|
127
107
|
this._inDOM = true;
|
128
|
-
|
129
108
|
if (slotsAreManaged) {
|
130
109
|
// always register the observer before yielding control to the main thread (await)
|
131
110
|
this._startObservingDOMChildren();
|
132
|
-
|
133
111
|
await this._processChildren();
|
134
112
|
}
|
135
|
-
|
136
113
|
if (!this._inDOM) {
|
137
114
|
// Component removed from DOM while _processChildren was running
|
138
115
|
return;
|
139
116
|
}
|
140
|
-
|
141
117
|
(0, _Render.renderImmediately)(this);
|
142
|
-
|
143
118
|
this._domRefReadyPromise._deferredResolve();
|
144
|
-
|
145
119
|
this._fullyConnected = true;
|
146
|
-
|
147
120
|
if (typeof this.onEnterDOM === "function") {
|
148
121
|
this.onEnterDOM();
|
149
122
|
}
|
150
123
|
}
|
124
|
+
|
151
125
|
/**
|
152
126
|
* Do not call this method from derivatives of UI5Element, use "onExitDOM" only
|
153
127
|
* @private
|
154
128
|
*/
|
155
|
-
|
156
|
-
|
157
129
|
disconnectedCallback() {
|
158
130
|
const slotsAreManaged = this.constructor.getMetadata().slotsAreManaged();
|
159
131
|
this._inDOM = false;
|
160
|
-
|
161
132
|
if (slotsAreManaged) {
|
162
133
|
this._stopObservingDOMChildren();
|
163
134
|
}
|
164
|
-
|
165
135
|
if (this._fullyConnected) {
|
166
136
|
if (typeof this.onExitDOM === "function") {
|
167
137
|
this.onExitDOM();
|
168
138
|
}
|
169
|
-
|
170
139
|
this._fullyConnected = false;
|
171
140
|
}
|
172
|
-
|
173
141
|
if (this.staticAreaItem && this.staticAreaItem.parentElement) {
|
174
142
|
this.staticAreaItem.parentElement.removeChild(this.staticAreaItem);
|
175
143
|
}
|
176
|
-
|
177
144
|
(0, _Render.cancelRender)(this);
|
178
145
|
}
|
146
|
+
|
179
147
|
/**
|
180
148
|
* @private
|
181
149
|
*/
|
182
|
-
|
183
|
-
|
184
150
|
_startObservingDOMChildren() {
|
185
151
|
const shouldObserveChildren = this.constructor.getMetadata().hasSlots();
|
186
|
-
|
187
152
|
if (!shouldObserveChildren) {
|
188
153
|
return;
|
189
154
|
}
|
190
|
-
|
191
155
|
const canSlotText = this.constructor.getMetadata().canSlotText();
|
192
156
|
const mutationObserverOptions = {
|
193
157
|
childList: true,
|
@@ -196,111 +160,95 @@ sap.ui.define(["exports", "./thirdparty/merge", "./Boot", "./UI5ElementMetadata"
|
|
196
160
|
};
|
197
161
|
(0, _DOMObserver.observeDOMNode)(this, this._processChildren.bind(this), mutationObserverOptions);
|
198
162
|
}
|
163
|
+
|
199
164
|
/**
|
200
165
|
* @private
|
201
166
|
*/
|
202
|
-
|
203
|
-
|
204
167
|
_stopObservingDOMChildren() {
|
205
168
|
(0, _DOMObserver.unobserveDOMNode)(this);
|
206
169
|
}
|
170
|
+
|
207
171
|
/**
|
208
172
|
* Note: this method is also manually called by "compatibility/patchNodeValue.js"
|
209
173
|
* @private
|
210
174
|
*/
|
211
|
-
|
212
|
-
|
213
175
|
async _processChildren() {
|
214
176
|
const hasSlots = this.constructor.getMetadata().hasSlots();
|
215
|
-
|
216
177
|
if (hasSlots) {
|
217
178
|
await this._updateSlots();
|
218
179
|
}
|
219
180
|
}
|
181
|
+
|
220
182
|
/**
|
221
183
|
* @private
|
222
184
|
*/
|
223
|
-
|
224
|
-
|
225
185
|
async _updateSlots() {
|
226
186
|
const slotsMap = this.constructor.getMetadata().getSlots();
|
227
187
|
const canSlotText = this.constructor.getMetadata().canSlotText();
|
228
188
|
const domChildren = Array.from(canSlotText ? this.childNodes : this.children);
|
229
189
|
const slotsCachedContentMap = new Map(); // Store here the content of each slot before the mutation occurred
|
230
|
-
|
231
190
|
const propertyNameToSlotMap = new Map(); // Used for reverse lookup to determine to which slot the property name corresponds
|
232
|
-
// Init the _state object based on the supported slots and store the previous values
|
233
191
|
|
192
|
+
// Init the _state object based on the supported slots and store the previous values
|
234
193
|
for (const [slotName, slotData] of Object.entries(slotsMap)) {
|
235
194
|
// eslint-disable-line
|
236
195
|
const propertyName = slotData.propertyName || slotName;
|
237
196
|
propertyNameToSlotMap.set(propertyName, slotName);
|
238
197
|
slotsCachedContentMap.set(propertyName, [...this._state[propertyName]]);
|
239
|
-
|
240
198
|
this._clearSlot(slotName, slotData);
|
241
199
|
}
|
242
|
-
|
243
200
|
const autoIncrementMap = new Map();
|
244
201
|
const slottedChildrenMap = new Map();
|
245
202
|
const allChildrenUpgraded = domChildren.map(async (child, idx) => {
|
246
203
|
// Determine the type of the child (mainly by the slot attribute)
|
247
204
|
const slotName = (0, _SlotsHelper.getSlotName)(child);
|
248
|
-
const slotData = slotsMap[slotName];
|
205
|
+
const slotData = slotsMap[slotName];
|
249
206
|
|
207
|
+
// Check if the slotName is supported
|
250
208
|
if (slotData === undefined) {
|
251
209
|
const validValues = Object.keys(slotsMap).join(", ");
|
252
210
|
console.warn(`Unknown slotName: ${slotName}, ignoring`, child, `Valid values are: ${validValues}`); // eslint-disable-line
|
253
|
-
|
254
211
|
return;
|
255
|
-
}
|
256
|
-
|
212
|
+
}
|
257
213
|
|
214
|
+
// For children that need individual slots, calculate them
|
258
215
|
if (slotData.individualSlots) {
|
259
216
|
const nextIndex = (autoIncrementMap.get(slotName) || 0) + 1;
|
260
217
|
autoIncrementMap.set(slotName, nextIndex);
|
261
218
|
child._individualSlot = `${slotName}-${nextIndex}`;
|
262
|
-
}
|
263
|
-
|
219
|
+
}
|
264
220
|
|
221
|
+
// Await for not-yet-defined custom elements
|
265
222
|
if (child instanceof HTMLElement) {
|
266
223
|
const localName = child.localName;
|
267
224
|
const isCustomElement = localName.includes("-");
|
268
|
-
|
269
225
|
if (isCustomElement) {
|
270
226
|
const isDefined = window.customElements.get(localName);
|
271
|
-
|
272
227
|
if (!isDefined) {
|
273
228
|
const whenDefinedPromise = window.customElements.whenDefined(localName); // Class registered, but instances not upgraded yet
|
274
|
-
|
275
229
|
let timeoutPromise = elementTimeouts.get(localName);
|
276
|
-
|
277
230
|
if (!timeoutPromise) {
|
278
231
|
timeoutPromise = new Promise(resolve => setTimeout(resolve, 1000));
|
279
232
|
elementTimeouts.set(localName, timeoutPromise);
|
280
233
|
}
|
281
|
-
|
282
234
|
await Promise.race([whenDefinedPromise, timeoutPromise]);
|
283
235
|
}
|
284
|
-
|
285
236
|
window.customElements.upgrade(child);
|
286
237
|
}
|
287
238
|
}
|
239
|
+
child = this.constructor.getMetadata().constructor.validateSlotValue(child, slotData);
|
288
240
|
|
289
|
-
|
290
|
-
|
241
|
+
// Listen for any invalidation on the child if invalidateOnChildChange is true or an object (ignore when false or not set)
|
291
242
|
if (child.isUI5Element && slotData.invalidateOnChildChange) {
|
292
243
|
const method = (child.attachInvalidate || child._attachChange).bind(child);
|
293
|
-
|
294
244
|
method(this._getChildChangeListener(slotName));
|
295
|
-
}
|
296
|
-
|
245
|
+
}
|
297
246
|
|
247
|
+
// Listen for the slotchange event if the child is a slot itself
|
298
248
|
if ((0, _SlotsHelper.isSlot)(child)) {
|
299
249
|
this._attachSlotChange(child, slotName);
|
300
250
|
}
|
301
|
-
|
302
251
|
const propertyName = slotData.propertyName || slotName;
|
303
|
-
|
304
252
|
if (slottedChildrenMap.has(propertyName)) {
|
305
253
|
slottedChildrenMap.get(propertyName).push({
|
306
254
|
child,
|
@@ -313,32 +261,31 @@ sap.ui.define(["exports", "./thirdparty/merge", "./Boot", "./UI5ElementMetadata"
|
|
313
261
|
}]);
|
314
262
|
}
|
315
263
|
});
|
316
|
-
await Promise.all(allChildrenUpgraded);
|
317
|
-
// not the order elements are defined.
|
264
|
+
await Promise.all(allChildrenUpgraded);
|
318
265
|
|
266
|
+
// Distribute the child in the _state object, keeping the Light DOM order,
|
267
|
+
// not the order elements are defined.
|
319
268
|
slottedChildrenMap.forEach((children, propertyName) => {
|
320
269
|
this._state[propertyName] = children.sort((a, b) => a.idx - b.idx).map(_ => _.child);
|
321
|
-
});
|
270
|
+
});
|
322
271
|
|
272
|
+
// Compare the content of each slot with the cached values and invalidate for the ones that changed
|
323
273
|
let invalidated = false;
|
324
|
-
|
325
274
|
for (const [slotName, slotData] of Object.entries(slotsMap)) {
|
326
275
|
// eslint-disable-line
|
327
276
|
const propertyName = slotData.propertyName || slotName;
|
328
|
-
|
329
277
|
if (!(0, _arraysAreEqual.default)(slotsCachedContentMap.get(propertyName), this._state[propertyName])) {
|
330
278
|
_invalidate.call(this, {
|
331
279
|
type: "slot",
|
332
280
|
name: propertyNameToSlotMap.get(propertyName),
|
333
281
|
reason: "children"
|
334
282
|
});
|
335
|
-
|
336
283
|
invalidated = true;
|
337
284
|
}
|
338
|
-
}
|
339
|
-
// the change is considered to be text content of the default slot
|
340
|
-
|
285
|
+
}
|
341
286
|
|
287
|
+
// If none of the slots had an invalidation due to changes to immediate children,
|
288
|
+
// the change is considered to be text content of the default slot
|
342
289
|
if (!invalidated) {
|
343
290
|
_invalidate.call(this, {
|
344
291
|
type: "slot",
|
@@ -347,50 +294,46 @@ sap.ui.define(["exports", "./thirdparty/merge", "./Boot", "./UI5ElementMetadata"
|
|
347
294
|
});
|
348
295
|
}
|
349
296
|
}
|
297
|
+
|
350
298
|
/**
|
351
299
|
* Removes all children from the slot and detaches listeners, if any
|
352
300
|
* @private
|
353
301
|
*/
|
354
|
-
|
355
|
-
|
356
302
|
_clearSlot(slotName, slotData) {
|
357
303
|
const propertyName = slotData.propertyName || slotName;
|
358
304
|
const children = this._state[propertyName];
|
359
305
|
children.forEach(child => {
|
360
306
|
if (child && child.isUI5Element) {
|
361
307
|
const method = (child.detachInvalidate || child._detachChange).bind(child);
|
362
|
-
|
363
308
|
method(this._getChildChangeListener(slotName));
|
364
309
|
}
|
365
|
-
|
366
310
|
if ((0, _SlotsHelper.isSlot)(child)) {
|
367
311
|
this._detachSlotChange(child, slotName);
|
368
312
|
}
|
369
313
|
});
|
370
314
|
this._state[propertyName] = [];
|
371
315
|
}
|
316
|
+
|
372
317
|
/**
|
373
318
|
* Attach a callback that will be executed whenever the component is invalidated
|
374
319
|
*
|
375
320
|
* @param callback
|
376
321
|
* @public
|
377
322
|
*/
|
378
|
-
|
379
|
-
|
380
323
|
attachInvalidate(callback) {
|
381
324
|
this._eventProvider.attachEvent("invalidate", callback);
|
382
325
|
}
|
326
|
+
|
383
327
|
/**
|
384
328
|
* Detach the callback that is executed whenever the component is invalidated
|
385
329
|
*
|
386
330
|
* @param callback
|
387
331
|
* @public
|
388
332
|
*/
|
389
|
-
|
390
|
-
|
391
333
|
detachInvalidate(callback) {
|
392
334
|
this._eventProvider.detachEvent("invalidate", callback);
|
393
335
|
}
|
336
|
+
|
394
337
|
/**
|
395
338
|
* Callback that is executed whenever a monitored child changes its state
|
396
339
|
*
|
@@ -398,15 +341,13 @@ sap.ui.define(["exports", "./thirdparty/merge", "./Boot", "./UI5ElementMetadata"
|
|
398
341
|
* @param childChangeInfo the changeInfo object for the child in the given slot
|
399
342
|
* @private
|
400
343
|
*/
|
401
|
-
|
402
|
-
|
403
344
|
_onChildChange(slotName, childChangeInfo) {
|
404
345
|
if (!this.constructor.getMetadata().shouldInvalidateOnChildChange(slotName, childChangeInfo.type, childChangeInfo.name)) {
|
405
346
|
return;
|
406
|
-
}
|
407
|
-
// However, no matter what changed on the child (property/slot), the invalidation is registered as "type=slot" for the component itself
|
408
|
-
|
347
|
+
}
|
409
348
|
|
349
|
+
// The component should be invalidated as this type of change on the child is listened for
|
350
|
+
// However, no matter what changed on the child (property/slot), the invalidation is registered as "type=slot" for the component itself
|
410
351
|
_invalidate.call(this, {
|
411
352
|
type: "slot",
|
412
353
|
name: slotName,
|
@@ -414,45 +355,38 @@ sap.ui.define(["exports", "./thirdparty/merge", "./Boot", "./UI5ElementMetadata"
|
|
414
355
|
child: childChangeInfo.target
|
415
356
|
});
|
416
357
|
}
|
358
|
+
|
417
359
|
/**
|
418
360
|
* Do not override this method in derivatives of UI5Element
|
419
361
|
* @private
|
420
362
|
*/
|
421
|
-
|
422
|
-
|
423
363
|
attributeChangedCallback(name, oldValue, newValue) {
|
424
364
|
const properties = this.constructor.getMetadata().getProperties();
|
425
365
|
const realName = name.replace(/^ui5-/, "");
|
426
366
|
const nameInCamelCase = (0, _StringHelper.kebabToCamelCase)(realName);
|
427
|
-
|
428
367
|
if (properties.hasOwnProperty(nameInCamelCase)) {
|
429
368
|
// eslint-disable-line
|
430
369
|
const propertyTypeClass = properties[nameInCamelCase].type;
|
431
|
-
|
432
370
|
if (propertyTypeClass === Boolean) {
|
433
371
|
newValue = newValue !== null;
|
434
372
|
} else if ((0, _isDescendantOf.default)(propertyTypeClass, _DataType.default)) {
|
435
373
|
newValue = propertyTypeClass.attributeToProperty(newValue);
|
436
374
|
}
|
437
|
-
|
438
375
|
this[nameInCamelCase] = newValue;
|
439
376
|
}
|
440
377
|
}
|
378
|
+
|
441
379
|
/**
|
442
380
|
* @private
|
443
381
|
*/
|
444
|
-
|
445
|
-
|
446
382
|
_updateAttribute(name, newValue) {
|
447
383
|
if (!this.constructor.getMetadata().hasAttribute(name)) {
|
448
384
|
return;
|
449
385
|
}
|
450
|
-
|
451
386
|
const properties = this.constructor.getMetadata().getProperties();
|
452
387
|
const propertyTypeClass = properties[name].type;
|
453
388
|
const attrName = (0, _StringHelper.camelToKebabCase)(name);
|
454
389
|
const attrValue = this.getAttribute(attrName);
|
455
|
-
|
456
390
|
if (propertyTypeClass === Boolean) {
|
457
391
|
if (newValue === true && attrValue === null) {
|
458
392
|
this.setAttribute(attrName, "");
|
@@ -466,13 +400,11 @@ sap.ui.define(["exports", "./thirdparty/merge", "./Boot", "./UI5ElementMetadata"
|
|
466
400
|
this.setAttribute(attrName, newValue);
|
467
401
|
}
|
468
402
|
} // else { return; } // old object handling
|
469
|
-
|
470
403
|
}
|
404
|
+
|
471
405
|
/**
|
472
406
|
* @private
|
473
407
|
*/
|
474
|
-
|
475
|
-
|
476
408
|
_upgradeProperty(prop) {
|
477
409
|
if (this.hasOwnProperty(prop)) {
|
478
410
|
// eslint-disable-line
|
@@ -481,24 +413,24 @@ sap.ui.define(["exports", "./thirdparty/merge", "./Boot", "./UI5ElementMetadata"
|
|
481
413
|
this[prop] = value;
|
482
414
|
}
|
483
415
|
}
|
416
|
+
|
484
417
|
/**
|
485
418
|
* @private
|
486
419
|
*/
|
487
|
-
|
488
|
-
|
489
420
|
_upgradeAllProperties() {
|
490
421
|
const allProps = this.constructor.getMetadata().getPropertiesList();
|
491
422
|
allProps.forEach(this._upgradeProperty, this);
|
492
423
|
}
|
424
|
+
|
493
425
|
/**
|
494
426
|
* @private
|
495
427
|
*/
|
496
|
-
|
497
|
-
|
498
428
|
_initializeState() {
|
499
|
-
this._state = {
|
429
|
+
this._state = {
|
430
|
+
...this.constructor.getMetadata().getInitialState()
|
500
431
|
};
|
501
432
|
}
|
433
|
+
|
502
434
|
/**
|
503
435
|
* Returns a singleton event listener for the "change" event of a child in a given slot
|
504
436
|
*
|
@@ -506,15 +438,13 @@ sap.ui.define(["exports", "./thirdparty/merge", "./Boot", "./UI5ElementMetadata"
|
|
506
438
|
* @returns {any}
|
507
439
|
* @private
|
508
440
|
*/
|
509
|
-
|
510
|
-
|
511
441
|
_getChildChangeListener(slotName) {
|
512
442
|
if (!this._childChangeListeners.has(slotName)) {
|
513
443
|
this._childChangeListeners.set(slotName, this._onChildChange.bind(this, slotName));
|
514
444
|
}
|
515
|
-
|
516
445
|
return this._childChangeListeners.get(slotName);
|
517
446
|
}
|
447
|
+
|
518
448
|
/**
|
519
449
|
* Returns a singleton slotchange event listener that invalidates the component due to changes in the given slot
|
520
450
|
*
|
@@ -522,39 +452,33 @@ sap.ui.define(["exports", "./thirdparty/merge", "./Boot", "./UI5ElementMetadata"
|
|
522
452
|
* @returns {any}
|
523
453
|
* @private
|
524
454
|
*/
|
525
|
-
|
526
|
-
|
527
455
|
_getSlotChangeListener(slotName) {
|
528
456
|
if (!this._slotChangeListeners.has(slotName)) {
|
529
457
|
this._slotChangeListeners.set(slotName, this._onSlotChange.bind(this, slotName));
|
530
458
|
}
|
531
|
-
|
532
459
|
return this._slotChangeListeners.get(slotName);
|
533
460
|
}
|
461
|
+
|
534
462
|
/**
|
535
463
|
* @private
|
536
464
|
*/
|
537
|
-
|
538
|
-
|
539
465
|
_attachSlotChange(child, slotName) {
|
540
466
|
child.addEventListener("slotchange", this._getSlotChangeListener(slotName));
|
541
467
|
}
|
468
|
+
|
542
469
|
/**
|
543
470
|
* @private
|
544
471
|
*/
|
545
|
-
|
546
|
-
|
547
472
|
_detachSlotChange(child, slotName) {
|
548
473
|
child.removeEventListener("slotchange", this._getSlotChangeListener(slotName));
|
549
474
|
}
|
475
|
+
|
550
476
|
/**
|
551
477
|
* Whenever a slot element is slotted inside a UI5 Web Component, its slotchange event invalidates the component
|
552
478
|
*
|
553
479
|
* @param slotName the name of the slot, where the slot element (whose slotchange event we're listening to) is
|
554
480
|
* @private
|
555
481
|
*/
|
556
|
-
|
557
|
-
|
558
482
|
_onSlotChange(slotName) {
|
559
483
|
_invalidate.call(this, {
|
560
484
|
type: "slot",
|
@@ -562,6 +486,7 @@ sap.ui.define(["exports", "./thirdparty/merge", "./Boot", "./UI5ElementMetadata"
|
|
562
486
|
reason: "slotchange"
|
563
487
|
});
|
564
488
|
}
|
489
|
+
|
565
490
|
/**
|
566
491
|
* A callback that is executed each time an already rendered component is invalidated (scheduled for re-rendering)
|
567
492
|
*
|
@@ -589,32 +514,30 @@ sap.ui.define(["exports", "./thirdparty/merge", "./Boot", "./UI5ElementMetadata"
|
|
589
514
|
*
|
590
515
|
* @public
|
591
516
|
*/
|
592
|
-
|
593
|
-
|
594
517
|
onInvalidation(changeInfo) {}
|
518
|
+
|
595
519
|
/**
|
596
520
|
* Do not call this method directly, only intended to be called by js
|
597
521
|
* @protected
|
598
522
|
*/
|
599
|
-
|
600
|
-
|
601
523
|
_render() {
|
602
|
-
const hasIndividualSlots = this.constructor.getMetadata().hasIndividualSlots();
|
524
|
+
const hasIndividualSlots = this.constructor.getMetadata().hasIndividualSlots();
|
603
525
|
|
526
|
+
// suppress invalidation to prevent state changes scheduling another rendering
|
604
527
|
this._suppressInvalidation = true;
|
605
|
-
|
606
528
|
if (typeof this.onBeforeRendering === "function") {
|
607
529
|
this.onBeforeRendering();
|
608
|
-
}
|
609
|
-
|
530
|
+
}
|
610
531
|
|
532
|
+
// Intended for framework usage only. Currently ItemNavigation updates tab indexes after the component has updated its state but before the template is rendered
|
611
533
|
if (this._onComponentStateFinalized) {
|
612
534
|
this._onComponentStateFinalized();
|
613
|
-
}
|
614
|
-
|
535
|
+
}
|
615
536
|
|
616
|
-
|
537
|
+
// resume normal invalidation handling
|
538
|
+
this._suppressInvalidation = false;
|
617
539
|
|
540
|
+
// Update the shadow root with the render result
|
618
541
|
/*
|
619
542
|
if (this._changedState.length) {
|
620
543
|
let element = this.localName;
|
@@ -634,32 +557,30 @@ sap.ui.define(["exports", "./thirdparty/merge", "./Boot", "./UI5ElementMetadata"
|
|
634
557
|
}));
|
635
558
|
}
|
636
559
|
*/
|
560
|
+
this._changedState = [];
|
637
561
|
|
638
|
-
|
639
|
-
|
562
|
+
// Update shadow root and static area item
|
640
563
|
if (this.constructor._needsShadowDOM()) {
|
641
564
|
(0, _updateShadowRoot.default)(this);
|
642
565
|
}
|
643
|
-
|
644
566
|
if (this.staticAreaItem) {
|
645
567
|
this.staticAreaItem.update();
|
646
|
-
}
|
647
|
-
|
568
|
+
}
|
648
569
|
|
570
|
+
// Safari requires that children get the slot attribute only after the slot tags have been rendered in the shadow DOM
|
649
571
|
if (hasIndividualSlots) {
|
650
572
|
this._assignIndividualSlotsToChildren();
|
651
|
-
}
|
652
|
-
|
573
|
+
}
|
653
574
|
|
575
|
+
// Call the onAfterRendering hook
|
654
576
|
if (typeof this.onAfterRendering === "function") {
|
655
577
|
this.onAfterRendering();
|
656
578
|
}
|
657
579
|
}
|
580
|
+
|
658
581
|
/**
|
659
582
|
* @private
|
660
583
|
*/
|
661
|
-
|
662
|
-
|
663
584
|
_assignIndividualSlotsToChildren() {
|
664
585
|
const domChildren = Array.from(this.children);
|
665
586
|
domChildren.forEach(child => {
|
@@ -668,14 +589,14 @@ sap.ui.define(["exports", "./thirdparty/merge", "./Boot", "./UI5ElementMetadata"
|
|
668
589
|
}
|
669
590
|
});
|
670
591
|
}
|
592
|
+
|
671
593
|
/**
|
672
594
|
* @private
|
673
595
|
*/
|
674
|
-
|
675
|
-
|
676
596
|
_waitForDomRef() {
|
677
597
|
return this._domRefReadyPromise;
|
678
598
|
}
|
599
|
+
|
679
600
|
/**
|
680
601
|
* Returns the DOM Element inside the Shadow Root that corresponds to the opening tag in the UI5 Web Component's template
|
681
602
|
* *Note:* For logical (abstract) elements (items, options, etc...), returns the part of the parent's DOM that represents this option
|
@@ -683,66 +604,57 @@ sap.ui.define(["exports", "./thirdparty/merge", "./Boot", "./UI5ElementMetadata"
|
|
683
604
|
*
|
684
605
|
* @public
|
685
606
|
*/
|
686
|
-
|
687
|
-
|
688
607
|
getDomRef() {
|
689
608
|
// If a component set _getRealDomRef to its children, use the return value of this function
|
690
609
|
if (typeof this._getRealDomRef === "function") {
|
691
610
|
return this._getRealDomRef();
|
692
611
|
}
|
693
|
-
|
694
612
|
if (!this.shadowRoot || this.shadowRoot.children.length === 0) {
|
695
613
|
return;
|
696
614
|
}
|
697
|
-
|
698
615
|
const children = [...this.shadowRoot.children].filter(child => !["link", "style"].includes(child.localName));
|
699
|
-
|
700
616
|
if (children.length !== 1) {
|
701
617
|
console.warn(`The shadow DOM for ${this.constructor.getMetadata().getTag()} does not have a top level element, the getDomRef() method might not work as expected`); // eslint-disable-line
|
702
618
|
}
|
703
619
|
|
704
620
|
return children[0];
|
705
621
|
}
|
622
|
+
|
706
623
|
/**
|
707
624
|
* Returns the DOM Element marked with "data-sap-focus-ref" inside the template.
|
708
625
|
* This is the element that will receive the focus by default.
|
709
626
|
* @public
|
710
627
|
*/
|
711
|
-
|
712
|
-
|
713
628
|
getFocusDomRef() {
|
714
629
|
const domRef = this.getDomRef();
|
715
|
-
|
716
630
|
if (domRef) {
|
717
631
|
const focusRef = domRef.querySelector("[data-sap-focus-ref]");
|
718
632
|
return focusRef || domRef;
|
719
633
|
}
|
720
634
|
}
|
635
|
+
|
721
636
|
/**
|
722
637
|
* Waits for dom ref and then returns the DOM Element marked with "data-sap-focus-ref" inside the template.
|
723
638
|
* This is the element that will receive the focus by default.
|
724
639
|
* @public
|
725
640
|
*/
|
726
|
-
|
727
|
-
|
728
641
|
async getFocusDomRefAsync() {
|
729
642
|
await this._waitForDomRef();
|
730
643
|
return this.getFocusDomRef();
|
731
644
|
}
|
645
|
+
|
732
646
|
/**
|
733
647
|
* Set the focus to the element, returned by "getFocusDomRef()" (marked by "data-sap-focus-ref")
|
734
648
|
* @public
|
735
649
|
*/
|
736
|
-
|
737
|
-
|
738
650
|
async focus() {
|
739
651
|
await this._waitForDomRef();
|
740
652
|
const focusDomRef = this.getFocusDomRef();
|
741
|
-
|
742
653
|
if (focusDomRef && typeof focusDomRef.focus === "function") {
|
743
654
|
focusDomRef.focus();
|
744
655
|
}
|
745
656
|
}
|
657
|
+
|
746
658
|
/**
|
747
659
|
*
|
748
660
|
* @public
|
@@ -752,55 +664,50 @@ sap.ui.define(["exports", "./thirdparty/merge", "./Boot", "./UI5ElementMetadata"
|
|
752
664
|
* @param bubbles - true, if the event bubbles
|
753
665
|
* @returns {boolean} false, if the event was cancelled (preventDefault called), true otherwise
|
754
666
|
*/
|
755
|
-
|
756
|
-
|
757
667
|
fireEvent(name, data, cancelable = false, bubbles = true) {
|
758
668
|
const eventResult = this._fireEvent(name, data, cancelable, bubbles);
|
759
|
-
|
760
669
|
const camelCaseEventName = (0, _StringHelper.kebabToCamelCase)(name);
|
761
|
-
|
762
670
|
if (camelCaseEventName !== name) {
|
763
671
|
return eventResult && this._fireEvent(camelCaseEventName, data, cancelable);
|
764
672
|
}
|
765
|
-
|
766
673
|
return eventResult;
|
767
674
|
}
|
768
|
-
|
769
675
|
_fireEvent(name, data, cancelable = false, bubbles = true) {
|
770
676
|
const noConflictEvent = new CustomEvent(`ui5-${name}`, {
|
771
677
|
detail: data,
|
772
678
|
composed: false,
|
773
679
|
bubbles,
|
774
680
|
cancelable
|
775
|
-
});
|
681
|
+
});
|
776
682
|
|
683
|
+
// This will be false if the no-conflict event is prevented
|
777
684
|
const noConflictEventResult = this.dispatchEvent(noConflictEvent);
|
778
|
-
|
779
685
|
if ((0, _NoConflict.skipOriginalEvent)(name)) {
|
780
686
|
return noConflictEventResult;
|
781
687
|
}
|
782
|
-
|
783
688
|
const normalEvent = new CustomEvent(name, {
|
784
689
|
detail: data,
|
785
690
|
composed: false,
|
786
691
|
bubbles,
|
787
692
|
cancelable
|
788
|
-
});
|
693
|
+
});
|
789
694
|
|
790
|
-
|
695
|
+
// This will be false if the normal event is prevented
|
696
|
+
const normalEventResult = this.dispatchEvent(normalEvent);
|
791
697
|
|
698
|
+
// Return false if any of the two events was prevented (its result was false).
|
792
699
|
return normalEventResult && noConflictEventResult;
|
793
700
|
}
|
701
|
+
|
794
702
|
/**
|
795
703
|
* Returns the actual children, associated with a slot.
|
796
704
|
* Useful when there are transitive slots in nested component scenarios and you don't want to get a list of the slots, but rather of their content.
|
797
705
|
* @public
|
798
706
|
*/
|
799
|
-
|
800
|
-
|
801
707
|
getSlottedNodes(slotName) {
|
802
708
|
return (0, _SlotsHelper.getSlottedElementsList)(this[slotName]);
|
803
709
|
}
|
710
|
+
|
804
711
|
/**
|
805
712
|
* Determines whether the component should be rendered in RTL mode or not.
|
806
713
|
* Returns: "rtl", "ltr" or undefined
|
@@ -808,111 +715,92 @@ sap.ui.define(["exports", "./thirdparty/merge", "./Boot", "./UI5ElementMetadata"
|
|
808
715
|
* @public
|
809
716
|
* @returns {String|undefined}
|
810
717
|
*/
|
811
|
-
|
812
|
-
|
813
718
|
get effectiveDir() {
|
814
719
|
(0, _RTLAwareRegistry.markAsRtlAware)(this.constructor); // if a UI5 Element calls this method, it's considered to be rtl-aware
|
815
|
-
|
816
720
|
return (0, _getEffectiveDir.default)(this);
|
817
721
|
}
|
722
|
+
|
818
723
|
/**
|
819
724
|
* Used to duck-type UI5 elements without using instanceof
|
820
725
|
* @returns {boolean}
|
821
726
|
* @public
|
822
727
|
*/
|
823
|
-
|
824
|
-
|
825
728
|
get isUI5Element() {
|
826
729
|
return true;
|
827
730
|
}
|
731
|
+
|
828
732
|
/**
|
829
733
|
* Do not override this method in derivatives of UI5Element, use metadata properties instead
|
830
734
|
* @private
|
831
735
|
*/
|
832
|
-
|
833
|
-
|
834
736
|
static get observedAttributes() {
|
835
737
|
return this.getMetadata().getAttributesList();
|
836
738
|
}
|
739
|
+
|
837
740
|
/**
|
838
741
|
* @private
|
839
742
|
*/
|
840
|
-
|
841
|
-
|
842
743
|
static _needsShadowDOM() {
|
843
744
|
return !!this.template;
|
844
745
|
}
|
746
|
+
|
845
747
|
/**
|
846
748
|
* @private
|
847
749
|
*/
|
848
|
-
|
849
|
-
|
850
750
|
static _needsStaticArea() {
|
851
751
|
return !!this.staticAreaTemplate;
|
852
752
|
}
|
753
|
+
|
853
754
|
/**
|
854
755
|
* @public
|
855
756
|
*/
|
856
|
-
|
857
|
-
|
858
757
|
getStaticAreaItemDomRef() {
|
859
758
|
if (!this.constructor._needsStaticArea()) {
|
860
759
|
throw new Error("This component does not use the static area");
|
861
760
|
}
|
862
|
-
|
863
761
|
if (!this.staticAreaItem) {
|
864
762
|
this.staticAreaItem = _StaticAreaItem.default.createInstance();
|
865
763
|
this.staticAreaItem.setOwnerElement(this);
|
866
764
|
}
|
867
|
-
|
868
765
|
if (!this.staticAreaItem.parentElement) {
|
869
766
|
(0, _getSingletonElementInstance.default)("ui5-static-area").appendChild(this.staticAreaItem);
|
870
767
|
}
|
871
|
-
|
872
768
|
return this.staticAreaItem.getDomRef();
|
873
769
|
}
|
770
|
+
|
874
771
|
/**
|
875
772
|
* @private
|
876
773
|
*/
|
877
|
-
|
878
|
-
|
879
774
|
static _generateAccessors() {
|
880
775
|
const proto = this.prototype;
|
881
|
-
const slotsAreManaged = this.getMetadata().slotsAreManaged();
|
776
|
+
const slotsAreManaged = this.getMetadata().slotsAreManaged();
|
882
777
|
|
778
|
+
// Properties
|
883
779
|
const properties = this.getMetadata().getProperties();
|
884
|
-
|
885
780
|
for (const [prop, propData] of Object.entries(properties)) {
|
886
781
|
// eslint-disable-line
|
887
782
|
if (!(0, _isValidPropertyName.default)(prop)) {
|
888
|
-
console.warn(`"${prop}" is not a valid property name. Use a name that does not collide with DOM APIs`);
|
889
|
-
/* eslint-disable-line */
|
783
|
+
console.warn(`"${prop}" is not a valid property name. Use a name that does not collide with DOM APIs`); /* eslint-disable-line */
|
890
784
|
}
|
891
785
|
|
892
786
|
if (propData.type === Boolean && propData.defaultValue) {
|
893
787
|
throw new Error(`Cannot set a default value for property "${prop}". All booleans are false by default.`);
|
894
788
|
}
|
895
|
-
|
896
789
|
if (propData.type === Array) {
|
897
790
|
throw new Error(`Wrong type for property "${prop}". Properties cannot be of type Array - use "multiple: true" and set "type" to the single value type, such as "String", "Object", etc...`);
|
898
791
|
}
|
899
|
-
|
900
792
|
if (propData.type === Object && propData.defaultValue) {
|
901
793
|
throw new Error(`Cannot set a default value for property "${prop}". All properties of type "Object" are empty objects by default.`);
|
902
794
|
}
|
903
|
-
|
904
795
|
if (propData.multiple && propData.defaultValue) {
|
905
796
|
throw new Error(`Cannot set a default value for property "${prop}". All multiple properties are empty arrays by default.`);
|
906
797
|
}
|
907
|
-
|
908
798
|
Object.defineProperty(proto, prop, {
|
909
799
|
get() {
|
910
800
|
if (this._state[prop] !== undefined) {
|
911
801
|
return this._state[prop];
|
912
802
|
}
|
913
|
-
|
914
803
|
const propDefaultValue = propData.defaultValue;
|
915
|
-
|
916
804
|
if (propData.type === Boolean) {
|
917
805
|
return false;
|
918
806
|
} else if (propData.type === String) {
|
@@ -925,12 +813,10 @@ sap.ui.define(["exports", "./thirdparty/merge", "./Boot", "./UI5ElementMetadata"
|
|
925
813
|
return propDefaultValue;
|
926
814
|
}
|
927
815
|
},
|
928
|
-
|
929
816
|
set(value) {
|
930
817
|
let isDifferent;
|
931
818
|
value = this.constructor.getMetadata().constructor.validatePropertyValue(value, propData);
|
932
819
|
const oldState = this._state[prop];
|
933
|
-
|
934
820
|
if (propData.multiple && propData.compareValues) {
|
935
821
|
isDifferent = !(0, _arraysAreEqual.default)(oldState, value);
|
936
822
|
} else if ((0, _isDescendantOf.default)(propData.type, _DataType.default)) {
|
@@ -938,33 +824,27 @@ sap.ui.define(["exports", "./thirdparty/merge", "./Boot", "./UI5ElementMetadata"
|
|
938
824
|
} else {
|
939
825
|
isDifferent = oldState !== value;
|
940
826
|
}
|
941
|
-
|
942
827
|
if (isDifferent) {
|
943
828
|
this._state[prop] = value;
|
944
|
-
|
945
829
|
_invalidate.call(this, {
|
946
830
|
type: "property",
|
947
831
|
name: prop,
|
948
832
|
newValue: value,
|
949
833
|
oldValue: oldState
|
950
834
|
});
|
951
|
-
|
952
835
|
this._updateAttribute(prop, value);
|
953
836
|
}
|
954
837
|
}
|
955
|
-
|
956
838
|
});
|
957
|
-
}
|
958
|
-
|
839
|
+
}
|
959
840
|
|
841
|
+
// Slots
|
960
842
|
if (slotsAreManaged) {
|
961
843
|
const slots = this.getMetadata().getSlots();
|
962
|
-
|
963
844
|
for (const [slotName, slotData] of Object.entries(slots)) {
|
964
845
|
// eslint-disable-line
|
965
846
|
if (!(0, _isValidPropertyName.default)(slotName)) {
|
966
|
-
console.warn(`"${slotName}" is not a valid property name. Use a name that does not collide with DOM APIs`);
|
967
|
-
/* eslint-disable-line */
|
847
|
+
console.warn(`"${slotName}" is not a valid property name. Use a name that does not collide with DOM APIs`); /* eslint-disable-line */
|
968
848
|
}
|
969
849
|
|
970
850
|
const propertyName = slotData.propertyName || slotName;
|
@@ -973,54 +853,48 @@ sap.ui.define(["exports", "./thirdparty/merge", "./Boot", "./UI5ElementMetadata"
|
|
973
853
|
if (this._state[propertyName] !== undefined) {
|
974
854
|
return this._state[propertyName];
|
975
855
|
}
|
976
|
-
|
977
856
|
return [];
|
978
857
|
},
|
979
|
-
|
980
858
|
set() {
|
981
859
|
throw new Error("Cannot set slot content directly, use the DOM APIs (appendChild, removeChild, etc...)");
|
982
860
|
}
|
983
|
-
|
984
861
|
});
|
985
862
|
}
|
986
863
|
}
|
987
864
|
}
|
865
|
+
|
988
866
|
/**
|
989
867
|
* Returns the metadata object for this UI5 Web Component Class
|
990
868
|
* @protected
|
991
869
|
*/
|
992
|
-
|
993
|
-
|
994
870
|
static get metadata() {
|
995
871
|
return metadata;
|
996
872
|
}
|
873
|
+
|
997
874
|
/**
|
998
875
|
* Sets a new metadata object for this UI5 Web Component Class
|
999
876
|
* @protected
|
1000
877
|
*/
|
1001
|
-
|
1002
|
-
|
1003
878
|
static set metadata(newMetadata) {
|
1004
879
|
metadata = newMetadata;
|
1005
880
|
}
|
881
|
+
|
1006
882
|
/**
|
1007
883
|
* Returns the CSS for this UI5 Web Component Class
|
1008
884
|
* @protected
|
1009
885
|
*/
|
1010
|
-
|
1011
|
-
|
1012
886
|
static get styles() {
|
1013
887
|
return "";
|
1014
888
|
}
|
889
|
+
|
1015
890
|
/**
|
1016
891
|
* Returns the Static Area CSS for this UI5 Web Component Class
|
1017
892
|
* @protected
|
1018
893
|
*/
|
1019
|
-
|
1020
|
-
|
1021
894
|
static get staticAreaStyles() {
|
1022
895
|
return "";
|
1023
896
|
}
|
897
|
+
|
1024
898
|
/**
|
1025
899
|
* Returns an array with the dependencies for this UI5 Web Component, which could be:
|
1026
900
|
* - composed components (used in its shadow root or static area item)
|
@@ -1028,54 +902,47 @@ sap.ui.define(["exports", "./thirdparty/merge", "./Boot", "./UI5ElementMetadata"
|
|
1028
902
|
*
|
1029
903
|
* @protected
|
1030
904
|
*/
|
1031
|
-
|
1032
|
-
|
1033
905
|
static get dependencies() {
|
1034
906
|
return [];
|
1035
907
|
}
|
908
|
+
|
1036
909
|
/**
|
1037
910
|
* Returns a list of the unique dependencies for this UI5 Web Component
|
1038
911
|
*
|
1039
912
|
* @public
|
1040
913
|
*/
|
1041
|
-
|
1042
|
-
|
1043
914
|
static getUniqueDependencies() {
|
1044
915
|
if (!uniqueDependenciesCache.has(this)) {
|
1045
916
|
const filtered = this.dependencies.filter((dep, index, deps) => deps.indexOf(dep) === index);
|
1046
917
|
uniqueDependenciesCache.set(this, filtered);
|
1047
918
|
}
|
1048
|
-
|
1049
919
|
return uniqueDependenciesCache.get(this);
|
1050
920
|
}
|
921
|
+
|
1051
922
|
/**
|
1052
923
|
* Returns a promise that resolves whenever all dependencies for this UI5 Web Component have resolved
|
1053
924
|
*
|
1054
925
|
* @returns {Promise<any[]>}
|
1055
926
|
*/
|
1056
|
-
|
1057
|
-
|
1058
927
|
static whenDependenciesDefined() {
|
1059
928
|
return Promise.all(this.getUniqueDependencies().map(dep => dep.define()));
|
1060
929
|
}
|
930
|
+
|
1061
931
|
/**
|
1062
932
|
* Hook that will be called upon custom element definition
|
1063
933
|
*
|
1064
934
|
* @protected
|
1065
935
|
* @returns {Promise<void>}
|
1066
936
|
*/
|
1067
|
-
|
1068
|
-
|
1069
937
|
static async onDefine() {
|
1070
938
|
return Promise.resolve();
|
1071
939
|
}
|
940
|
+
|
1072
941
|
/**
|
1073
942
|
* Registers a UI5 Web Component in the browser window object
|
1074
943
|
* @public
|
1075
944
|
* @returns {Promise<UI5Element>}
|
1076
945
|
*/
|
1077
|
-
|
1078
|
-
|
1079
946
|
static async define() {
|
1080
947
|
await (0, _Boot.boot)();
|
1081
948
|
await Promise.all([this.whenDependenciesDefined(), this.onDefine()]);
|
@@ -1083,16 +950,13 @@ sap.ui.define(["exports", "./thirdparty/merge", "./Boot", "./UI5ElementMetadata"
|
|
1083
950
|
const altTag = this.getMetadata().getAltTag();
|
1084
951
|
const definedLocally = (0, _CustomElementsRegistry.isTagRegistered)(tag);
|
1085
952
|
const definedGlobally = customElements.get(tag);
|
1086
|
-
|
1087
953
|
if (definedGlobally && !definedLocally) {
|
1088
954
|
(0, _CustomElementsRegistry.recordTagRegistrationFailure)(tag);
|
1089
955
|
} else if (!definedGlobally) {
|
1090
956
|
this._generateAccessors();
|
1091
|
-
|
1092
957
|
(0, _CustomElementsRegistry.registerTag)(tag);
|
1093
958
|
window.customElements.define(tag, this);
|
1094
959
|
(0, _preloadLinks.default)(this);
|
1095
|
-
|
1096
960
|
if (altTag && !customElements.get(altTag)) {
|
1097
961
|
(0, _CustomElementsRegistry.registerTag)(altTag);
|
1098
962
|
window.customElements.define(altTag, (0, _getClassCopy.default)(this, () => {
|
@@ -1103,35 +967,29 @@ sap.ui.define(["exports", "./thirdparty/merge", "./Boot", "./UI5ElementMetadata"
|
|
1103
967
|
|
1104
968
|
return this;
|
1105
969
|
}
|
970
|
+
|
1106
971
|
/**
|
1107
972
|
* Returns an instance of UI5ElementMetadata.js representing this UI5 Web Component's full metadata (its and its parents')
|
1108
973
|
* Note: not to be confused with the "get metadata()" method, which returns an object for this class's metadata only
|
1109
974
|
* @public
|
1110
975
|
* @returns {UI5ElementMetadata}
|
1111
976
|
*/
|
1112
|
-
|
1113
|
-
|
1114
977
|
static getMetadata() {
|
1115
978
|
if (this.hasOwnProperty("_metadata")) {
|
1116
979
|
// eslint-disable-line
|
1117
980
|
return this._metadata;
|
1118
981
|
}
|
1119
|
-
|
1120
982
|
const metadataObjects = [this.metadata];
|
1121
983
|
let klass = this; // eslint-disable-line
|
1122
|
-
|
1123
984
|
while (klass !== UI5Element) {
|
1124
985
|
klass = Object.getPrototypeOf(klass);
|
1125
986
|
metadataObjects.unshift(klass.metadata);
|
1126
987
|
}
|
1127
|
-
|
1128
988
|
const mergedMetadata = (0, _merge.default)({}, ...metadataObjects);
|
1129
989
|
this._metadata = new _UI5ElementMetadata.default(mergedMetadata);
|
1130
990
|
return this._metadata;
|
1131
991
|
}
|
1132
|
-
|
1133
992
|
}
|
1134
|
-
|
1135
993
|
var _default = UI5Element;
|
1136
994
|
_exports.default = _default;
|
1137
995
|
});
|