@mgdis/mg-components 4.2.0 → 5.0.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/dist/cjs/{index-64cee0c8.js → index-94497267.js} +220 -202
- package/dist/cjs/loader.cjs.js +3 -3
- package/dist/cjs/{mg-badge_23.cjs.entry.js → mg-badge_24.cjs.entry.js} +2028 -26
- package/dist/cjs/mg-components.cjs.js +3 -3
- package/dist/cjs/mg-modal.cjs.entry.js +6 -2
- package/dist/collection/collection-manifest.json +1 -1
- package/dist/collection/components/atoms/mg-button/doc/mg-button.stories.js +0 -2
- package/dist/collection/components/atoms/mg-button/mg-button.css +106 -68
- package/dist/collection/components/atoms/mg-button/mg-button.js +51 -64
- package/dist/collection/components/atoms/mg-icon/mg-icon.conf.js +3 -0
- package/dist/collection/components/atoms/mg-tooltip/mg-tooltip.js +3 -3
- package/dist/collection/components/molecules/inputs/mg-input-numeric/mg-input-numeric.js +1 -1
- package/dist/collection/components/molecules/mg-form/mg-form.js +2 -3
- package/dist/collection/components/molecules/mg-illustrated-message/doc/mg-illustrated-message.stories.js +2 -1
- package/dist/collection/components/molecules/mg-illustrated-message/mg-illustrated-message.css +15 -7
- package/dist/collection/components/molecules/mg-illustrated-message/mg-illustrated-message.js +27 -2
- package/dist/collection/components/molecules/mg-modal/doc/mg-modal.stories.js +1 -1
- package/dist/collection/components/molecules/mg-modal/mg-modal.css +2 -2
- package/dist/collection/components/molecules/mg-modal/mg-modal.js +4 -0
- package/dist/collection/components/molecules/mg-pagination/mg-pagination.js +4 -3
- package/dist/collection/components/molecules/mg-panel/doc/mg-panel.stories.js +1 -1
- package/dist/collection/components/molecules/mg-panel/mg-panel.css +8 -7
- package/dist/collection/components/molecules/mg-panel/mg-panel.js +1 -1
- package/dist/collection/components/molecules/mg-popover/mg-popover.css +5 -7
- package/dist/collection/components/molecules/mg-popover/mg-popover.js +7 -8
- package/dist/collection/variables.css +6 -0
- package/dist/components/mg-button2.js +44 -13
- package/dist/components/mg-form.js +2 -3
- package/dist/components/mg-icon2.js +3 -0
- package/dist/components/mg-illustrated-message.js +12 -4
- package/dist/components/mg-input-numeric.js +1 -1
- package/dist/components/mg-modal.js +5 -1
- package/dist/components/mg-pagination.js +4 -3
- package/dist/components/mg-panel.js +2 -2
- package/dist/components/mg-popover.js +9 -9
- package/dist/components/mg-tooltip2.js +5 -4
- package/dist/components/popper.js +60 -49
- package/dist/esm/{index-120f47fd.js → index-aad0184c.js} +220 -202
- package/dist/esm/loader.js +3 -3
- package/dist/esm/{mg-badge_23.entry.js → mg-badge_24.entry.js} +2027 -26
- package/dist/esm/mg-components.js +3 -3
- package/dist/esm/mg-modal.entry.js +6 -2
- package/dist/esm/polyfills/css-shim.js +1 -1
- package/dist/mg-components/mg-components.css +1 -1
- package/dist/mg-components/mg-components.esm.js +1 -1
- package/dist/mg-components/p-3899d5d2.js +2 -0
- package/dist/mg-components/p-b60a4c53.entry.js +1 -0
- package/dist/mg-components/p-df947fa5.entry.js +1 -0
- package/dist/mg-components/variables.css +6 -0
- package/dist/types/components/atoms/mg-button/doc/mg-button.stories.d.ts +2 -2
- package/dist/types/components/atoms/mg-button/mg-button.conf.d.ts +5 -1
- package/dist/types/components/atoms/mg-button/mg-button.d.ts +19 -17
- package/dist/types/components/molecules/mg-illustrated-message/mg-illustrated-message.d.ts +4 -0
- package/dist/types/components/molecules/mg-modal/mg-modal.d.ts +1 -0
- package/dist/types/components/molecules/mg-pagination/mg-pagination.d.ts +1 -0
- package/dist/types/components.d.ts +13 -29
- package/dist/types/stencil-public-runtime.d.ts +15 -4
- package/package.json +2 -2
- package/dist/cjs/mg-popover.cjs.entry.js +0 -171
- package/dist/cjs/popper-71bf3058.js +0 -1790
- package/dist/collection/variables.scss +0 -212
- package/dist/esm/mg-popover.entry.js +0 -167
- package/dist/esm/popper-93ecb064.js +0 -1788
- package/dist/mg-components/p-21991be8.entry.js +0 -1
- package/dist/mg-components/p-36a64f8c.entry.js +0 -1
- package/dist/mg-components/p-4c66f794.js +0 -1
- package/dist/mg-components/p-7bc32a2f.js +0 -2
- package/dist/mg-components/p-b380a0df.entry.js +0 -1
- package/dist/mg-components/variables.scss +0 -212
|
@@ -1,5 +1,13 @@
|
|
|
1
1
|
const NAMESPACE = 'mg-components';
|
|
2
2
|
|
|
3
|
+
/**
|
|
4
|
+
* Virtual DOM patching algorithm based on Snabbdom by
|
|
5
|
+
* Simon Friis Vindum (@paldepind)
|
|
6
|
+
* Licensed under the MIT License
|
|
7
|
+
* https://github.com/snabbdom/snabbdom/blob/master/LICENSE
|
|
8
|
+
*
|
|
9
|
+
* Modified for Stencil's renderer and slot projection
|
|
10
|
+
*/
|
|
3
11
|
let scopeId;
|
|
4
12
|
let contentRef;
|
|
5
13
|
let hostTagName;
|
|
@@ -8,62 +16,6 @@ let checkSlotFallbackVisibility = false;
|
|
|
8
16
|
let checkSlotRelocate = false;
|
|
9
17
|
let isSvgMode = false;
|
|
10
18
|
let queuePending = false;
|
|
11
|
-
const win = typeof window !== 'undefined' ? window : {};
|
|
12
|
-
const doc = win.document || { head: {} };
|
|
13
|
-
const plt = {
|
|
14
|
-
$flags$: 0,
|
|
15
|
-
$resourcesUrl$: '',
|
|
16
|
-
jmp: (h) => h(),
|
|
17
|
-
raf: (h) => requestAnimationFrame(h),
|
|
18
|
-
ael: (el, eventName, listener, opts) => el.addEventListener(eventName, listener, opts),
|
|
19
|
-
rel: (el, eventName, listener, opts) => el.removeEventListener(eventName, listener, opts),
|
|
20
|
-
ce: (eventName, opts) => new CustomEvent(eventName, opts),
|
|
21
|
-
};
|
|
22
|
-
const promiseResolve = (v) => Promise.resolve(v);
|
|
23
|
-
const supportsConstructableStylesheets = /*@__PURE__*/ (() => {
|
|
24
|
-
try {
|
|
25
|
-
new CSSStyleSheet();
|
|
26
|
-
return typeof new CSSStyleSheet().replaceSync === 'function';
|
|
27
|
-
}
|
|
28
|
-
catch (e) { }
|
|
29
|
-
return false;
|
|
30
|
-
})()
|
|
31
|
-
;
|
|
32
|
-
const addHostEventListeners = (elm, hostRef, listeners, attachParentListeners) => {
|
|
33
|
-
if (listeners) {
|
|
34
|
-
listeners.map(([flags, name, method]) => {
|
|
35
|
-
const target = getHostListenerTarget(elm, flags) ;
|
|
36
|
-
const handler = hostListenerProxy(hostRef, method);
|
|
37
|
-
const opts = hostListenerOpts(flags);
|
|
38
|
-
plt.ael(target, name, handler, opts);
|
|
39
|
-
(hostRef.$rmListeners$ = hostRef.$rmListeners$ || []).push(() => plt.rel(target, name, handler, opts));
|
|
40
|
-
});
|
|
41
|
-
}
|
|
42
|
-
};
|
|
43
|
-
const hostListenerProxy = (hostRef, methodName) => (ev) => {
|
|
44
|
-
try {
|
|
45
|
-
{
|
|
46
|
-
if (hostRef.$flags$ & 256 /* HOST_FLAGS.isListenReady */) {
|
|
47
|
-
// instance is ready, let's call it's member method for this event
|
|
48
|
-
hostRef.$lazyInstance$[methodName](ev);
|
|
49
|
-
}
|
|
50
|
-
else {
|
|
51
|
-
(hostRef.$queuedListeners$ = hostRef.$queuedListeners$ || []).push([methodName, ev]);
|
|
52
|
-
}
|
|
53
|
-
}
|
|
54
|
-
}
|
|
55
|
-
catch (e) {
|
|
56
|
-
consoleError(e);
|
|
57
|
-
}
|
|
58
|
-
};
|
|
59
|
-
const getHostListenerTarget = (elm, flags) => {
|
|
60
|
-
if (flags & 8 /* LISTENER_FLAGS.TargetWindow */)
|
|
61
|
-
return win;
|
|
62
|
-
return elm;
|
|
63
|
-
};
|
|
64
|
-
// prettier-ignore
|
|
65
|
-
const hostListenerOpts = (flags) => (flags & 2 /* LISTENER_FLAGS.Capture */) !== 0;
|
|
66
|
-
const HYDRATED_CSS = '{visibility:hidden}.hydrated{visibility:inherit}';
|
|
67
19
|
const createTime = (fnName, tagName = '') => {
|
|
68
20
|
{
|
|
69
21
|
return () => {
|
|
@@ -78,79 +30,7 @@ const uniqueTime = (key, measureText) => {
|
|
|
78
30
|
};
|
|
79
31
|
}
|
|
80
32
|
};
|
|
81
|
-
const
|
|
82
|
-
const registerStyle = (scopeId, cssText, allowCS) => {
|
|
83
|
-
let style = styles.get(scopeId);
|
|
84
|
-
if (supportsConstructableStylesheets && allowCS) {
|
|
85
|
-
style = (style || new CSSStyleSheet());
|
|
86
|
-
if (typeof style === 'string') {
|
|
87
|
-
style = cssText;
|
|
88
|
-
}
|
|
89
|
-
else {
|
|
90
|
-
style.replaceSync(cssText);
|
|
91
|
-
}
|
|
92
|
-
}
|
|
93
|
-
else {
|
|
94
|
-
style = cssText;
|
|
95
|
-
}
|
|
96
|
-
styles.set(scopeId, style);
|
|
97
|
-
};
|
|
98
|
-
const addStyle = (styleContainerNode, cmpMeta, mode, hostElm) => {
|
|
99
|
-
let scopeId = getScopeId(cmpMeta);
|
|
100
|
-
const style = styles.get(scopeId);
|
|
101
|
-
// if an element is NOT connected then getRootNode() will return the wrong root node
|
|
102
|
-
// so the fallback is to always use the document for the root node in those cases
|
|
103
|
-
styleContainerNode = styleContainerNode.nodeType === 11 /* NODE_TYPE.DocumentFragment */ ? styleContainerNode : doc;
|
|
104
|
-
if (style) {
|
|
105
|
-
if (typeof style === 'string') {
|
|
106
|
-
styleContainerNode = styleContainerNode.head || styleContainerNode;
|
|
107
|
-
let appliedStyles = rootAppliedStyles.get(styleContainerNode);
|
|
108
|
-
let styleElm;
|
|
109
|
-
if (!appliedStyles) {
|
|
110
|
-
rootAppliedStyles.set(styleContainerNode, (appliedStyles = new Set()));
|
|
111
|
-
}
|
|
112
|
-
if (!appliedStyles.has(scopeId)) {
|
|
113
|
-
{
|
|
114
|
-
{
|
|
115
|
-
styleElm = doc.createElement('style');
|
|
116
|
-
styleElm.innerHTML = style;
|
|
117
|
-
}
|
|
118
|
-
styleContainerNode.insertBefore(styleElm, styleContainerNode.querySelector('link'));
|
|
119
|
-
}
|
|
120
|
-
if (appliedStyles) {
|
|
121
|
-
appliedStyles.add(scopeId);
|
|
122
|
-
}
|
|
123
|
-
}
|
|
124
|
-
}
|
|
125
|
-
else if (!styleContainerNode.adoptedStyleSheets.includes(style)) {
|
|
126
|
-
styleContainerNode.adoptedStyleSheets = [...styleContainerNode.adoptedStyleSheets, style];
|
|
127
|
-
}
|
|
128
|
-
}
|
|
129
|
-
return scopeId;
|
|
130
|
-
};
|
|
131
|
-
const attachStyles = (hostRef) => {
|
|
132
|
-
const cmpMeta = hostRef.$cmpMeta$;
|
|
133
|
-
const elm = hostRef.$hostElement$;
|
|
134
|
-
const flags = cmpMeta.$flags$;
|
|
135
|
-
const endAttachStyles = createTime('attachStyles', cmpMeta.$tagName$);
|
|
136
|
-
const scopeId = addStyle(elm.shadowRoot ? elm.shadowRoot : elm.getRootNode(), cmpMeta);
|
|
137
|
-
if (flags & 10 /* CMP_FLAGS.needsScopedEncapsulation */) {
|
|
138
|
-
// only required when we're NOT using native shadow dom (slot)
|
|
139
|
-
// or this browser doesn't support native shadow dom
|
|
140
|
-
// and this host element was NOT created with SSR
|
|
141
|
-
// let's pick out the inner content for slot projection
|
|
142
|
-
// create a node to represent where the original
|
|
143
|
-
// content was first placed, which is useful later on
|
|
144
|
-
// DOM WRITE!!
|
|
145
|
-
elm['s-sc'] = scopeId;
|
|
146
|
-
elm.classList.add(scopeId + '-h');
|
|
147
|
-
if (flags & 2 /* CMP_FLAGS.scopedCssEncapsulation */) {
|
|
148
|
-
elm.classList.add(scopeId + '-s');
|
|
149
|
-
}
|
|
150
|
-
}
|
|
151
|
-
endAttachStyles();
|
|
152
|
-
};
|
|
153
|
-
const getScopeId = (cmp, mode) => 'sc-' + (cmp.$tagName$);
|
|
33
|
+
const HYDRATED_CSS = '{visibility:hidden}.hydrated{visibility:inherit}';
|
|
154
34
|
/**
|
|
155
35
|
* Default style mode id
|
|
156
36
|
*/
|
|
@@ -288,6 +168,152 @@ const convertToPrivate = (node) => {
|
|
|
288
168
|
vnode.$name$ = node.vname;
|
|
289
169
|
return vnode;
|
|
290
170
|
};
|
|
171
|
+
/**
|
|
172
|
+
* Parse a new property value for a given property type.
|
|
173
|
+
*
|
|
174
|
+
* While the prop value can reasonably be expected to be of `any` type as far as TypeScript's type checker is concerned,
|
|
175
|
+
* it is not safe to assume that the string returned by evaluating `typeof propValue` matches:
|
|
176
|
+
* 1. `any`, the type given to `propValue` in the function signature
|
|
177
|
+
* 2. the type stored from `propType`.
|
|
178
|
+
*
|
|
179
|
+
* This function provides the capability to parse/coerce a property's value to potentially any other JavaScript type.
|
|
180
|
+
*
|
|
181
|
+
* Property values represented in TSX preserve their type information. In the example below, the number 0 is passed to
|
|
182
|
+
* a component. This `propValue` will preserve its type information (`typeof propValue === 'number'`). Note that is
|
|
183
|
+
* based on the type of the value being passed in, not the type declared of the class member decorated with `@Prop`.
|
|
184
|
+
* ```tsx
|
|
185
|
+
* <my-cmp prop-val={0}></my-cmp>
|
|
186
|
+
* ```
|
|
187
|
+
*
|
|
188
|
+
* HTML prop values on the other hand, will always a string
|
|
189
|
+
*
|
|
190
|
+
* @param propValue the new value to coerce to some type
|
|
191
|
+
* @param propType the type of the prop, expressed as a binary number
|
|
192
|
+
* @returns the parsed/coerced value
|
|
193
|
+
*/
|
|
194
|
+
const parsePropertyValue = (propValue, propType) => {
|
|
195
|
+
// ensure this value is of the correct prop type
|
|
196
|
+
if (propValue != null && !isComplexType(propValue)) {
|
|
197
|
+
if (propType & 4 /* MEMBER_FLAGS.Boolean */) {
|
|
198
|
+
// per the HTML spec, any string value means it is a boolean true value
|
|
199
|
+
// but we'll cheat here and say that the string "false" is the boolean false
|
|
200
|
+
return propValue === 'false' ? false : propValue === '' || !!propValue;
|
|
201
|
+
}
|
|
202
|
+
if (propType & 2 /* MEMBER_FLAGS.Number */) {
|
|
203
|
+
// force it to be a number
|
|
204
|
+
return parseFloat(propValue);
|
|
205
|
+
}
|
|
206
|
+
if (propType & 1 /* MEMBER_FLAGS.String */) {
|
|
207
|
+
// could have been passed as a number or boolean
|
|
208
|
+
// but we still want it as a string
|
|
209
|
+
return String(propValue);
|
|
210
|
+
}
|
|
211
|
+
// redundant return here for better minification
|
|
212
|
+
return propValue;
|
|
213
|
+
}
|
|
214
|
+
// not sure exactly what type we want
|
|
215
|
+
// so no need to change to a different type
|
|
216
|
+
return propValue;
|
|
217
|
+
};
|
|
218
|
+
const getElement = (ref) => (getHostRef(ref).$hostElement$ );
|
|
219
|
+
const createEvent = (ref, name, flags) => {
|
|
220
|
+
const elm = getElement(ref);
|
|
221
|
+
return {
|
|
222
|
+
emit: (detail) => {
|
|
223
|
+
return emitEvent(elm, name, {
|
|
224
|
+
bubbles: !!(flags & 4 /* EVENT_FLAGS.Bubbles */),
|
|
225
|
+
composed: !!(flags & 2 /* EVENT_FLAGS.Composed */),
|
|
226
|
+
cancelable: !!(flags & 1 /* EVENT_FLAGS.Cancellable */),
|
|
227
|
+
detail,
|
|
228
|
+
});
|
|
229
|
+
},
|
|
230
|
+
};
|
|
231
|
+
};
|
|
232
|
+
/**
|
|
233
|
+
* Helper function to create & dispatch a custom Event on a provided target
|
|
234
|
+
* @param elm the target of the Event
|
|
235
|
+
* @param name the name to give the custom Event
|
|
236
|
+
* @param opts options for configuring a custom Event
|
|
237
|
+
* @returns the custom Event
|
|
238
|
+
*/
|
|
239
|
+
const emitEvent = (elm, name, opts) => {
|
|
240
|
+
const ev = plt.ce(name, opts);
|
|
241
|
+
elm.dispatchEvent(ev);
|
|
242
|
+
return ev;
|
|
243
|
+
};
|
|
244
|
+
const rootAppliedStyles = /*@__PURE__*/ new WeakMap();
|
|
245
|
+
const registerStyle = (scopeId, cssText, allowCS) => {
|
|
246
|
+
let style = styles.get(scopeId);
|
|
247
|
+
if (supportsConstructableStylesheets && allowCS) {
|
|
248
|
+
style = (style || new CSSStyleSheet());
|
|
249
|
+
if (typeof style === 'string') {
|
|
250
|
+
style = cssText;
|
|
251
|
+
}
|
|
252
|
+
else {
|
|
253
|
+
style.replaceSync(cssText);
|
|
254
|
+
}
|
|
255
|
+
}
|
|
256
|
+
else {
|
|
257
|
+
style = cssText;
|
|
258
|
+
}
|
|
259
|
+
styles.set(scopeId, style);
|
|
260
|
+
};
|
|
261
|
+
const addStyle = (styleContainerNode, cmpMeta, mode, hostElm) => {
|
|
262
|
+
let scopeId = getScopeId(cmpMeta);
|
|
263
|
+
const style = styles.get(scopeId);
|
|
264
|
+
// if an element is NOT connected then getRootNode() will return the wrong root node
|
|
265
|
+
// so the fallback is to always use the document for the root node in those cases
|
|
266
|
+
styleContainerNode = styleContainerNode.nodeType === 11 /* NODE_TYPE.DocumentFragment */ ? styleContainerNode : doc;
|
|
267
|
+
if (style) {
|
|
268
|
+
if (typeof style === 'string') {
|
|
269
|
+
styleContainerNode = styleContainerNode.head || styleContainerNode;
|
|
270
|
+
let appliedStyles = rootAppliedStyles.get(styleContainerNode);
|
|
271
|
+
let styleElm;
|
|
272
|
+
if (!appliedStyles) {
|
|
273
|
+
rootAppliedStyles.set(styleContainerNode, (appliedStyles = new Set()));
|
|
274
|
+
}
|
|
275
|
+
if (!appliedStyles.has(scopeId)) {
|
|
276
|
+
{
|
|
277
|
+
{
|
|
278
|
+
styleElm = doc.createElement('style');
|
|
279
|
+
styleElm.innerHTML = style;
|
|
280
|
+
}
|
|
281
|
+
styleContainerNode.insertBefore(styleElm, styleContainerNode.querySelector('link'));
|
|
282
|
+
}
|
|
283
|
+
if (appliedStyles) {
|
|
284
|
+
appliedStyles.add(scopeId);
|
|
285
|
+
}
|
|
286
|
+
}
|
|
287
|
+
}
|
|
288
|
+
else if (!styleContainerNode.adoptedStyleSheets.includes(style)) {
|
|
289
|
+
styleContainerNode.adoptedStyleSheets = [...styleContainerNode.adoptedStyleSheets, style];
|
|
290
|
+
}
|
|
291
|
+
}
|
|
292
|
+
return scopeId;
|
|
293
|
+
};
|
|
294
|
+
const attachStyles = (hostRef) => {
|
|
295
|
+
const cmpMeta = hostRef.$cmpMeta$;
|
|
296
|
+
const elm = hostRef.$hostElement$;
|
|
297
|
+
const flags = cmpMeta.$flags$;
|
|
298
|
+
const endAttachStyles = createTime('attachStyles', cmpMeta.$tagName$);
|
|
299
|
+
const scopeId = addStyle(elm.shadowRoot ? elm.shadowRoot : elm.getRootNode(), cmpMeta);
|
|
300
|
+
if (flags & 10 /* CMP_FLAGS.needsScopedEncapsulation */) {
|
|
301
|
+
// only required when we're NOT using native shadow dom (slot)
|
|
302
|
+
// or this browser doesn't support native shadow dom
|
|
303
|
+
// and this host element was NOT created with SSR
|
|
304
|
+
// let's pick out the inner content for slot projection
|
|
305
|
+
// create a node to represent where the original
|
|
306
|
+
// content was first placed, which is useful later on
|
|
307
|
+
// DOM WRITE!!
|
|
308
|
+
elm['s-sc'] = scopeId;
|
|
309
|
+
elm.classList.add(scopeId + '-h');
|
|
310
|
+
if (flags & 2 /* CMP_FLAGS.scopedCssEncapsulation */) {
|
|
311
|
+
elm.classList.add(scopeId + '-s');
|
|
312
|
+
}
|
|
313
|
+
}
|
|
314
|
+
endAttachStyles();
|
|
315
|
+
};
|
|
316
|
+
const getScopeId = (cmp, mode) => 'sc-' + (cmp.$tagName$);
|
|
291
317
|
/**
|
|
292
318
|
* Production setAccessor() function based on Preact by
|
|
293
319
|
* Jason Miller (@developit)
|
|
@@ -1150,32 +1176,6 @@ const renderVdom = (hostRef, renderFnResults) => {
|
|
|
1150
1176
|
relocateNodes.length = 0;
|
|
1151
1177
|
}
|
|
1152
1178
|
};
|
|
1153
|
-
const getElement = (ref) => (getHostRef(ref).$hostElement$ );
|
|
1154
|
-
const createEvent = (ref, name, flags) => {
|
|
1155
|
-
const elm = getElement(ref);
|
|
1156
|
-
return {
|
|
1157
|
-
emit: (detail) => {
|
|
1158
|
-
return emitEvent(elm, name, {
|
|
1159
|
-
bubbles: !!(flags & 4 /* EVENT_FLAGS.Bubbles */),
|
|
1160
|
-
composed: !!(flags & 2 /* EVENT_FLAGS.Composed */),
|
|
1161
|
-
cancelable: !!(flags & 1 /* EVENT_FLAGS.Cancellable */),
|
|
1162
|
-
detail,
|
|
1163
|
-
});
|
|
1164
|
-
},
|
|
1165
|
-
};
|
|
1166
|
-
};
|
|
1167
|
-
/**
|
|
1168
|
-
* Helper function to create & dispatch a custom Event on a provided target
|
|
1169
|
-
* @param elm the target of the Event
|
|
1170
|
-
* @param name the name to give the custom Event
|
|
1171
|
-
* @param opts options for configuring a custom Event
|
|
1172
|
-
* @returns the custom Event
|
|
1173
|
-
*/
|
|
1174
|
-
const emitEvent = (elm, name, opts) => {
|
|
1175
|
-
const ev = plt.ce(name, opts);
|
|
1176
|
-
elm.dispatchEvent(ev);
|
|
1177
|
-
return ev;
|
|
1178
|
-
};
|
|
1179
1179
|
const attachToAncestor = (hostRef, ancestorComponent) => {
|
|
1180
1180
|
if (ancestorComponent && !hostRef.$onRenderResolve$ && ancestorComponent['s-p']) {
|
|
1181
1181
|
ancestorComponent['s-p'].push(new Promise((r) => (hostRef.$onRenderResolve$ = r)));
|
|
@@ -1347,53 +1347,6 @@ const then = (promise, thenFn) => {
|
|
|
1347
1347
|
};
|
|
1348
1348
|
const addHydratedFlag = (elm) => elm.classList.add('hydrated')
|
|
1349
1349
|
;
|
|
1350
|
-
/**
|
|
1351
|
-
* Parse a new property value for a given property type.
|
|
1352
|
-
*
|
|
1353
|
-
* While the prop value can reasonably be expected to be of `any` type as far as TypeScript's type checker is concerned,
|
|
1354
|
-
* it is not safe to assume that the string returned by evaluating `typeof propValue` matches:
|
|
1355
|
-
* 1. `any`, the type given to `propValue` in the function signature
|
|
1356
|
-
* 2. the type stored from `propType`.
|
|
1357
|
-
*
|
|
1358
|
-
* This function provides the capability to parse/coerce a property's value to potentially any other JavaScript type.
|
|
1359
|
-
*
|
|
1360
|
-
* Property values represented in TSX preserve their type information. In the example below, the number 0 is passed to
|
|
1361
|
-
* a component. This `propValue` will preserve its type information (`typeof propValue === 'number'`). Note that is
|
|
1362
|
-
* based on the type of the value being passed in, not the type declared of the class member decorated with `@Prop`.
|
|
1363
|
-
* ```tsx
|
|
1364
|
-
* <my-cmp prop-val={0}></my-cmp>
|
|
1365
|
-
* ```
|
|
1366
|
-
*
|
|
1367
|
-
* HTML prop values on the other hand, will always a string
|
|
1368
|
-
*
|
|
1369
|
-
* @param propValue the new value to coerce to some type
|
|
1370
|
-
* @param propType the type of the prop, expressed as a binary number
|
|
1371
|
-
* @returns the parsed/coerced value
|
|
1372
|
-
*/
|
|
1373
|
-
const parsePropertyValue = (propValue, propType) => {
|
|
1374
|
-
// ensure this value is of the correct prop type
|
|
1375
|
-
if (propValue != null && !isComplexType(propValue)) {
|
|
1376
|
-
if (propType & 4 /* MEMBER_FLAGS.Boolean */) {
|
|
1377
|
-
// per the HTML spec, any string value means it is a boolean true value
|
|
1378
|
-
// but we'll cheat here and say that the string "false" is the boolean false
|
|
1379
|
-
return propValue === 'false' ? false : propValue === '' || !!propValue;
|
|
1380
|
-
}
|
|
1381
|
-
if (propType & 2 /* MEMBER_FLAGS.Number */) {
|
|
1382
|
-
// force it to be a number
|
|
1383
|
-
return parseFloat(propValue);
|
|
1384
|
-
}
|
|
1385
|
-
if (propType & 1 /* MEMBER_FLAGS.String */) {
|
|
1386
|
-
// could have been passed as a number or boolean
|
|
1387
|
-
// but we still want it as a string
|
|
1388
|
-
return String(propValue);
|
|
1389
|
-
}
|
|
1390
|
-
// redundant return here for better minification
|
|
1391
|
-
return propValue;
|
|
1392
|
-
}
|
|
1393
|
-
// not sure exactly what type we want
|
|
1394
|
-
// so no need to change to a different type
|
|
1395
|
-
return propValue;
|
|
1396
|
-
};
|
|
1397
1350
|
const getValue = (ref, propName) => getHostRef(ref).$instanceValues$.get(propName);
|
|
1398
1351
|
const setValue = (ref, propName, newVal, cmpMeta) => {
|
|
1399
1352
|
// check our new property value against our internal value
|
|
@@ -1437,6 +1390,16 @@ const setValue = (ref, propName, newVal, cmpMeta) => {
|
|
|
1437
1390
|
}
|
|
1438
1391
|
}
|
|
1439
1392
|
};
|
|
1393
|
+
/**
|
|
1394
|
+
* Attach a series of runtime constructs to a compiled Stencil component
|
|
1395
|
+
* constructor, including getters and setters for the `@Prop` and `@State`
|
|
1396
|
+
* decorators, callbacks for when attributes change, and so on.
|
|
1397
|
+
*
|
|
1398
|
+
* @param Cstr the constructor for a component that we need to process
|
|
1399
|
+
* @param cmpMeta metadata collected previously about the component
|
|
1400
|
+
* @param flags a number used to store a series of bit flags
|
|
1401
|
+
* @returns a reference to the same constructor passed in (but now mutated)
|
|
1402
|
+
*/
|
|
1440
1403
|
const proxyComponent = (Cstr, cmpMeta, flags) => {
|
|
1441
1404
|
if (cmpMeta.$members$) {
|
|
1442
1405
|
if (Cstr.watchers) {
|
|
@@ -1796,6 +1759,40 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
|
|
|
1796
1759
|
// Fallback appLoad event
|
|
1797
1760
|
endBootstrap();
|
|
1798
1761
|
};
|
|
1762
|
+
const addHostEventListeners = (elm, hostRef, listeners, attachParentListeners) => {
|
|
1763
|
+
if (listeners) {
|
|
1764
|
+
listeners.map(([flags, name, method]) => {
|
|
1765
|
+
const target = getHostListenerTarget(elm, flags) ;
|
|
1766
|
+
const handler = hostListenerProxy(hostRef, method);
|
|
1767
|
+
const opts = hostListenerOpts(flags);
|
|
1768
|
+
plt.ael(target, name, handler, opts);
|
|
1769
|
+
(hostRef.$rmListeners$ = hostRef.$rmListeners$ || []).push(() => plt.rel(target, name, handler, opts));
|
|
1770
|
+
});
|
|
1771
|
+
}
|
|
1772
|
+
};
|
|
1773
|
+
const hostListenerProxy = (hostRef, methodName) => (ev) => {
|
|
1774
|
+
try {
|
|
1775
|
+
{
|
|
1776
|
+
if (hostRef.$flags$ & 256 /* HOST_FLAGS.isListenReady */) {
|
|
1777
|
+
// instance is ready, let's call it's member method for this event
|
|
1778
|
+
hostRef.$lazyInstance$[methodName](ev);
|
|
1779
|
+
}
|
|
1780
|
+
else {
|
|
1781
|
+
(hostRef.$queuedListeners$ = hostRef.$queuedListeners$ || []).push([methodName, ev]);
|
|
1782
|
+
}
|
|
1783
|
+
}
|
|
1784
|
+
}
|
|
1785
|
+
catch (e) {
|
|
1786
|
+
consoleError(e);
|
|
1787
|
+
}
|
|
1788
|
+
};
|
|
1789
|
+
const getHostListenerTarget = (elm, flags) => {
|
|
1790
|
+
if (flags & 8 /* LISTENER_FLAGS.TargetWindow */)
|
|
1791
|
+
return win;
|
|
1792
|
+
return elm;
|
|
1793
|
+
};
|
|
1794
|
+
// prettier-ignore
|
|
1795
|
+
const hostListenerOpts = (flags) => (flags & 2 /* LISTENER_FLAGS.Capture */) !== 0;
|
|
1799
1796
|
const hostRefs = /*@__PURE__*/ new WeakMap();
|
|
1800
1797
|
const getHostRef = (ref) => hostRefs.get(ref);
|
|
1801
1798
|
const registerInstance = (lazyInstance, hostRef) => hostRefs.set((hostRef.$lazyInstance$ = lazyInstance), hostRef);
|
|
@@ -1842,6 +1839,27 @@ const loadModule = (cmpMeta, hostRef, hmrVersionId) => {
|
|
|
1842
1839
|
}, consoleError);
|
|
1843
1840
|
};
|
|
1844
1841
|
const styles = /*@__PURE__*/ new Map();
|
|
1842
|
+
const win = typeof window !== 'undefined' ? window : {};
|
|
1843
|
+
const doc = win.document || { head: {} };
|
|
1844
|
+
const plt = {
|
|
1845
|
+
$flags$: 0,
|
|
1846
|
+
$resourcesUrl$: '',
|
|
1847
|
+
jmp: (h) => h(),
|
|
1848
|
+
raf: (h) => requestAnimationFrame(h),
|
|
1849
|
+
ael: (el, eventName, listener, opts) => el.addEventListener(eventName, listener, opts),
|
|
1850
|
+
rel: (el, eventName, listener, opts) => el.removeEventListener(eventName, listener, opts),
|
|
1851
|
+
ce: (eventName, opts) => new CustomEvent(eventName, opts),
|
|
1852
|
+
};
|
|
1853
|
+
const promiseResolve = (v) => Promise.resolve(v);
|
|
1854
|
+
const supportsConstructableStylesheets = /*@__PURE__*/ (() => {
|
|
1855
|
+
try {
|
|
1856
|
+
new CSSStyleSheet();
|
|
1857
|
+
return typeof new CSSStyleSheet().replaceSync === 'function';
|
|
1858
|
+
}
|
|
1859
|
+
catch (e) { }
|
|
1860
|
+
return false;
|
|
1861
|
+
})()
|
|
1862
|
+
;
|
|
1845
1863
|
const queueDomReads = [];
|
|
1846
1864
|
const queueDomWrites = [];
|
|
1847
1865
|
const queueTask = (queue, write) => (cb) => {
|
package/dist/esm/loader.js
CHANGED
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { p as promiseResolve, b as bootstrapLazy } from './index-
|
|
1
|
+
import { p as promiseResolve, b as bootstrapLazy } from './index-aad0184c.js';
|
|
2
2
|
|
|
3
3
|
/*
|
|
4
|
-
Stencil Client Patch Esm v2.18.
|
|
4
|
+
Stencil Client Patch Esm v2.18.1 | MIT Licensed | https://stenciljs.com
|
|
5
5
|
*/
|
|
6
6
|
const patchEsm = () => {
|
|
7
7
|
return promiseResolve();
|
|
@@ -10,7 +10,7 @@ const patchEsm = () => {
|
|
|
10
10
|
const defineCustomElements = (win, options) => {
|
|
11
11
|
if (typeof window === 'undefined') return Promise.resolve();
|
|
12
12
|
return patchEsm().then(() => {
|
|
13
|
-
return bootstrapLazy([["mg-
|
|
13
|
+
return bootstrapLazy([["mg-badge_24",[[1,"mg-panel",{"identifier":[1],"panelTitle":[1025,"panel-title"],"titlePattern":[1025,"title-pattern"],"titlePatternErrorMessage":[1025,"title-pattern-error-message"],"expanded":[1028],"expandToggleDisabled":[1028,"expand-toggle-disabled"],"titleEditable":[4,"title-editable"],"classList":[32],"isEditing":[32],"updatedPanelTitle":[32]}],[1,"mg-pagination",{"identifier":[1],"label":[1025],"totalPages":[2,"total-pages"],"currentPage":[1538,"current-page"]}],[1,"mg-input-textarea",{"value":[1537],"identifier":[1],"name":[1],"label":[1],"labelOnTop":[4,"label-on-top"],"labelHide":[4,"label-hide"],"placeholder":[1],"maxlength":[2],"required":[4],"readonly":[4],"disabled":[4],"mgWidth":[8,"mg-width"],"pattern":[1],"patternErrorMessage":[1,"pattern-error-message"],"rows":[2],"tooltip":[1],"displayCharacterLeft":[4,"display-character-left"],"helpText":[1,"help-text"],"valid":[1028],"invalid":[1028],"resizable":[1],"classList":[32],"errorMessage":[32],"displayError":[64]}],[1,"mg-input-checkbox",{"value":[1040],"identifier":[1],"name":[1],"label":[1],"labelOnTop":[4,"label-on-top"],"labelHide":[4,"label-hide"],"inputVerticalList":[4,"input-vertical-list"],"required":[4],"readonly":[4],"disabled":[4],"tooltip":[1],"helpText":[1,"help-text"],"valid":[1028],"invalid":[1028],"classList":[32],"errorMessage":[32],"checkboxItems":[32],"displayError":[64]}],[1,"mg-input-date",{"value":[1537],"identifier":[1],"name":[1],"label":[1],"labelOnTop":[4,"label-on-top"],"labelHide":[4,"label-hide"],"required":[4],"readonly":[4],"disabled":[4],"tooltip":[1],"helpText":[1,"help-text"],"valid":[1028],"invalid":[1028],"min":[1],"max":[1],"classList":[32],"errorMessage":[32],"displayError":[64]}],[1,"mg-input-numeric",{"value":[1537],"identifier":[1],"name":[1],"label":[1],"labelOnTop":[4,"label-on-top"],"labelHide":[4,"label-hide"],"placeholder":[1],"required":[4],"readonly":[4],"disabled":[4],"mgWidth":[8,"mg-width"],"tooltip":[1],"helpText":[1,"help-text"],"type":[1],"currency":[1],"max":[2],"min":[2],"integerLength":[2,"integer-length"],"decimalLength":[2,"decimal-length"],"valid":[1028],"invalid":[1028],"classList":[32],"errorMessage":[32],"hasFocus":[32],"displayError":[64]}],[1,"mg-input-password",{"value":[1537],"identifier":[1],"name":[1],"label":[1],"labelOnTop":[4,"label-on-top"],"labelHide":[4,"label-hide"],"placeholder":[1],"required":[4],"readonly":[4],"disabled":[4],"mgWidth":[8,"mg-width"],"tooltip":[1],"helpText":[1,"help-text"],"valid":[1028],"invalid":[1028],"classList":[32],"errorMessage":[32],"displayError":[64]}],[1,"mg-input-radio",{"value":[1032],"items":[16],"identifier":[1],"name":[1],"label":[1],"labelOnTop":[4,"label-on-top"],"labelHide":[4,"label-hide"],"inputVerticalList":[4,"input-vertical-list"],"required":[4],"readonly":[4],"disabled":[4],"tooltip":[1],"helpText":[1,"help-text"],"valid":[1028],"invalid":[1028],"classList":[32],"errorMessage":[32],"options":[32],"displayError":[64]}],[1,"mg-input-toggle",{"value":[1032],"items":[16],"identifier":[1],"name":[1],"label":[1],"labelOnTop":[4,"label-on-top"],"labelHide":[4,"label-hide"],"isOnOff":[4,"is-on-off"],"isIcon":[4,"is-icon"],"readonly":[4],"disabled":[4],"tooltip":[1],"helpText":[1,"help-text"],"classList":[32],"options":[32],"checked":[32]}],[1,"mg-message",{"identifier":[1],"delay":[2],"variant":[1],"closeButton":[1028,"close-button"],"hide":[1028],"classList":[32],"hasActions":[32]}],[1,"mg-popover",{"identifier":[1],"placement":[1],"closeButton":[4,"close-button"],"display":[1028],"disabled":[1028]}],[1,"mg-tabs",{"identifier":[1],"label":[1],"size":[1],"items":[16],"activeTab":[1538,"active-tab"],"tabs":[32],"classList":[32]}],[1,"mg-details",{"toggleClosed":[1,"toggle-closed"],"toggleOpened":[1,"toggle-opened"],"expanded":[1028]}],[1,"mg-form",{"identifier":[1],"name":[1],"readonly":[4],"disabled":[4],"valid":[1028],"invalid":[1028],"classList":[32],"displayError":[64]}],[1,"mg-illustrated-message",{"size":[1],"direction":[1]}],[1,"mg-tag",{"variant":[1],"outline":[4],"classList":[32]}],[1,"mg-input-text",{"value":[1537],"identifier":[1],"name":[1],"label":[1],"type":[1],"icon":[1],"labelOnTop":[4,"label-on-top"],"labelHide":[4,"label-hide"],"placeholder":[1],"maxlength":[2],"required":[4],"readonly":[4],"disabled":[4],"mgWidth":[8,"mg-width"],"pattern":[1],"patternErrorMessage":[1,"pattern-error-message"],"tooltip":[1],"displayCharacterLeft":[4,"display-character-left"],"helpText":[1,"help-text"],"valid":[1028],"invalid":[1028],"classList":[32],"errorMessage":[32],"setFocus":[64],"displayError":[64]}],[1,"mg-input-select",{"value":[1032],"items":[16],"identifier":[1],"name":[1],"label":[1],"labelOnTop":[4,"label-on-top"],"labelHide":[4,"label-hide"],"placeholder":[1025],"placeholderHide":[4,"placeholder-hide"],"placeholderDisabled":[4,"placeholder-disabled"],"required":[4],"readonly":[4],"disabled":[4],"mgWidth":[8,"mg-width"],"tooltip":[1],"helpText":[1,"help-text"],"valid":[1028],"invalid":[1028],"classList":[32],"errorMessage":[32],"options":[32],"valueExist":[32],"readonlyValue":[32],"displayError":[64]}],[1,"mg-badge",{"value":[1032],"label":[1],"variant":[1],"outline":[4],"classList":[32]}],[2,"mg-character-left",{"identifier":[1],"characters":[1],"maxlength":[2]}],[1,"mg-button",{"variant":[1],"identifier":[1],"label":[1],"type":[1],"form":[1025],"disabled":[1028],"isIcon":[4,"is-icon"],"disableOnClick":[4,"disable-on-click"],"loading":[32],"classList":[32]}],[6,"mg-input-title",{"identifier":[1],"required":[4],"isLegend":[4,"is-legend"],"tagName":[32]}],[1,"mg-tooltip",{"identifier":[1],"message":[1],"placement":[1],"display":[1028],"disabled":[1028]}],[1,"mg-icon",{"icon":[1],"size":[1],"variant":[1],"spin":[4],"classList":[32]}]]],["mg-modal",[[1,"mg-modal",{"identifier":[1],"modalTitle":[1,"modal-title"],"closeButton":[1028,"close-button"],"hide":[1028],"hasActions":[32],"hasContent":[32],"classList":[32]},[[8,"keydown","handleKeyDown"]]]]]], options);
|
|
14
14
|
});
|
|
15
15
|
};
|
|
16
16
|
|