@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.
@@ -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
- const style = styles.get(scopeId);
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
- const vNodeChildren = [];
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
- const n = newValue == null ? '' : newValue;
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
- const newVNode = newParentVNode.$children$[childIndex];
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 };
@@ -1,7 +1,7 @@
1
- import { p as promiseResolve, b as bootstrapLazy } from './index-215cc33d.js';
1
+ import { p as promiseResolve, b as bootstrapLazy } from './index-515a97dd.js';
2
2
 
3
3
  /*
4
- Stencil Client Patch Esm v2.17.0 | MIT Licensed | https://stenciljs.com
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,"lottery-game-details"]]]], options);
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-215cc33d.js';
1
+ import { p as promiseResolve, b as bootstrapLazy } from './index-515a97dd.js';
2
2
 
3
3
  /*
4
- Stencil Client Patch Browser v2.17.0 | MIT Licensed | https://stenciljs.com
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,"lottery-game-details"]]]], options);
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 t,b as e}from"./p-3c694375.js";(()=>{const e=import.meta.url,r={};return""!==e&&(r.resourcesUrl=new URL(".",e).href),t(r)})().then((t=>e([["p-9a006ef9",[[1,"lottery-game-details"]]]],t)));
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)));