@atmgrupomaggioli/iris-button 0.0.1 → 0.1.0-dev.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.
Files changed (40) hide show
  1. package/dist/cjs/{index-15a93aad.js → index-f786c569.js} +289 -384
  2. package/dist/cjs/index-f786c569.js.map +1 -0
  3. package/dist/cjs/iris-button.cjs.entry.js +66 -10
  4. package/dist/cjs/iris-button.cjs.entry.js.map +1 -1
  5. package/dist/cjs/iris-button.cjs.js +3 -3
  6. package/dist/cjs/iris-button.cjs.js.map +1 -1
  7. package/dist/cjs/loader.cjs.js +2 -2
  8. package/dist/collection/collection-manifest.json +1 -1
  9. package/dist/collection/components/iris-button/iris-button.css +40 -13
  10. package/dist/collection/components/iris-button/iris-button.js +161 -14
  11. package/dist/collection/components/iris-button/iris-button.js.map +1 -1
  12. package/dist/components/index.js +1 -1
  13. package/dist/components/iris-button.js +72 -14
  14. package/dist/components/iris-button.js.map +1 -1
  15. package/dist/components/{p-9678c037.js → p-913b636c.js} +248 -375
  16. package/dist/components/p-913b636c.js.map +1 -0
  17. package/dist/esm/{index-73dab88a.js → index-45a8db1c.js} +289 -385
  18. package/dist/esm/index-45a8db1c.js.map +1 -0
  19. package/dist/esm/iris-button.entry.js +66 -10
  20. package/dist/esm/iris-button.entry.js.map +1 -1
  21. package/dist/esm/iris-button.js +4 -4
  22. package/dist/esm/iris-button.js.map +1 -1
  23. package/dist/esm/loader.js +3 -3
  24. package/dist/iris-button/iris-button.css +1 -1
  25. package/dist/iris-button/iris-button.esm.js +1 -1
  26. package/dist/iris-button/iris-button.esm.js.map +1 -1
  27. package/dist/iris-button/p-705a656b.js +3 -0
  28. package/dist/iris-button/p-705a656b.js.map +1 -0
  29. package/dist/iris-button/p-cbf16ce7.entry.js +2 -0
  30. package/dist/iris-button/p-cbf16ce7.entry.js.map +1 -0
  31. package/dist/types/components/iris-button/iris-button.d.ts +32 -4
  32. package/dist/types/components.d.ts +49 -7
  33. package/package.json +6 -9
  34. package/dist/cjs/index-15a93aad.js.map +0 -1
  35. package/dist/components/p-9678c037.js.map +0 -1
  36. package/dist/esm/index-73dab88a.js.map +0 -1
  37. package/dist/iris-button/p-cc8752cf.entry.js +0 -2
  38. package/dist/iris-button/p-cc8752cf.entry.js.map +0 -1
  39. package/dist/iris-button/p-f582cc7a.js +0 -3
  40. package/dist/iris-button/p-f582cc7a.js.map +0 -1
@@ -1,17 +1,25 @@
1
1
  const NAMESPACE = 'iris-button';
2
- const BUILD = /* iris-button */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, cmpDidLoad: false, cmpDidRender: false, cmpDidUnload: false, cmpDidUpdate: false, cmpShouldUpdate: false, cmpWillLoad: false, cmpWillRender: false, cmpWillUpdate: false, connectedCallback: false, constructableCSS: true, cssAnnotations: true, devTools: false, disconnectedCallback: false, element: false, event: false, experimentalScopedSlotChanges: false, experimentalSlotFixes: false, formAssociated: false, hasRenderFn: true, hostListener: false, hostListenerTarget: false, hostListenerTargetBody: false, hostListenerTargetDocument: false, hostListenerTargetParent: false, hostListenerTargetWindow: false, hotModuleReplacement: false, hydrateClientSide: false, hydrateServerSide: false, hydratedAttribute: false, hydratedClass: true, hydratedSelectorName: "hydrated", initializeNextTick: false, invisiblePrehydration: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: false, lifecycleDOMEvents: false, member: true, method: false, mode: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: false, propNumber: false, propString: true, reflect: false, scoped: false, scopedSlotTextContentFix: false, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: false, slot: true, slotChildNodesFix: false, slotRelocation: true, state: false, style: true, svg: false, taskQueue: true, transformTagName: false, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: false, vdomKey: true, vdomListener: false, vdomPropOrAttr: false, vdomRef: false, vdomRender: true, vdomStyle: false, vdomText: true, vdomXlink: false, watchCallback: false };
2
+ const BUILD = /* iris-button */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, cmpDidLoad: false, cmpDidRender: false, cmpDidUnload: false, cmpDidUpdate: false, cmpShouldUpdate: false, cmpWillLoad: false, cmpWillRender: false, cmpWillUpdate: false, connectedCallback: false, constructableCSS: true, cssAnnotations: true, devTools: false, disconnectedCallback: false, element: false, event: true, experimentalScopedSlotChanges: false, experimentalSlotFixes: false, formAssociated: false, hasRenderFn: true, hostListener: false, hostListenerTarget: false, hostListenerTargetBody: false, hostListenerTargetDocument: false, hostListenerTargetParent: false, hostListenerTargetWindow: false, hotModuleReplacement: false, hydrateClientSide: false, hydrateServerSide: false, hydratedAttribute: false, hydratedClass: true, hydratedSelectorName: "hydrated", initializeNextTick: false, invisiblePrehydration: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: false, lifecycleDOMEvents: false, member: true, method: false, mode: false, modernPropertyDecls: false, observeAttribute: true, profile: false, prop: true, propBoolean: true, propMutable: true, propNumber: false, propString: true, reflect: false, scoped: false, scopedSlotTextContentFix: false, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: true, slot: false, slotChildNodesFix: false, slotRelocation: false, state: false, style: true, svg: true, taskQueue: true, transformTagName: false, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: false, vdomKey: false, vdomListener: true, vdomPropOrAttr: true, vdomRef: false, vdomRender: true, vdomStyle: false, vdomText: true, vdomXlink: false, watchCallback: false };
3
3
 
4
4
  /*
5
- Stencil Client Platform v4.22.3 | MIT Licensed | https://stenciljs.com
5
+ Stencil Client Platform v4.25.1 | MIT Licensed | https://stenciljs.com
6
6
  */
7
7
  var __defProp = Object.defineProperty;
8
8
  var __export = (target, all) => {
9
9
  for (var name in all)
10
10
  __defProp(target, name, { get: all[name], enumerable: true });
11
11
  };
12
+
13
+ // src/utils/constants.ts
14
+ var SVG_NS = "http://www.w3.org/2000/svg";
15
+ var HTML_NS = "http://www.w3.org/1999/xhtml";
16
+
17
+ // src/client/client-host-ref.ts
12
18
  var hostRefs = /* @__PURE__ */ new WeakMap();
13
19
  var getHostRef = (ref) => hostRefs.get(ref);
14
- var registerInstance = (lazyInstance, hostRef) => hostRefs.set(hostRef.$lazyInstance$ = lazyInstance, hostRef);
20
+ var registerInstance = (lazyInstance, hostRef) => {
21
+ hostRefs.set(hostRef.$lazyInstance$ = lazyInstance, hostRef);
22
+ };
15
23
  var registerHost = (hostElement, cmpMeta) => {
16
24
  const hostRef = {
17
25
  $flags$: 0,
@@ -24,8 +32,10 @@ var registerHost = (hostElement, cmpMeta) => {
24
32
  hostElement["s-p"] = [];
25
33
  hostElement["s-rc"] = [];
26
34
  }
27
- return hostRefs.set(hostElement, hostRef);
35
+ const ref = hostRefs.set(hostElement, hostRef);
36
+ return ref;
28
37
  };
38
+ var isMemberInElement = (elm, memberName) => memberName in elm;
29
39
  var consoleError = (e, el) => (0, console.error)(e, el);
30
40
 
31
41
  // src/client/client-load-module.ts
@@ -47,16 +57,22 @@ var loadModule = (cmpMeta, hostRef, hmrVersionId) => {
47
57
  /* webpackExclude: /\.system\.entry\.js$/ */
48
58
  /* webpackMode: "lazy" */
49
59
  `./${bundleId}.entry.js${""}`
50
- ).then((importedModule) => {
51
- {
52
- cmpModules.set(bundleId, importedModule);
60
+ ).then(
61
+ (importedModule) => {
62
+ {
63
+ cmpModules.set(bundleId, importedModule);
64
+ }
65
+ return importedModule[exportName];
66
+ },
67
+ (e) => {
68
+ consoleError(e, hostRef.$hostElement$);
53
69
  }
54
- return importedModule[exportName];
55
- }, consoleError);
70
+ );
56
71
  };
57
72
 
58
73
  // src/client/client-style.ts
59
74
  var styles = /* @__PURE__ */ new Map();
75
+ var HYDRATED_STYLE_ID = "sty-id";
60
76
  var HYDRATED_CSS = "{visibility:hidden}.hydrated{visibility:inherit}";
61
77
  var SLOT_FB_CSS = "slot-fb{display:contents}slot-fb[hidden]{display:none}";
62
78
  var win = typeof window !== "undefined" ? window : {};
@@ -70,7 +86,6 @@ var plt = {
70
86
  rel: (el, eventName, listener, opts) => el.removeEventListener(eventName, listener, opts),
71
87
  ce: (eventName, opts) => new CustomEvent(eventName, opts)
72
88
  };
73
- var supportsShadow = BUILD.shadowDom;
74
89
  var promiseResolve = (v) => Promise.resolve(v);
75
90
  var supportsConstructableStylesheets = /* @__PURE__ */ (() => {
76
91
  try {
@@ -115,12 +130,6 @@ var flush = () => {
115
130
  };
116
131
  var nextTick = (cb) => promiseResolve().then(cb);
117
132
  var writeTask = /* @__PURE__ */ queueTask(queueDomWrites, true);
118
-
119
- // src/utils/constants.ts
120
- var EMPTY_OBJ = {};
121
-
122
- // src/utils/helpers.ts
123
- var isDef = (v) => v != null;
124
133
  var isComplexType = (o) => {
125
134
  o = typeof o;
126
135
  return o === "object" || o === "function";
@@ -196,8 +205,6 @@ var uniqueTime = (key, measureText) => {
196
205
  };
197
206
  var h = (nodeName, vnodeData, ...children) => {
198
207
  let child = null;
199
- let key = null;
200
- let slotName = null;
201
208
  let simple = false;
202
209
  let lastSimple = false;
203
210
  const vNodeChildren = [];
@@ -221,12 +228,6 @@ var h = (nodeName, vnodeData, ...children) => {
221
228
  };
222
229
  walk(children);
223
230
  if (vnodeData) {
224
- if (vnodeData.key) {
225
- key = vnodeData.key;
226
- }
227
- if (vnodeData.name) {
228
- slotName = vnodeData.name;
229
- }
230
231
  {
231
232
  const classData = vnodeData.className || vnodeData.class;
232
233
  if (classData) {
@@ -239,12 +240,6 @@ var h = (nodeName, vnodeData, ...children) => {
239
240
  if (vNodeChildren.length > 0) {
240
241
  vnode.$children$ = vNodeChildren;
241
242
  }
242
- {
243
- vnode.$key$ = key;
244
- }
245
- {
246
- vnode.$name$ = slotName;
247
- }
248
243
  return vnode;
249
244
  };
250
245
  var newVNode = (tag, text) => {
@@ -258,12 +253,6 @@ var newVNode = (tag, text) => {
258
253
  {
259
254
  vnode.$attrs$ = null;
260
255
  }
261
- {
262
- vnode.$key$ = null;
263
- }
264
- {
265
- vnode.$name$ = null;
266
- }
267
256
  return vnode;
268
257
  };
269
258
  var Host = {};
@@ -280,6 +269,22 @@ var parsePropertyValue = (propValue, propType) => {
280
269
  }
281
270
  return propValue;
282
271
  };
272
+ var getElement = (ref) => getHostRef(ref).$hostElement$ ;
273
+
274
+ // src/runtime/event-emitter.ts
275
+ var createEvent = (ref, name, flags) => {
276
+ const elm = getElement(ref);
277
+ return {
278
+ emit: (detail) => {
279
+ return emitEvent(elm, name, {
280
+ bubbles: !!(flags & 4 /* Bubbles */),
281
+ composed: !!(flags & 2 /* Composed */),
282
+ cancelable: !!(flags & 1 /* Cancellable */),
283
+ detail
284
+ });
285
+ }
286
+ };
287
+ };
283
288
  var emitEvent = (elm, name, opts) => {
284
289
  const ev = plt.ce(name, opts);
285
290
  elm.dispatchEvent(ev);
@@ -315,7 +320,7 @@ var addStyle = (styleContainerNode, cmpMeta, mode) => {
315
320
  }
316
321
  if (!appliedStyles.has(scopeId2)) {
317
322
  {
318
- styleElm = doc.createElement("style");
323
+ styleElm = document.querySelector(`[${HYDRATED_STYLE_ID}="${scopeId2}"]`) || doc.createElement("style");
319
324
  styleElm.innerHTML = style;
320
325
  const nonce = (_a = plt.$nonce$) != null ? _a : queryNonceMetaTagContent(doc);
321
326
  if (nonce != null) {
@@ -325,7 +330,10 @@ var addStyle = (styleContainerNode, cmpMeta, mode) => {
325
330
  if (styleContainerNode.nodeName === "HEAD") {
326
331
  const preconnectLinks = styleContainerNode.querySelectorAll("link[rel=preconnect]");
327
332
  const referenceNode2 = preconnectLinks.length > 0 ? preconnectLinks[preconnectLinks.length - 1].nextSibling : styleContainerNode.querySelector("style");
328
- styleContainerNode.insertBefore(styleElm, referenceNode2);
333
+ styleContainerNode.insertBefore(
334
+ styleElm,
335
+ (referenceNode2 == null ? void 0 : referenceNode2.parentNode) === styleContainerNode ? referenceNode2 : null
336
+ );
329
337
  } else if ("host" in styleContainerNode) {
330
338
  if (supportsConstructableStylesheets) {
331
339
  const stylesheet = new CSSStyleSheet();
@@ -363,42 +371,123 @@ var addStyle = (styleContainerNode, cmpMeta, mode) => {
363
371
  var attachStyles = (hostRef) => {
364
372
  const cmpMeta = hostRef.$cmpMeta$;
365
373
  const elm = hostRef.$hostElement$;
374
+ const flags = cmpMeta.$flags$;
366
375
  const endAttachStyles = createTime("attachStyles", cmpMeta.$tagName$);
367
- addStyle(
368
- elm.getRootNode(),
376
+ const scopeId2 = addStyle(
377
+ elm.shadowRoot ? elm.shadowRoot : elm.getRootNode(),
369
378
  cmpMeta);
379
+ if (flags & 10 /* needsScopedEncapsulation */ && flags & 2 /* scopedCssEncapsulation */) {
380
+ elm["s-sc"] = scopeId2;
381
+ elm.classList.add(scopeId2 + "-h");
382
+ }
370
383
  endAttachStyles();
371
384
  };
372
385
  var getScopeId = (cmp, mode) => "sc-" + (cmp.$tagName$);
373
- var setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags) => {
386
+ var setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags, initialRender) => {
374
387
  if (oldValue !== newValue) {
375
- memberName.toLowerCase();
388
+ let isProp = isMemberInElement(elm, memberName);
389
+ let ln = memberName.toLowerCase();
376
390
  if (memberName === "class") {
377
391
  const classList = elm.classList;
378
392
  const oldClasses = parseClassList(oldValue);
379
- const newClasses = parseClassList(newValue);
380
- classList.remove(...oldClasses.filter((c) => c && !newClasses.includes(c)));
381
- classList.add(...newClasses.filter((c) => c && !oldClasses.includes(c)));
393
+ let newClasses = parseClassList(newValue);
394
+ {
395
+ classList.remove(...oldClasses.filter((c) => c && !newClasses.includes(c)));
396
+ classList.add(...newClasses.filter((c) => c && !oldClasses.includes(c)));
397
+ }
398
+ } else if ((!isProp ) && memberName[0] === "o" && memberName[1] === "n") {
399
+ if (memberName[2] === "-") {
400
+ memberName = memberName.slice(3);
401
+ } else if (isMemberInElement(win, ln)) {
402
+ memberName = ln.slice(2);
403
+ } else {
404
+ memberName = ln[2] + memberName.slice(3);
405
+ }
406
+ if (oldValue || newValue) {
407
+ const capture = memberName.endsWith(CAPTURE_EVENT_SUFFIX);
408
+ memberName = memberName.replace(CAPTURE_EVENT_REGEX, "");
409
+ if (oldValue) {
410
+ plt.rel(elm, memberName, oldValue, capture);
411
+ }
412
+ if (newValue) {
413
+ plt.ael(elm, memberName, newValue, capture);
414
+ }
415
+ }
416
+ } else {
417
+ const isComplex = isComplexType(newValue);
418
+ if ((isProp || isComplex && newValue !== null) && !isSvg) {
419
+ try {
420
+ if (!elm.tagName.includes("-")) {
421
+ const n = newValue == null ? "" : newValue;
422
+ if (memberName === "list") {
423
+ isProp = false;
424
+ } else if (oldValue == null || elm[memberName] != n) {
425
+ if (typeof elm.__lookupSetter__(memberName) === "function") {
426
+ elm[memberName] = n;
427
+ } else {
428
+ elm.setAttribute(memberName, n);
429
+ }
430
+ }
431
+ } else if (elm[memberName] !== newValue) {
432
+ elm[memberName] = newValue;
433
+ }
434
+ } catch (e) {
435
+ }
436
+ }
437
+ if (newValue == null || newValue === false) {
438
+ if (newValue !== false || elm.getAttribute(memberName) === "") {
439
+ {
440
+ elm.removeAttribute(memberName);
441
+ }
442
+ }
443
+ } else if ((!isProp || flags & 4 /* isHost */ || isSvg) && !isComplex) {
444
+ newValue = newValue === true ? "" : newValue;
445
+ {
446
+ elm.setAttribute(memberName, newValue);
447
+ }
448
+ }
382
449
  }
383
450
  }
384
451
  };
385
452
  var parseClassListRegex = /\s/;
386
- var parseClassList = (value) => !value ? [] : value.split(parseClassListRegex);
453
+ var parseClassList = (value) => {
454
+ if (typeof value === "object" && value && "baseVal" in value) {
455
+ value = value.baseVal;
456
+ }
457
+ if (!value || typeof value !== "string") {
458
+ return [];
459
+ }
460
+ return value.split(parseClassListRegex);
461
+ };
462
+ var CAPTURE_EVENT_SUFFIX = "Capture";
463
+ var CAPTURE_EVENT_REGEX = new RegExp(CAPTURE_EVENT_SUFFIX + "$");
387
464
 
388
465
  // src/runtime/vdom/update-element.ts
389
- var updateElement = (oldVnode, newVnode, isSvgMode2) => {
466
+ var updateElement = (oldVnode, newVnode, isSvgMode2, isInitialRender) => {
390
467
  const elm = newVnode.$elm$.nodeType === 11 /* DocumentFragment */ && newVnode.$elm$.host ? newVnode.$elm$.host : newVnode.$elm$;
391
- const oldVnodeAttrs = oldVnode && oldVnode.$attrs$ || EMPTY_OBJ;
392
- const newVnodeAttrs = newVnode.$attrs$ || EMPTY_OBJ;
468
+ const oldVnodeAttrs = oldVnode && oldVnode.$attrs$ || {};
469
+ const newVnodeAttrs = newVnode.$attrs$ || {};
393
470
  {
394
471
  for (const memberName of sortedAttrNames(Object.keys(oldVnodeAttrs))) {
395
472
  if (!(memberName in newVnodeAttrs)) {
396
- setAccessor(elm, memberName, oldVnodeAttrs[memberName], void 0);
473
+ setAccessor(
474
+ elm,
475
+ memberName,
476
+ oldVnodeAttrs[memberName],
477
+ void 0,
478
+ isSvgMode2,
479
+ newVnode.$flags$);
397
480
  }
398
481
  }
399
482
  }
400
483
  for (const memberName of sortedAttrNames(Object.keys(newVnodeAttrs))) {
401
- setAccessor(elm, memberName, oldVnodeAttrs[memberName], newVnodeAttrs[memberName]);
484
+ setAccessor(
485
+ elm,
486
+ memberName,
487
+ oldVnodeAttrs[memberName],
488
+ newVnodeAttrs[memberName],
489
+ isSvgMode2,
490
+ newVnode.$flags$);
402
491
  }
403
492
  };
404
493
  function sortedAttrNames(attrNames) {
@@ -410,51 +499,29 @@ function sortedAttrNames(attrNames) {
410
499
  attrNames
411
500
  );
412
501
  }
413
-
414
- // src/runtime/vdom/vdom-render.ts
415
- var scopeId;
416
- var contentRef;
417
502
  var hostTagName;
418
503
  var useNativeShadowDom = false;
419
- var checkSlotFallbackVisibility = false;
420
- var checkSlotRelocate = false;
421
- var createElm = (oldParentVNode, newParentVNode, childIndex, parentElm) => {
422
- var _a;
504
+ var isSvgMode = false;
505
+ var createElm = (oldParentVNode, newParentVNode, childIndex) => {
423
506
  const newVNode2 = newParentVNode.$children$[childIndex];
424
507
  let i2 = 0;
425
508
  let elm;
426
509
  let childNode;
427
- let oldVNode;
428
- if (!useNativeShadowDom) {
429
- checkSlotRelocate = true;
430
- if (newVNode2.$tag$ === "slot") {
431
- newVNode2.$flags$ |= newVNode2.$children$ ? (
432
- // slot element has fallback content
433
- // still create an element that "mocks" the slot element
434
- 2 /* isSlotFallback */
435
- ) : (
436
- // slot element does not have fallback content
437
- // create an html comment we'll use to always reference
438
- // where actual slot content should sit next to
439
- 1 /* isSlotReference */
440
- );
441
- }
442
- }
443
510
  if (newVNode2.$text$ !== null) {
444
511
  elm = newVNode2.$elm$ = doc.createTextNode(newVNode2.$text$);
445
- } else if (newVNode2.$flags$ & 1 /* isSlotReference */) {
446
- elm = newVNode2.$elm$ = doc.createTextNode("");
447
512
  } else {
448
- elm = newVNode2.$elm$ = doc.createElement(
513
+ if (!isSvgMode) {
514
+ isSvgMode = newVNode2.$tag$ === "svg";
515
+ }
516
+ elm = newVNode2.$elm$ = doc.createElementNS(
517
+ isSvgMode ? SVG_NS : HTML_NS,
449
518
  !useNativeShadowDom && BUILD.slotRelocation && newVNode2.$flags$ & 2 /* isSlotFallback */ ? "slot-fb" : newVNode2.$tag$
450
- );
451
- {
452
- updateElement(null, newVNode2);
519
+ ) ;
520
+ if (isSvgMode && newVNode2.$tag$ === "foreignObject") {
521
+ isSvgMode = false;
453
522
  }
454
- const rootNode = elm.getRootNode();
455
- const isElementWithinShadowRoot = !rootNode.querySelector("body");
456
- if (!isElementWithinShadowRoot && BUILD.scoped && isDef(scopeId) && elm["s-si"] !== scopeId) {
457
- elm.classList.add(elm["s-si"] = scopeId);
523
+ {
524
+ updateElement(null, newVNode2, isSvgMode);
458
525
  }
459
526
  if (newVNode2.$children$) {
460
527
  for (i2 = 0; i2 < newVNode2.$children$.length; ++i2) {
@@ -464,59 +531,29 @@ var createElm = (oldParentVNode, newParentVNode, childIndex, parentElm) => {
464
531
  }
465
532
  }
466
533
  }
467
- }
468
- elm["s-hn"] = hostTagName;
469
- {
470
- if (newVNode2.$flags$ & (2 /* isSlotFallback */ | 1 /* isSlotReference */)) {
471
- elm["s-sr"] = true;
472
- elm["s-cr"] = contentRef;
473
- elm["s-sn"] = newVNode2.$name$ || "";
474
- elm["s-rf"] = (_a = newVNode2.$attrs$) == null ? void 0 : _a.ref;
475
- oldVNode = oldParentVNode && oldParentVNode.$children$ && oldParentVNode.$children$[childIndex];
476
- if (oldVNode && oldVNode.$tag$ === newVNode2.$tag$ && oldParentVNode.$elm$) {
477
- {
478
- putBackInOriginalLocation(oldParentVNode.$elm$, false);
479
- }
534
+ {
535
+ if (newVNode2.$tag$ === "svg") {
536
+ isSvgMode = false;
537
+ } else if (elm.tagName === "foreignObject") {
538
+ isSvgMode = true;
480
539
  }
481
540
  }
482
541
  }
542
+ elm["s-hn"] = hostTagName;
483
543
  return elm;
484
544
  };
485
- var putBackInOriginalLocation = (parentElm, recursive) => {
486
- plt.$flags$ |= 1 /* isTmpDisconnected */;
487
- const oldSlotChildNodes = Array.from(parentElm.childNodes);
488
- if (parentElm["s-sr"] && BUILD.experimentalSlotFixes) {
489
- let node = parentElm;
490
- while (node = node.nextSibling) {
491
- if (node && node["s-sn"] === parentElm["s-sn"] && node["s-sh"] === hostTagName) {
492
- oldSlotChildNodes.push(node);
493
- }
494
- }
495
- }
496
- for (let i2 = oldSlotChildNodes.length - 1; i2 >= 0; i2--) {
497
- const childNode = oldSlotChildNodes[i2];
498
- if (childNode["s-hn"] !== hostTagName && childNode["s-ol"]) {
499
- insertBefore(parentReferenceNode(childNode), childNode, referenceNode(childNode));
500
- childNode["s-ol"].remove();
501
- childNode["s-ol"] = void 0;
502
- childNode["s-sh"] = void 0;
503
- checkSlotRelocate = true;
504
- }
505
- if (recursive) {
506
- putBackInOriginalLocation(childNode, recursive);
507
- }
508
- }
509
- plt.$flags$ &= ~1 /* isTmpDisconnected */;
510
- };
511
545
  var addVnodes = (parentElm, before, parentVNode, vnodes, startIdx, endIdx) => {
512
- let containerElm = parentElm["s-cr"] && parentElm["s-cr"].parentNode || parentElm;
546
+ let containerElm = parentElm;
513
547
  let childNode;
548
+ if (containerElm.shadowRoot && containerElm.tagName === hostTagName) {
549
+ containerElm = containerElm.shadowRoot;
550
+ }
514
551
  for (; startIdx <= endIdx; ++startIdx) {
515
552
  if (vnodes[startIdx]) {
516
553
  childNode = createElm(null, parentVNode, startIdx);
517
554
  if (childNode) {
518
555
  vnodes[startIdx].$elm$ = childNode;
519
- insertBefore(containerElm, childNode, referenceNode(before) );
556
+ insertBefore(containerElm, childNode, before);
520
557
  }
521
558
  }
522
559
  }
@@ -527,14 +564,6 @@ var removeVnodes = (vnodes, startIdx, endIdx) => {
527
564
  if (vnode) {
528
565
  const elm = vnode.$elm$;
529
566
  if (elm) {
530
- {
531
- checkSlotFallbackVisibility = true;
532
- if (elm["s-ol"]) {
533
- elm["s-ol"].remove();
534
- } else {
535
- putBackInOriginalLocation(elm, true);
536
- }
537
- }
538
567
  elm.remove();
539
568
  }
540
569
  }
@@ -543,8 +572,6 @@ var removeVnodes = (vnodes, startIdx, endIdx) => {
543
572
  var updateChildren = (parentElm, oldCh, newVNode2, newCh, isInitialRender = false) => {
544
573
  let oldStartIdx = 0;
545
574
  let newStartIdx = 0;
546
- let idxInOld = 0;
547
- let i2 = 0;
548
575
  let oldEndIdx = oldCh.length - 1;
549
576
  let oldStartVnode = oldCh[0];
550
577
  let oldEndVnode = oldCh[oldEndIdx];
@@ -552,7 +579,6 @@ var updateChildren = (parentElm, oldCh, newVNode2, newCh, isInitialRender = fals
552
579
  let newStartVnode = newCh[0];
553
580
  let newEndVnode = newCh[newEndIdx];
554
581
  let node;
555
- let elmToMove;
556
582
  while (oldStartIdx <= oldEndIdx && newStartIdx <= newEndIdx) {
557
583
  if (oldStartVnode == null) {
558
584
  oldStartVnode = oldCh[++oldStartIdx];
@@ -571,48 +597,23 @@ var updateChildren = (parentElm, oldCh, newVNode2, newCh, isInitialRender = fals
571
597
  oldEndVnode = oldCh[--oldEndIdx];
572
598
  newEndVnode = newCh[--newEndIdx];
573
599
  } else if (isSameVnode(oldStartVnode, newEndVnode, isInitialRender)) {
574
- if ((oldStartVnode.$tag$ === "slot" || newEndVnode.$tag$ === "slot")) {
575
- putBackInOriginalLocation(oldStartVnode.$elm$.parentNode, false);
576
- }
577
600
  patch(oldStartVnode, newEndVnode, isInitialRender);
578
601
  insertBefore(parentElm, oldStartVnode.$elm$, oldEndVnode.$elm$.nextSibling);
579
602
  oldStartVnode = oldCh[++oldStartIdx];
580
603
  newEndVnode = newCh[--newEndIdx];
581
604
  } else if (isSameVnode(oldEndVnode, newStartVnode, isInitialRender)) {
582
- if ((oldStartVnode.$tag$ === "slot" || newEndVnode.$tag$ === "slot")) {
583
- putBackInOriginalLocation(oldEndVnode.$elm$.parentNode, false);
584
- }
585
605
  patch(oldEndVnode, newStartVnode, isInitialRender);
586
606
  insertBefore(parentElm, oldEndVnode.$elm$, oldStartVnode.$elm$);
587
607
  oldEndVnode = oldCh[--oldEndIdx];
588
608
  newStartVnode = newCh[++newStartIdx];
589
609
  } else {
590
- idxInOld = -1;
591
610
  {
592
- for (i2 = oldStartIdx; i2 <= oldEndIdx; ++i2) {
593
- if (oldCh[i2] && oldCh[i2].$key$ !== null && oldCh[i2].$key$ === newStartVnode.$key$) {
594
- idxInOld = i2;
595
- break;
596
- }
597
- }
598
- }
599
- if (idxInOld >= 0) {
600
- elmToMove = oldCh[idxInOld];
601
- if (elmToMove.$tag$ !== newStartVnode.$tag$) {
602
- node = createElm(oldCh && oldCh[newStartIdx], newVNode2, idxInOld);
603
- } else {
604
- patch(elmToMove, newStartVnode, isInitialRender);
605
- oldCh[idxInOld] = void 0;
606
- node = elmToMove.$elm$;
607
- }
608
- newStartVnode = newCh[++newStartIdx];
609
- } else {
610
611
  node = createElm(oldCh && oldCh[newStartIdx], newVNode2, newStartIdx);
611
612
  newStartVnode = newCh[++newStartIdx];
612
613
  }
613
614
  if (node) {
614
615
  {
615
- insertBefore(parentReferenceNode(oldStartVnode.$elm$), node, referenceNode(oldStartVnode.$elm$));
616
+ insertBefore(oldStartVnode.$elm$.parentNode, node, oldStartVnode.$elm$);
616
617
  }
617
618
  }
618
619
  }
@@ -632,40 +633,26 @@ var updateChildren = (parentElm, oldCh, newVNode2, newCh, isInitialRender = fals
632
633
  };
633
634
  var isSameVnode = (leftVNode, rightVNode, isInitialRender = false) => {
634
635
  if (leftVNode.$tag$ === rightVNode.$tag$) {
635
- if (leftVNode.$tag$ === "slot") {
636
- if (
637
- // The component gets hydrated and no VDOM has been initialized.
638
- // Here the comparison can't happen as $name$ property is not set for `leftNode`.
639
- "$nodeId$" in leftVNode && isInitialRender && // `leftNode` is not from type HTMLComment which would cause many
640
- // hydration comments to be removed
641
- leftVNode.$elm$.nodeType !== 8
642
- ) {
643
- return false;
644
- }
645
- return leftVNode.$name$ === rightVNode.$name$;
646
- }
647
- if (!isInitialRender) {
648
- return leftVNode.$key$ === rightVNode.$key$;
636
+ if (isInitialRender && !leftVNode.$key$ && rightVNode.$key$) {
637
+ leftVNode.$key$ = rightVNode.$key$;
649
638
  }
650
639
  return true;
651
640
  }
652
641
  return false;
653
642
  };
654
- var referenceNode = (node) => {
655
- return node && node["s-ol"] || node;
656
- };
657
- var parentReferenceNode = (node) => (node["s-ol"] ? node["s-ol"] : node).parentNode;
658
643
  var patch = (oldVNode, newVNode2, isInitialRender = false) => {
659
644
  const elm = newVNode2.$elm$ = oldVNode.$elm$;
660
645
  const oldChildren = oldVNode.$children$;
661
646
  const newChildren = newVNode2.$children$;
662
647
  const tag = newVNode2.$tag$;
663
648
  const text = newVNode2.$text$;
664
- let defaultHolder;
665
649
  if (text === null) {
666
650
  {
667
- if (tag === "slot" && !useNativeShadowDom) ; else {
668
- updateElement(oldVNode, newVNode2);
651
+ isSvgMode = tag === "svg" ? true : tag === "foreignObject" ? false : isSvgMode;
652
+ }
653
+ {
654
+ {
655
+ updateElement(oldVNode, newVNode2, isSvgMode);
669
656
  }
670
657
  }
671
658
  if (oldChildren !== null && newChildren !== null) {
@@ -681,110 +668,21 @@ var patch = (oldVNode, newVNode2, isInitialRender = false) => {
681
668
  ) {
682
669
  removeVnodes(oldChildren, 0, oldChildren.length - 1);
683
670
  }
684
- } else if ((defaultHolder = elm["s-cr"])) {
685
- defaultHolder.parentNode.textContent = text;
671
+ if (isSvgMode && tag === "svg") {
672
+ isSvgMode = false;
673
+ }
686
674
  } else if (oldVNode.$text$ !== text) {
687
675
  elm.data = text;
688
676
  }
689
677
  };
690
- var updateFallbackSlotVisibility = (elm) => {
691
- const childNodes = elm.childNodes;
692
- for (const childNode of childNodes) {
693
- if (childNode.nodeType === 1 /* ElementNode */) {
694
- if (childNode["s-sr"]) {
695
- const slotName = childNode["s-sn"];
696
- childNode.hidden = false;
697
- for (const siblingNode of childNodes) {
698
- if (siblingNode !== childNode) {
699
- if (siblingNode["s-hn"] !== childNode["s-hn"] || slotName !== "") {
700
- if (siblingNode.nodeType === 1 /* ElementNode */ && (slotName === siblingNode.getAttribute("slot") || slotName === siblingNode["s-sn"]) || siblingNode.nodeType === 3 /* TextNode */ && slotName === siblingNode["s-sn"]) {
701
- childNode.hidden = true;
702
- break;
703
- }
704
- } else {
705
- if (siblingNode.nodeType === 1 /* ElementNode */ || siblingNode.nodeType === 3 /* TextNode */ && siblingNode.textContent.trim() !== "") {
706
- childNode.hidden = true;
707
- break;
708
- }
709
- }
710
- }
711
- }
712
- }
713
- updateFallbackSlotVisibility(childNode);
714
- }
715
- }
716
- };
717
- var relocateNodes = [];
718
- var markSlotContentForRelocation = (elm) => {
719
- let node;
720
- let hostContentNodes;
721
- let j;
722
- for (const childNode of elm.childNodes) {
723
- if (childNode["s-sr"] && (node = childNode["s-cr"]) && node.parentNode) {
724
- hostContentNodes = node.parentNode.childNodes;
725
- const slotName = childNode["s-sn"];
726
- for (j = hostContentNodes.length - 1; j >= 0; j--) {
727
- node = hostContentNodes[j];
728
- if (!node["s-cn"] && !node["s-nr"] && node["s-hn"] !== childNode["s-hn"] && (!BUILD.experimentalSlotFixes )) {
729
- if (isNodeLocatedInSlot(node, slotName)) {
730
- let relocateNodeData = relocateNodes.find((r) => r.$nodeToRelocate$ === node);
731
- checkSlotFallbackVisibility = true;
732
- node["s-sn"] = node["s-sn"] || slotName;
733
- if (relocateNodeData) {
734
- relocateNodeData.$nodeToRelocate$["s-sh"] = childNode["s-hn"];
735
- relocateNodeData.$slotRefNode$ = childNode;
736
- } else {
737
- node["s-sh"] = childNode["s-hn"];
738
- relocateNodes.push({
739
- $slotRefNode$: childNode,
740
- $nodeToRelocate$: node
741
- });
742
- }
743
- if (node["s-sr"]) {
744
- relocateNodes.map((relocateNode) => {
745
- if (isNodeLocatedInSlot(relocateNode.$nodeToRelocate$, node["s-sn"])) {
746
- relocateNodeData = relocateNodes.find((r) => r.$nodeToRelocate$ === node);
747
- if (relocateNodeData && !relocateNode.$slotRefNode$) {
748
- relocateNode.$slotRefNode$ = relocateNodeData.$slotRefNode$;
749
- }
750
- }
751
- });
752
- }
753
- } else if (!relocateNodes.some((r) => r.$nodeToRelocate$ === node)) {
754
- relocateNodes.push({
755
- $nodeToRelocate$: node
756
- });
757
- }
758
- }
759
- }
760
- }
761
- if (childNode.nodeType === 1 /* ElementNode */) {
762
- markSlotContentForRelocation(childNode);
763
- }
764
- }
765
- };
766
- var isNodeLocatedInSlot = (nodeToRelocate, slotName) => {
767
- if (nodeToRelocate.nodeType === 1 /* ElementNode */) {
768
- if (nodeToRelocate.getAttribute("slot") === null && slotName === "") {
769
- return true;
770
- }
771
- if (nodeToRelocate.getAttribute("slot") === slotName) {
772
- return true;
773
- }
774
- return false;
775
- }
776
- if (nodeToRelocate["s-sn"] === slotName) {
777
- return true;
778
- }
779
- return slotName === "";
780
- };
781
678
  var insertBefore = (parent, newNode, reference) => {
782
- const inserted = parent == null ? void 0 : parent.insertBefore(newNode, reference);
783
- return inserted;
679
+ {
680
+ return parent == null ? void 0 : parent.insertBefore(newNode, reference);
681
+ }
784
682
  };
785
683
  var renderVdom = (hostRef, renderFnResults, isInitialLoad = false) => {
786
- var _a, _b, _c, _d;
787
684
  const hostElm = hostRef.$hostElement$;
685
+ const cmpMeta = hostRef.$cmpMeta$;
788
686
  const oldVNode = hostRef.$vnode$ || newVNode(null, null);
789
687
  const rootVnode = isHost(renderFnResults) ? renderFnResults : h(null, null, renderFnResults);
790
688
  hostTagName = hostElm.tagName;
@@ -798,83 +696,22 @@ var renderVdom = (hostRef, renderFnResults, isInitialLoad = false) => {
798
696
  rootVnode.$tag$ = null;
799
697
  rootVnode.$flags$ |= 4 /* isHost */;
800
698
  hostRef.$vnode$ = rootVnode;
801
- rootVnode.$elm$ = oldVNode.$elm$ = hostElm;
802
- useNativeShadowDom = supportsShadow ;
803
- {
804
- contentRef = hostElm["s-cr"];
805
- checkSlotFallbackVisibility = false;
806
- }
699
+ rootVnode.$elm$ = oldVNode.$elm$ = hostElm.shadowRoot || hostElm ;
700
+ useNativeShadowDom = (cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) !== 0;
807
701
  patch(oldVNode, rootVnode, isInitialLoad);
808
- {
809
- plt.$flags$ |= 1 /* isTmpDisconnected */;
810
- if (checkSlotRelocate) {
811
- markSlotContentForRelocation(rootVnode.$elm$);
812
- for (const relocateData of relocateNodes) {
813
- const nodeToRelocate = relocateData.$nodeToRelocate$;
814
- if (!nodeToRelocate["s-ol"]) {
815
- const orgLocationNode = doc.createTextNode("");
816
- orgLocationNode["s-nr"] = nodeToRelocate;
817
- insertBefore(nodeToRelocate.parentNode, nodeToRelocate["s-ol"] = orgLocationNode, nodeToRelocate);
818
- }
819
- }
820
- for (const relocateData of relocateNodes) {
821
- const nodeToRelocate = relocateData.$nodeToRelocate$;
822
- const slotRefNode = relocateData.$slotRefNode$;
823
- if (slotRefNode) {
824
- const parentNodeRef = slotRefNode.parentNode;
825
- let insertBeforeNode = slotRefNode.nextSibling;
826
- {
827
- let orgLocationNode = (_a = nodeToRelocate["s-ol"]) == null ? void 0 : _a.previousSibling;
828
- while (orgLocationNode) {
829
- let refNode = (_b = orgLocationNode["s-nr"]) != null ? _b : null;
830
- if (refNode && refNode["s-sn"] === nodeToRelocate["s-sn"] && parentNodeRef === refNode.parentNode) {
831
- refNode = refNode.nextSibling;
832
- while (refNode === nodeToRelocate || (refNode == null ? void 0 : refNode["s-sr"])) {
833
- refNode = refNode == null ? void 0 : refNode.nextSibling;
834
- }
835
- if (!refNode || !refNode["s-nr"]) {
836
- insertBeforeNode = refNode;
837
- break;
838
- }
839
- }
840
- orgLocationNode = orgLocationNode.previousSibling;
841
- }
842
- }
843
- if (!insertBeforeNode && parentNodeRef !== nodeToRelocate.parentNode || nodeToRelocate.nextSibling !== insertBeforeNode) {
844
- if (nodeToRelocate !== insertBeforeNode) {
845
- if (!nodeToRelocate["s-hn"] && nodeToRelocate["s-ol"]) {
846
- nodeToRelocate["s-hn"] = nodeToRelocate["s-ol"].parentNode.nodeName;
847
- }
848
- insertBefore(parentNodeRef, nodeToRelocate, insertBeforeNode);
849
- if (nodeToRelocate.nodeType === 1 /* ElementNode */) {
850
- nodeToRelocate.hidden = (_c = nodeToRelocate["s-ih"]) != null ? _c : false;
851
- }
852
- }
853
- }
854
- nodeToRelocate && typeof slotRefNode["s-rf"] === "function" && slotRefNode["s-rf"](nodeToRelocate);
855
- } else {
856
- if (nodeToRelocate.nodeType === 1 /* ElementNode */) {
857
- if (isInitialLoad) {
858
- nodeToRelocate["s-ih"] = (_d = nodeToRelocate.hidden) != null ? _d : false;
859
- }
860
- nodeToRelocate.hidden = true;
861
- }
862
- }
863
- }
864
- }
865
- if (checkSlotFallbackVisibility) {
866
- updateFallbackSlotVisibility(rootVnode.$elm$);
867
- }
868
- plt.$flags$ &= ~1 /* isTmpDisconnected */;
869
- relocateNodes.length = 0;
870
- }
871
- contentRef = void 0;
872
702
  };
873
703
 
874
704
  // src/runtime/update-component.ts
875
705
  var attachToAncestor = (hostRef, ancestorComponent) => {
876
706
  if (ancestorComponent && !hostRef.$onRenderResolve$ && ancestorComponent["s-p"]) {
877
- ancestorComponent["s-p"].push(new Promise((r) => hostRef.$onRenderResolve$ = r));
707
+ const index = ancestorComponent["s-p"].push(
708
+ new Promise(
709
+ (r) => hostRef.$onRenderResolve$ = () => {
710
+ ancestorComponent["s-p"].splice(index - 1, 1);
711
+ r();
712
+ }
713
+ )
714
+ );
878
715
  }
879
716
  };
880
717
  var scheduleUpdate = (hostRef, isInitialLoad) => {
@@ -1033,15 +870,68 @@ var proxyComponent = (Cstr, cmpMeta, flags) => {
1033
870
  const members = Object.entries((_a = cmpMeta.$members$) != null ? _a : {});
1034
871
  members.map(([memberName, [memberFlags]]) => {
1035
872
  if ((memberFlags & 31 /* Prop */ || (flags & 2 /* proxyState */) && memberFlags & 32 /* State */)) {
873
+ const { get: origGetter, set: origSetter } = Object.getOwnPropertyDescriptor(prototype, memberName) || {};
874
+ if (origGetter) cmpMeta.$members$[memberName][0] |= 2048 /* Getter */;
875
+ if (origSetter) cmpMeta.$members$[memberName][0] |= 4096 /* Setter */;
876
+ if (flags & 1 /* isElementConstructor */ || !origGetter) {
877
+ Object.defineProperty(prototype, memberName, {
878
+ get() {
879
+ {
880
+ if ((cmpMeta.$members$[memberName][0] & 2048 /* Getter */) === 0) {
881
+ return getValue(this, memberName);
882
+ }
883
+ const ref = getHostRef(this);
884
+ const instance = ref ? ref.$lazyInstance$ : prototype;
885
+ if (!instance) return;
886
+ return instance[memberName];
887
+ }
888
+ },
889
+ configurable: true,
890
+ enumerable: true
891
+ });
892
+ }
1036
893
  Object.defineProperty(prototype, memberName, {
1037
- get() {
1038
- return getValue(this, memberName);
1039
- },
1040
894
  set(newValue) {
1041
- setValue(this, memberName, newValue, cmpMeta);
1042
- },
1043
- configurable: true,
1044
- enumerable: true
895
+ const ref = getHostRef(this);
896
+ if (origSetter) {
897
+ const currentValue = memberFlags & 32 /* State */ ? this[memberName] : ref.$hostElement$[memberName];
898
+ if (typeof currentValue === "undefined" && ref.$instanceValues$.get(memberName)) {
899
+ newValue = ref.$instanceValues$.get(memberName);
900
+ } else if (!ref.$instanceValues$.get(memberName) && currentValue) {
901
+ ref.$instanceValues$.set(memberName, currentValue);
902
+ }
903
+ origSetter.apply(this, [parsePropertyValue(newValue, memberFlags)]);
904
+ newValue = memberFlags & 32 /* State */ ? this[memberName] : ref.$hostElement$[memberName];
905
+ setValue(this, memberName, newValue, cmpMeta);
906
+ return;
907
+ }
908
+ {
909
+ if ((flags & 1 /* isElementConstructor */) === 0 || (cmpMeta.$members$[memberName][0] & 4096 /* Setter */) === 0) {
910
+ setValue(this, memberName, newValue, cmpMeta);
911
+ if (flags & 1 /* isElementConstructor */ && !ref.$lazyInstance$) {
912
+ ref.$onReadyPromise$.then(() => {
913
+ if (cmpMeta.$members$[memberName][0] & 4096 /* Setter */ && ref.$lazyInstance$[memberName] !== ref.$instanceValues$.get(memberName)) {
914
+ ref.$lazyInstance$[memberName] = newValue;
915
+ }
916
+ });
917
+ }
918
+ return;
919
+ }
920
+ const setterSetVal = () => {
921
+ const currentValue = ref.$lazyInstance$[memberName];
922
+ if (!ref.$instanceValues$.get(memberName) && currentValue) {
923
+ ref.$instanceValues$.set(memberName, currentValue);
924
+ }
925
+ ref.$lazyInstance$[memberName] = parsePropertyValue(newValue, memberFlags);
926
+ setValue(this, memberName, ref.$lazyInstance$[memberName], cmpMeta);
927
+ };
928
+ if (ref.$lazyInstance$) {
929
+ setterSetVal();
930
+ } else {
931
+ ref.$onReadyPromise$.then(() => setterSetVal());
932
+ }
933
+ }
934
+ }
1045
935
  });
1046
936
  }
1047
937
  });
@@ -1051,7 +941,7 @@ var proxyComponent = (Cstr, cmpMeta, flags) => {
1051
941
  plt.jmp(() => {
1052
942
  var _a2;
1053
943
  const propName = attrNameToPropName.get(attrName);
1054
- if (this.hasOwnProperty(propName)) {
944
+ if (this.hasOwnProperty(propName) && BUILD.lazyLoad) {
1055
945
  newValue = this[propName];
1056
946
  delete this[propName];
1057
947
  } else if (prototype.hasOwnProperty(propName) && typeof this[propName] === "number" && // cast type to number to avoid TS compiler issues
@@ -1071,7 +961,11 @@ var proxyComponent = (Cstr, cmpMeta, flags) => {
1071
961
  }
1072
962
  return;
1073
963
  }
1074
- this[propName] = newValue === null && typeof this[propName] === "boolean" ? false : newValue;
964
+ const propDesc = Object.getOwnPropertyDescriptor(prototype, propName);
965
+ newValue = newValue === null && typeof this[propName] === "boolean" ? false : newValue;
966
+ if (newValue !== this[propName] && (!propDesc.get || !!propDesc.set)) {
967
+ this[propName] = newValue;
968
+ }
1075
969
  });
1076
970
  };
1077
971
  Cstr.observedAttributes = Array.from(
@@ -1094,9 +988,8 @@ var initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
1094
988
  let Cstr;
1095
989
  if ((hostRef.$flags$ & 32 /* hasInitializedComponent */) === 0) {
1096
990
  hostRef.$flags$ |= 32 /* hasInitializedComponent */;
1097
- const bundleId = cmpMeta.$lazyBundleId$;
1098
- if (bundleId) {
1099
- const CstrImport = loadModule(cmpMeta);
991
+ {
992
+ const CstrImport = loadModule(cmpMeta, hostRef);
1100
993
  if (CstrImport && "then" in CstrImport) {
1101
994
  const endLoad = uniqueTime();
1102
995
  Cstr = await CstrImport;
@@ -1118,16 +1011,12 @@ var initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
1118
1011
  try {
1119
1012
  new Cstr(hostRef);
1120
1013
  } catch (e) {
1121
- consoleError(e);
1014
+ consoleError(e, elm);
1122
1015
  }
1123
1016
  {
1124
1017
  hostRef.$flags$ &= ~8 /* isConstructingInstance */;
1125
1018
  }
1126
1019
  endNewInstance();
1127
- } else {
1128
- Cstr = elm.constructor;
1129
- const cmpTag = elm.localName;
1130
- customElements.whenDefined(cmpTag).then(() => hostRef.$flags$ |= 128 /* isWatchReady */);
1131
1020
  }
1132
1021
  if (Cstr && Cstr.style) {
1133
1022
  let style;
@@ -1150,7 +1039,7 @@ var initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
1150
1039
  schedule();
1151
1040
  }
1152
1041
  };
1153
- var fireConnectedCallback = (instance) => {
1042
+ var fireConnectedCallback = (instance, elm) => {
1154
1043
  };
1155
1044
 
1156
1045
  // src/runtime/connected-callback.ts
@@ -1161,12 +1050,6 @@ var connectedCallback = (elm) => {
1161
1050
  const endConnected = createTime("connectedCallback", cmpMeta.$tagName$);
1162
1051
  if (!(hostRef.$flags$ & 1 /* hasConnected */)) {
1163
1052
  hostRef.$flags$ |= 1 /* hasConnected */;
1164
- {
1165
- if (// TODO(STENCIL-854): Remove code related to legacy shadowDomShim field
1166
- cmpMeta.$flags$ & (4 /* hasSlotRelocation */ | 8 /* needsShadowDomShim */)) {
1167
- setContentReference(elm);
1168
- }
1169
- }
1170
1053
  {
1171
1054
  let ancestorComponent = elm;
1172
1055
  while (ancestorComponent = ancestorComponent.parentNode || ancestorComponent.host) {
@@ -1196,14 +1079,7 @@ var connectedCallback = (elm) => {
1196
1079
  endConnected();
1197
1080
  }
1198
1081
  };
1199
- var setContentReference = (elm) => {
1200
- const contentRefElm = elm["s-cr"] = doc.createComment(
1201
- ""
1202
- );
1203
- contentRefElm["s-cn"] = true;
1204
- insertBefore(elm, contentRefElm, elm.firstChild);
1205
- };
1206
- var disconnectInstance = (instance) => {
1082
+ var disconnectInstance = (instance, elm) => {
1207
1083
  };
1208
1084
  var disconnectedCallback = async (elm) => {
1209
1085
  if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) {
@@ -1212,6 +1088,12 @@ var disconnectedCallback = async (elm) => {
1212
1088
  hostRef.$onReadyPromise$.then(() => disconnectInstance());
1213
1089
  }
1214
1090
  }
1091
+ if (rootAppliedStyles.has(elm)) {
1092
+ rootAppliedStyles.delete(elm);
1093
+ }
1094
+ if (elm.shadowRoot && rootAppliedStyles.has(elm.shadowRoot)) {
1095
+ rootAppliedStyles.delete(elm.shadowRoot);
1096
+ }
1215
1097
  };
1216
1098
 
1217
1099
  // src/runtime/bootstrap-lazy.ts
@@ -1252,6 +1134,21 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
1252
1134
  this.hasRegisteredEventListeners = false;
1253
1135
  self = this;
1254
1136
  registerHost(self, cmpMeta);
1137
+ if (cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) {
1138
+ {
1139
+ if (!self.shadowRoot) {
1140
+ {
1141
+ self.attachShadow({ mode: "open" });
1142
+ }
1143
+ } else {
1144
+ if (self.shadowRoot.mode !== "open") {
1145
+ throw new Error(
1146
+ `Unable to re-use existing shadow root for ${cmpMeta.$tagName$}! Mode is set to ${self.shadowRoot.mode} but Stencil only supports open shadow roots.`
1147
+ );
1148
+ }
1149
+ }
1150
+ }
1151
+ }
1255
1152
  }
1256
1153
  connectedCallback() {
1257
1154
  getHostRef(this);
@@ -1270,6 +1167,13 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
1270
1167
  }
1271
1168
  disconnectedCallback() {
1272
1169
  plt.jmp(() => disconnectedCallback(this));
1170
+ plt.raf(() => {
1171
+ var _a3;
1172
+ const hostRef = getHostRef(this);
1173
+ if (((_a3 = hostRef == null ? void 0 : hostRef.$vnode$) == null ? void 0 : _a3.$elm$) instanceof Node && !hostRef.$vnode$.$elm$.isConnected) {
1174
+ delete hostRef.$vnode$.$elm$;
1175
+ }
1176
+ });
1273
1177
  }
1274
1178
  componentOnReady() {
1275
1179
  return getHostRef(this).$onReadyPromise$;
@@ -1315,6 +1219,6 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
1315
1219
  // src/runtime/nonce.ts
1316
1220
  var setNonce = (nonce) => plt.$nonce$ = nonce;
1317
1221
 
1318
- export { bootstrapLazy as b, h, promiseResolve as p, registerInstance as r, setNonce as s };
1222
+ export { bootstrapLazy as b, createEvent as c, h, promiseResolve as p, registerInstance as r, setNonce as s };
1319
1223
 
1320
- //# sourceMappingURL=index-73dab88a.js.map
1224
+ //# sourceMappingURL=index-45a8db1c.js.map