@merkur/integration-custom-element 0.35.12 → 0.36.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/lib/index.cjs +105 -24
- package/lib/index.es9.cjs +89 -31
- package/lib/index.es9.mjs +90 -32
- package/lib/index.js +105 -24
- package/lib/index.mjs +106 -25
- package/lib/index.umd.js +1 -1
- package/package.json +4 -4
package/lib/index.cjs
CHANGED
|
@@ -3,16 +3,19 @@
|
|
|
3
3
|
var core = require('@merkur/core');
|
|
4
4
|
var integration = require('@merkur/integration');
|
|
5
5
|
|
|
6
|
-
async function createSPAWidget(widgetDefinition) {
|
|
6
|
+
async function createSPAWidget(widgetDefinition, root) {
|
|
7
7
|
const definition = {
|
|
8
8
|
...widgetDefinition,
|
|
9
|
-
createWidget: widgetDefinition.createWidget
|
|
9
|
+
createWidget: widgetDefinition.createWidget,
|
|
10
10
|
};
|
|
11
11
|
|
|
12
|
-
core.getMerkur()
|
|
12
|
+
const merkur = core.getMerkur();
|
|
13
|
+
if (!merkur.isRegistered(definition.name + definition.version)) {
|
|
14
|
+
core.getMerkur().register(definition);
|
|
15
|
+
}
|
|
13
16
|
|
|
14
17
|
await afterDOMLoad();
|
|
15
|
-
await integration.loadAssets(definition.assets,
|
|
18
|
+
await integration.loadAssets(definition.assets, root);
|
|
16
19
|
|
|
17
20
|
return await core.getMerkur().create(definition);
|
|
18
21
|
}
|
|
@@ -39,32 +42,66 @@ function registerCustomElement(options) {
|
|
|
39
42
|
constructor() {
|
|
40
43
|
super();
|
|
41
44
|
|
|
42
|
-
const
|
|
45
|
+
const customWidgetDefinition = deepMerge({}, widgetDefinition);
|
|
43
46
|
|
|
44
|
-
|
|
45
|
-
this.
|
|
47
|
+
(async () => {
|
|
48
|
+
this._shadow = this.attachShadow({ mode: 'open' });
|
|
46
49
|
|
|
47
|
-
|
|
48
|
-
|
|
50
|
+
try {
|
|
51
|
+
const widget = await callbacks?.getInstance?.();
|
|
49
52
|
|
|
50
|
-
|
|
53
|
+
if (widget && widget.name && widget.version) {
|
|
54
|
+
this._widget = widget;
|
|
51
55
|
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
+
await afterDOMLoad();
|
|
57
|
+
await integration.loadAssets(widget.assets, this._shadow);
|
|
58
|
+
|
|
59
|
+
await callbacks?.reconstructor?.(this._widget, {
|
|
60
|
+
shadow: this._shadow,
|
|
61
|
+
customElement: this,
|
|
62
|
+
});
|
|
63
|
+
|
|
64
|
+
(await callbacks?.remount?.(this._widget, {
|
|
65
|
+
shadow: this._shadow,
|
|
66
|
+
customElement: this,
|
|
67
|
+
})) ?? this._shadow.appendChild(widget.container);
|
|
68
|
+
|
|
69
|
+
return;
|
|
70
|
+
}
|
|
71
|
+
} catch (error) {
|
|
72
|
+
console.error(error);
|
|
56
73
|
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
74
|
+
return;
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
try {
|
|
78
|
+
customWidgetDefinition.root = this._shadow;
|
|
79
|
+
customWidgetDefinition.customElement = this;
|
|
80
|
+
|
|
81
|
+
if (!customWidgetDefinition.container) {
|
|
82
|
+
customWidgetDefinition.container = document.createElement('div');
|
|
83
|
+
customWidgetDefinition.container.setAttribute(
|
|
84
|
+
'id',
|
|
85
|
+
'merkur-container',
|
|
86
|
+
);
|
|
60
87
|
}
|
|
61
88
|
|
|
62
|
-
|
|
89
|
+
this._shadow.appendChild(customWidgetDefinition.container);
|
|
63
90
|
|
|
64
|
-
this._widget = await createSPAWidget(
|
|
65
|
-
|
|
91
|
+
this._widget = await createSPAWidget(
|
|
92
|
+
customWidgetDefinition,
|
|
93
|
+
this._shadow,
|
|
94
|
+
);
|
|
66
95
|
|
|
67
|
-
callbacks?.constructor?.(this._widget
|
|
96
|
+
await callbacks?.constructor?.(this._widget, {
|
|
97
|
+
shadow: this._shadow,
|
|
98
|
+
customElement: this,
|
|
99
|
+
});
|
|
100
|
+
|
|
101
|
+
(await callbacks?.mount?.(this._widget, {
|
|
102
|
+
shadow: this._shadow,
|
|
103
|
+
customElement: this,
|
|
104
|
+
})) ?? (await this._widget.mount());
|
|
68
105
|
} catch (error) {
|
|
69
106
|
console.error(error);
|
|
70
107
|
}
|
|
@@ -72,23 +109,62 @@ function registerCustomElement(options) {
|
|
|
72
109
|
}
|
|
73
110
|
|
|
74
111
|
connectedCallback() {
|
|
75
|
-
|
|
112
|
+
this._widget?.connectedCallback?.({
|
|
113
|
+
shadow: this._shadow,
|
|
114
|
+
customElement: this,
|
|
115
|
+
});
|
|
116
|
+
|
|
117
|
+
callbacks?.connectedCallback?.(this._widget, {
|
|
118
|
+
shadow: this._shadow,
|
|
119
|
+
customElement: this,
|
|
120
|
+
});
|
|
76
121
|
}
|
|
77
122
|
|
|
78
123
|
disconnectedCallback() {
|
|
79
|
-
|
|
124
|
+
this._widget?.disconnectedCallback?.({
|
|
125
|
+
shadow: this._shadow,
|
|
126
|
+
customElement: this,
|
|
127
|
+
});
|
|
128
|
+
|
|
129
|
+
callbacks?.disconnectedCallback?.(this._widget, {
|
|
130
|
+
shadow: this._shadow,
|
|
131
|
+
customElement: this,
|
|
132
|
+
});
|
|
80
133
|
}
|
|
81
134
|
|
|
82
135
|
adoptedCallback() {
|
|
83
|
-
|
|
136
|
+
this._widget?.adoptedCallback?.({
|
|
137
|
+
shadow: this._shadow,
|
|
138
|
+
customElement: this,
|
|
139
|
+
});
|
|
140
|
+
|
|
141
|
+
callbacks?.adoptedCallback?.(this._widget, {
|
|
142
|
+
shadow: this._shadow,
|
|
143
|
+
customElement: this,
|
|
144
|
+
});
|
|
84
145
|
}
|
|
85
146
|
|
|
86
147
|
attributeChangedCallback(name, oldValue, newValue) {
|
|
148
|
+
this._widget?.attributeChangedCallback?.(
|
|
149
|
+
this._widget,
|
|
150
|
+
name,
|
|
151
|
+
oldValue,
|
|
152
|
+
newValue,
|
|
153
|
+
{
|
|
154
|
+
shadow: this._shadow,
|
|
155
|
+
customElement: this,
|
|
156
|
+
},
|
|
157
|
+
);
|
|
158
|
+
|
|
87
159
|
callbacks?.attributeChangedCallback?.(
|
|
88
160
|
this._widget,
|
|
89
161
|
name,
|
|
90
162
|
oldValue,
|
|
91
163
|
newValue,
|
|
164
|
+
{
|
|
165
|
+
shadow: this._shadow,
|
|
166
|
+
customElement: this,
|
|
167
|
+
},
|
|
92
168
|
);
|
|
93
169
|
}
|
|
94
170
|
}
|
|
@@ -98,6 +174,7 @@ function registerCustomElement(options) {
|
|
|
98
174
|
}
|
|
99
175
|
}
|
|
100
176
|
|
|
177
|
+
const PROTECTED_FIELDS = ['__proto__', 'prototype', 'constructor'];
|
|
101
178
|
function deepMerge(target, source) {
|
|
102
179
|
const isObject = (obj) => !!obj && obj.constructor === Object;
|
|
103
180
|
|
|
@@ -106,6 +183,10 @@ function deepMerge(target, source) {
|
|
|
106
183
|
}
|
|
107
184
|
|
|
108
185
|
Object.keys(source).forEach((key) => {
|
|
186
|
+
if (PROTECTED_FIELDS.includes(key)) {
|
|
187
|
+
return;
|
|
188
|
+
}
|
|
189
|
+
|
|
109
190
|
const targetValue = target[key];
|
|
110
191
|
const sourceValue = source[key];
|
|
111
192
|
|
package/lib/index.es9.cjs
CHANGED
|
@@ -2,14 +2,17 @@
|
|
|
2
2
|
|
|
3
3
|
var core = require('@merkur/core');
|
|
4
4
|
var integration = require('@merkur/integration');
|
|
5
|
-
async function createSPAWidget(widgetDefinition) {
|
|
5
|
+
async function createSPAWidget(widgetDefinition, root) {
|
|
6
6
|
const definition = {
|
|
7
7
|
...widgetDefinition,
|
|
8
|
-
createWidget: widgetDefinition.createWidget
|
|
8
|
+
createWidget: widgetDefinition.createWidget
|
|
9
9
|
};
|
|
10
|
-
core.getMerkur()
|
|
10
|
+
const merkur = core.getMerkur();
|
|
11
|
+
if (!merkur.isRegistered(definition.name + definition.version)) {
|
|
12
|
+
core.getMerkur().register(definition);
|
|
13
|
+
}
|
|
11
14
|
await afterDOMLoad();
|
|
12
|
-
await integration.loadAssets(definition.assets,
|
|
15
|
+
await integration.loadAssets(definition.assets, root);
|
|
13
16
|
return await core.getMerkur().create(definition);
|
|
14
17
|
}
|
|
15
18
|
function afterDOMLoad() {
|
|
@@ -34,61 +37,116 @@ function registerCustomElement(options) {
|
|
|
34
37
|
} = deepMerge({}, options);
|
|
35
38
|
class WidgetElement extends HTMLElement {
|
|
36
39
|
constructor() {
|
|
37
|
-
var _callbacks$getSinglet;
|
|
38
40
|
super();
|
|
39
|
-
const
|
|
40
|
-
if (widget && widget.name && widget.version) {
|
|
41
|
-
this._widget = widget;
|
|
42
|
-
return;
|
|
43
|
-
}
|
|
44
|
-
const shadow = this.attachShadow({
|
|
45
|
-
mode: 'open'
|
|
46
|
-
});
|
|
41
|
+
const customWidgetDefinition = deepMerge({}, widgetDefinition);
|
|
47
42
|
(async () => {
|
|
43
|
+
this._shadow = this.attachShadow({
|
|
44
|
+
mode: 'open'
|
|
45
|
+
});
|
|
46
|
+
try {
|
|
47
|
+
var _callbacks$getInstanc;
|
|
48
|
+
const widget = await (callbacks === null || callbacks === void 0 || (_callbacks$getInstanc = callbacks.getInstance) === null || _callbacks$getInstanc === void 0 ? void 0 : _callbacks$getInstanc.call(callbacks));
|
|
49
|
+
if (widget && widget.name && widget.version) {
|
|
50
|
+
var _callbacks$reconstruc, _await$callbacks$remo, _callbacks$remount;
|
|
51
|
+
this._widget = widget;
|
|
52
|
+
await afterDOMLoad();
|
|
53
|
+
await integration.loadAssets(widget.assets, this._shadow);
|
|
54
|
+
await (callbacks === null || callbacks === void 0 || (_callbacks$reconstruc = callbacks.reconstructor) === null || _callbacks$reconstruc === void 0 ? void 0 : _callbacks$reconstruc.call(callbacks, this._widget, {
|
|
55
|
+
shadow: this._shadow,
|
|
56
|
+
customElement: this
|
|
57
|
+
}));
|
|
58
|
+
(_await$callbacks$remo = await (callbacks === null || callbacks === void 0 || (_callbacks$remount = callbacks.remount) === null || _callbacks$remount === void 0 ? void 0 : _callbacks$remount.call(callbacks, this._widget, {
|
|
59
|
+
shadow: this._shadow,
|
|
60
|
+
customElement: this
|
|
61
|
+
}))) !== null && _await$callbacks$remo !== void 0 ? _await$callbacks$remo : this._shadow.appendChild(widget.container);
|
|
62
|
+
return;
|
|
63
|
+
}
|
|
64
|
+
} catch (error) {
|
|
65
|
+
console.error(error);
|
|
66
|
+
return;
|
|
67
|
+
}
|
|
48
68
|
try {
|
|
49
|
-
var _callbacks$constructo;
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
if (!
|
|
53
|
-
|
|
54
|
-
|
|
69
|
+
var _callbacks$constructo, _await$callbacks$moun, _callbacks$mount;
|
|
70
|
+
customWidgetDefinition.root = this._shadow;
|
|
71
|
+
customWidgetDefinition.customElement = this;
|
|
72
|
+
if (!customWidgetDefinition.container) {
|
|
73
|
+
customWidgetDefinition.container = document.createElement('div');
|
|
74
|
+
customWidgetDefinition.container.setAttribute('id', 'merkur-container');
|
|
55
75
|
}
|
|
56
|
-
|
|
57
|
-
this._widget = await createSPAWidget(
|
|
58
|
-
this._widget
|
|
59
|
-
|
|
76
|
+
this._shadow.appendChild(customWidgetDefinition.container);
|
|
77
|
+
this._widget = await createSPAWidget(customWidgetDefinition, this._shadow);
|
|
78
|
+
await (callbacks === null || callbacks === void 0 || (_callbacks$constructo = callbacks.constructor) === null || _callbacks$constructo === void 0 ? void 0 : _callbacks$constructo.call(callbacks, this._widget, {
|
|
79
|
+
shadow: this._shadow,
|
|
80
|
+
customElement: this
|
|
81
|
+
}));
|
|
82
|
+
(_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, {
|
|
83
|
+
shadow: this._shadow,
|
|
84
|
+
customElement: this
|
|
85
|
+
}))) !== null && _await$callbacks$moun !== void 0 ? _await$callbacks$moun : await this._widget.mount();
|
|
60
86
|
} catch (error) {
|
|
61
87
|
console.error(error);
|
|
62
88
|
}
|
|
63
89
|
})();
|
|
64
90
|
}
|
|
65
91
|
connectedCallback() {
|
|
66
|
-
var _callbacks$connectedC;
|
|
67
|
-
|
|
92
|
+
var _this$_widget, _this$_widget$connect, _callbacks$connectedC;
|
|
93
|
+
(_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, {
|
|
94
|
+
shadow: this._shadow,
|
|
95
|
+
customElement: this
|
|
96
|
+
});
|
|
97
|
+
callbacks === null || callbacks === void 0 || (_callbacks$connectedC = callbacks.connectedCallback) === null || _callbacks$connectedC === void 0 || _callbacks$connectedC.call(callbacks, this._widget, {
|
|
98
|
+
shadow: this._shadow,
|
|
99
|
+
customElement: this
|
|
100
|
+
});
|
|
68
101
|
}
|
|
69
102
|
disconnectedCallback() {
|
|
70
|
-
var _callbacks$disconnect;
|
|
71
|
-
|
|
103
|
+
var _this$_widget2, _this$_widget2$discon, _callbacks$disconnect;
|
|
104
|
+
(_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, {
|
|
105
|
+
shadow: this._shadow,
|
|
106
|
+
customElement: this
|
|
107
|
+
});
|
|
108
|
+
callbacks === null || callbacks === void 0 || (_callbacks$disconnect = callbacks.disconnectedCallback) === null || _callbacks$disconnect === void 0 || _callbacks$disconnect.call(callbacks, this._widget, {
|
|
109
|
+
shadow: this._shadow,
|
|
110
|
+
customElement: this
|
|
111
|
+
});
|
|
72
112
|
}
|
|
73
113
|
adoptedCallback() {
|
|
74
|
-
var _callbacks$adoptedCal;
|
|
75
|
-
|
|
114
|
+
var _this$_widget3, _this$_widget3$adopte, _callbacks$adoptedCal;
|
|
115
|
+
(_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, {
|
|
116
|
+
shadow: this._shadow,
|
|
117
|
+
customElement: this
|
|
118
|
+
});
|
|
119
|
+
callbacks === null || callbacks === void 0 || (_callbacks$adoptedCal = callbacks.adoptedCallback) === null || _callbacks$adoptedCal === void 0 || _callbacks$adoptedCal.call(callbacks, this._widget, {
|
|
120
|
+
shadow: this._shadow,
|
|
121
|
+
customElement: this
|
|
122
|
+
});
|
|
76
123
|
}
|
|
77
124
|
attributeChangedCallback(name, oldValue, newValue) {
|
|
78
|
-
var _callbacks$attributeC;
|
|
79
|
-
|
|
125
|
+
var _this$_widget4, _this$_widget4$attrib, _callbacks$attributeC;
|
|
126
|
+
(_this$_widget4 = this._widget) === null || _this$_widget4 === void 0 || (_this$_widget4$attrib = _this$_widget4.attributeChangedCallback) === null || _this$_widget4$attrib === void 0 || _this$_widget4$attrib.call(_this$_widget4, this._widget, name, oldValue, newValue, {
|
|
127
|
+
shadow: this._shadow,
|
|
128
|
+
customElement: this
|
|
129
|
+
});
|
|
130
|
+
callbacks === null || callbacks === void 0 || (_callbacks$attributeC = callbacks.attributeChangedCallback) === null || _callbacks$attributeC === void 0 || _callbacks$attributeC.call(callbacks, this._widget, name, oldValue, newValue, {
|
|
131
|
+
shadow: this._shadow,
|
|
132
|
+
customElement: this
|
|
133
|
+
});
|
|
80
134
|
}
|
|
81
135
|
}
|
|
82
136
|
if (customElements.get(widgetDefinition.name) === undefined) {
|
|
83
137
|
customElements.define(widgetDefinition.name, WidgetElement);
|
|
84
138
|
}
|
|
85
139
|
}
|
|
140
|
+
const PROTECTED_FIELDS = ['__proto__', 'prototype', 'constructor'];
|
|
86
141
|
function deepMerge(target, source) {
|
|
87
142
|
const isObject = obj => !!obj && obj.constructor === Object;
|
|
88
143
|
if (!isObject(target) || !isObject(source)) {
|
|
89
144
|
return source;
|
|
90
145
|
}
|
|
91
146
|
Object.keys(source).forEach(key => {
|
|
147
|
+
if (PROTECTED_FIELDS.includes(key)) {
|
|
148
|
+
return;
|
|
149
|
+
}
|
|
92
150
|
const targetValue = target[key];
|
|
93
151
|
const sourceValue = source[key];
|
|
94
152
|
if (Array.isArray(targetValue) && Array.isArray(sourceValue)) {
|
package/lib/index.es9.mjs
CHANGED
|
@@ -1,13 +1,16 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { getMerkur } from '@merkur/core';
|
|
2
2
|
import { loadAssets } from '@merkur/integration';
|
|
3
|
-
async function createSPAWidget(widgetDefinition) {
|
|
3
|
+
async function createSPAWidget(widgetDefinition, root) {
|
|
4
4
|
const definition = {
|
|
5
5
|
...widgetDefinition,
|
|
6
|
-
createWidget: widgetDefinition.createWidget
|
|
6
|
+
createWidget: widgetDefinition.createWidget
|
|
7
7
|
};
|
|
8
|
-
getMerkur()
|
|
8
|
+
const merkur = getMerkur();
|
|
9
|
+
if (!merkur.isRegistered(definition.name + definition.version)) {
|
|
10
|
+
getMerkur().register(definition);
|
|
11
|
+
}
|
|
9
12
|
await afterDOMLoad();
|
|
10
|
-
await loadAssets(definition.assets,
|
|
13
|
+
await loadAssets(definition.assets, root);
|
|
11
14
|
return await getMerkur().create(definition);
|
|
12
15
|
}
|
|
13
16
|
function afterDOMLoad() {
|
|
@@ -32,61 +35,116 @@ function registerCustomElement(options) {
|
|
|
32
35
|
} = deepMerge({}, options);
|
|
33
36
|
class WidgetElement extends HTMLElement {
|
|
34
37
|
constructor() {
|
|
35
|
-
var _callbacks$getSinglet;
|
|
36
38
|
super();
|
|
37
|
-
const
|
|
38
|
-
if (widget && widget.name && widget.version) {
|
|
39
|
-
this._widget = widget;
|
|
40
|
-
return;
|
|
41
|
-
}
|
|
42
|
-
const shadow = this.attachShadow({
|
|
43
|
-
mode: 'open'
|
|
44
|
-
});
|
|
39
|
+
const customWidgetDefinition = deepMerge({}, widgetDefinition);
|
|
45
40
|
(async () => {
|
|
41
|
+
this._shadow = this.attachShadow({
|
|
42
|
+
mode: 'open'
|
|
43
|
+
});
|
|
44
|
+
try {
|
|
45
|
+
var _callbacks$getInstanc;
|
|
46
|
+
const widget = await (callbacks === null || callbacks === void 0 || (_callbacks$getInstanc = callbacks.getInstance) === null || _callbacks$getInstanc === void 0 ? void 0 : _callbacks$getInstanc.call(callbacks));
|
|
47
|
+
if (widget && widget.name && widget.version) {
|
|
48
|
+
var _callbacks$reconstruc, _await$callbacks$remo, _callbacks$remount;
|
|
49
|
+
this._widget = widget;
|
|
50
|
+
await afterDOMLoad();
|
|
51
|
+
await loadAssets(widget.assets, this._shadow);
|
|
52
|
+
await (callbacks === null || callbacks === void 0 || (_callbacks$reconstruc = callbacks.reconstructor) === null || _callbacks$reconstruc === void 0 ? void 0 : _callbacks$reconstruc.call(callbacks, this._widget, {
|
|
53
|
+
shadow: this._shadow,
|
|
54
|
+
customElement: this
|
|
55
|
+
}));
|
|
56
|
+
(_await$callbacks$remo = await (callbacks === null || callbacks === void 0 || (_callbacks$remount = callbacks.remount) === null || _callbacks$remount === void 0 ? void 0 : _callbacks$remount.call(callbacks, this._widget, {
|
|
57
|
+
shadow: this._shadow,
|
|
58
|
+
customElement: this
|
|
59
|
+
}))) !== null && _await$callbacks$remo !== void 0 ? _await$callbacks$remo : this._shadow.appendChild(widget.container);
|
|
60
|
+
return;
|
|
61
|
+
}
|
|
62
|
+
} catch (error) {
|
|
63
|
+
console.error(error);
|
|
64
|
+
return;
|
|
65
|
+
}
|
|
46
66
|
try {
|
|
47
|
-
var _callbacks$constructo;
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
if (!
|
|
51
|
-
|
|
52
|
-
|
|
67
|
+
var _callbacks$constructo, _await$callbacks$moun, _callbacks$mount;
|
|
68
|
+
customWidgetDefinition.root = this._shadow;
|
|
69
|
+
customWidgetDefinition.customElement = this;
|
|
70
|
+
if (!customWidgetDefinition.container) {
|
|
71
|
+
customWidgetDefinition.container = document.createElement('div');
|
|
72
|
+
customWidgetDefinition.container.setAttribute('id', 'merkur-container');
|
|
53
73
|
}
|
|
54
|
-
|
|
55
|
-
this._widget = await createSPAWidget(
|
|
56
|
-
this._widget
|
|
57
|
-
|
|
74
|
+
this._shadow.appendChild(customWidgetDefinition.container);
|
|
75
|
+
this._widget = await createSPAWidget(customWidgetDefinition, this._shadow);
|
|
76
|
+
await (callbacks === null || callbacks === void 0 || (_callbacks$constructo = callbacks.constructor) === null || _callbacks$constructo === void 0 ? void 0 : _callbacks$constructo.call(callbacks, this._widget, {
|
|
77
|
+
shadow: this._shadow,
|
|
78
|
+
customElement: this
|
|
79
|
+
}));
|
|
80
|
+
(_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, {
|
|
81
|
+
shadow: this._shadow,
|
|
82
|
+
customElement: this
|
|
83
|
+
}))) !== null && _await$callbacks$moun !== void 0 ? _await$callbacks$moun : await this._widget.mount();
|
|
58
84
|
} catch (error) {
|
|
59
85
|
console.error(error);
|
|
60
86
|
}
|
|
61
87
|
})();
|
|
62
88
|
}
|
|
63
89
|
connectedCallback() {
|
|
64
|
-
var _callbacks$connectedC;
|
|
65
|
-
|
|
90
|
+
var _this$_widget, _this$_widget$connect, _callbacks$connectedC;
|
|
91
|
+
(_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, {
|
|
92
|
+
shadow: this._shadow,
|
|
93
|
+
customElement: this
|
|
94
|
+
});
|
|
95
|
+
callbacks === null || callbacks === void 0 || (_callbacks$connectedC = callbacks.connectedCallback) === null || _callbacks$connectedC === void 0 || _callbacks$connectedC.call(callbacks, this._widget, {
|
|
96
|
+
shadow: this._shadow,
|
|
97
|
+
customElement: this
|
|
98
|
+
});
|
|
66
99
|
}
|
|
67
100
|
disconnectedCallback() {
|
|
68
|
-
var _callbacks$disconnect;
|
|
69
|
-
|
|
101
|
+
var _this$_widget2, _this$_widget2$discon, _callbacks$disconnect;
|
|
102
|
+
(_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, {
|
|
103
|
+
shadow: this._shadow,
|
|
104
|
+
customElement: this
|
|
105
|
+
});
|
|
106
|
+
callbacks === null || callbacks === void 0 || (_callbacks$disconnect = callbacks.disconnectedCallback) === null || _callbacks$disconnect === void 0 || _callbacks$disconnect.call(callbacks, this._widget, {
|
|
107
|
+
shadow: this._shadow,
|
|
108
|
+
customElement: this
|
|
109
|
+
});
|
|
70
110
|
}
|
|
71
111
|
adoptedCallback() {
|
|
72
|
-
var _callbacks$adoptedCal;
|
|
73
|
-
|
|
112
|
+
var _this$_widget3, _this$_widget3$adopte, _callbacks$adoptedCal;
|
|
113
|
+
(_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, {
|
|
114
|
+
shadow: this._shadow,
|
|
115
|
+
customElement: this
|
|
116
|
+
});
|
|
117
|
+
callbacks === null || callbacks === void 0 || (_callbacks$adoptedCal = callbacks.adoptedCallback) === null || _callbacks$adoptedCal === void 0 || _callbacks$adoptedCal.call(callbacks, this._widget, {
|
|
118
|
+
shadow: this._shadow,
|
|
119
|
+
customElement: this
|
|
120
|
+
});
|
|
74
121
|
}
|
|
75
122
|
attributeChangedCallback(name, oldValue, newValue) {
|
|
76
|
-
var _callbacks$attributeC;
|
|
77
|
-
|
|
123
|
+
var _this$_widget4, _this$_widget4$attrib, _callbacks$attributeC;
|
|
124
|
+
(_this$_widget4 = this._widget) === null || _this$_widget4 === void 0 || (_this$_widget4$attrib = _this$_widget4.attributeChangedCallback) === null || _this$_widget4$attrib === void 0 || _this$_widget4$attrib.call(_this$_widget4, this._widget, name, oldValue, newValue, {
|
|
125
|
+
shadow: this._shadow,
|
|
126
|
+
customElement: this
|
|
127
|
+
});
|
|
128
|
+
callbacks === null || callbacks === void 0 || (_callbacks$attributeC = callbacks.attributeChangedCallback) === null || _callbacks$attributeC === void 0 || _callbacks$attributeC.call(callbacks, this._widget, name, oldValue, newValue, {
|
|
129
|
+
shadow: this._shadow,
|
|
130
|
+
customElement: this
|
|
131
|
+
});
|
|
78
132
|
}
|
|
79
133
|
}
|
|
80
134
|
if (customElements.get(widgetDefinition.name) === undefined) {
|
|
81
135
|
customElements.define(widgetDefinition.name, WidgetElement);
|
|
82
136
|
}
|
|
83
137
|
}
|
|
138
|
+
const PROTECTED_FIELDS = ['__proto__', 'prototype', 'constructor'];
|
|
84
139
|
function deepMerge(target, source) {
|
|
85
140
|
const isObject = obj => !!obj && obj.constructor === Object;
|
|
86
141
|
if (!isObject(target) || !isObject(source)) {
|
|
87
142
|
return source;
|
|
88
143
|
}
|
|
89
144
|
Object.keys(source).forEach(key => {
|
|
145
|
+
if (PROTECTED_FIELDS.includes(key)) {
|
|
146
|
+
return;
|
|
147
|
+
}
|
|
90
148
|
const targetValue = target[key];
|
|
91
149
|
const sourceValue = source[key];
|
|
92
150
|
if (Array.isArray(targetValue) && Array.isArray(sourceValue)) {
|
package/lib/index.js
CHANGED
|
@@ -3,16 +3,19 @@
|
|
|
3
3
|
var core = require('@merkur/core');
|
|
4
4
|
var integration = require('@merkur/integration');
|
|
5
5
|
|
|
6
|
-
async function createSPAWidget(widgetDefinition) {
|
|
6
|
+
async function createSPAWidget(widgetDefinition, root) {
|
|
7
7
|
const definition = {
|
|
8
8
|
...widgetDefinition,
|
|
9
|
-
createWidget: widgetDefinition.createWidget
|
|
9
|
+
createWidget: widgetDefinition.createWidget,
|
|
10
10
|
};
|
|
11
11
|
|
|
12
|
-
core.getMerkur()
|
|
12
|
+
const merkur = core.getMerkur();
|
|
13
|
+
if (!merkur.isRegistered(definition.name + definition.version)) {
|
|
14
|
+
core.getMerkur().register(definition);
|
|
15
|
+
}
|
|
13
16
|
|
|
14
17
|
await afterDOMLoad();
|
|
15
|
-
await integration.loadAssets(definition.assets,
|
|
18
|
+
await integration.loadAssets(definition.assets, root);
|
|
16
19
|
|
|
17
20
|
return await core.getMerkur().create(definition);
|
|
18
21
|
}
|
|
@@ -39,32 +42,66 @@ function registerCustomElement(options) {
|
|
|
39
42
|
constructor() {
|
|
40
43
|
super();
|
|
41
44
|
|
|
42
|
-
const
|
|
45
|
+
const customWidgetDefinition = deepMerge({}, widgetDefinition);
|
|
43
46
|
|
|
44
|
-
|
|
45
|
-
this.
|
|
47
|
+
(async () => {
|
|
48
|
+
this._shadow = this.attachShadow({ mode: 'open' });
|
|
46
49
|
|
|
47
|
-
|
|
48
|
-
|
|
50
|
+
try {
|
|
51
|
+
const widget = await callbacks?.getInstance?.();
|
|
49
52
|
|
|
50
|
-
|
|
53
|
+
if (widget && widget.name && widget.version) {
|
|
54
|
+
this._widget = widget;
|
|
51
55
|
|
|
52
|
-
|
|
53
|
-
|
|
54
|
-
|
|
55
|
-
|
|
56
|
+
await afterDOMLoad();
|
|
57
|
+
await integration.loadAssets(widget.assets, this._shadow);
|
|
58
|
+
|
|
59
|
+
await callbacks?.reconstructor?.(this._widget, {
|
|
60
|
+
shadow: this._shadow,
|
|
61
|
+
customElement: this,
|
|
62
|
+
});
|
|
63
|
+
|
|
64
|
+
(await callbacks?.remount?.(this._widget, {
|
|
65
|
+
shadow: this._shadow,
|
|
66
|
+
customElement: this,
|
|
67
|
+
})) ?? this._shadow.appendChild(widget.container);
|
|
68
|
+
|
|
69
|
+
return;
|
|
70
|
+
}
|
|
71
|
+
} catch (error) {
|
|
72
|
+
console.error(error);
|
|
56
73
|
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
74
|
+
return;
|
|
75
|
+
}
|
|
76
|
+
|
|
77
|
+
try {
|
|
78
|
+
customWidgetDefinition.root = this._shadow;
|
|
79
|
+
customWidgetDefinition.customElement = this;
|
|
80
|
+
|
|
81
|
+
if (!customWidgetDefinition.container) {
|
|
82
|
+
customWidgetDefinition.container = document.createElement('div');
|
|
83
|
+
customWidgetDefinition.container.setAttribute(
|
|
84
|
+
'id',
|
|
85
|
+
'merkur-container',
|
|
86
|
+
);
|
|
60
87
|
}
|
|
61
88
|
|
|
62
|
-
|
|
89
|
+
this._shadow.appendChild(customWidgetDefinition.container);
|
|
63
90
|
|
|
64
|
-
this._widget = await createSPAWidget(
|
|
65
|
-
|
|
91
|
+
this._widget = await createSPAWidget(
|
|
92
|
+
customWidgetDefinition,
|
|
93
|
+
this._shadow,
|
|
94
|
+
);
|
|
66
95
|
|
|
67
|
-
callbacks?.constructor?.(this._widget
|
|
96
|
+
await callbacks?.constructor?.(this._widget, {
|
|
97
|
+
shadow: this._shadow,
|
|
98
|
+
customElement: this,
|
|
99
|
+
});
|
|
100
|
+
|
|
101
|
+
(await callbacks?.mount?.(this._widget, {
|
|
102
|
+
shadow: this._shadow,
|
|
103
|
+
customElement: this,
|
|
104
|
+
})) ?? (await this._widget.mount());
|
|
68
105
|
} catch (error) {
|
|
69
106
|
console.error(error);
|
|
70
107
|
}
|
|
@@ -72,23 +109,62 @@ function registerCustomElement(options) {
|
|
|
72
109
|
}
|
|
73
110
|
|
|
74
111
|
connectedCallback() {
|
|
75
|
-
|
|
112
|
+
this._widget?.connectedCallback?.({
|
|
113
|
+
shadow: this._shadow,
|
|
114
|
+
customElement: this,
|
|
115
|
+
});
|
|
116
|
+
|
|
117
|
+
callbacks?.connectedCallback?.(this._widget, {
|
|
118
|
+
shadow: this._shadow,
|
|
119
|
+
customElement: this,
|
|
120
|
+
});
|
|
76
121
|
}
|
|
77
122
|
|
|
78
123
|
disconnectedCallback() {
|
|
79
|
-
|
|
124
|
+
this._widget?.disconnectedCallback?.({
|
|
125
|
+
shadow: this._shadow,
|
|
126
|
+
customElement: this,
|
|
127
|
+
});
|
|
128
|
+
|
|
129
|
+
callbacks?.disconnectedCallback?.(this._widget, {
|
|
130
|
+
shadow: this._shadow,
|
|
131
|
+
customElement: this,
|
|
132
|
+
});
|
|
80
133
|
}
|
|
81
134
|
|
|
82
135
|
adoptedCallback() {
|
|
83
|
-
|
|
136
|
+
this._widget?.adoptedCallback?.({
|
|
137
|
+
shadow: this._shadow,
|
|
138
|
+
customElement: this,
|
|
139
|
+
});
|
|
140
|
+
|
|
141
|
+
callbacks?.adoptedCallback?.(this._widget, {
|
|
142
|
+
shadow: this._shadow,
|
|
143
|
+
customElement: this,
|
|
144
|
+
});
|
|
84
145
|
}
|
|
85
146
|
|
|
86
147
|
attributeChangedCallback(name, oldValue, newValue) {
|
|
148
|
+
this._widget?.attributeChangedCallback?.(
|
|
149
|
+
this._widget,
|
|
150
|
+
name,
|
|
151
|
+
oldValue,
|
|
152
|
+
newValue,
|
|
153
|
+
{
|
|
154
|
+
shadow: this._shadow,
|
|
155
|
+
customElement: this,
|
|
156
|
+
},
|
|
157
|
+
);
|
|
158
|
+
|
|
87
159
|
callbacks?.attributeChangedCallback?.(
|
|
88
160
|
this._widget,
|
|
89
161
|
name,
|
|
90
162
|
oldValue,
|
|
91
163
|
newValue,
|
|
164
|
+
{
|
|
165
|
+
shadow: this._shadow,
|
|
166
|
+
customElement: this,
|
|
167
|
+
},
|
|
92
168
|
);
|
|
93
169
|
}
|
|
94
170
|
}
|
|
@@ -98,6 +174,7 @@ function registerCustomElement(options) {
|
|
|
98
174
|
}
|
|
99
175
|
}
|
|
100
176
|
|
|
177
|
+
const PROTECTED_FIELDS = ['__proto__', 'prototype', 'constructor'];
|
|
101
178
|
function deepMerge(target, source) {
|
|
102
179
|
const isObject = (obj) => !!obj && obj.constructor === Object;
|
|
103
180
|
|
|
@@ -106,6 +183,10 @@ function deepMerge(target, source) {
|
|
|
106
183
|
}
|
|
107
184
|
|
|
108
185
|
Object.keys(source).forEach((key) => {
|
|
186
|
+
if (PROTECTED_FIELDS.includes(key)) {
|
|
187
|
+
return;
|
|
188
|
+
}
|
|
189
|
+
|
|
109
190
|
const targetValue = target[key];
|
|
110
191
|
const sourceValue = source[key];
|
|
111
192
|
|
package/lib/index.mjs
CHANGED
|
@@ -1,16 +1,19 @@
|
|
|
1
|
-
import {
|
|
1
|
+
import { getMerkur } from '@merkur/core';
|
|
2
2
|
import { loadAssets } from '@merkur/integration';
|
|
3
3
|
|
|
4
|
-
async function createSPAWidget(widgetDefinition) {
|
|
4
|
+
async function createSPAWidget(widgetDefinition, root) {
|
|
5
5
|
const definition = {
|
|
6
6
|
...widgetDefinition,
|
|
7
|
-
createWidget: widgetDefinition.createWidget
|
|
7
|
+
createWidget: widgetDefinition.createWidget,
|
|
8
8
|
};
|
|
9
9
|
|
|
10
|
-
getMerkur()
|
|
10
|
+
const merkur = getMerkur();
|
|
11
|
+
if (!merkur.isRegistered(definition.name + definition.version)) {
|
|
12
|
+
getMerkur().register(definition);
|
|
13
|
+
}
|
|
11
14
|
|
|
12
15
|
await afterDOMLoad();
|
|
13
|
-
await loadAssets(definition.assets,
|
|
16
|
+
await loadAssets(definition.assets, root);
|
|
14
17
|
|
|
15
18
|
return await getMerkur().create(definition);
|
|
16
19
|
}
|
|
@@ -37,32 +40,66 @@ function registerCustomElement(options) {
|
|
|
37
40
|
constructor() {
|
|
38
41
|
super();
|
|
39
42
|
|
|
40
|
-
const
|
|
43
|
+
const customWidgetDefinition = deepMerge({}, widgetDefinition);
|
|
41
44
|
|
|
42
|
-
|
|
43
|
-
this.
|
|
45
|
+
(async () => {
|
|
46
|
+
this._shadow = this.attachShadow({ mode: 'open' });
|
|
44
47
|
|
|
45
|
-
|
|
46
|
-
|
|
48
|
+
try {
|
|
49
|
+
const widget = await callbacks?.getInstance?.();
|
|
47
50
|
|
|
48
|
-
|
|
51
|
+
if (widget && widget.name && widget.version) {
|
|
52
|
+
this._widget = widget;
|
|
49
53
|
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
|
|
54
|
+
await afterDOMLoad();
|
|
55
|
+
await loadAssets(widget.assets, this._shadow);
|
|
56
|
+
|
|
57
|
+
await callbacks?.reconstructor?.(this._widget, {
|
|
58
|
+
shadow: this._shadow,
|
|
59
|
+
customElement: this,
|
|
60
|
+
});
|
|
61
|
+
|
|
62
|
+
(await callbacks?.remount?.(this._widget, {
|
|
63
|
+
shadow: this._shadow,
|
|
64
|
+
customElement: this,
|
|
65
|
+
})) ?? this._shadow.appendChild(widget.container);
|
|
66
|
+
|
|
67
|
+
return;
|
|
68
|
+
}
|
|
69
|
+
} catch (error) {
|
|
70
|
+
console.error(error);
|
|
54
71
|
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
72
|
+
return;
|
|
73
|
+
}
|
|
74
|
+
|
|
75
|
+
try {
|
|
76
|
+
customWidgetDefinition.root = this._shadow;
|
|
77
|
+
customWidgetDefinition.customElement = this;
|
|
78
|
+
|
|
79
|
+
if (!customWidgetDefinition.container) {
|
|
80
|
+
customWidgetDefinition.container = document.createElement('div');
|
|
81
|
+
customWidgetDefinition.container.setAttribute(
|
|
82
|
+
'id',
|
|
83
|
+
'merkur-container',
|
|
84
|
+
);
|
|
58
85
|
}
|
|
59
86
|
|
|
60
|
-
|
|
87
|
+
this._shadow.appendChild(customWidgetDefinition.container);
|
|
61
88
|
|
|
62
|
-
this._widget = await createSPAWidget(
|
|
63
|
-
|
|
89
|
+
this._widget = await createSPAWidget(
|
|
90
|
+
customWidgetDefinition,
|
|
91
|
+
this._shadow,
|
|
92
|
+
);
|
|
64
93
|
|
|
65
|
-
callbacks?.constructor?.(this._widget
|
|
94
|
+
await callbacks?.constructor?.(this._widget, {
|
|
95
|
+
shadow: this._shadow,
|
|
96
|
+
customElement: this,
|
|
97
|
+
});
|
|
98
|
+
|
|
99
|
+
(await callbacks?.mount?.(this._widget, {
|
|
100
|
+
shadow: this._shadow,
|
|
101
|
+
customElement: this,
|
|
102
|
+
})) ?? (await this._widget.mount());
|
|
66
103
|
} catch (error) {
|
|
67
104
|
console.error(error);
|
|
68
105
|
}
|
|
@@ -70,23 +107,62 @@ function registerCustomElement(options) {
|
|
|
70
107
|
}
|
|
71
108
|
|
|
72
109
|
connectedCallback() {
|
|
73
|
-
|
|
110
|
+
this._widget?.connectedCallback?.({
|
|
111
|
+
shadow: this._shadow,
|
|
112
|
+
customElement: this,
|
|
113
|
+
});
|
|
114
|
+
|
|
115
|
+
callbacks?.connectedCallback?.(this._widget, {
|
|
116
|
+
shadow: this._shadow,
|
|
117
|
+
customElement: this,
|
|
118
|
+
});
|
|
74
119
|
}
|
|
75
120
|
|
|
76
121
|
disconnectedCallback() {
|
|
77
|
-
|
|
122
|
+
this._widget?.disconnectedCallback?.({
|
|
123
|
+
shadow: this._shadow,
|
|
124
|
+
customElement: this,
|
|
125
|
+
});
|
|
126
|
+
|
|
127
|
+
callbacks?.disconnectedCallback?.(this._widget, {
|
|
128
|
+
shadow: this._shadow,
|
|
129
|
+
customElement: this,
|
|
130
|
+
});
|
|
78
131
|
}
|
|
79
132
|
|
|
80
133
|
adoptedCallback() {
|
|
81
|
-
|
|
134
|
+
this._widget?.adoptedCallback?.({
|
|
135
|
+
shadow: this._shadow,
|
|
136
|
+
customElement: this,
|
|
137
|
+
});
|
|
138
|
+
|
|
139
|
+
callbacks?.adoptedCallback?.(this._widget, {
|
|
140
|
+
shadow: this._shadow,
|
|
141
|
+
customElement: this,
|
|
142
|
+
});
|
|
82
143
|
}
|
|
83
144
|
|
|
84
145
|
attributeChangedCallback(name, oldValue, newValue) {
|
|
146
|
+
this._widget?.attributeChangedCallback?.(
|
|
147
|
+
this._widget,
|
|
148
|
+
name,
|
|
149
|
+
oldValue,
|
|
150
|
+
newValue,
|
|
151
|
+
{
|
|
152
|
+
shadow: this._shadow,
|
|
153
|
+
customElement: this,
|
|
154
|
+
},
|
|
155
|
+
);
|
|
156
|
+
|
|
85
157
|
callbacks?.attributeChangedCallback?.(
|
|
86
158
|
this._widget,
|
|
87
159
|
name,
|
|
88
160
|
oldValue,
|
|
89
161
|
newValue,
|
|
162
|
+
{
|
|
163
|
+
shadow: this._shadow,
|
|
164
|
+
customElement: this,
|
|
165
|
+
},
|
|
90
166
|
);
|
|
91
167
|
}
|
|
92
168
|
}
|
|
@@ -96,6 +172,7 @@ function registerCustomElement(options) {
|
|
|
96
172
|
}
|
|
97
173
|
}
|
|
98
174
|
|
|
175
|
+
const PROTECTED_FIELDS = ['__proto__', 'prototype', 'constructor'];
|
|
99
176
|
function deepMerge(target, source) {
|
|
100
177
|
const isObject = (obj) => !!obj && obj.constructor === Object;
|
|
101
178
|
|
|
@@ -104,6 +181,10 @@ function deepMerge(target, source) {
|
|
|
104
181
|
}
|
|
105
182
|
|
|
106
183
|
Object.keys(source).forEach((key) => {
|
|
184
|
+
if (PROTECTED_FIELDS.includes(key)) {
|
|
185
|
+
return;
|
|
186
|
+
}
|
|
187
|
+
|
|
107
188
|
const targetValue = target[key];
|
|
108
189
|
const sourceValue = source[key];
|
|
109
190
|
|
package/lib/index.umd.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
function e(t){return e="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},e(t)}!function(e,t){if("function"==typeof define&&define.amd)define("@merkur/integration-custom-element",["exports","@merkur/core","@merkur/integration"],t);else if("undefined"!=typeof exports)t(exports,require("@merkur/core"),require("@merkur/integration"));else{var n={exports:{}};t(n.exports,e.Merkur.Core,e.Merkur.Integration),e.merkurIntegrationCustomElement=n.exports}}("undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self?self:this,(function(t,n,
|
|
1
|
+
function e(t){return e="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e},e(t)}!function(e,t){if("function"==typeof define&&define.amd)define("@merkur/integration-custom-element",["exports","@merkur/core","@merkur/integration"],t);else if("undefined"!=typeof exports)t(exports,require("@merkur/core"),require("@merkur/integration"));else{var n={exports:{}};t(n.exports,e.Merkur.Core,e.Merkur.Integration),e.merkurIntegrationCustomElement=n.exports}}("undefined"!=typeof globalThis?globalThis:"undefined"!=typeof self?self:this,(function(t,n,o){function r(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,o)}return n}function i(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?r(Object(n),!0).forEach((function(t){l(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):r(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function l(e,t,n){return(t=c(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function u(e,t){for(var n=0;n<t.length;n++){var o=t[n];o.enumerable=o.enumerable||!1,o.configurable=!0,"value"in o&&(o.writable=!0),Object.defineProperty(e,c(o.key),o)}}function c(t){var n=function(t,n){if("object"!=e(t)||!t)return t;var o=t[Symbol.toPrimitive];if(void 0!==o){var r=o.call(t,n||"default");if("object"!=e(r))return r;throw new TypeError("@@toPrimitive must return a primitive value.")}return("string"===n?String:Number)(t)}(t,"string");return"symbol"==e(n)?n:n+""}function a(e){var t="function"==typeof Map?new Map:void 0;return a=function(e){if(null===e||!function(e){try{return-1!==Function.toString.call(e).indexOf("[native code]")}catch(t){return"function"==typeof e}}(e))return e;if("function"!=typeof e)throw new TypeError("Super expression must either be null or a function");if(void 0!==t){if(t.has(e))return t.get(e);t.set(e,n)}function n(){return function(e,t,n){if(s())return Reflect.construct.apply(null,arguments);var o=[null];o.push.apply(o,t);var r=new(e.bind.apply(e,o));return n&&d(r,n.prototype),r}(e,arguments,f(this).constructor)}return n.prototype=Object.create(e.prototype,{constructor:{value:n,enumerable:!1,writable:!0,configurable:!0}}),d(n,e)},a(e)}function s(){try{var e=!Boolean.prototype.valueOf.call(Reflect.construct(Boolean,[],(function(){})))}catch(e){}return(s=function(){return!!e})()}function d(e,t){return d=Object.setPrototypeOf?Object.setPrototypeOf.bind():function(e,t){return e.__proto__=t,e},d(e,t)}function f(e){return f=Object.setPrototypeOf?Object.getPrototypeOf.bind():function(e){return e.__proto__||Object.getPrototypeOf(e)},f(e)}function p(e,t,n,o,r,i,l){try{var u=e[i](l),c=u.value}catch(e){return void n(e)}u.done?t(c):Promise.resolve(c).then(o,r)}function y(e){return function(){var t=this,n=arguments;return new Promise((function(o,r){var i=e.apply(t,n);function l(e){p(i,o,r,l,u,"next",e)}function u(e){p(i,o,r,l,u,"throw",e)}l(void 0)}))}}function h(){return(h=y((function*(e,t){var r=i(i({},e),{},{createWidget:e.createWidget});return(0,n.getMerkur)().isRegistered(r.name+r.version)||(0,n.getMerkur)().register(r),yield v(),yield(0,o.loadAssets)(r.assets,t),yield(0,n.getMerkur)().create(r)}))).apply(this,arguments)}function v(){return new Promise((function(e){"undefined"!=typeof document?"loading"!==document.readyState?e():window.addEventListener("DOMContentLoaded",(function(){e()})):e()}))}Object.defineProperty(t,"__esModule",{value:!0}),t.deepMerge=b,t.registerCustomElement=function(t){var n=b({},t),r=n.widgetDefinition,i=n.callbacks,l=function(t){function n(){var t,l,u,c;!function(e,t){if(!(e instanceof t))throw new TypeError("Cannot call a class as a function")}(this,n),l=this,u=f(u=n),t=function(t,n){if(n&&("object"===e(n)||"function"==typeof n))return n;if(void 0!==n)throw new TypeError("Derived constructors may only return object or undefined");return function(e){if(void 0===e)throw new ReferenceError("this hasn't been initialised - super() hasn't been called");return e}(t)}(l,s()?Reflect.construct(u,c||[],f(l).constructor):u.apply(l,c));var a=b({},r);return y((function*(){t._shadow=t.attachShadow({mode:"open"});try{var e,n,r,l,u=yield null==i||null===(e=i.getInstance)||void 0===e?void 0:e.call(i);if(u&&u.name&&u.version)return t._widget=u,yield v(),yield(0,o.loadAssets)(u.assets,t._shadow),yield null==i||null===(n=i.reconstructor)||void 0===n?void 0:n.call(i,t._widget,{shadow:t._shadow,customElement:t}),void(null!==(r=yield null==i||null===(l=i.remount)||void 0===l?void 0:l.call(i,t._widget,{shadow:t._shadow,customElement:t}))&&void 0!==r||t._shadow.appendChild(u.container))}catch(e){return void console.error(e)}try{var c,s,d;a.root=t._shadow,a.customElement=t,a.container||(a.container=document.createElement("div"),a.container.setAttribute("id","merkur-container")),t._shadow.appendChild(a.container),t._widget=yield function(e,t){return h.apply(this,arguments)}(a,t._shadow),yield null==i||null===(c=i.constructor)||void 0===c?void 0:c.call(i,t._widget,{shadow:t._shadow,customElement:t}),null!==(s=yield null==i||null===(d=i.mount)||void 0===d?void 0:d.call(i,t._widget,{shadow:t._shadow,customElement:t}))&&void 0!==s||(yield t._widget.mount())}catch(e){console.error(e)}}))(),t}return function(e,t){if("function"!=typeof t&&null!==t)throw new TypeError("Super expression must either be null or a function");e.prototype=Object.create(t&&t.prototype,{constructor:{value:e,writable:!0,configurable:!0}}),Object.defineProperty(e,"prototype",{writable:!1}),t&&d(e,t)}(n,t),function(e,t,n){t&&u(e.prototype,t);n&&u(e,n);return Object.defineProperty(e,"prototype",{writable:!1}),e}(n,[{key:"connectedCallback",value:function(){var e,t,n;null===(e=this._widget)||void 0===e||null===(t=e.connectedCallback)||void 0===t||t.call(e,{shadow:this._shadow,customElement:this}),null==i||null===(n=i.connectedCallback)||void 0===n||n.call(i,this._widget,{shadow:this._shadow,customElement:this})}},{key:"disconnectedCallback",value:function(){var e,t,n;null===(e=this._widget)||void 0===e||null===(t=e.disconnectedCallback)||void 0===t||t.call(e,{shadow:this._shadow,customElement:this}),null==i||null===(n=i.disconnectedCallback)||void 0===n||n.call(i,this._widget,{shadow:this._shadow,customElement:this})}},{key:"adoptedCallback",value:function(){var e,t,n;null===(e=this._widget)||void 0===e||null===(t=e.adoptedCallback)||void 0===t||t.call(e,{shadow:this._shadow,customElement:this}),null==i||null===(n=i.adoptedCallback)||void 0===n||n.call(i,this._widget,{shadow:this._shadow,customElement:this})}},{key:"attributeChangedCallback",value:function(e,t,n){var o,r,l;null===(o=this._widget)||void 0===o||null===(r=o.attributeChangedCallback)||void 0===r||r.call(o,this._widget,e,t,n,{shadow:this._shadow,customElement:this}),null==i||null===(l=i.attributeChangedCallback)||void 0===l||l.call(i,this._widget,e,t,n,{shadow:this._shadow,customElement:this})}}])}(a(HTMLElement));void 0===customElements.get(r.name)&&customElements.define(r.name,l)};var m=["__proto__","prototype","constructor"];function b(e,t){var n=function(e){return!!e&&e.constructor===Object};return n(e)&&n(t)?(Object.keys(t).forEach((function(o){if(!m.includes(o)){var r=e[o],i=t[o];Array.isArray(r)&&Array.isArray(i)?e[o]=r.concat(i):n(r)&&n(i)?e[o]=b(Object.assign({},r),i):e[o]=i}})),e):t}}));
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@merkur/integration-custom-element",
|
|
3
|
-
"version": "0.
|
|
3
|
+
"version": "0.36.0",
|
|
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.36.0",
|
|
54
|
+
"@merkur/integration": "^0.36.0"
|
|
55
55
|
},
|
|
56
56
|
"peerDependencies": {
|
|
57
57
|
"@merkur/core": "*",
|
|
58
58
|
"@merkur/integration": "*"
|
|
59
59
|
},
|
|
60
|
-
"gitHead": "
|
|
60
|
+
"gitHead": "2471f91d8249ae75e49b2a0da8d0deb93062f014"
|
|
61
61
|
}
|