@merkur/integration-custom-element 0.45.1 → 0.47.2
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/lib/index.cjs +47 -54
- package/lib/index.es9.cjs +49 -55
- package/lib/index.es9.mjs +49 -55
- package/lib/index.js +47 -54
- package/lib/index.mjs +47 -54
- package/lib/index.umd.js +1 -1
- package/package.json +4 -4
package/lib/index.cjs
CHANGED
|
@@ -24,6 +24,8 @@ function afterDOMLoad() {
|
|
|
24
24
|
} else {
|
|
25
25
|
window.addEventListener('DOMContentLoaded', () => {
|
|
26
26
|
resolve();
|
|
27
|
+
}, {
|
|
28
|
+
once: true
|
|
27
29
|
});
|
|
28
30
|
}
|
|
29
31
|
} else {
|
|
@@ -44,6 +46,9 @@ function registerCustomElement(options) {
|
|
|
44
46
|
}
|
|
45
47
|
constructor(...$) {
|
|
46
48
|
const _ = super(...$);
|
|
49
|
+
this._pendingProps = {};
|
|
50
|
+
this._batchTimeout = null;
|
|
51
|
+
this._isInitialized = false;
|
|
47
52
|
_._init();
|
|
48
53
|
return _;
|
|
49
54
|
}
|
|
@@ -65,15 +70,9 @@ function registerCustomElement(options) {
|
|
|
65
70
|
await afterDOMLoad();
|
|
66
71
|
await integration.loadAssets(widget.assets, this._shadow);
|
|
67
72
|
this._setDefaultProps();
|
|
68
|
-
await callbacks?.reconstructor?.(this._widget,
|
|
69
|
-
shadow: this._shadow,
|
|
70
|
-
customElement: this
|
|
71
|
-
});
|
|
73
|
+
await callbacks?.reconstructor?.(this._widget, this._getContext());
|
|
72
74
|
if (typeof callbacks?.remount === 'function') {
|
|
73
|
-
await callbacks?.remount?.(this._widget,
|
|
74
|
-
shadow: this._shadow,
|
|
75
|
-
customElement: this
|
|
76
|
-
});
|
|
75
|
+
await callbacks?.remount?.(this._widget, this._getContext());
|
|
77
76
|
} else {
|
|
78
77
|
widget.root = this._shadow;
|
|
79
78
|
widget.customElement = this;
|
|
@@ -95,14 +94,8 @@ function registerCustomElement(options) {
|
|
|
95
94
|
this._shadow.appendChild(customWidgetDefinition.container);
|
|
96
95
|
this._widget = await createSPAWidget(customWidgetDefinition, this._shadow);
|
|
97
96
|
this._setDefaultProps();
|
|
98
|
-
await callbacks?.constructor?.(this._widget,
|
|
99
|
-
|
|
100
|
-
customElement: this
|
|
101
|
-
});
|
|
102
|
-
(await callbacks?.mount?.(this._widget, {
|
|
103
|
-
shadow: this._shadow,
|
|
104
|
-
customElement: this
|
|
105
|
-
})) ?? (await this._widget.mount());
|
|
97
|
+
await callbacks?.constructor?.(this._widget, this._getContext());
|
|
98
|
+
(await callbacks?.mount?.(this._widget, this._getContext())) ?? (await this._widget.mount());
|
|
106
99
|
} catch (error) {
|
|
107
100
|
console.error(error);
|
|
108
101
|
}
|
|
@@ -112,53 +105,47 @@ function registerCustomElement(options) {
|
|
|
112
105
|
}
|
|
113
106
|
}
|
|
114
107
|
async connectedCallback() {
|
|
108
|
+
this._isInitialized = true;
|
|
115
109
|
await this._widgetPromise;
|
|
116
|
-
this._widget?.connectedCallback?.(
|
|
117
|
-
|
|
118
|
-
customElement: this
|
|
119
|
-
});
|
|
120
|
-
callbacks?.connectedCallback?.(this._widget, {
|
|
121
|
-
shadow: this._shadow,
|
|
122
|
-
customElement: this
|
|
123
|
-
});
|
|
110
|
+
this._widget?.connectedCallback?.(this._getContext());
|
|
111
|
+
callbacks?.connectedCallback?.(this._widget, this._getContext());
|
|
124
112
|
}
|
|
125
113
|
async disconnectedCallback() {
|
|
114
|
+
this._isInitialized = false;
|
|
126
115
|
await this._widgetPromise;
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
116
|
+
|
|
117
|
+
// Clear any pending batch updates
|
|
118
|
+
if (this._batchTimeout) {
|
|
119
|
+
clearTimeout(this._batchTimeout);
|
|
120
|
+
this._batchTimeout = null;
|
|
121
|
+
this._pendingProps = {};
|
|
122
|
+
}
|
|
123
|
+
this._widget?.disconnectedCallback?.(this._getContext());
|
|
124
|
+
callbacks?.disconnectedCallback?.(this._widget, this._getContext());
|
|
135
125
|
}
|
|
136
126
|
async adoptedCallback() {
|
|
137
127
|
await this._widgetPromise;
|
|
138
|
-
this._widget?.adoptedCallback?.(
|
|
139
|
-
|
|
140
|
-
customElement: this
|
|
141
|
-
});
|
|
142
|
-
callbacks?.adoptedCallback?.(this._widget, {
|
|
143
|
-
shadow: this._shadow,
|
|
144
|
-
customElement: this
|
|
145
|
-
});
|
|
128
|
+
this._widget?.adoptedCallback?.(this._getContext());
|
|
129
|
+
callbacks?.adoptedCallback?.(this._widget, this._getContext());
|
|
146
130
|
}
|
|
147
131
|
async attributeChangedCallback(name, oldValue, newValue) {
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
[camelCaseKey]
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
132
|
+
if (this._isInitialized) {
|
|
133
|
+
await this._widgetPromise;
|
|
134
|
+
const camelCaseKey = name.replace(/-([a-z])/g, g => g[1].toUpperCase());
|
|
135
|
+
const parser = attributesParser?.[name] ?? (value => value);
|
|
136
|
+
this._pendingProps[camelCaseKey] = parser(newValue);
|
|
137
|
+
if (this._batchTimeout) {
|
|
138
|
+
clearTimeout(this._batchTimeout);
|
|
139
|
+
}
|
|
140
|
+
this._batchTimeout = setTimeout(() => {
|
|
141
|
+
const propsToUpdate = this._pendingProps;
|
|
142
|
+
this._pendingProps = {};
|
|
143
|
+
this._batchTimeout = null;
|
|
144
|
+
this._widget?.setProps?.(propsToUpdate);
|
|
145
|
+
}, 0);
|
|
146
|
+
this._widget?.attributeChangedCallback?.(this._widget, name, oldValue, newValue, this._getContext());
|
|
147
|
+
callbacks?.attributeChangedCallback?.(this._widget, name, oldValue, newValue, this._getContext());
|
|
148
|
+
}
|
|
162
149
|
}
|
|
163
150
|
_setDefaultProps() {
|
|
164
151
|
const attributes = this.constructor.observedAttributes;
|
|
@@ -175,6 +162,12 @@ function registerCustomElement(options) {
|
|
|
175
162
|
});
|
|
176
163
|
}
|
|
177
164
|
}
|
|
165
|
+
_getContext() {
|
|
166
|
+
return {
|
|
167
|
+
shadow: this._shadow,
|
|
168
|
+
customElement: this
|
|
169
|
+
};
|
|
170
|
+
}
|
|
178
171
|
}
|
|
179
172
|
if (customElements.get(widgetDefinition.name) === undefined) {
|
|
180
173
|
customElements.define(widgetDefinition.name, WidgetElement);
|
package/lib/index.es9.cjs
CHANGED
|
@@ -23,6 +23,8 @@ function afterDOMLoad() {
|
|
|
23
23
|
} else {
|
|
24
24
|
window.addEventListener('DOMContentLoaded', () => {
|
|
25
25
|
resolve();
|
|
26
|
+
}, {
|
|
27
|
+
once: true
|
|
26
28
|
});
|
|
27
29
|
}
|
|
28
30
|
} else {
|
|
@@ -43,6 +45,9 @@ function registerCustomElement(options) {
|
|
|
43
45
|
}
|
|
44
46
|
constructor(...$) {
|
|
45
47
|
const _ = super(...$);
|
|
48
|
+
this._pendingProps = {};
|
|
49
|
+
this._batchTimeout = null;
|
|
50
|
+
this._isInitialized = false;
|
|
46
51
|
_._init();
|
|
47
52
|
return _;
|
|
48
53
|
}
|
|
@@ -66,16 +71,10 @@ function registerCustomElement(options) {
|
|
|
66
71
|
await afterDOMLoad();
|
|
67
72
|
await integration.loadAssets(widget.assets, this._shadow);
|
|
68
73
|
this._setDefaultProps();
|
|
69
|
-
await (callbacks === null || callbacks === void 0 || (_callbacks$reconstruc = callbacks.reconstructor) === null || _callbacks$reconstruc === void 0 ? void 0 : _callbacks$reconstruc.call(callbacks, this._widget,
|
|
70
|
-
shadow: this._shadow,
|
|
71
|
-
customElement: this
|
|
72
|
-
}));
|
|
74
|
+
await (callbacks === null || callbacks === void 0 || (_callbacks$reconstruc = callbacks.reconstructor) === null || _callbacks$reconstruc === void 0 ? void 0 : _callbacks$reconstruc.call(callbacks, this._widget, this._getContext()));
|
|
73
75
|
if (typeof (callbacks === null || callbacks === void 0 ? void 0 : callbacks.remount) === 'function') {
|
|
74
76
|
var _callbacks$remount;
|
|
75
|
-
await (callbacks === null || callbacks === void 0 || (_callbacks$remount = callbacks.remount) === null || _callbacks$remount === void 0 ? void 0 : _callbacks$remount.call(callbacks, this._widget,
|
|
76
|
-
shadow: this._shadow,
|
|
77
|
-
customElement: this
|
|
78
|
-
}));
|
|
77
|
+
await (callbacks === null || callbacks === void 0 || (_callbacks$remount = callbacks.remount) === null || _callbacks$remount === void 0 ? void 0 : _callbacks$remount.call(callbacks, this._widget, this._getContext()));
|
|
79
78
|
} else {
|
|
80
79
|
widget.root = this._shadow;
|
|
81
80
|
widget.customElement = this;
|
|
@@ -98,14 +97,8 @@ function registerCustomElement(options) {
|
|
|
98
97
|
this._shadow.appendChild(customWidgetDefinition.container);
|
|
99
98
|
this._widget = await createSPAWidget(customWidgetDefinition, this._shadow);
|
|
100
99
|
this._setDefaultProps();
|
|
101
|
-
await (callbacks === null || callbacks === void 0 || (_callbacks$constructo = callbacks.constructor) === null || _callbacks$constructo === void 0 ? void 0 : _callbacks$constructo.call(callbacks, this._widget,
|
|
102
|
-
|
|
103
|
-
customElement: this
|
|
104
|
-
}));
|
|
105
|
-
(_await$callbacks$moun = await (callbacks === null || callbacks === void 0 || (_callbacks$mount = callbacks.mount) === null || _callbacks$mount === void 0 ? void 0 : _callbacks$mount.call(callbacks, this._widget, {
|
|
106
|
-
shadow: this._shadow,
|
|
107
|
-
customElement: this
|
|
108
|
-
}))) !== null && _await$callbacks$moun !== void 0 ? _await$callbacks$moun : await this._widget.mount();
|
|
100
|
+
await (callbacks === null || callbacks === void 0 || (_callbacks$constructo = callbacks.constructor) === null || _callbacks$constructo === void 0 ? void 0 : _callbacks$constructo.call(callbacks, this._widget, this._getContext()));
|
|
101
|
+
(_await$callbacks$moun = await (callbacks === null || callbacks === void 0 || (_callbacks$mount = callbacks.mount) === null || _callbacks$mount === void 0 ? void 0 : _callbacks$mount.call(callbacks, this._widget, this._getContext()))) !== null && _await$callbacks$moun !== void 0 ? _await$callbacks$moun : await this._widget.mount();
|
|
109
102
|
} catch (error) {
|
|
110
103
|
console.error(error);
|
|
111
104
|
}
|
|
@@ -116,56 +109,51 @@ function registerCustomElement(options) {
|
|
|
116
109
|
}
|
|
117
110
|
async connectedCallback() {
|
|
118
111
|
var _this$_widget, _this$_widget$connect, _callbacks$connectedC;
|
|
112
|
+
this._isInitialized = true;
|
|
119
113
|
await this._widgetPromise;
|
|
120
|
-
(_this$_widget = this._widget) === null || _this$_widget === void 0 || (_this$_widget$connect = _this$_widget.connectedCallback) === null || _this$_widget$connect === void 0 || _this$_widget$connect.call(_this$_widget,
|
|
121
|
-
|
|
122
|
-
customElement: this
|
|
123
|
-
});
|
|
124
|
-
callbacks === null || callbacks === void 0 || (_callbacks$connectedC = callbacks.connectedCallback) === null || _callbacks$connectedC === void 0 || _callbacks$connectedC.call(callbacks, this._widget, {
|
|
125
|
-
shadow: this._shadow,
|
|
126
|
-
customElement: this
|
|
127
|
-
});
|
|
114
|
+
(_this$_widget = this._widget) === null || _this$_widget === void 0 || (_this$_widget$connect = _this$_widget.connectedCallback) === null || _this$_widget$connect === void 0 || _this$_widget$connect.call(_this$_widget, this._getContext());
|
|
115
|
+
callbacks === null || callbacks === void 0 || (_callbacks$connectedC = callbacks.connectedCallback) === null || _callbacks$connectedC === void 0 || _callbacks$connectedC.call(callbacks, this._widget, this._getContext());
|
|
128
116
|
}
|
|
129
117
|
async disconnectedCallback() {
|
|
130
118
|
var _this$_widget2, _this$_widget2$discon, _callbacks$disconnect;
|
|
119
|
+
this._isInitialized = false;
|
|
131
120
|
await this._widgetPromise;
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
138
|
-
|
|
139
|
-
|
|
121
|
+
|
|
122
|
+
// Clear any pending batch updates
|
|
123
|
+
if (this._batchTimeout) {
|
|
124
|
+
clearTimeout(this._batchTimeout);
|
|
125
|
+
this._batchTimeout = null;
|
|
126
|
+
this._pendingProps = {};
|
|
127
|
+
}
|
|
128
|
+
(_this$_widget2 = this._widget) === null || _this$_widget2 === void 0 || (_this$_widget2$discon = _this$_widget2.disconnectedCallback) === null || _this$_widget2$discon === void 0 || _this$_widget2$discon.call(_this$_widget2, this._getContext());
|
|
129
|
+
callbacks === null || callbacks === void 0 || (_callbacks$disconnect = callbacks.disconnectedCallback) === null || _callbacks$disconnect === void 0 || _callbacks$disconnect.call(callbacks, this._widget, this._getContext());
|
|
140
130
|
}
|
|
141
131
|
async adoptedCallback() {
|
|
142
132
|
var _this$_widget3, _this$_widget3$adopte, _callbacks$adoptedCal;
|
|
143
133
|
await this._widgetPromise;
|
|
144
|
-
(_this$_widget3 = this._widget) === null || _this$_widget3 === void 0 || (_this$_widget3$adopte = _this$_widget3.adoptedCallback) === null || _this$_widget3$adopte === void 0 || _this$_widget3$adopte.call(_this$_widget3,
|
|
145
|
-
|
|
146
|
-
customElement: this
|
|
147
|
-
});
|
|
148
|
-
callbacks === null || callbacks === void 0 || (_callbacks$adoptedCal = callbacks.adoptedCallback) === null || _callbacks$adoptedCal === void 0 || _callbacks$adoptedCal.call(callbacks, this._widget, {
|
|
149
|
-
shadow: this._shadow,
|
|
150
|
-
customElement: this
|
|
151
|
-
});
|
|
134
|
+
(_this$_widget3 = this._widget) === null || _this$_widget3 === void 0 || (_this$_widget3$adopte = _this$_widget3.adoptedCallback) === null || _this$_widget3$adopte === void 0 || _this$_widget3$adopte.call(_this$_widget3, this._getContext());
|
|
135
|
+
callbacks === null || callbacks === void 0 || (_callbacks$adoptedCal = callbacks.adoptedCallback) === null || _callbacks$adoptedCal === void 0 || _callbacks$adoptedCal.call(callbacks, this._widget, this._getContext());
|
|
152
136
|
}
|
|
153
137
|
async attributeChangedCallback(name, oldValue, newValue) {
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
[camelCaseKey]
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
168
|
-
|
|
138
|
+
if (this._isInitialized) {
|
|
139
|
+
var _attributesParser$nam, _this$_widget5, _this$_widget5$attrib, _callbacks$attributeC;
|
|
140
|
+
await this._widgetPromise;
|
|
141
|
+
const camelCaseKey = name.replace(/-([a-z])/g, g => g[1].toUpperCase());
|
|
142
|
+
const parser = (_attributesParser$nam = attributesParser === null || attributesParser === void 0 ? void 0 : attributesParser[name]) !== null && _attributesParser$nam !== void 0 ? _attributesParser$nam : value => value;
|
|
143
|
+
this._pendingProps[camelCaseKey] = parser(newValue);
|
|
144
|
+
if (this._batchTimeout) {
|
|
145
|
+
clearTimeout(this._batchTimeout);
|
|
146
|
+
}
|
|
147
|
+
this._batchTimeout = setTimeout(() => {
|
|
148
|
+
var _this$_widget4, _this$_widget4$setPro;
|
|
149
|
+
const propsToUpdate = this._pendingProps;
|
|
150
|
+
this._pendingProps = {};
|
|
151
|
+
this._batchTimeout = null;
|
|
152
|
+
(_this$_widget4 = this._widget) === null || _this$_widget4 === void 0 || (_this$_widget4$setPro = _this$_widget4.setProps) === null || _this$_widget4$setPro === void 0 || _this$_widget4$setPro.call(_this$_widget4, propsToUpdate);
|
|
153
|
+
}, 0);
|
|
154
|
+
(_this$_widget5 = this._widget) === null || _this$_widget5 === void 0 || (_this$_widget5$attrib = _this$_widget5.attributeChangedCallback) === null || _this$_widget5$attrib === void 0 || _this$_widget5$attrib.call(_this$_widget5, this._widget, name, oldValue, newValue, this._getContext());
|
|
155
|
+
callbacks === null || callbacks === void 0 || (_callbacks$attributeC = callbacks.attributeChangedCallback) === null || _callbacks$attributeC === void 0 || _callbacks$attributeC.call(callbacks, this._widget, name, oldValue, newValue, this._getContext());
|
|
156
|
+
}
|
|
169
157
|
}
|
|
170
158
|
_setDefaultProps() {
|
|
171
159
|
const attributes = this.constructor.observedAttributes;
|
|
@@ -183,6 +171,12 @@ function registerCustomElement(options) {
|
|
|
183
171
|
});
|
|
184
172
|
}
|
|
185
173
|
}
|
|
174
|
+
_getContext() {
|
|
175
|
+
return {
|
|
176
|
+
shadow: this._shadow,
|
|
177
|
+
customElement: this
|
|
178
|
+
};
|
|
179
|
+
}
|
|
186
180
|
}
|
|
187
181
|
if (customElements.get(widgetDefinition.name) === undefined) {
|
|
188
182
|
customElements.define(widgetDefinition.name, WidgetElement);
|
package/lib/index.es9.mjs
CHANGED
|
@@ -21,6 +21,8 @@ function afterDOMLoad() {
|
|
|
21
21
|
} else {
|
|
22
22
|
window.addEventListener('DOMContentLoaded', () => {
|
|
23
23
|
resolve();
|
|
24
|
+
}, {
|
|
25
|
+
once: true
|
|
24
26
|
});
|
|
25
27
|
}
|
|
26
28
|
} else {
|
|
@@ -41,6 +43,9 @@ function registerCustomElement(options) {
|
|
|
41
43
|
}
|
|
42
44
|
constructor(...$) {
|
|
43
45
|
const _ = super(...$);
|
|
46
|
+
this._pendingProps = {};
|
|
47
|
+
this._batchTimeout = null;
|
|
48
|
+
this._isInitialized = false;
|
|
44
49
|
_._init();
|
|
45
50
|
return _;
|
|
46
51
|
}
|
|
@@ -64,16 +69,10 @@ function registerCustomElement(options) {
|
|
|
64
69
|
await afterDOMLoad();
|
|
65
70
|
await loadAssets(widget.assets, this._shadow);
|
|
66
71
|
this._setDefaultProps();
|
|
67
|
-
await (callbacks === null || callbacks === void 0 || (_callbacks$reconstruc = callbacks.reconstructor) === null || _callbacks$reconstruc === void 0 ? void 0 : _callbacks$reconstruc.call(callbacks, this._widget,
|
|
68
|
-
shadow: this._shadow,
|
|
69
|
-
customElement: this
|
|
70
|
-
}));
|
|
72
|
+
await (callbacks === null || callbacks === void 0 || (_callbacks$reconstruc = callbacks.reconstructor) === null || _callbacks$reconstruc === void 0 ? void 0 : _callbacks$reconstruc.call(callbacks, this._widget, this._getContext()));
|
|
71
73
|
if (typeof (callbacks === null || callbacks === void 0 ? void 0 : callbacks.remount) === 'function') {
|
|
72
74
|
var _callbacks$remount;
|
|
73
|
-
await (callbacks === null || callbacks === void 0 || (_callbacks$remount = callbacks.remount) === null || _callbacks$remount === void 0 ? void 0 : _callbacks$remount.call(callbacks, this._widget,
|
|
74
|
-
shadow: this._shadow,
|
|
75
|
-
customElement: this
|
|
76
|
-
}));
|
|
75
|
+
await (callbacks === null || callbacks === void 0 || (_callbacks$remount = callbacks.remount) === null || _callbacks$remount === void 0 ? void 0 : _callbacks$remount.call(callbacks, this._widget, this._getContext()));
|
|
77
76
|
} else {
|
|
78
77
|
widget.root = this._shadow;
|
|
79
78
|
widget.customElement = this;
|
|
@@ -96,14 +95,8 @@ function registerCustomElement(options) {
|
|
|
96
95
|
this._shadow.appendChild(customWidgetDefinition.container);
|
|
97
96
|
this._widget = await createSPAWidget(customWidgetDefinition, this._shadow);
|
|
98
97
|
this._setDefaultProps();
|
|
99
|
-
await (callbacks === null || callbacks === void 0 || (_callbacks$constructo = callbacks.constructor) === null || _callbacks$constructo === void 0 ? void 0 : _callbacks$constructo.call(callbacks, this._widget,
|
|
100
|
-
|
|
101
|
-
customElement: this
|
|
102
|
-
}));
|
|
103
|
-
(_await$callbacks$moun = await (callbacks === null || callbacks === void 0 || (_callbacks$mount = callbacks.mount) === null || _callbacks$mount === void 0 ? void 0 : _callbacks$mount.call(callbacks, this._widget, {
|
|
104
|
-
shadow: this._shadow,
|
|
105
|
-
customElement: this
|
|
106
|
-
}))) !== null && _await$callbacks$moun !== void 0 ? _await$callbacks$moun : await this._widget.mount();
|
|
98
|
+
await (callbacks === null || callbacks === void 0 || (_callbacks$constructo = callbacks.constructor) === null || _callbacks$constructo === void 0 ? void 0 : _callbacks$constructo.call(callbacks, this._widget, this._getContext()));
|
|
99
|
+
(_await$callbacks$moun = await (callbacks === null || callbacks === void 0 || (_callbacks$mount = callbacks.mount) === null || _callbacks$mount === void 0 ? void 0 : _callbacks$mount.call(callbacks, this._widget, this._getContext()))) !== null && _await$callbacks$moun !== void 0 ? _await$callbacks$moun : await this._widget.mount();
|
|
107
100
|
} catch (error) {
|
|
108
101
|
console.error(error);
|
|
109
102
|
}
|
|
@@ -114,56 +107,51 @@ function registerCustomElement(options) {
|
|
|
114
107
|
}
|
|
115
108
|
async connectedCallback() {
|
|
116
109
|
var _this$_widget, _this$_widget$connect, _callbacks$connectedC;
|
|
110
|
+
this._isInitialized = true;
|
|
117
111
|
await this._widgetPromise;
|
|
118
|
-
(_this$_widget = this._widget) === null || _this$_widget === void 0 || (_this$_widget$connect = _this$_widget.connectedCallback) === null || _this$_widget$connect === void 0 || _this$_widget$connect.call(_this$_widget,
|
|
119
|
-
|
|
120
|
-
customElement: this
|
|
121
|
-
});
|
|
122
|
-
callbacks === null || callbacks === void 0 || (_callbacks$connectedC = callbacks.connectedCallback) === null || _callbacks$connectedC === void 0 || _callbacks$connectedC.call(callbacks, this._widget, {
|
|
123
|
-
shadow: this._shadow,
|
|
124
|
-
customElement: this
|
|
125
|
-
});
|
|
112
|
+
(_this$_widget = this._widget) === null || _this$_widget === void 0 || (_this$_widget$connect = _this$_widget.connectedCallback) === null || _this$_widget$connect === void 0 || _this$_widget$connect.call(_this$_widget, this._getContext());
|
|
113
|
+
callbacks === null || callbacks === void 0 || (_callbacks$connectedC = callbacks.connectedCallback) === null || _callbacks$connectedC === void 0 || _callbacks$connectedC.call(callbacks, this._widget, this._getContext());
|
|
126
114
|
}
|
|
127
115
|
async disconnectedCallback() {
|
|
128
116
|
var _this$_widget2, _this$_widget2$discon, _callbacks$disconnect;
|
|
117
|
+
this._isInitialized = false;
|
|
129
118
|
await this._widgetPromise;
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
135
|
-
|
|
136
|
-
|
|
137
|
-
|
|
119
|
+
|
|
120
|
+
// Clear any pending batch updates
|
|
121
|
+
if (this._batchTimeout) {
|
|
122
|
+
clearTimeout(this._batchTimeout);
|
|
123
|
+
this._batchTimeout = null;
|
|
124
|
+
this._pendingProps = {};
|
|
125
|
+
}
|
|
126
|
+
(_this$_widget2 = this._widget) === null || _this$_widget2 === void 0 || (_this$_widget2$discon = _this$_widget2.disconnectedCallback) === null || _this$_widget2$discon === void 0 || _this$_widget2$discon.call(_this$_widget2, this._getContext());
|
|
127
|
+
callbacks === null || callbacks === void 0 || (_callbacks$disconnect = callbacks.disconnectedCallback) === null || _callbacks$disconnect === void 0 || _callbacks$disconnect.call(callbacks, this._widget, this._getContext());
|
|
138
128
|
}
|
|
139
129
|
async adoptedCallback() {
|
|
140
130
|
var _this$_widget3, _this$_widget3$adopte, _callbacks$adoptedCal;
|
|
141
131
|
await this._widgetPromise;
|
|
142
|
-
(_this$_widget3 = this._widget) === null || _this$_widget3 === void 0 || (_this$_widget3$adopte = _this$_widget3.adoptedCallback) === null || _this$_widget3$adopte === void 0 || _this$_widget3$adopte.call(_this$_widget3,
|
|
143
|
-
|
|
144
|
-
customElement: this
|
|
145
|
-
});
|
|
146
|
-
callbacks === null || callbacks === void 0 || (_callbacks$adoptedCal = callbacks.adoptedCallback) === null || _callbacks$adoptedCal === void 0 || _callbacks$adoptedCal.call(callbacks, this._widget, {
|
|
147
|
-
shadow: this._shadow,
|
|
148
|
-
customElement: this
|
|
149
|
-
});
|
|
132
|
+
(_this$_widget3 = this._widget) === null || _this$_widget3 === void 0 || (_this$_widget3$adopte = _this$_widget3.adoptedCallback) === null || _this$_widget3$adopte === void 0 || _this$_widget3$adopte.call(_this$_widget3, this._getContext());
|
|
133
|
+
callbacks === null || callbacks === void 0 || (_callbacks$adoptedCal = callbacks.adoptedCallback) === null || _callbacks$adoptedCal === void 0 || _callbacks$adoptedCal.call(callbacks, this._widget, this._getContext());
|
|
150
134
|
}
|
|
151
135
|
async attributeChangedCallback(name, oldValue, newValue) {
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
[camelCaseKey]
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
162
|
-
|
|
163
|
-
|
|
164
|
-
|
|
165
|
-
|
|
166
|
-
|
|
136
|
+
if (this._isInitialized) {
|
|
137
|
+
var _attributesParser$nam, _this$_widget5, _this$_widget5$attrib, _callbacks$attributeC;
|
|
138
|
+
await this._widgetPromise;
|
|
139
|
+
const camelCaseKey = name.replace(/-([a-z])/g, g => g[1].toUpperCase());
|
|
140
|
+
const parser = (_attributesParser$nam = attributesParser === null || attributesParser === void 0 ? void 0 : attributesParser[name]) !== null && _attributesParser$nam !== void 0 ? _attributesParser$nam : value => value;
|
|
141
|
+
this._pendingProps[camelCaseKey] = parser(newValue);
|
|
142
|
+
if (this._batchTimeout) {
|
|
143
|
+
clearTimeout(this._batchTimeout);
|
|
144
|
+
}
|
|
145
|
+
this._batchTimeout = setTimeout(() => {
|
|
146
|
+
var _this$_widget4, _this$_widget4$setPro;
|
|
147
|
+
const propsToUpdate = this._pendingProps;
|
|
148
|
+
this._pendingProps = {};
|
|
149
|
+
this._batchTimeout = null;
|
|
150
|
+
(_this$_widget4 = this._widget) === null || _this$_widget4 === void 0 || (_this$_widget4$setPro = _this$_widget4.setProps) === null || _this$_widget4$setPro === void 0 || _this$_widget4$setPro.call(_this$_widget4, propsToUpdate);
|
|
151
|
+
}, 0);
|
|
152
|
+
(_this$_widget5 = this._widget) === null || _this$_widget5 === void 0 || (_this$_widget5$attrib = _this$_widget5.attributeChangedCallback) === null || _this$_widget5$attrib === void 0 || _this$_widget5$attrib.call(_this$_widget5, this._widget, name, oldValue, newValue, this._getContext());
|
|
153
|
+
callbacks === null || callbacks === void 0 || (_callbacks$attributeC = callbacks.attributeChangedCallback) === null || _callbacks$attributeC === void 0 || _callbacks$attributeC.call(callbacks, this._widget, name, oldValue, newValue, this._getContext());
|
|
154
|
+
}
|
|
167
155
|
}
|
|
168
156
|
_setDefaultProps() {
|
|
169
157
|
const attributes = this.constructor.observedAttributes;
|
|
@@ -181,6 +169,12 @@ function registerCustomElement(options) {
|
|
|
181
169
|
});
|
|
182
170
|
}
|
|
183
171
|
}
|
|
172
|
+
_getContext() {
|
|
173
|
+
return {
|
|
174
|
+
shadow: this._shadow,
|
|
175
|
+
customElement: this
|
|
176
|
+
};
|
|
177
|
+
}
|
|
184
178
|
}
|
|
185
179
|
if (customElements.get(widgetDefinition.name) === undefined) {
|
|
186
180
|
customElements.define(widgetDefinition.name, WidgetElement);
|
package/lib/index.js
CHANGED
|
@@ -24,6 +24,8 @@ function afterDOMLoad() {
|
|
|
24
24
|
} else {
|
|
25
25
|
window.addEventListener('DOMContentLoaded', () => {
|
|
26
26
|
resolve();
|
|
27
|
+
}, {
|
|
28
|
+
once: true
|
|
27
29
|
});
|
|
28
30
|
}
|
|
29
31
|
} else {
|
|
@@ -44,6 +46,9 @@ function registerCustomElement(options) {
|
|
|
44
46
|
}
|
|
45
47
|
constructor(...$) {
|
|
46
48
|
const _ = super(...$);
|
|
49
|
+
this._pendingProps = {};
|
|
50
|
+
this._batchTimeout = null;
|
|
51
|
+
this._isInitialized = false;
|
|
47
52
|
_._init();
|
|
48
53
|
return _;
|
|
49
54
|
}
|
|
@@ -65,15 +70,9 @@ function registerCustomElement(options) {
|
|
|
65
70
|
await afterDOMLoad();
|
|
66
71
|
await integration.loadAssets(widget.assets, this._shadow);
|
|
67
72
|
this._setDefaultProps();
|
|
68
|
-
await callbacks?.reconstructor?.(this._widget,
|
|
69
|
-
shadow: this._shadow,
|
|
70
|
-
customElement: this
|
|
71
|
-
});
|
|
73
|
+
await callbacks?.reconstructor?.(this._widget, this._getContext());
|
|
72
74
|
if (typeof callbacks?.remount === 'function') {
|
|
73
|
-
await callbacks?.remount?.(this._widget,
|
|
74
|
-
shadow: this._shadow,
|
|
75
|
-
customElement: this
|
|
76
|
-
});
|
|
75
|
+
await callbacks?.remount?.(this._widget, this._getContext());
|
|
77
76
|
} else {
|
|
78
77
|
widget.root = this._shadow;
|
|
79
78
|
widget.customElement = this;
|
|
@@ -95,14 +94,8 @@ function registerCustomElement(options) {
|
|
|
95
94
|
this._shadow.appendChild(customWidgetDefinition.container);
|
|
96
95
|
this._widget = await createSPAWidget(customWidgetDefinition, this._shadow);
|
|
97
96
|
this._setDefaultProps();
|
|
98
|
-
await callbacks?.constructor?.(this._widget,
|
|
99
|
-
|
|
100
|
-
customElement: this
|
|
101
|
-
});
|
|
102
|
-
(await callbacks?.mount?.(this._widget, {
|
|
103
|
-
shadow: this._shadow,
|
|
104
|
-
customElement: this
|
|
105
|
-
})) ?? (await this._widget.mount());
|
|
97
|
+
await callbacks?.constructor?.(this._widget, this._getContext());
|
|
98
|
+
(await callbacks?.mount?.(this._widget, this._getContext())) ?? (await this._widget.mount());
|
|
106
99
|
} catch (error) {
|
|
107
100
|
console.error(error);
|
|
108
101
|
}
|
|
@@ -112,53 +105,47 @@ function registerCustomElement(options) {
|
|
|
112
105
|
}
|
|
113
106
|
}
|
|
114
107
|
async connectedCallback() {
|
|
108
|
+
this._isInitialized = true;
|
|
115
109
|
await this._widgetPromise;
|
|
116
|
-
this._widget?.connectedCallback?.(
|
|
117
|
-
|
|
118
|
-
customElement: this
|
|
119
|
-
});
|
|
120
|
-
callbacks?.connectedCallback?.(this._widget, {
|
|
121
|
-
shadow: this._shadow,
|
|
122
|
-
customElement: this
|
|
123
|
-
});
|
|
110
|
+
this._widget?.connectedCallback?.(this._getContext());
|
|
111
|
+
callbacks?.connectedCallback?.(this._widget, this._getContext());
|
|
124
112
|
}
|
|
125
113
|
async disconnectedCallback() {
|
|
114
|
+
this._isInitialized = false;
|
|
126
115
|
await this._widgetPromise;
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
133
|
-
|
|
134
|
-
|
|
116
|
+
|
|
117
|
+
// Clear any pending batch updates
|
|
118
|
+
if (this._batchTimeout) {
|
|
119
|
+
clearTimeout(this._batchTimeout);
|
|
120
|
+
this._batchTimeout = null;
|
|
121
|
+
this._pendingProps = {};
|
|
122
|
+
}
|
|
123
|
+
this._widget?.disconnectedCallback?.(this._getContext());
|
|
124
|
+
callbacks?.disconnectedCallback?.(this._widget, this._getContext());
|
|
135
125
|
}
|
|
136
126
|
async adoptedCallback() {
|
|
137
127
|
await this._widgetPromise;
|
|
138
|
-
this._widget?.adoptedCallback?.(
|
|
139
|
-
|
|
140
|
-
customElement: this
|
|
141
|
-
});
|
|
142
|
-
callbacks?.adoptedCallback?.(this._widget, {
|
|
143
|
-
shadow: this._shadow,
|
|
144
|
-
customElement: this
|
|
145
|
-
});
|
|
128
|
+
this._widget?.adoptedCallback?.(this._getContext());
|
|
129
|
+
callbacks?.adoptedCallback?.(this._widget, this._getContext());
|
|
146
130
|
}
|
|
147
131
|
async attributeChangedCallback(name, oldValue, newValue) {
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
|
|
151
|
-
|
|
152
|
-
[camelCaseKey]
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
132
|
+
if (this._isInitialized) {
|
|
133
|
+
await this._widgetPromise;
|
|
134
|
+
const camelCaseKey = name.replace(/-([a-z])/g, g => g[1].toUpperCase());
|
|
135
|
+
const parser = attributesParser?.[name] ?? (value => value);
|
|
136
|
+
this._pendingProps[camelCaseKey] = parser(newValue);
|
|
137
|
+
if (this._batchTimeout) {
|
|
138
|
+
clearTimeout(this._batchTimeout);
|
|
139
|
+
}
|
|
140
|
+
this._batchTimeout = setTimeout(() => {
|
|
141
|
+
const propsToUpdate = this._pendingProps;
|
|
142
|
+
this._pendingProps = {};
|
|
143
|
+
this._batchTimeout = null;
|
|
144
|
+
this._widget?.setProps?.(propsToUpdate);
|
|
145
|
+
}, 0);
|
|
146
|
+
this._widget?.attributeChangedCallback?.(this._widget, name, oldValue, newValue, this._getContext());
|
|
147
|
+
callbacks?.attributeChangedCallback?.(this._widget, name, oldValue, newValue, this._getContext());
|
|
148
|
+
}
|
|
162
149
|
}
|
|
163
150
|
_setDefaultProps() {
|
|
164
151
|
const attributes = this.constructor.observedAttributes;
|
|
@@ -175,6 +162,12 @@ function registerCustomElement(options) {
|
|
|
175
162
|
});
|
|
176
163
|
}
|
|
177
164
|
}
|
|
165
|
+
_getContext() {
|
|
166
|
+
return {
|
|
167
|
+
shadow: this._shadow,
|
|
168
|
+
customElement: this
|
|
169
|
+
};
|
|
170
|
+
}
|
|
178
171
|
}
|
|
179
172
|
if (customElements.get(widgetDefinition.name) === undefined) {
|
|
180
173
|
customElements.define(widgetDefinition.name, WidgetElement);
|
package/lib/index.mjs
CHANGED
|
@@ -22,6 +22,8 @@ function afterDOMLoad() {
|
|
|
22
22
|
} else {
|
|
23
23
|
window.addEventListener('DOMContentLoaded', () => {
|
|
24
24
|
resolve();
|
|
25
|
+
}, {
|
|
26
|
+
once: true
|
|
25
27
|
});
|
|
26
28
|
}
|
|
27
29
|
} else {
|
|
@@ -42,6 +44,9 @@ function registerCustomElement(options) {
|
|
|
42
44
|
}
|
|
43
45
|
constructor(...$) {
|
|
44
46
|
const _ = super(...$);
|
|
47
|
+
this._pendingProps = {};
|
|
48
|
+
this._batchTimeout = null;
|
|
49
|
+
this._isInitialized = false;
|
|
45
50
|
_._init();
|
|
46
51
|
return _;
|
|
47
52
|
}
|
|
@@ -63,15 +68,9 @@ function registerCustomElement(options) {
|
|
|
63
68
|
await afterDOMLoad();
|
|
64
69
|
await loadAssets(widget.assets, this._shadow);
|
|
65
70
|
this._setDefaultProps();
|
|
66
|
-
await callbacks?.reconstructor?.(this._widget,
|
|
67
|
-
shadow: this._shadow,
|
|
68
|
-
customElement: this
|
|
69
|
-
});
|
|
71
|
+
await callbacks?.reconstructor?.(this._widget, this._getContext());
|
|
70
72
|
if (typeof callbacks?.remount === 'function') {
|
|
71
|
-
await callbacks?.remount?.(this._widget,
|
|
72
|
-
shadow: this._shadow,
|
|
73
|
-
customElement: this
|
|
74
|
-
});
|
|
73
|
+
await callbacks?.remount?.(this._widget, this._getContext());
|
|
75
74
|
} else {
|
|
76
75
|
widget.root = this._shadow;
|
|
77
76
|
widget.customElement = this;
|
|
@@ -93,14 +92,8 @@ function registerCustomElement(options) {
|
|
|
93
92
|
this._shadow.appendChild(customWidgetDefinition.container);
|
|
94
93
|
this._widget = await createSPAWidget(customWidgetDefinition, this._shadow);
|
|
95
94
|
this._setDefaultProps();
|
|
96
|
-
await callbacks?.constructor?.(this._widget,
|
|
97
|
-
|
|
98
|
-
customElement: this
|
|
99
|
-
});
|
|
100
|
-
(await callbacks?.mount?.(this._widget, {
|
|
101
|
-
shadow: this._shadow,
|
|
102
|
-
customElement: this
|
|
103
|
-
})) ?? (await this._widget.mount());
|
|
95
|
+
await callbacks?.constructor?.(this._widget, this._getContext());
|
|
96
|
+
(await callbacks?.mount?.(this._widget, this._getContext())) ?? (await this._widget.mount());
|
|
104
97
|
} catch (error) {
|
|
105
98
|
console.error(error);
|
|
106
99
|
}
|
|
@@ -110,53 +103,47 @@ function registerCustomElement(options) {
|
|
|
110
103
|
}
|
|
111
104
|
}
|
|
112
105
|
async connectedCallback() {
|
|
106
|
+
this._isInitialized = true;
|
|
113
107
|
await this._widgetPromise;
|
|
114
|
-
this._widget?.connectedCallback?.(
|
|
115
|
-
|
|
116
|
-
customElement: this
|
|
117
|
-
});
|
|
118
|
-
callbacks?.connectedCallback?.(this._widget, {
|
|
119
|
-
shadow: this._shadow,
|
|
120
|
-
customElement: this
|
|
121
|
-
});
|
|
108
|
+
this._widget?.connectedCallback?.(this._getContext());
|
|
109
|
+
callbacks?.connectedCallback?.(this._widget, this._getContext());
|
|
122
110
|
}
|
|
123
111
|
async disconnectedCallback() {
|
|
112
|
+
this._isInitialized = false;
|
|
124
113
|
await this._widgetPromise;
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
128
|
-
|
|
129
|
-
|
|
130
|
-
|
|
131
|
-
|
|
132
|
-
|
|
114
|
+
|
|
115
|
+
// Clear any pending batch updates
|
|
116
|
+
if (this._batchTimeout) {
|
|
117
|
+
clearTimeout(this._batchTimeout);
|
|
118
|
+
this._batchTimeout = null;
|
|
119
|
+
this._pendingProps = {};
|
|
120
|
+
}
|
|
121
|
+
this._widget?.disconnectedCallback?.(this._getContext());
|
|
122
|
+
callbacks?.disconnectedCallback?.(this._widget, this._getContext());
|
|
133
123
|
}
|
|
134
124
|
async adoptedCallback() {
|
|
135
125
|
await this._widgetPromise;
|
|
136
|
-
this._widget?.adoptedCallback?.(
|
|
137
|
-
|
|
138
|
-
customElement: this
|
|
139
|
-
});
|
|
140
|
-
callbacks?.adoptedCallback?.(this._widget, {
|
|
141
|
-
shadow: this._shadow,
|
|
142
|
-
customElement: this
|
|
143
|
-
});
|
|
126
|
+
this._widget?.adoptedCallback?.(this._getContext());
|
|
127
|
+
callbacks?.adoptedCallback?.(this._widget, this._getContext());
|
|
144
128
|
}
|
|
145
129
|
async attributeChangedCallback(name, oldValue, newValue) {
|
|
146
|
-
|
|
147
|
-
|
|
148
|
-
|
|
149
|
-
|
|
150
|
-
[camelCaseKey]
|
|
151
|
-
|
|
152
|
-
|
|
153
|
-
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
130
|
+
if (this._isInitialized) {
|
|
131
|
+
await this._widgetPromise;
|
|
132
|
+
const camelCaseKey = name.replace(/-([a-z])/g, g => g[1].toUpperCase());
|
|
133
|
+
const parser = attributesParser?.[name] ?? (value => value);
|
|
134
|
+
this._pendingProps[camelCaseKey] = parser(newValue);
|
|
135
|
+
if (this._batchTimeout) {
|
|
136
|
+
clearTimeout(this._batchTimeout);
|
|
137
|
+
}
|
|
138
|
+
this._batchTimeout = setTimeout(() => {
|
|
139
|
+
const propsToUpdate = this._pendingProps;
|
|
140
|
+
this._pendingProps = {};
|
|
141
|
+
this._batchTimeout = null;
|
|
142
|
+
this._widget?.setProps?.(propsToUpdate);
|
|
143
|
+
}, 0);
|
|
144
|
+
this._widget?.attributeChangedCallback?.(this._widget, name, oldValue, newValue, this._getContext());
|
|
145
|
+
callbacks?.attributeChangedCallback?.(this._widget, name, oldValue, newValue, this._getContext());
|
|
146
|
+
}
|
|
160
147
|
}
|
|
161
148
|
_setDefaultProps() {
|
|
162
149
|
const attributes = this.constructor.observedAttributes;
|
|
@@ -173,6 +160,12 @@ function registerCustomElement(options) {
|
|
|
173
160
|
});
|
|
174
161
|
}
|
|
175
162
|
}
|
|
163
|
+
_getContext() {
|
|
164
|
+
return {
|
|
165
|
+
shadow: this._shadow,
|
|
166
|
+
customElement: this
|
|
167
|
+
};
|
|
168
|
+
}
|
|
176
169
|
}
|
|
177
170
|
if (customElements.get(widgetDefinition.name) === undefined) {
|
|
178
171
|
customElements.define(widgetDefinition.name, WidgetElement);
|
package/lib/index.umd.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
function t(e){return t="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},t(e)}!function(t,e){if("function"==typeof define&&define.amd)define("@merkur/integration-custom-element",["exports","@merkur/core","@merkur/integration"],e);else if("undefined"!=typeof exports)e(exports,require("@merkur/core"),require("@merkur/integration"));else{var n={exports:{}};e(n.exports,t.Merkur.Core,t.Merkur.Integration),t.merkurIntegrationCustomElement=n.exports}}("undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self?self:this,(function(e,n,r){function o(t,e){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(t);e&&(r=r.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),n.push.apply(n,r)}return n}function i(t){for(var e=1;e<arguments.length;e++){var n=null!=arguments[e]?arguments[e]:{};e%2?o(Object(n),!0).forEach((function(e){u(t,e,n[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):o(Object(n)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))}))}return t}function u(t,e,n){return(e=d(e))in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}function l(){return l="undefined"!=typeof Reflect&&Reflect.get?Reflect.get.bind():function(t,e,n){var r=function(t,e){for(;!{}.hasOwnProperty.call(t,e)&&null!==(t=
|
|
1
|
+
function t(e){return t="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t},t(e)}!function(t,e){if("function"==typeof define&&define.amd)define("@merkur/integration-custom-element",["exports","@merkur/core","@merkur/integration"],e);else if("undefined"!=typeof exports)e(exports,require("@merkur/core"),require("@merkur/integration"));else{var n={exports:{}};e(n.exports,t.Merkur.Core,t.Merkur.Integration),t.merkurIntegrationCustomElement=n.exports}}("undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self?self:this,(function(e,n,r){function o(t,e){var n=Object.keys(t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(t);e&&(r=r.filter((function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable}))),n.push.apply(n,r)}return n}function i(t){for(var e=1;e<arguments.length;e++){var n=null!=arguments[e]?arguments[e]:{};e%2?o(Object(n),!0).forEach((function(e){u(t,e,n[e])})):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(n)):o(Object(n)).forEach((function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(n,e))}))}return t}function u(t,e,n){return(e=d(e))in t?Object.defineProperty(t,e,{value:n,enumerable:!0,configurable:!0,writable:!0}):t[e]=n,t}function l(){return l="undefined"!=typeof Reflect&&Reflect.get?Reflect.get.bind():function(t,e,n){var r=function(t,e){for(;!{}.hasOwnProperty.call(t,e)&&null!==(t=g(t)););return t}(t,e);if(r){var o=Object.getOwnPropertyDescriptor(r,e);return o.get?o.get.call(arguments.length<3?t:n):o.value}},l.apply(null,arguments)}function c(t,e){if(!(t instanceof e))throw new TypeError("Cannot call a class as a function")}function a(t,e){for(var n=0;n<e.length;n++){var r=e[n];r.enumerable=r.enumerable||!1,r.configurable=!0,"value"in r&&(r.writable=!0),Object.defineProperty(t,d(r.key),r)}}function s(t,e,n){return e&&a(t.prototype,e),n&&a(t,n),Object.defineProperty(t,"prototype",{writable:!1}),t}function d(e){var n=function(e,n){if("object"!=t(e)||!e)return e;var r=e[Symbol.toPrimitive];if(void 0!==r){var o=r.call(e,n||"default");if("object"!=t(o))return o;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===n?String:Number)(e)}(e,"string");return"symbol"==t(n)?n:n+""}function f(t,e,n){return e=g(e),p(t,v()?Reflect.construct(e,n||[],g(t).constructor):e.apply(t,n))}function p(e,n){if(n&&("object"==t(n)||"function"==typeof n))return n;if(void 0!==n)throw new TypeError("Derived constructors may only return object or undefined");return function(t){if(void 0===t)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return t}(e)}function y(t,e){if("function"!=typeof e&&null!==e)throw new TypeError("Super expression must either be null or a function");t.prototype=Object.create(e&&e.prototype,{constructor:{value:t,writable:!0,configurable:!0}}),Object.defineProperty(t,"prototype",{writable:!1}),e&&b(t,e)}function h(t){var e="function"==typeof Map?new Map:void 0;return h=function(t){if(null===t||!function(t){try{return-1!==Function.toString.call(t).indexOf("[native code]")}catch(e){return"function"==typeof t}}(t))return t;if("function"!=typeof t)throw new TypeError("Super expression must either be null or a function");if(void 0!==e){if(e.has(t))return e.get(t);e.set(t,n)}function n(){return function(t,e,n){if(v())return Reflect.construct.apply(null,arguments);var r=[null];r.push.apply(r,e);var o=new(t.bind.apply(t,r));return n&&b(o,n.prototype),o}(t,arguments,g(this).constructor)}return n.prototype=Object.create(t.prototype,{constructor:{value:n,enumerable:!1,writable:!0,configurable:!0}}),b(n,t)},h(t)}function v(){try{var t=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){})))}catch(t){}return(v=function(){return!!t})()}function b(t,e){return b=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(t,e){return t.__proto__=e,t},b(t,e)}function g(t){return g=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(t){return t.__proto__||Object.getPrototypeOf(t)},g(t)}function _(t,e,n,r,o,i,u){try{var l=t[i](u),c=l.value}catch(t){return void n(t)}l.done?e(c):Promise.resolve(c).then(r,o)}function m(t){return function(){var e=this,n=arguments;return new Promise((function(r,o){var i=t.apply(e,n);function u(t){_(i,r,o,u,l,"next",t)}function l(t){_(i,r,o,u,l,"throw",t)}u(void 0)}))}}function w(){return(w=m((function*(t,e){var o=i(i({},t),{},{createWidget:t.createWidget});return(0,n.getMerkur)().isRegistered(o.name+o.version)||(0,n.getMerkur)().register(o),yield O(),yield(0,r.loadAssets)(o.assets,e),yield(0,n.getMerkur)().create(o)}))).apply(this,arguments)}function O(){return new Promise((function(t){"undefined"!=typeof document?"loading"!==document.readyState?t():window.addEventListener("DOMContentLoaded",(function(){t()}),{once:!0}):t()}))}Object.defineProperty(e,"__esModule",{value:!0}),e.deepMerge=k,e.registerCustomElement=function(t){var e=k({},t),n=e.widgetDefinition,o=e.callbacks,u=e.observedAttributes,a=e.attributesParser,d=function(t){function e(){var t;c(this,e);for(var n=arguments.length,r=new Array(n),o=0;o<n;o++)r[o]=arguments[o];var i=t=f(this,e,[].concat(r));return t._pendingProps={},t._batchTimeout=null,t._isInitialized=!1,i._init(),p(t,i)}return y(e,t),s(e,[{key:"_init",value:function(){}}],[{key:"observedAttributes",get:function(){return null!=u?u:[]}}])}(h(HTMLElement)),v=function(t){function e(){return c(this,e),f(this,e,arguments)}return y(e,t),s(e,[{key:"_init",value:function(){var t,i,u,c,a,s=this;try{(t=e,i="_init",u=this,a=l(g(1&(c=3)?t.prototype:t),i,u),2&c&&"function"==typeof a?function(t){return a.apply(u,t)}:a)([]);var d=k({},n);this._widgetPromise=m((function*(){s._shadow=s.attachShadow({mode:"open"});try{var t,e=yield null==o||null===(t=o.getInstance)||void 0===t?void 0:t.call(o);if(e&&e.name&&e.version){var n,i;if(s._widget=e,yield O(),yield(0,r.loadAssets)(e.assets,s._shadow),s._setDefaultProps(),yield null==o||null===(n=o.reconstructor)||void 0===n?void 0:n.call(o,s._widget,s._getContext()),"function"==typeof(null==o?void 0:o.remount))yield null==o||null===(i=o.remount)||void 0===i?void 0:i.call(o,s._widget,s._getContext());else e.root=s._shadow,e.customElement=s,s._shadow.appendChild(e.container);return}}catch(t){return void console.error(t)}try{var u,l,c;d.root=s._shadow,d.customElement=s,d.container||(d.container=document.createElement("div"),d.container.setAttribute("id","merkur-container")),s._shadow.appendChild(d.container),s._widget=yield function(t,e){return w.apply(this,arguments)}(d,s._shadow),s._setDefaultProps(),yield null==o||null===(u=o.constructor)||void 0===u?void 0:u.call(o,s._widget,s._getContext()),null!==(l=yield null==o||null===(c=o.mount)||void 0===c?void 0:c.call(o,s._widget,s._getContext()))&&void 0!==l||(yield s._widget.mount())}catch(t){console.error(t)}}))()}catch(t){console.error(t)}}},{key:"connectedCallback",value:(h=m((function*(){var t,e,n;this._isInitialized=!0,yield this._widgetPromise,null===(t=this._widget)||void 0===t||null===(e=t.connectedCallback)||void 0===e||e.call(t,this._getContext()),null==o||null===(n=o.connectedCallback)||void 0===n||n.call(o,this._widget,this._getContext())})),function(){return h.apply(this,arguments)})},{key:"disconnectedCallback",value:(p=m((function*(){var t,e,n;this._isInitialized=!1,yield this._widgetPromise,this._batchTimeout&&(clearTimeout(this._batchTimeout),this._batchTimeout=null,this._pendingProps={}),null===(t=this._widget)||void 0===t||null===(e=t.disconnectedCallback)||void 0===e||e.call(t,this._getContext()),null==o||null===(n=o.disconnectedCallback)||void 0===n||n.call(o,this._widget,this._getContext())})),function(){return p.apply(this,arguments)})},{key:"adoptedCallback",value:(d=m((function*(){var t,e,n;yield this._widgetPromise,null===(t=this._widget)||void 0===t||null===(e=t.adoptedCallback)||void 0===e||e.call(t,this._getContext()),null==o||null===(n=o.adoptedCallback)||void 0===n||n.call(o,this._widget,this._getContext())})),function(){return d.apply(this,arguments)})},{key:"attributeChangedCallback",value:(u=m((function*(t,e,n){var r=this;if(this._isInitialized){var i,u,l,c;yield this._widgetPromise;var s=t.replace(/-([a-z])/g,(function(t){return t[1].toUpperCase()})),d=null!==(i=null==a?void 0:a[t])&&void 0!==i?i:function(t){return t};this._pendingProps[s]=d(n),this._batchTimeout&&clearTimeout(this._batchTimeout),this._batchTimeout=setTimeout((function(){var t,e,n=r._pendingProps;r._pendingProps={},r._batchTimeout=null,null===(t=r._widget)||void 0===t||null===(e=t.setProps)||void 0===e||e.call(t,n)}),0),null===(u=this._widget)||void 0===u||null===(l=u.attributeChangedCallback)||void 0===l||l.call(u,this._widget,t,e,n,this._getContext()),null==o||null===(c=o.attributeChangedCallback)||void 0===c||c.call(o,this._widget,t,e,n,this._getContext())}})),function(t,e,n){return u.apply(this,arguments)})},{key:"_setDefaultProps",value:function(){var t=this,e=this.constructor.observedAttributes;Array.isArray(e)&&"function"==typeof this._widget.setProps&&(this._widget.props=i({},this._widget.props),e.forEach((function(e){if(t.hasAttribute(e)){var n,r,o=e.replace(/-([a-z])/g,(function(t){return t[1].toUpperCase()})),i=null!==(n=null==a?void 0:a[e])&&void 0!==n?n:function(t){return t};t._widget.props[o]=i(null!==(r=t.getAttribute(e))&&void 0!==r?r:t._widget.props[e])}})))}},{key:"_getContext",value:function(){return{shadow:this._shadow,customElement:this}}}]);var u,d,p,h}(d);void 0===customElements.get(n.name)&&customElements.define(n.name,v);return v};var P=["__proto__","prototype","constructor"];function k(t,e){var n=function(t){return!!t&&t.constructor===Object};return n(t)&&n(e)?(Object.keys(e).forEach((function(r){if(!P.includes(r)){var o=t[r],i=e[r];Array.isArray(o)&&Array.isArray(i)?t[r]=o.concat(i):n(o)&&n(i)?t[r]=k(Object.assign({},o),i):t[r]=i}})),t):e}}));
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@merkur/integration-custom-element",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.47.2",
|
|
4
4
|
"description": "Merkur module for easy integration with other apps with custom element.",
|
|
5
5
|
"main": "lib/index",
|
|
6
6
|
"module": "lib/index",
|
|
@@ -50,12 +50,12 @@
|
|
|
50
50
|
},
|
|
51
51
|
"homepage": "https://merkur.js.org/",
|
|
52
52
|
"devDependencies": {
|
|
53
|
-
"@merkur/core": "^0.
|
|
54
|
-
"@merkur/integration": "^0.
|
|
53
|
+
"@merkur/core": "^0.47.2",
|
|
54
|
+
"@merkur/integration": "^0.47.2"
|
|
55
55
|
},
|
|
56
56
|
"peerDependencies": {
|
|
57
57
|
"@merkur/core": "*",
|
|
58
58
|
"@merkur/integration": "*"
|
|
59
59
|
},
|
|
60
|
-
"gitHead": "
|
|
60
|
+
"gitHead": "1f8dd906f352a28828785d33791a8a4129836f35"
|
|
61
61
|
}
|