@everymatrix/lottery-game-details 0.0.3 → 0.1.4
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/helper-accordion_4.cjs.entry.js +167 -0
- package/dist/cjs/{index-94a620d7.js → index-9d95408f.js} +430 -14
- package/dist/cjs/loader.cjs.js +3 -3
- package/dist/cjs/lottery-game-details.cjs.js +3 -3
- package/dist/collection/collection-manifest.json +16 -2
- package/dist/components/helper-accordion.js +6 -0
- package/dist/components/helper-accordion2.js +115 -0
- package/dist/components/helper-tab.js +6 -0
- package/dist/components/helper-tab2.js +51 -0
- package/dist/components/helper-tabs.js +6 -0
- package/dist/components/helper-tabs2.js +62 -0
- package/dist/components/index.d.ts +5 -1
- package/dist/components/index.js +0 -1
- package/dist/components/lottery-game-details.js +19 -3
- package/dist/esm/helper-accordion_4.entry.js +160 -0
- package/dist/esm/{index-215cc33d.js → index-515a97dd.js} +429 -15
- package/dist/esm/loader.js +3 -3
- package/dist/esm/lottery-game-details.js +3 -3
- package/dist/lottery-game-details/lottery-game-details.esm.js +1 -1
- package/dist/lottery-game-details/p-703a43dd.js +1 -0
- package/dist/lottery-game-details/p-ea7da786.entry.js +1 -0
- package/package.json +1 -1
- package/dist/cjs/lottery-game-details.cjs.entry.js +0 -21
- package/dist/esm/lottery-game-details.entry.js +0 -17
- package/dist/lottery-game-details/p-3c694375.js +0 -2
- package/dist/lottery-game-details/p-9a006ef9.entry.js +0 -1
|
@@ -54,7 +54,7 @@ const registerStyle = (scopeId, cssText, allowCS) => {
|
|
|
54
54
|
};
|
|
55
55
|
const addStyle = (styleContainerNode, cmpMeta, mode, hostElm) => {
|
|
56
56
|
let scopeId = getScopeId(cmpMeta);
|
|
57
|
-
|
|
57
|
+
let style = styles.get(scopeId);
|
|
58
58
|
// if an element is NOT connected then getRootNode() will return the wrong root node
|
|
59
59
|
// so the fallback is to always use the document for the root node in those cases
|
|
60
60
|
styleContainerNode = styleContainerNode.nodeType === 11 /* DocumentFragment */ ? styleContainerNode : doc;
|
|
@@ -134,7 +134,7 @@ const h = (nodeName, vnodeData, ...children) => {
|
|
|
134
134
|
let child = null;
|
|
135
135
|
let simple = false;
|
|
136
136
|
let lastSimple = false;
|
|
137
|
-
|
|
137
|
+
let vNodeChildren = [];
|
|
138
138
|
const walk = (c) => {
|
|
139
139
|
for (let i = 0; i < c.length; i++) {
|
|
140
140
|
child = c[i];
|
|
@@ -158,6 +158,19 @@ const h = (nodeName, vnodeData, ...children) => {
|
|
|
158
158
|
}
|
|
159
159
|
};
|
|
160
160
|
walk(children);
|
|
161
|
+
if (vnodeData) {
|
|
162
|
+
{
|
|
163
|
+
const classData = vnodeData.className || vnodeData.class;
|
|
164
|
+
if (classData) {
|
|
165
|
+
vnodeData.class =
|
|
166
|
+
typeof classData !== 'object'
|
|
167
|
+
? classData
|
|
168
|
+
: Object.keys(classData)
|
|
169
|
+
.filter((k) => classData[k])
|
|
170
|
+
.join(' ');
|
|
171
|
+
}
|
|
172
|
+
}
|
|
173
|
+
}
|
|
161
174
|
const vnode = newVNode(nodeName, null);
|
|
162
175
|
vnode.$attrs$ = vnodeData;
|
|
163
176
|
if (vNodeChildren.length > 0) {
|
|
@@ -191,14 +204,60 @@ const isHost = (node) => node && node.$tag$ === Host;
|
|
|
191
204
|
const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
|
|
192
205
|
if (oldValue !== newValue) {
|
|
193
206
|
let isProp = isMemberInElement(elm, memberName);
|
|
194
|
-
memberName.toLowerCase();
|
|
195
|
-
{
|
|
207
|
+
let ln = memberName.toLowerCase();
|
|
208
|
+
if (memberName === 'class') {
|
|
209
|
+
const classList = elm.classList;
|
|
210
|
+
const oldClasses = parseClassList(oldValue);
|
|
211
|
+
const newClasses = parseClassList(newValue);
|
|
212
|
+
classList.remove(...oldClasses.filter((c) => c && !newClasses.includes(c)));
|
|
213
|
+
classList.add(...newClasses.filter((c) => c && !oldClasses.includes(c)));
|
|
214
|
+
}
|
|
215
|
+
else if ((!isProp ) &&
|
|
216
|
+
memberName[0] === 'o' &&
|
|
217
|
+
memberName[1] === 'n') {
|
|
218
|
+
// Event Handlers
|
|
219
|
+
// so if the member name starts with "on" and the 3rd characters is
|
|
220
|
+
// a capital letter, and it's not already a member on the element,
|
|
221
|
+
// then we're assuming it's an event listener
|
|
222
|
+
if (memberName[2] === '-') {
|
|
223
|
+
// on- prefixed events
|
|
224
|
+
// allows to be explicit about the dom event to listen without any magic
|
|
225
|
+
// under the hood:
|
|
226
|
+
// <my-cmp on-click> // listens for "click"
|
|
227
|
+
// <my-cmp on-Click> // listens for "Click"
|
|
228
|
+
// <my-cmp on-ionChange> // listens for "ionChange"
|
|
229
|
+
// <my-cmp on-EVENTS> // listens for "EVENTS"
|
|
230
|
+
memberName = memberName.slice(3);
|
|
231
|
+
}
|
|
232
|
+
else if (isMemberInElement(win, ln)) {
|
|
233
|
+
// standard event
|
|
234
|
+
// the JSX attribute could have been "onMouseOver" and the
|
|
235
|
+
// member name "onmouseover" is on the window's prototype
|
|
236
|
+
// so let's add the listener "mouseover", which is all lowercased
|
|
237
|
+
memberName = ln.slice(2);
|
|
238
|
+
}
|
|
239
|
+
else {
|
|
240
|
+
// custom event
|
|
241
|
+
// the JSX attribute could have been "onMyCustomEvent"
|
|
242
|
+
// so let's trim off the "on" prefix and lowercase the first character
|
|
243
|
+
// and add the listener "myCustomEvent"
|
|
244
|
+
// except for the first character, we keep the event name case
|
|
245
|
+
memberName = ln[2] + memberName.slice(3);
|
|
246
|
+
}
|
|
247
|
+
if (oldValue) {
|
|
248
|
+
plt.rel(elm, memberName, oldValue, false);
|
|
249
|
+
}
|
|
250
|
+
if (newValue) {
|
|
251
|
+
plt.ael(elm, memberName, newValue, false);
|
|
252
|
+
}
|
|
253
|
+
}
|
|
254
|
+
else {
|
|
196
255
|
// Set property if it exists and it's not a SVG
|
|
197
256
|
const isComplex = isComplexType(newValue);
|
|
198
257
|
if ((isProp || (isComplex && newValue !== null)) && !isSvg) {
|
|
199
258
|
try {
|
|
200
259
|
if (!elm.tagName.includes('-')) {
|
|
201
|
-
|
|
260
|
+
let n = newValue == null ? '' : newValue;
|
|
202
261
|
// Workaround for Safari, moving the <input> caret when re-assigning the same valued
|
|
203
262
|
if (memberName === 'list') {
|
|
204
263
|
isProp = false;
|
|
@@ -229,6 +288,8 @@ const setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
|
|
|
229
288
|
}
|
|
230
289
|
}
|
|
231
290
|
};
|
|
291
|
+
const parseClassListRegex = /\s/;
|
|
292
|
+
const parseClassList = (value) => (!value ? [] : value.split(parseClassListRegex));
|
|
232
293
|
const updateElement = (oldVnode, newVnode, isSvgMode, memberName) => {
|
|
233
294
|
// if the element passed in is a shadow root, which is a document fragment
|
|
234
295
|
// then we want to be adding attrs/props to the shadow root's "host" element
|
|
@@ -238,6 +299,14 @@ const updateElement = (oldVnode, newVnode, isSvgMode, memberName) => {
|
|
|
238
299
|
: newVnode.$elm$;
|
|
239
300
|
const oldVnodeAttrs = (oldVnode && oldVnode.$attrs$) || EMPTY_OBJ;
|
|
240
301
|
const newVnodeAttrs = newVnode.$attrs$ || EMPTY_OBJ;
|
|
302
|
+
{
|
|
303
|
+
// remove attributes no longer present on the vnode by setting them to undefined
|
|
304
|
+
for (memberName in oldVnodeAttrs) {
|
|
305
|
+
if (!(memberName in newVnodeAttrs)) {
|
|
306
|
+
setAccessor(elm, memberName, oldVnodeAttrs[memberName], undefined, isSvgMode, newVnode.$flags$);
|
|
307
|
+
}
|
|
308
|
+
}
|
|
309
|
+
}
|
|
241
310
|
// add new & update changed attributes
|
|
242
311
|
for (memberName in newVnodeAttrs) {
|
|
243
312
|
setAccessor(elm, memberName, oldVnodeAttrs[memberName], newVnodeAttrs[memberName], isSvgMode, newVnode.$flags$);
|
|
@@ -245,11 +314,15 @@ const updateElement = (oldVnode, newVnode, isSvgMode, memberName) => {
|
|
|
245
314
|
};
|
|
246
315
|
const createElm = (oldParentVNode, newParentVNode, childIndex, parentElm) => {
|
|
247
316
|
// tslint:disable-next-line: prefer-const
|
|
248
|
-
|
|
317
|
+
let newVNode = newParentVNode.$children$[childIndex];
|
|
249
318
|
let i = 0;
|
|
250
319
|
let elm;
|
|
251
320
|
let childNode;
|
|
252
|
-
{
|
|
321
|
+
if (newVNode.$text$ !== null) {
|
|
322
|
+
// create text node
|
|
323
|
+
elm = newVNode.$elm$ = doc.createTextNode(newVNode.$text$);
|
|
324
|
+
}
|
|
325
|
+
else {
|
|
253
326
|
// create element
|
|
254
327
|
elm = newVNode.$elm$ = (doc.createElement(newVNode.$tag$));
|
|
255
328
|
// add css classes, attrs, props, listeners, etc.
|
|
@@ -291,31 +364,141 @@ const addVnodes = (parentElm, before, parentVNode, vnodes, startIdx, endIdx) =>
|
|
|
291
364
|
}
|
|
292
365
|
}
|
|
293
366
|
};
|
|
367
|
+
const removeVnodes = (vnodes, startIdx, endIdx, vnode, elm) => {
|
|
368
|
+
for (; startIdx <= endIdx; ++startIdx) {
|
|
369
|
+
if ((vnode = vnodes[startIdx])) {
|
|
370
|
+
elm = vnode.$elm$;
|
|
371
|
+
// remove the vnode's element from the dom
|
|
372
|
+
elm.remove();
|
|
373
|
+
}
|
|
374
|
+
}
|
|
375
|
+
};
|
|
376
|
+
const updateChildren = (parentElm, oldCh, newVNode, newCh) => {
|
|
377
|
+
let oldStartIdx = 0;
|
|
378
|
+
let newStartIdx = 0;
|
|
379
|
+
let oldEndIdx = oldCh.length - 1;
|
|
380
|
+
let oldStartVnode = oldCh[0];
|
|
381
|
+
let oldEndVnode = oldCh[oldEndIdx];
|
|
382
|
+
let newEndIdx = newCh.length - 1;
|
|
383
|
+
let newStartVnode = newCh[0];
|
|
384
|
+
let newEndVnode = newCh[newEndIdx];
|
|
385
|
+
let node;
|
|
386
|
+
while (oldStartIdx <= oldEndIdx && newStartIdx <= newEndIdx) {
|
|
387
|
+
if (oldStartVnode == null) {
|
|
388
|
+
// Vnode might have been moved left
|
|
389
|
+
oldStartVnode = oldCh[++oldStartIdx];
|
|
390
|
+
}
|
|
391
|
+
else if (oldEndVnode == null) {
|
|
392
|
+
oldEndVnode = oldCh[--oldEndIdx];
|
|
393
|
+
}
|
|
394
|
+
else if (newStartVnode == null) {
|
|
395
|
+
newStartVnode = newCh[++newStartIdx];
|
|
396
|
+
}
|
|
397
|
+
else if (newEndVnode == null) {
|
|
398
|
+
newEndVnode = newCh[--newEndIdx];
|
|
399
|
+
}
|
|
400
|
+
else if (isSameVnode(oldStartVnode, newStartVnode)) {
|
|
401
|
+
patch(oldStartVnode, newStartVnode);
|
|
402
|
+
oldStartVnode = oldCh[++oldStartIdx];
|
|
403
|
+
newStartVnode = newCh[++newStartIdx];
|
|
404
|
+
}
|
|
405
|
+
else if (isSameVnode(oldEndVnode, newEndVnode)) {
|
|
406
|
+
patch(oldEndVnode, newEndVnode);
|
|
407
|
+
oldEndVnode = oldCh[--oldEndIdx];
|
|
408
|
+
newEndVnode = newCh[--newEndIdx];
|
|
409
|
+
}
|
|
410
|
+
else if (isSameVnode(oldStartVnode, newEndVnode)) {
|
|
411
|
+
patch(oldStartVnode, newEndVnode);
|
|
412
|
+
parentElm.insertBefore(oldStartVnode.$elm$, oldEndVnode.$elm$.nextSibling);
|
|
413
|
+
oldStartVnode = oldCh[++oldStartIdx];
|
|
414
|
+
newEndVnode = newCh[--newEndIdx];
|
|
415
|
+
}
|
|
416
|
+
else if (isSameVnode(oldEndVnode, newStartVnode)) {
|
|
417
|
+
patch(oldEndVnode, newStartVnode);
|
|
418
|
+
parentElm.insertBefore(oldEndVnode.$elm$, oldStartVnode.$elm$);
|
|
419
|
+
oldEndVnode = oldCh[--oldEndIdx];
|
|
420
|
+
newStartVnode = newCh[++newStartIdx];
|
|
421
|
+
}
|
|
422
|
+
else {
|
|
423
|
+
{
|
|
424
|
+
// new element
|
|
425
|
+
node = createElm(oldCh && oldCh[newStartIdx], newVNode, newStartIdx);
|
|
426
|
+
newStartVnode = newCh[++newStartIdx];
|
|
427
|
+
}
|
|
428
|
+
if (node) {
|
|
429
|
+
{
|
|
430
|
+
oldStartVnode.$elm$.parentNode.insertBefore(node, oldStartVnode.$elm$);
|
|
431
|
+
}
|
|
432
|
+
}
|
|
433
|
+
}
|
|
434
|
+
}
|
|
435
|
+
if (oldStartIdx > oldEndIdx) {
|
|
436
|
+
addVnodes(parentElm, newCh[newEndIdx + 1] == null ? null : newCh[newEndIdx + 1].$elm$, newVNode, newCh, newStartIdx, newEndIdx);
|
|
437
|
+
}
|
|
438
|
+
else if (newStartIdx > newEndIdx) {
|
|
439
|
+
removeVnodes(oldCh, oldStartIdx, oldEndIdx);
|
|
440
|
+
}
|
|
441
|
+
};
|
|
442
|
+
const isSameVnode = (vnode1, vnode2) => {
|
|
443
|
+
// compare if two vnode to see if they're "technically" the same
|
|
444
|
+
// need to have the same element tag, and same key to be the same
|
|
445
|
+
if (vnode1.$tag$ === vnode2.$tag$) {
|
|
446
|
+
return true;
|
|
447
|
+
}
|
|
448
|
+
return false;
|
|
449
|
+
};
|
|
294
450
|
const patch = (oldVNode, newVNode) => {
|
|
295
451
|
const elm = (newVNode.$elm$ = oldVNode.$elm$);
|
|
452
|
+
const oldChildren = oldVNode.$children$;
|
|
296
453
|
const newChildren = newVNode.$children$;
|
|
297
|
-
|
|
454
|
+
const tag = newVNode.$tag$;
|
|
455
|
+
const text = newVNode.$text$;
|
|
456
|
+
if (text === null) {
|
|
298
457
|
// element node
|
|
299
458
|
{
|
|
300
|
-
|
|
459
|
+
if (tag === 'slot')
|
|
460
|
+
;
|
|
461
|
+
else {
|
|
301
462
|
// either this is the first render of an element OR it's an update
|
|
302
463
|
// AND we already know it's possible it could have changed
|
|
303
464
|
// this updates the element's css classes, attrs, props, listeners, etc.
|
|
304
465
|
updateElement(oldVNode, newVNode, isSvgMode);
|
|
305
466
|
}
|
|
306
467
|
}
|
|
307
|
-
if (newChildren !== null) {
|
|
468
|
+
if (oldChildren !== null && newChildren !== null) {
|
|
469
|
+
// looks like there's child vnodes for both the old and new vnodes
|
|
470
|
+
updateChildren(elm, oldChildren, newVNode, newChildren);
|
|
471
|
+
}
|
|
472
|
+
else if (newChildren !== null) {
|
|
473
|
+
// no old child vnodes, but there are new child vnodes to add
|
|
474
|
+
if (oldVNode.$text$ !== null) {
|
|
475
|
+
// the old vnode was text, so be sure to clear it out
|
|
476
|
+
elm.textContent = '';
|
|
477
|
+
}
|
|
308
478
|
// add the new vnode children
|
|
309
479
|
addVnodes(elm, null, newVNode, newChildren, 0, newChildren.length - 1);
|
|
310
480
|
}
|
|
311
|
-
else
|
|
481
|
+
else if (oldChildren !== null) {
|
|
482
|
+
// no new child vnodes, but there are old child vnodes to remove
|
|
483
|
+
removeVnodes(oldChildren, 0, oldChildren.length - 1);
|
|
484
|
+
}
|
|
485
|
+
}
|
|
486
|
+
else if (oldVNode.$text$ !== text) {
|
|
487
|
+
// update the text content for the text only vnode
|
|
488
|
+
// and also only if the text is different than before
|
|
489
|
+
elm.data = text;
|
|
312
490
|
}
|
|
313
491
|
};
|
|
314
492
|
const renderVdom = (hostRef, renderFnResults) => {
|
|
315
493
|
const hostElm = hostRef.$hostElement$;
|
|
494
|
+
const cmpMeta = hostRef.$cmpMeta$;
|
|
316
495
|
const oldVNode = hostRef.$vnode$ || newVNode(null, null);
|
|
317
496
|
const rootVnode = isHost(renderFnResults) ? renderFnResults : h(null, null, renderFnResults);
|
|
318
497
|
hostTagName = hostElm.tagName;
|
|
498
|
+
if (cmpMeta.$attrsToReflect$) {
|
|
499
|
+
rootVnode.$attrs$ = rootVnode.$attrs$ || {};
|
|
500
|
+
cmpMeta.$attrsToReflect$.map(([propName, attribute]) => (rootVnode.$attrs$[attribute] = hostElm[propName]));
|
|
501
|
+
}
|
|
319
502
|
rootVnode.$tag$ = null;
|
|
320
503
|
rootVnode.$flags$ |= 4 /* isHost */;
|
|
321
504
|
hostRef.$vnode$ = rootVnode;
|
|
@@ -326,6 +509,20 @@ const renderVdom = (hostRef, renderFnResults) => {
|
|
|
326
509
|
// synchronous patch
|
|
327
510
|
patch(oldVNode, rootVnode);
|
|
328
511
|
};
|
|
512
|
+
const getElement = (ref) => (getHostRef(ref).$hostElement$ );
|
|
513
|
+
const createEvent = (ref, name, flags) => {
|
|
514
|
+
const elm = getElement(ref);
|
|
515
|
+
return {
|
|
516
|
+
emit: (detail) => {
|
|
517
|
+
return emitEvent(elm, name, {
|
|
518
|
+
bubbles: !!(flags & 4 /* Bubbles */),
|
|
519
|
+
composed: !!(flags & 2 /* Composed */),
|
|
520
|
+
cancelable: !!(flags & 1 /* Cancellable */),
|
|
521
|
+
detail,
|
|
522
|
+
});
|
|
523
|
+
},
|
|
524
|
+
};
|
|
525
|
+
};
|
|
329
526
|
/**
|
|
330
527
|
* Helper function to create & dispatch a custom Event on a provided target
|
|
331
528
|
* @param elm the target of the Event
|
|
@@ -344,6 +541,9 @@ const attachToAncestor = (hostRef, ancestorComponent) => {
|
|
|
344
541
|
}
|
|
345
542
|
};
|
|
346
543
|
const scheduleUpdate = (hostRef, isInitialLoad) => {
|
|
544
|
+
{
|
|
545
|
+
hostRef.$flags$ |= 16 /* isQueuedForUpdate */;
|
|
546
|
+
}
|
|
347
547
|
if (hostRef.$flags$ & 4 /* isWaitingForChildren */) {
|
|
348
548
|
hostRef.$flags$ |= 512 /* needsRerender */;
|
|
349
549
|
return;
|
|
@@ -400,6 +600,9 @@ const updateComponent = async (hostRef, instance, isInitialLoad) => {
|
|
|
400
600
|
const callRender = (hostRef, instance, elm) => {
|
|
401
601
|
try {
|
|
402
602
|
instance = instance.render() ;
|
|
603
|
+
{
|
|
604
|
+
hostRef.$flags$ &= ~16 /* isQueuedForUpdate */;
|
|
605
|
+
}
|
|
403
606
|
{
|
|
404
607
|
hostRef.$flags$ |= 2 /* hasRendered */;
|
|
405
608
|
}
|
|
@@ -465,12 +668,185 @@ const appDidLoad = (who) => {
|
|
|
465
668
|
}
|
|
466
669
|
nextTick(() => emitEvent(win, 'appload', { detail: { namespace: NAMESPACE } }));
|
|
467
670
|
};
|
|
671
|
+
const safeCall = (instance, method, arg) => {
|
|
672
|
+
if (instance && instance[method]) {
|
|
673
|
+
try {
|
|
674
|
+
return instance[method](arg);
|
|
675
|
+
}
|
|
676
|
+
catch (e) {
|
|
677
|
+
consoleError(e);
|
|
678
|
+
}
|
|
679
|
+
}
|
|
680
|
+
return undefined;
|
|
681
|
+
};
|
|
468
682
|
const then = (promise, thenFn) => {
|
|
469
683
|
return promise && promise.then ? promise.then(thenFn) : thenFn();
|
|
470
684
|
};
|
|
471
685
|
const addHydratedFlag = (elm) => elm.classList.add('hydrated')
|
|
472
686
|
;
|
|
687
|
+
/**
|
|
688
|
+
* Parse a new property value for a given property type.
|
|
689
|
+
*
|
|
690
|
+
* While the prop value can reasonably be expected to be of `any` type as far as TypeScript's type checker is concerned,
|
|
691
|
+
* it is not safe to assume that the string returned by evaluating `typeof propValue` matches:
|
|
692
|
+
* 1. `any`, the type given to `propValue` in the function signature
|
|
693
|
+
* 2. the type stored from `propType`.
|
|
694
|
+
*
|
|
695
|
+
* This function provides the capability to parse/coerce a property's value to potentially any other JavaScript type.
|
|
696
|
+
*
|
|
697
|
+
* Property values represented in TSX preserve their type information. In the example below, the number 0 is passed to
|
|
698
|
+
* a component. This `propValue` will preserve its type information (`typeof propValue === 'number'`). Note that is
|
|
699
|
+
* based on the type of the value being passed in, not the type declared of the class member decorated with `@Prop`.
|
|
700
|
+
* ```tsx
|
|
701
|
+
* <my-cmp prop-val={0}></my-cmp>
|
|
702
|
+
* ```
|
|
703
|
+
*
|
|
704
|
+
* HTML prop values on the other hand, will always a string
|
|
705
|
+
*
|
|
706
|
+
* @param propValue the new value to coerce to some type
|
|
707
|
+
* @param propType the type of the prop, expressed as a binary number
|
|
708
|
+
* @returns the parsed/coerced value
|
|
709
|
+
*/
|
|
710
|
+
const parsePropertyValue = (propValue, propType) => {
|
|
711
|
+
// ensure this value is of the correct prop type
|
|
712
|
+
if (propValue != null && !isComplexType(propValue)) {
|
|
713
|
+
if (propType & 4 /* Boolean */) {
|
|
714
|
+
// per the HTML spec, any string value means it is a boolean true value
|
|
715
|
+
// but we'll cheat here and say that the string "false" is the boolean false
|
|
716
|
+
return propValue === 'false' ? false : propValue === '' || !!propValue;
|
|
717
|
+
}
|
|
718
|
+
if (propType & 2 /* Number */) {
|
|
719
|
+
// force it to be a number
|
|
720
|
+
return parseFloat(propValue);
|
|
721
|
+
}
|
|
722
|
+
if (propType & 1 /* String */) {
|
|
723
|
+
// could have been passed as a number or boolean
|
|
724
|
+
// but we still want it as a string
|
|
725
|
+
return String(propValue);
|
|
726
|
+
}
|
|
727
|
+
// redundant return here for better minification
|
|
728
|
+
return propValue;
|
|
729
|
+
}
|
|
730
|
+
// not sure exactly what type we want
|
|
731
|
+
// so no need to change to a different type
|
|
732
|
+
return propValue;
|
|
733
|
+
};
|
|
734
|
+
const getValue = (ref, propName) => getHostRef(ref).$instanceValues$.get(propName);
|
|
735
|
+
const setValue = (ref, propName, newVal, cmpMeta) => {
|
|
736
|
+
// check our new property value against our internal value
|
|
737
|
+
const hostRef = getHostRef(ref);
|
|
738
|
+
const oldVal = hostRef.$instanceValues$.get(propName);
|
|
739
|
+
const flags = hostRef.$flags$;
|
|
740
|
+
const instance = hostRef.$lazyInstance$ ;
|
|
741
|
+
newVal = parsePropertyValue(newVal, cmpMeta.$members$[propName][0]);
|
|
742
|
+
// explicitly check for NaN on both sides, as `NaN === NaN` is always false
|
|
743
|
+
const areBothNaN = Number.isNaN(oldVal) && Number.isNaN(newVal);
|
|
744
|
+
const didValueChange = newVal !== oldVal && !areBothNaN;
|
|
745
|
+
if ((!(flags & 8 /* isConstructingInstance */) || oldVal === undefined) && didValueChange) {
|
|
746
|
+
// gadzooks! the property's value has changed!!
|
|
747
|
+
// set our new value!
|
|
748
|
+
hostRef.$instanceValues$.set(propName, newVal);
|
|
749
|
+
if (instance) {
|
|
750
|
+
if ((flags & (2 /* hasRendered */ | 16 /* isQueuedForUpdate */)) === 2 /* hasRendered */) {
|
|
751
|
+
// looks like this value actually changed, so we've got work to do!
|
|
752
|
+
// but only if we've already rendered, otherwise just chill out
|
|
753
|
+
// queue that we need to do an update, but don't worry about queuing
|
|
754
|
+
// up millions cuz this function ensures it only runs once
|
|
755
|
+
scheduleUpdate(hostRef, false);
|
|
756
|
+
}
|
|
757
|
+
}
|
|
758
|
+
}
|
|
759
|
+
};
|
|
473
760
|
const proxyComponent = (Cstr, cmpMeta, flags) => {
|
|
761
|
+
if (cmpMeta.$members$) {
|
|
762
|
+
// It's better to have a const than two Object.entries()
|
|
763
|
+
const members = Object.entries(cmpMeta.$members$);
|
|
764
|
+
const prototype = Cstr.prototype;
|
|
765
|
+
members.map(([memberName, [memberFlags]]) => {
|
|
766
|
+
if ((memberFlags & 31 /* Prop */ ||
|
|
767
|
+
((flags & 2 /* proxyState */) && memberFlags & 32 /* State */))) {
|
|
768
|
+
// proxyComponent - prop
|
|
769
|
+
Object.defineProperty(prototype, memberName, {
|
|
770
|
+
get() {
|
|
771
|
+
// proxyComponent, get value
|
|
772
|
+
return getValue(this, memberName);
|
|
773
|
+
},
|
|
774
|
+
set(newValue) {
|
|
775
|
+
// proxyComponent, set value
|
|
776
|
+
setValue(this, memberName, newValue, cmpMeta);
|
|
777
|
+
},
|
|
778
|
+
configurable: true,
|
|
779
|
+
enumerable: true,
|
|
780
|
+
});
|
|
781
|
+
}
|
|
782
|
+
});
|
|
783
|
+
if ((flags & 1 /* isElementConstructor */)) {
|
|
784
|
+
const attrNameToPropName = new Map();
|
|
785
|
+
prototype.attributeChangedCallback = function (attrName, _oldValue, newValue) {
|
|
786
|
+
plt.jmp(() => {
|
|
787
|
+
const propName = attrNameToPropName.get(attrName);
|
|
788
|
+
// In a web component lifecycle the attributeChangedCallback runs prior to connectedCallback
|
|
789
|
+
// in the case where an attribute was set inline.
|
|
790
|
+
// ```html
|
|
791
|
+
// <my-component some-attribute="some-value"></my-component>
|
|
792
|
+
// ```
|
|
793
|
+
//
|
|
794
|
+
// There is an edge case where a developer sets the attribute inline on a custom element and then
|
|
795
|
+
// programmatically changes it before it has been upgraded as shown below:
|
|
796
|
+
//
|
|
797
|
+
// ```html
|
|
798
|
+
// <!-- this component has _not_ been upgraded yet -->
|
|
799
|
+
// <my-component id="test" some-attribute="some-value"></my-component>
|
|
800
|
+
// <script>
|
|
801
|
+
// // grab non-upgraded component
|
|
802
|
+
// el = document.querySelector("#test");
|
|
803
|
+
// el.someAttribute = "another-value";
|
|
804
|
+
// // upgrade component
|
|
805
|
+
// customElements.define('my-component', MyComponent);
|
|
806
|
+
// </script>
|
|
807
|
+
// ```
|
|
808
|
+
// In this case if we do not unshadow here and use the value of the shadowing property, attributeChangedCallback
|
|
809
|
+
// will be called with `newValue = "some-value"` and will set the shadowed property (this.someAttribute = "another-value")
|
|
810
|
+
// to the value that was set inline i.e. "some-value" from above example. When
|
|
811
|
+
// the connectedCallback attempts to unshadow it will use "some-value" as the initial value rather than "another-value"
|
|
812
|
+
//
|
|
813
|
+
// The case where the attribute was NOT set inline but was not set programmatically shall be handled/unshadowed
|
|
814
|
+
// by connectedCallback as this attributeChangedCallback will not fire.
|
|
815
|
+
//
|
|
816
|
+
// https://developers.google.com/web/fundamentals/web-components/best-practices#lazy-properties
|
|
817
|
+
//
|
|
818
|
+
// TODO(STENCIL-16) we should think about whether or not we actually want to be reflecting the attributes to
|
|
819
|
+
// properties here given that this goes against best practices outlined here
|
|
820
|
+
// https://developers.google.com/web/fundamentals/web-components/best-practices#avoid-reentrancy
|
|
821
|
+
if (this.hasOwnProperty(propName)) {
|
|
822
|
+
newValue = this[propName];
|
|
823
|
+
delete this[propName];
|
|
824
|
+
}
|
|
825
|
+
else if (prototype.hasOwnProperty(propName) &&
|
|
826
|
+
typeof this[propName] === 'number' &&
|
|
827
|
+
this[propName] == newValue) {
|
|
828
|
+
// if the propName exists on the prototype of `Cstr`, this update may be a result of Stencil using native
|
|
829
|
+
// APIs to reflect props as attributes. Calls to `setAttribute(someElement, propName)` will result in
|
|
830
|
+
// `propName` to be converted to a `DOMString`, which may not be what we want for other primitive props.
|
|
831
|
+
return;
|
|
832
|
+
}
|
|
833
|
+
this[propName] = newValue === null && typeof this[propName] === 'boolean' ? false : newValue;
|
|
834
|
+
});
|
|
835
|
+
};
|
|
836
|
+
// create an array of attributes to observe
|
|
837
|
+
// and also create a map of html attribute name to js property name
|
|
838
|
+
Cstr.observedAttributes = members
|
|
839
|
+
.filter(([_, m]) => m[0] & 15 /* HasAttribute */) // filter to only keep props that should match attributes
|
|
840
|
+
.map(([propName, m]) => {
|
|
841
|
+
const attrName = m[1] || propName;
|
|
842
|
+
attrNameToPropName.set(attrName, propName);
|
|
843
|
+
if (m[0] & 512 /* ReflectAttr */) {
|
|
844
|
+
cmpMeta.$attrsToReflect$.push([propName, attrName]);
|
|
845
|
+
}
|
|
846
|
+
return attrName;
|
|
847
|
+
});
|
|
848
|
+
}
|
|
849
|
+
}
|
|
474
850
|
return Cstr;
|
|
475
851
|
};
|
|
476
852
|
const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId, Cstr) => {
|
|
@@ -489,7 +865,17 @@ const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId, Cstr) =>
|
|
|
489
865
|
Cstr = await Cstr;
|
|
490
866
|
endLoad();
|
|
491
867
|
}
|
|
868
|
+
if (!Cstr.isProxied) {
|
|
869
|
+
proxyComponent(Cstr, cmpMeta, 2 /* proxyState */);
|
|
870
|
+
Cstr.isProxied = true;
|
|
871
|
+
}
|
|
492
872
|
const endNewInstance = createTime('createInstance', cmpMeta.$tagName$);
|
|
873
|
+
// ok, time to construct the instance
|
|
874
|
+
// but let's keep track of when we start and stop
|
|
875
|
+
// so that the getters/setters don't incorrectly step on data
|
|
876
|
+
{
|
|
877
|
+
hostRef.$flags$ |= 8 /* isConstructingInstance */;
|
|
878
|
+
}
|
|
493
879
|
// construct the lazy-loaded component implementation
|
|
494
880
|
// passing the hostRef is very important during
|
|
495
881
|
// construction in order to directly wire together the
|
|
@@ -500,7 +886,11 @@ const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId, Cstr) =>
|
|
|
500
886
|
catch (e) {
|
|
501
887
|
consoleError(e);
|
|
502
888
|
}
|
|
889
|
+
{
|
|
890
|
+
hostRef.$flags$ &= ~8 /* isConstructingInstance */;
|
|
891
|
+
}
|
|
503
892
|
endNewInstance();
|
|
893
|
+
fireConnectedCallback(hostRef.$lazyInstance$);
|
|
504
894
|
}
|
|
505
895
|
if (Cstr.style) {
|
|
506
896
|
// this component has styles but we haven't registered them yet
|
|
@@ -529,6 +919,11 @@ const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId, Cstr) =>
|
|
|
529
919
|
schedule();
|
|
530
920
|
}
|
|
531
921
|
};
|
|
922
|
+
const fireConnectedCallback = (instance) => {
|
|
923
|
+
{
|
|
924
|
+
safeCall(instance, 'connectedCallback');
|
|
925
|
+
}
|
|
926
|
+
};
|
|
532
927
|
const connectedCallback = (elm) => {
|
|
533
928
|
if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) {
|
|
534
929
|
const hostRef = getHostRef(elm);
|
|
@@ -552,10 +947,25 @@ const connectedCallback = (elm) => {
|
|
|
552
947
|
}
|
|
553
948
|
}
|
|
554
949
|
}
|
|
950
|
+
// Lazy properties
|
|
951
|
+
// https://developers.google.com/web/fundamentals/web-components/best-practices#lazy-properties
|
|
952
|
+
if (cmpMeta.$members$) {
|
|
953
|
+
Object.entries(cmpMeta.$members$).map(([memberName, [memberFlags]]) => {
|
|
954
|
+
if (memberFlags & 31 /* Prop */ && elm.hasOwnProperty(memberName)) {
|
|
955
|
+
const value = elm[memberName];
|
|
956
|
+
delete elm[memberName];
|
|
957
|
+
elm[memberName] = value;
|
|
958
|
+
}
|
|
959
|
+
});
|
|
960
|
+
}
|
|
555
961
|
{
|
|
556
962
|
initializeComponent(elm, hostRef, cmpMeta);
|
|
557
963
|
}
|
|
558
964
|
}
|
|
965
|
+
else {
|
|
966
|
+
// fire off connectedCallback() on component instance
|
|
967
|
+
fireConnectedCallback(hostRef.$lazyInstance$);
|
|
968
|
+
}
|
|
559
969
|
endConnected();
|
|
560
970
|
}
|
|
561
971
|
};
|
|
@@ -585,6 +995,12 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
|
|
|
585
995
|
$members$: compactMeta[2],
|
|
586
996
|
$listeners$: compactMeta[3],
|
|
587
997
|
};
|
|
998
|
+
{
|
|
999
|
+
cmpMeta.$members$ = compactMeta[2];
|
|
1000
|
+
}
|
|
1001
|
+
{
|
|
1002
|
+
cmpMeta.$attrsToReflect$ = [];
|
|
1003
|
+
}
|
|
588
1004
|
const tagName = cmpMeta.$tagName$;
|
|
589
1005
|
const HostElement = class extends HTMLElement {
|
|
590
1006
|
// StencilLazyHost
|
|
@@ -628,7 +1044,7 @@ const bootstrapLazy = (lazyBundles, options = {}) => {
|
|
|
628
1044
|
cmpMeta.$lazyBundleId$ = lazyBundle[0];
|
|
629
1045
|
if (!exclude.includes(tagName) && !customElements.get(tagName)) {
|
|
630
1046
|
cmpTags.push(tagName);
|
|
631
|
-
customElements.define(tagName, proxyComponent(HostElement));
|
|
1047
|
+
customElements.define(tagName, proxyComponent(HostElement, cmpMeta, 1 /* isElementConstructor */));
|
|
632
1048
|
}
|
|
633
1049
|
});
|
|
634
1050
|
});
|
|
@@ -678,9 +1094,7 @@ const loadModule = (cmpMeta, hostRef, hmrVersionId) => {
|
|
|
678
1094
|
if (module) {
|
|
679
1095
|
return module[exportName];
|
|
680
1096
|
}
|
|
681
|
-
/*!__STENCIL_STATIC_IMPORT_SWITCH__*/
|
|
682
1097
|
return import(
|
|
683
|
-
/* @vite-ignore */
|
|
684
1098
|
/* webpackInclude: /\.entry\.js$/ */
|
|
685
1099
|
/* webpackExclude: /\.system\.entry\.js$/ */
|
|
686
1100
|
/* webpackMode: "lazy" */
|
|
@@ -735,4 +1149,4 @@ const flush = () => {
|
|
|
735
1149
|
const nextTick = /*@__PURE__*/ (cb) => promiseResolve().then(cb);
|
|
736
1150
|
const writeTask = /*@__PURE__*/ queueTask(queueDomWrites, true);
|
|
737
1151
|
|
|
738
|
-
export { bootstrapLazy as b, h, promiseResolve as p, registerInstance as r };
|
|
1152
|
+
export { bootstrapLazy as b, createEvent as c, getElement as g, h, promiseResolve as p, registerInstance as r };
|
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-515a97dd.js';
|
|
2
2
|
|
|
3
3
|
/*
|
|
4
|
-
Stencil Client Patch Esm v2.
|
|
4
|
+
Stencil Client Patch Esm v2.15.2 | 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([["lottery-game-details",[[1,"
|
|
13
|
+
return bootstrapLazy([["helper-accordion_4",[[1,"lottery-game-details"],[1,"helper-tabs",{"disabled":[4],"label":[1],"selected":[4],"cmsEndpoint":[1,"cms-endpoint"],"selectedIndex":[1538,"selected-index"],"tabs":[16]}],[1,"helper-accordion",{"ticketHistoryFlag":[4,"ticket-history-flag"],"headerTitle":[1,"header-title"],"headerSubtitle":[1,"header-subtitle"],"description":[1],"footer":[4],"deleteTab":[4,"delete-tab"],"postMessage":[4,"post-message"],"eventName":[1,"event-name"],"collapsed":[4],"language":[1],"showContent":[32]}],[1,"helper-tab",{"selectedIndex":[2,"selected-index"],"cmsEndpoint":[1,"cms-endpoint"],"tabContent":[32]}]]]], options);
|
|
14
14
|
});
|
|
15
15
|
};
|
|
16
16
|
|
|
@@ -1,7 +1,7 @@
|
|
|
1
|
-
import { p as promiseResolve, b as bootstrapLazy } from './index-
|
|
1
|
+
import { p as promiseResolve, b as bootstrapLazy } from './index-515a97dd.js';
|
|
2
2
|
|
|
3
3
|
/*
|
|
4
|
-
Stencil Client Patch Browser v2.
|
|
4
|
+
Stencil Client Patch Browser v2.15.2 | MIT Licensed | https://stenciljs.com
|
|
5
5
|
*/
|
|
6
6
|
const patchBrowser = () => {
|
|
7
7
|
const importMeta = import.meta.url;
|
|
@@ -13,5 +13,5 @@ const patchBrowser = () => {
|
|
|
13
13
|
};
|
|
14
14
|
|
|
15
15
|
patchBrowser().then(options => {
|
|
16
|
-
return bootstrapLazy([["lottery-game-details",[[1,"
|
|
16
|
+
return bootstrapLazy([["helper-accordion_4",[[1,"lottery-game-details"],[1,"helper-tabs",{"disabled":[4],"label":[1],"selected":[4],"cmsEndpoint":[1,"cms-endpoint"],"selectedIndex":[1538,"selected-index"],"tabs":[16]}],[1,"helper-accordion",{"ticketHistoryFlag":[4,"ticket-history-flag"],"headerTitle":[1,"header-title"],"headerSubtitle":[1,"header-subtitle"],"description":[1],"footer":[4],"deleteTab":[4,"delete-tab"],"postMessage":[4,"post-message"],"eventName":[1,"event-name"],"collapsed":[4],"language":[1],"showContent":[32]}],[1,"helper-tab",{"selectedIndex":[2,"selected-index"],"cmsEndpoint":[1,"cms-endpoint"],"tabContent":[32]}]]]], options);
|
|
17
17
|
});
|
|
@@ -1 +1 @@
|
|
|
1
|
-
import{p as
|
|
1
|
+
import{p as e,b as t}from"./p-703a43dd.js";(()=>{const t=import.meta.url,a={};return""!==t&&(a.resourcesUrl=new URL(".",t).href),e(a)})().then((e=>t([["p-ea7da786",[[1,"lottery-game-details"],[1,"helper-tabs",{disabled:[4],label:[1],selected:[4],cmsEndpoint:[1,"cms-endpoint"],selectedIndex:[1538,"selected-index"],tabs:[16]}],[1,"helper-accordion",{ticketHistoryFlag:[4,"ticket-history-flag"],headerTitle:[1,"header-title"],headerSubtitle:[1,"header-subtitle"],description:[1],footer:[4],deleteTab:[4,"delete-tab"],postMessage:[4,"post-message"],eventName:[1,"event-name"],collapsed:[4],language:[1],showContent:[32]}],[1,"helper-tab",{selectedIndex:[2,"selected-index"],cmsEndpoint:[1,"cms-endpoint"],tabContent:[32]}]]]],e)));
|