@maggioli-design-system/mds-modal 5.3.0 → 5.5.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 (92) hide show
  1. package/dist/cjs/{index-6f236cfa.js → index-a263ff04.js} +139 -101
  2. package/dist/cjs/loader.cjs.js +2 -2
  3. package/dist/cjs/mds-modal.cjs.entry.js +35 -4
  4. package/dist/cjs/mds-modal.cjs.js +3 -3
  5. package/dist/collection/collection-manifest.json +1 -1
  6. package/dist/collection/common/floating-controller.js +3 -3
  7. package/dist/collection/common/slot.js +10 -1
  8. package/dist/collection/common/string.js +30 -0
  9. package/dist/collection/components/mds-modal/mds-modal.css +171 -73
  10. package/dist/collection/components/mds-modal/mds-modal.js +59 -2
  11. package/dist/collection/components/mds-modal/meta/dictionary.js +5 -1
  12. package/dist/collection/components/mds-modal/test/mds-modal.stories.js +20 -2
  13. package/dist/collection/dictionary/keyboard.js +84 -0
  14. package/dist/collection/type/keyboard.js +1 -0
  15. package/dist/components/mds-modal.js +36 -4
  16. package/dist/documentation.json +47 -2
  17. package/dist/esm/{index-f8d2dee4.js → index-efd0657a.js} +139 -101
  18. package/dist/esm/loader.js +3 -3
  19. package/dist/esm/mds-modal.entry.js +35 -4
  20. package/dist/esm/mds-modal.js +4 -4
  21. package/dist/esm-es5/index-efd0657a.js +1 -0
  22. package/dist/esm-es5/loader.js +1 -1
  23. package/dist/esm-es5/mds-modal.entry.js +1 -1
  24. package/dist/esm-es5/mds-modal.js +1 -1
  25. package/dist/mds-modal/mds-modal.esm.js +1 -1
  26. package/dist/mds-modal/mds-modal.js +1 -1
  27. package/dist/mds-modal/p-26971abb.js +2 -0
  28. package/dist/mds-modal/p-52bb21e4.system.entry.js +1 -0
  29. package/dist/mds-modal/p-785b3b47.system.js +2 -0
  30. package/dist/mds-modal/p-96b782c7.system.js +1 -0
  31. package/dist/mds-modal/p-df986a83.entry.js +1 -0
  32. package/dist/stats.json +100 -33
  33. package/dist/types/common/slot.d.ts +2 -1
  34. package/dist/types/common/string.d.ts +4 -0
  35. package/dist/types/components/mds-modal/mds-modal.d.ts +8 -1
  36. package/dist/types/components/mds-modal/meta/dictionary.d.ts +2 -1
  37. package/dist/types/components/mds-modal/meta/types.d.ts +1 -0
  38. package/dist/types/components/mds-modal/test/mds-modal.stories.d.ts +11 -0
  39. package/dist/types/components.d.ts +10 -2
  40. package/dist/types/dictionary/keyboard.d.ts +2 -0
  41. package/dist/types/type/keyboard.d.ts +12 -0
  42. package/documentation.json +62 -2
  43. package/package.json +4 -4
  44. package/readme.md +18 -16
  45. package/src/common/floating-controller.ts +6 -6
  46. package/src/common/slot.ts +11 -0
  47. package/src/common/string.ts +42 -0
  48. package/src/components/mds-modal/css/mds-modal-animate-bottom-left.css +2 -2
  49. package/src/components/mds-modal/css/mds-modal-animate-bottom-right.css +2 -2
  50. package/src/components/mds-modal/css/mds-modal-animate-bottom.css +2 -2
  51. package/src/components/mds-modal/css/mds-modal-animate-center.css +2 -2
  52. package/src/components/mds-modal/css/mds-modal-animate-left.css +2 -2
  53. package/src/components/mds-modal/css/mds-modal-animate-right.css +2 -2
  54. package/src/components/mds-modal/css/mds-modal-animate-top-left.css +2 -2
  55. package/src/components/mds-modal/css/mds-modal-animate-top-right.css +2 -2
  56. package/src/components/mds-modal/css/mds-modal-animate-top.css +2 -2
  57. package/src/components/mds-modal/css/mds-modal-animate.css +4 -4
  58. package/src/components/mds-modal/css/mds-modal-pref-animation.css +14 -23
  59. package/src/components/mds-modal/css/mds-modal-pref-contrast.css +5 -13
  60. package/src/components/mds-modal/css/mds-modal-pref-theme.css +6 -15
  61. package/src/components/mds-modal/mds-modal.css +9 -6
  62. package/src/components/mds-modal/mds-modal.tsx +36 -1
  63. package/src/components/mds-modal/meta/dictionary.ts +6 -0
  64. package/src/components/mds-modal/meta/types.ts +4 -0
  65. package/src/components/mds-modal/readme.md +18 -16
  66. package/src/components/mds-modal/test/mds-modal.stories.tsx +57 -3
  67. package/src/components.d.ts +10 -2
  68. package/src/dictionary/keyboard.ts +87 -0
  69. package/src/fixtures/icons.json +18 -1
  70. package/src/meta/keyboard/keys.json +83 -0
  71. package/src/tailwind/components.css +11 -46
  72. package/src/tailwind/fouc.css +118 -0
  73. package/src/tailwind/index.css +4 -0
  74. package/src/type/keyboard.ts +93 -0
  75. package/www/build/mds-modal.esm.js +1 -1
  76. package/www/build/mds-modal.js +1 -1
  77. package/www/build/p-26971abb.js +2 -0
  78. package/www/build/p-52bb21e4.system.entry.js +1 -0
  79. package/www/build/p-785b3b47.system.js +2 -0
  80. package/www/build/p-96b782c7.system.js +1 -0
  81. package/www/build/p-df986a83.entry.js +1 -0
  82. package/dist/esm-es5/index-f8d2dee4.js +0 -1
  83. package/dist/mds-modal/p-413a00c5.entry.js +0 -1
  84. package/dist/mds-modal/p-96958acc.system.entry.js +0 -1
  85. package/dist/mds-modal/p-bc1fa4e4.system.js +0 -2
  86. package/dist/mds-modal/p-c6899cb0.system.js +0 -1
  87. package/dist/mds-modal/p-ee90f86a.js +0 -2
  88. package/www/build/p-413a00c5.entry.js +0 -1
  89. package/www/build/p-96958acc.system.entry.js +0 -1
  90. package/www/build/p-bc1fa4e4.system.js +0 -2
  91. package/www/build/p-c6899cb0.system.js +0 -1
  92. package/www/build/p-ee90f86a.js +0 -2
@@ -1,8 +1,8 @@
1
1
  const NAMESPACE = 'mds-modal';
2
- const BUILD = /* mds-modal */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, cmpDidLoad: true, cmpDidRender: false, cmpDidUnload: false, cmpDidUpdate: false, cmpShouldUpdate: false, cmpWillLoad: true, cmpWillRender: true, 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: true, hostListenerTarget: true, hostListenerTargetBody: false, hostListenerTargetDocument: true, hostListenerTargetParent: false, hostListenerTargetWindow: false, hotModuleReplacement: false, hydrateClientSide: false, hydrateServerSide: false, hydratedAttribute: true, hydratedClass: false, hydratedSelectorName: "hydrated", initializeNextTick: false, invisiblePrehydration: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, 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: true, scoped: false, scopedSlotTextContentFix: false, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: true, slot: true, slotChildNodesFix: false, slotRelocation: false, state: false, style: true, svg: false, taskQueue: true, transformTagName: false, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: false, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: false, vdomRender: true, vdomStyle: false, vdomText: true, vdomXlink: false, watchCallback: true };
2
+ const BUILD = /* mds-modal */ { allRenderFn: true, appendChildSlotFix: false, asyncLoading: true, asyncQueue: false, attachStyles: true, cloneNodeFix: false, constructableCSS: true, cssAnnotations: true, devTools: false, element: false, event: true, experimentalScopedSlotChanges: false, experimentalSlotFixes: false, formAssociated: false, hasRenderFn: true, hostListener: true, hostListenerTarget: true, hostListenerTargetBody: false, hostListenerTargetDocument: true, hostListenerTargetParent: false, hostListenerTargetWindow: false, hotModuleReplacement: false, hydrateClientSide: false, hydrateServerSide: false, hydratedAttribute: true, hydratedClass: false, hydratedSelectorName: "hydrated", initializeNextTick: false, invisiblePrehydration: true, isDebug: false, isDev: false, isTesting: false, lazyLoad: true, lifecycle: true, 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: true, scoped: false, scopedSlotTextContentFix: false, scriptDataOpts: false, shadowDelegatesFocus: false, shadowDom: true, slot: true, slotChildNodesFix: false, slotRelocation: false, state: false, style: true, svg: false, taskQueue: true, transformTagName: false, updatable: true, vdomAttribute: true, vdomClass: true, vdomFunctional: false, vdomKey: true, vdomListener: true, vdomPropOrAttr: true, vdomRef: false, vdomRender: true, vdomStyle: false, vdomText: true, vdomXlink: false, watchCallback: true };
3
3
 
4
4
  /*
5
- Stencil Client Platform v4.25.1 | MIT Licensed | https://stenciljs.com
5
+ Stencil Client Platform v4.27.2 | MIT Licensed | https://stenciljs.com
6
6
  */
7
7
  var __defProp = Object.defineProperty;
8
8
  var __export = (target, all) => {
@@ -11,10 +11,15 @@ var __export = (target, all) => {
11
11
  };
12
12
 
13
13
  // src/client/client-host-ref.ts
14
- var hostRefs = /* @__PURE__ */ new WeakMap();
15
- var getHostRef = (ref) => hostRefs.get(ref);
14
+ var getHostRef = (ref) => {
15
+ if (ref.__stencil__getHostRef) {
16
+ return ref.__stencil__getHostRef();
17
+ }
18
+ return void 0;
19
+ };
16
20
  var registerInstance = (lazyInstance, hostRef) => {
17
- hostRefs.set(hostRef.$lazyInstance$ = lazyInstance, hostRef);
21
+ lazyInstance.__stencil__getHostRef = () => hostRef;
22
+ hostRef.$lazyInstance$ = lazyInstance;
18
23
  };
19
24
  var registerHost = (hostElement, cmpMeta) => {
20
25
  const hostRef = {
@@ -28,7 +33,8 @@ var registerHost = (hostElement, cmpMeta) => {
28
33
  hostElement["s-p"] = [];
29
34
  hostElement["s-rc"] = [];
30
35
  }
31
- const ref = hostRefs.set(hostElement, hostRef);
36
+ const ref = hostRef;
37
+ hostElement.__stencil__getHostRef = () => ref;
32
38
  return ref;
33
39
  };
34
40
  var isMemberInElement = (elm, memberName) => memberName in elm;
@@ -85,7 +91,6 @@ var HYDRATED_STYLE_ID = "sty-id";
85
91
  var HYDRATED_CSS = "{visibility:hidden}[hydrated]{visibility:inherit}";
86
92
  var SLOT_FB_CSS = "slot-fb{display:contents}slot-fb[hidden]{display:none}";
87
93
  var win = typeof window !== "undefined" ? window : {};
88
- var doc = win.document || { head: {} };
89
94
  var plt = {
90
95
  $flags$: 0,
91
96
  $resourcesUrl$: "",
@@ -96,9 +101,10 @@ var plt = {
96
101
  ce: (eventName, opts) => new CustomEvent(eventName, opts)
97
102
  };
98
103
  var supportsListenerOptions = /* @__PURE__ */ (() => {
104
+ var _a;
99
105
  let supportsListenerOptions2 = false;
100
106
  try {
101
- doc.addEventListener(
107
+ (_a = win.document) == null ? void 0 : _a.addEventListener(
102
108
  "e",
103
109
  null,
104
110
  Object.defineProperty({}, "passive", {
@@ -161,9 +167,9 @@ var isComplexType = (o) => {
161
167
  };
162
168
 
163
169
  // src/utils/query-nonce-meta-tag-content.ts
164
- function queryNonceMetaTagContent(doc2) {
170
+ function queryNonceMetaTagContent(doc) {
165
171
  var _a, _b, _c;
166
- return (_c = (_b = (_a = doc2.head) == null ? void 0 : _a.querySelector('meta[name="csp-nonce"]')) == null ? void 0 : _b.getAttribute("content")) != null ? _c : void 0;
172
+ return (_c = (_b = (_a = doc.head) == null ? void 0 : _a.querySelector('meta[name="csp-nonce"]')) == null ? void 0 : _b.getAttribute("content")) != null ? _c : void 0;
167
173
  }
168
174
 
169
175
  // src/utils/result.ts
@@ -344,7 +350,10 @@ var addStyle = (styleContainerNode, cmpMeta, mode) => {
344
350
  var _a;
345
351
  const scopeId2 = getScopeId(cmpMeta);
346
352
  const style = styles.get(scopeId2);
347
- styleContainerNode = styleContainerNode.nodeType === 11 /* DocumentFragment */ ? styleContainerNode : doc;
353
+ if (!win.document) {
354
+ return scopeId2;
355
+ }
356
+ styleContainerNode = styleContainerNode.nodeType === 11 /* DocumentFragment */ ? styleContainerNode : win.document;
348
357
  if (style) {
349
358
  if (typeof style === "string") {
350
359
  styleContainerNode = styleContainerNode.head || styleContainerNode;
@@ -355,9 +364,9 @@ var addStyle = (styleContainerNode, cmpMeta, mode) => {
355
364
  }
356
365
  if (!appliedStyles.has(scopeId2)) {
357
366
  {
358
- styleElm = document.querySelector(`[${HYDRATED_STYLE_ID}="${scopeId2}"]`) || doc.createElement("style");
367
+ styleElm = document.querySelector(`[${HYDRATED_STYLE_ID}="${scopeId2}"]`) || win.document.createElement("style");
359
368
  styleElm.innerHTML = style;
360
- const nonce = (_a = plt.$nonce$) != null ? _a : queryNonceMetaTagContent(doc);
369
+ const nonce = (_a = plt.$nonce$) != null ? _a : queryNonceMetaTagContent(win.document);
361
370
  if (nonce != null) {
362
371
  styleElm.setAttribute("nonce", nonce);
363
372
  }
@@ -386,7 +395,7 @@ var addStyle = (styleContainerNode, cmpMeta, mode) => {
386
395
  styleContainerNode.append(styleElm);
387
396
  }
388
397
  }
389
- if (cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */ && styleContainerNode.nodeName !== "HEAD") {
398
+ if (cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) {
390
399
  styleContainerNode.insertBefore(styleElm, null);
391
400
  }
392
401
  }
@@ -411,7 +420,7 @@ var attachStyles = (hostRef) => {
411
420
  const scopeId2 = addStyle(
412
421
  elm.shadowRoot ? elm.shadowRoot : elm.getRootNode(),
413
422
  cmpMeta);
414
- if (flags & 10 /* needsScopedEncapsulation */ && flags & 2 /* scopedCssEncapsulation */) {
423
+ if ((flags & 10 /* needsScopedEncapsulation */ && flags & 2 /* scopedCssEncapsulation */ || flags & 128 /* shadowNeedsScopedCss */)) {
415
424
  elm["s-sc"] = scopeId2;
416
425
  elm.classList.add(scopeId2 + "-h");
417
426
  }
@@ -419,68 +428,69 @@ var attachStyles = (hostRef) => {
419
428
  };
420
429
  var getScopeId = (cmp, mode) => "sc-" + (cmp.$tagName$);
421
430
  var setAccessor = (elm, memberName, oldValue, newValue, isSvg, flags, initialRender) => {
422
- if (oldValue !== newValue) {
423
- let isProp = isMemberInElement(elm, memberName);
424
- let ln = memberName.toLowerCase();
425
- if (memberName === "class") {
426
- const classList = elm.classList;
427
- const oldClasses = parseClassList(oldValue);
428
- let newClasses = parseClassList(newValue);
429
- {
430
- classList.remove(...oldClasses.filter((c) => c && !newClasses.includes(c)));
431
- classList.add(...newClasses.filter((c) => c && !oldClasses.includes(c)));
432
- }
433
- } else if (memberName === "key") ; else if ((!isProp ) && memberName[0] === "o" && memberName[1] === "n") {
434
- if (memberName[2] === "-") {
435
- memberName = memberName.slice(3);
436
- } else if (isMemberInElement(win, ln)) {
437
- memberName = ln.slice(2);
438
- } else {
439
- memberName = ln[2] + memberName.slice(3);
431
+ if (oldValue === newValue) {
432
+ return;
433
+ }
434
+ let isProp = isMemberInElement(elm, memberName);
435
+ let ln = memberName.toLowerCase();
436
+ if (memberName === "class") {
437
+ const classList = elm.classList;
438
+ const oldClasses = parseClassList(oldValue);
439
+ let newClasses = parseClassList(newValue);
440
+ {
441
+ classList.remove(...oldClasses.filter((c) => c && !newClasses.includes(c)));
442
+ classList.add(...newClasses.filter((c) => c && !oldClasses.includes(c)));
443
+ }
444
+ } else if (memberName === "key") ; else if ((!isProp ) && memberName[0] === "o" && memberName[1] === "n") {
445
+ if (memberName[2] === "-") {
446
+ memberName = memberName.slice(3);
447
+ } else if (isMemberInElement(win, ln)) {
448
+ memberName = ln.slice(2);
449
+ } else {
450
+ memberName = ln[2] + memberName.slice(3);
451
+ }
452
+ if (oldValue || newValue) {
453
+ const capture = memberName.endsWith(CAPTURE_EVENT_SUFFIX);
454
+ memberName = memberName.replace(CAPTURE_EVENT_REGEX, "");
455
+ if (oldValue) {
456
+ plt.rel(elm, memberName, oldValue, capture);
440
457
  }
441
- if (oldValue || newValue) {
442
- const capture = memberName.endsWith(CAPTURE_EVENT_SUFFIX);
443
- memberName = memberName.replace(CAPTURE_EVENT_REGEX, "");
444
- if (oldValue) {
445
- plt.rel(elm, memberName, oldValue, capture);
446
- }
447
- if (newValue) {
448
- plt.ael(elm, memberName, newValue, capture);
449
- }
458
+ if (newValue) {
459
+ plt.ael(elm, memberName, newValue, capture);
450
460
  }
451
- } else {
452
- const isComplex = isComplexType(newValue);
453
- if ((isProp || isComplex && newValue !== null) && !isSvg) {
454
- try {
455
- if (!elm.tagName.includes("-")) {
456
- const n = newValue == null ? "" : newValue;
457
- if (memberName === "list") {
458
- isProp = false;
459
- } else if (oldValue == null || elm[memberName] != n) {
460
- if (typeof elm.__lookupSetter__(memberName) === "function") {
461
- elm[memberName] = n;
462
- } else {
463
- elm.setAttribute(memberName, n);
464
- }
461
+ }
462
+ } else {
463
+ const isComplex = isComplexType(newValue);
464
+ if ((isProp || isComplex && newValue !== null) && !isSvg) {
465
+ try {
466
+ if (!elm.tagName.includes("-")) {
467
+ const n = newValue == null ? "" : newValue;
468
+ if (memberName === "list") {
469
+ isProp = false;
470
+ } else if (oldValue == null || elm[memberName] != n) {
471
+ if (typeof elm.__lookupSetter__(memberName) === "function") {
472
+ elm[memberName] = n;
473
+ } else {
474
+ elm.setAttribute(memberName, n);
465
475
  }
466
- } else if (elm[memberName] !== newValue) {
467
- elm[memberName] = newValue;
468
476
  }
469
- } catch (e) {
477
+ } else if (elm[memberName] !== newValue) {
478
+ elm[memberName] = newValue;
470
479
  }
480
+ } catch (e) {
471
481
  }
472
- if (newValue == null || newValue === false) {
473
- if (newValue !== false || elm.getAttribute(memberName) === "") {
474
- {
475
- elm.removeAttribute(memberName);
476
- }
477
- }
478
- } else if ((!isProp || flags & 4 /* isHost */ || isSvg) && !isComplex) {
479
- newValue = newValue === true ? "" : newValue;
482
+ }
483
+ if (newValue == null || newValue === false) {
484
+ if (newValue !== false || elm.getAttribute(memberName) === "") {
480
485
  {
481
- elm.setAttribute(memberName, newValue);
486
+ elm.removeAttribute(memberName);
482
487
  }
483
488
  }
489
+ } else if ((!isProp || flags & 4 /* isHost */ || isSvg) && !isComplex && elm.nodeType === 1 /* ElementNode */) {
490
+ newValue = newValue === true ? "" : newValue;
491
+ {
492
+ elm.setAttribute(memberName, newValue);
493
+ }
484
494
  }
485
495
  }
486
496
  };
@@ -543,9 +553,14 @@ var createElm = (oldParentVNode, newParentVNode, childIndex) => {
543
553
  let elm;
544
554
  let childNode;
545
555
  if (newVNode2.$text$ !== null) {
546
- elm = newVNode2.$elm$ = doc.createTextNode(newVNode2.$text$);
556
+ elm = newVNode2.$elm$ = win.document.createTextNode(newVNode2.$text$);
547
557
  } else {
548
- elm = newVNode2.$elm$ = doc.createElement(
558
+ if (!win.document) {
559
+ throw new Error(
560
+ "You are trying to render a Stencil component in an environment that doesn't support the DOM. Make sure to populate the [`window`](https://developer.mozilla.org/en-US/docs/Web/API/Window/window) object before rendering a component."
561
+ );
562
+ }
563
+ elm = newVNode2.$elm$ = win.document.createElement(
549
564
  !useNativeShadowDom && BUILD.slotRelocation && newVNode2.$flags$ & 2 /* isSlotFallback */ ? "slot-fb" : newVNode2.$tag$
550
565
  );
551
566
  {
@@ -690,13 +705,10 @@ var patch = (oldVNode, newVNode2, isInitialRender = false) => {
690
705
  const elm = newVNode2.$elm$ = oldVNode.$elm$;
691
706
  const oldChildren = oldVNode.$children$;
692
707
  const newChildren = newVNode2.$children$;
693
- const tag = newVNode2.$tag$;
694
708
  const text = newVNode2.$text$;
695
709
  if (text === null) {
696
710
  {
697
- if (tag === "slot" && !useNativeShadowDom) ; else {
698
- updateElement(oldVNode, newVNode2, isSvgMode);
699
- }
711
+ updateElement(oldVNode, newVNode2, isSvgMode);
700
712
  }
701
713
  if (oldChildren !== null && newChildren !== null) {
702
714
  updateChildren(elm, oldChildren, newVNode2, newChildren, isInitialRender);
@@ -743,7 +755,7 @@ var renderVdom = (hostRef, renderFnResults, isInitialLoad = false) => {
743
755
  rootVnode.$flags$ |= 4 /* isHost */;
744
756
  hostRef.$vnode$ = rootVnode;
745
757
  rootVnode.$elm$ = oldVNode.$elm$ = hostElm.shadowRoot || hostElm ;
746
- useNativeShadowDom = (cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) !== 0;
758
+ useNativeShadowDom = !!(cmpMeta.$flags$ & 1 /* shadowDomEncapsulation */) && !(cmpMeta.$flags$ & 128 /* shadowNeedsScopedCss */);
747
759
  patch(oldVNode, rootVnode, isInitialLoad);
748
760
  };
749
761
 
@@ -790,13 +802,11 @@ var dispatchHooks = (hostRef, isInitialLoad) => {
790
802
  hostRef.$queuedListeners$ = void 0;
791
803
  }
792
804
  }
793
- {
794
- maybePromise = safeCall(instance, "componentWillLoad", void 0, elm);
795
- }
796
- }
797
- {
798
- maybePromise = enqueue(maybePromise, () => safeCall(instance, "componentWillRender", void 0, elm));
805
+ maybePromise = safeCall(instance, "componentWillLoad", void 0, elm);
806
+ } else {
807
+ maybePromise = safeCall(instance, "componentWillUpdate", void 0, elm);
799
808
  }
809
+ maybePromise = enqueue(maybePromise, () => safeCall(instance, "componentWillRender", void 0, elm));
800
810
  endSchedule();
801
811
  return enqueue(maybePromise, () => updateComponent(hostRef, instance, isInitialLoad));
802
812
  };
@@ -862,14 +872,13 @@ var postUpdateComponent = (hostRef) => {
862
872
  const endPostUpdate = createTime("postUpdate", tagName);
863
873
  const instance = hostRef.$lazyInstance$ ;
864
874
  const ancestorComponent = hostRef.$ancestorComponent$;
875
+ safeCall(instance, "componentDidRender", void 0, elm);
865
876
  if (!(hostRef.$flags$ & 64 /* hasLoadedComponent */)) {
866
877
  hostRef.$flags$ |= 64 /* hasLoadedComponent */;
867
878
  {
868
879
  addHydratedFlag(elm);
869
880
  }
870
- {
871
- safeCall(instance, "componentDidLoad", void 0, elm);
872
- }
881
+ safeCall(instance, "componentDidLoad", void 0, elm);
873
882
  endPostUpdate();
874
883
  {
875
884
  hostRef.$onReadyResolve$(elm);
@@ -878,6 +887,7 @@ var postUpdateComponent = (hostRef) => {
878
887
  }
879
888
  }
880
889
  } else {
890
+ safeCall(instance, "componentDidUpdate", void 0, elm);
881
891
  endPostUpdate();
882
892
  }
883
893
  {
@@ -892,9 +902,6 @@ var postUpdateComponent = (hostRef) => {
892
902
  }
893
903
  };
894
904
  var appDidLoad = (who) => {
895
- {
896
- addHydratedFlag(doc.documentElement);
897
- }
898
905
  nextTick(() => emitEvent(win, "appload", { detail: { namespace: NAMESPACE } }));
899
906
  };
900
907
  var safeCall = (instance, method, arg, elm) => {
@@ -918,7 +925,7 @@ var setValue = (ref, propName, newVal, cmpMeta) => {
918
925
  const hostRef = getHostRef(ref);
919
926
  if (!hostRef) {
920
927
  throw new Error(
921
- `Couldn't find host element for "${cmpMeta.$tagName$}" as it is unknown to this Stencil runtime. This usually happens when integrating a 3rd party Stencil component with another Stencil component or application. Please reach out to the maintainers of the 3rd party Stencil component or report this on the Stencil Discord server (https://chat.stenciljs.com) or comment on this similar [GitHub issue](https://github.com/ionic-team/stencil/issues/5457).`
928
+ `Couldn't find host element for "${cmpMeta.$tagName$}" as it is unknown to this Stencil runtime. This usually happens when integrating a 3rd party Stencil component with another Stencil component or application. Please reach out to the maintainers of the 3rd party Stencil component or report this on the Stencil Discord server (https://chat.stenciljs.com) or comment on this similar [GitHub issue](https://github.com/stenciljs/core/issues/5457).`
922
929
  );
923
930
  }
924
931
  const elm = hostRef.$hostElement$ ;
@@ -944,6 +951,11 @@ var setValue = (ref, propName, newVal, cmpMeta) => {
944
951
  }
945
952
  }
946
953
  if ((flags & (2 /* hasRendered */ | 16 /* isQueuedForUpdate */)) === 2 /* hasRendered */) {
954
+ if (instance.componentShouldUpdate) {
955
+ if (instance.componentShouldUpdate(newVal, oldVal, propName) === false) {
956
+ return;
957
+ }
958
+ }
947
959
  scheduleUpdate(hostRef, false);
948
960
  }
949
961
  }
@@ -1083,7 +1095,8 @@ var initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
1083
1095
  let Cstr;
1084
1096
  if ((hostRef.$flags$ & 32 /* hasInitializedComponent */) === 0) {
1085
1097
  hostRef.$flags$ |= 32 /* hasInitializedComponent */;
1086
- {
1098
+ const bundleId = cmpMeta.$lazyBundleId$;
1099
+ if (bundleId) {
1087
1100
  const CstrImport = loadModule(cmpMeta, hostRef);
1088
1101
  if (CstrImport && "then" in CstrImport) {
1089
1102
  const endLoad = uniqueTime();
@@ -1118,6 +1131,11 @@ var initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
1118
1131
  hostRef.$flags$ |= 128 /* isWatchReady */;
1119
1132
  }
1120
1133
  endNewInstance();
1134
+ fireConnectedCallback(hostRef.$lazyInstance$, elm);
1135
+ } else {
1136
+ Cstr = elm.constructor;
1137
+ const cmpTag = elm.localName;
1138
+ customElements.whenDefined(cmpTag).then(() => hostRef.$flags$ |= 128 /* isWatchReady */);
1121
1139
  }
1122
1140
  if (Cstr && Cstr.style) {
1123
1141
  let style;
@@ -1141,6 +1159,9 @@ var initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId) => {
1141
1159
  }
1142
1160
  };
1143
1161
  var fireConnectedCallback = (instance, elm) => {
1162
+ {
1163
+ safeCall(instance, "connectedCallback", void 0, elm);
1164
+ }
1144
1165
  };
1145
1166
 
1146
1167
  // src/runtime/connected-callback.ts
@@ -1174,14 +1195,19 @@ var connectedCallback = (elm) => {
1174
1195
  }
1175
1196
  } else {
1176
1197
  addHostEventListeners(elm, hostRef, cmpMeta.$listeners$);
1177
- if (hostRef == null ? void 0 : hostRef.$lazyInstance$) ; else if (hostRef == null ? void 0 : hostRef.$onReadyPromise$) {
1178
- hostRef.$onReadyPromise$.then(() => fireConnectedCallback());
1198
+ if (hostRef == null ? void 0 : hostRef.$lazyInstance$) {
1199
+ fireConnectedCallback(hostRef.$lazyInstance$, elm);
1200
+ } else if (hostRef == null ? void 0 : hostRef.$onReadyPromise$) {
1201
+ hostRef.$onReadyPromise$.then(() => fireConnectedCallback(hostRef.$lazyInstance$, elm));
1179
1202
  }
1180
1203
  }
1181
1204
  endConnected();
1182
1205
  }
1183
1206
  };
1184
1207
  var disconnectInstance = (instance, elm) => {
1208
+ {
1209
+ safeCall(instance, "disconnectedCallback", void 0, elm || instance);
1210
+ }
1185
1211
  };
1186
1212
  var disconnectedCallback = async (elm) => {
1187
1213
  if ((plt.$flags$ & 1 /* isTmpDisconnected */) === 0) {
@@ -1192,8 +1218,10 @@ var disconnectedCallback = async (elm) => {
1192
1218
  hostRef.$rmListeners$ = void 0;
1193
1219
  }
1194
1220
  }
1195
- if (hostRef == null ? void 0 : hostRef.$lazyInstance$) ; else if (hostRef == null ? void 0 : hostRef.$onReadyPromise$) {
1196
- hostRef.$onReadyPromise$.then(() => disconnectInstance());
1221
+ if (hostRef == null ? void 0 : hostRef.$lazyInstance$) {
1222
+ disconnectInstance(hostRef.$lazyInstance$, elm);
1223
+ } else if (hostRef == null ? void 0 : hostRef.$onReadyPromise$) {
1224
+ hostRef.$onReadyPromise$.then(() => disconnectInstance(hostRef.$lazyInstance$, elm));
1197
1225
  }
1198
1226
  }
1199
1227
  if (rootAppliedStyles.has(elm)) {
@@ -1207,18 +1235,22 @@ var disconnectedCallback = async (elm) => {
1207
1235
  // src/runtime/bootstrap-lazy.ts
1208
1236
  var bootstrapLazy = (lazyBundles, options = {}) => {
1209
1237
  var _a;
1238
+ if (!win.document) {
1239
+ console.warn("Stencil: No document found. Skipping bootstrapping lazy components.");
1240
+ return;
1241
+ }
1210
1242
  const endBootstrap = createTime();
1211
1243
  const cmpTags = [];
1212
1244
  const exclude = options.exclude || [];
1213
1245
  const customElements2 = win.customElements;
1214
- const head = doc.head;
1246
+ const head = win.document.head;
1215
1247
  const metaCharset = /* @__PURE__ */ head.querySelector("meta[charset]");
1216
- const dataStyles = /* @__PURE__ */ doc.createElement("style");
1248
+ const dataStyles = /* @__PURE__ */ win.document.createElement("style");
1217
1249
  const deferredConnectedCallbacks = [];
1218
1250
  let appLoadFallback;
1219
1251
  let isBootstrapping = true;
1220
1252
  Object.assign(plt, options);
1221
- plt.$resourcesUrl$ = new URL(options.resourcesUrl || "./", doc.baseURI).href;
1253
+ plt.$resourcesUrl$ = new URL(options.resourcesUrl || "./", win.document.baseURI).href;
1222
1254
  let hasSlotRelocation = false;
1223
1255
  lazyBundles.map((lazyBundle) => {
1224
1256
  lazyBundle[1].map((compactMeta) => {
@@ -1289,6 +1321,10 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
1289
1321
  plt.raf(() => {
1290
1322
  var _a3;
1291
1323
  const hostRef = getHostRef(this);
1324
+ const i2 = deferredConnectedCallbacks.findIndex((host) => host === this);
1325
+ if (i2 > -1) {
1326
+ deferredConnectedCallbacks.splice(i2, 1);
1327
+ }
1292
1328
  if (((_a3 = hostRef == null ? void 0 : hostRef.$vnode$) == null ? void 0 : _a3.$elm$) instanceof Node && !hostRef.$vnode$.$elm$.isConnected) {
1293
1329
  delete hostRef.$vnode$.$elm$;
1294
1330
  }
@@ -1317,7 +1353,7 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
1317
1353
  }
1318
1354
  if (dataStyles.innerHTML.length) {
1319
1355
  dataStyles.setAttribute("data-styles", "");
1320
- const nonce = (_a = plt.$nonce$) != null ? _a : queryNonceMetaTagContent(doc);
1356
+ const nonce = (_a = plt.$nonce$) != null ? _a : queryNonceMetaTagContent(win.document);
1321
1357
  if (nonce != null) {
1322
1358
  dataStyles.setAttribute("nonce", nonce);
1323
1359
  }
@@ -1335,9 +1371,9 @@ var bootstrapLazy = (lazyBundles, options = {}) => {
1335
1371
  endBootstrap();
1336
1372
  };
1337
1373
  var addHostEventListeners = (elm, hostRef, listeners, attachParentListeners) => {
1338
- if (listeners) {
1374
+ if (listeners && win.document) {
1339
1375
  listeners.map(([flags, name, method]) => {
1340
- const target = getHostListenerTarget(elm, flags) ;
1376
+ const target = getHostListenerTarget(win.document, elm, flags) ;
1341
1377
  const handler = hostListenerProxy(hostRef, method);
1342
1378
  const opts = hostListenerOpts(flags);
1343
1379
  plt.ael(target, name, handler, opts);
@@ -1359,8 +1395,10 @@ var hostListenerProxy = (hostRef, methodName) => (ev) => {
1359
1395
  consoleError(e, hostRef.$hostElement$);
1360
1396
  }
1361
1397
  };
1362
- var getHostListenerTarget = (elm, flags) => {
1363
- if (flags & 4 /* TargetDocument */) return doc;
1398
+ var getHostListenerTarget = (doc, elm, flags) => {
1399
+ if (flags & 4 /* TargetDocument */) {
1400
+ return doc;
1401
+ }
1364
1402
  return elm;
1365
1403
  };
1366
1404
  var hostListenerOpts = (flags) => supportsListenerOptions ? {
@@ -1,11 +1,11 @@
1
- import { b as bootstrapLazy } from './index-f8d2dee4.js';
2
- export { s as setNonce } from './index-f8d2dee4.js';
1
+ import { b as bootstrapLazy } from './index-efd0657a.js';
2
+ export { s as setNonce } from './index-efd0657a.js';
3
3
  import { g as globalScripts } from './app-globals-0f993ce5.js';
4
4
 
5
5
  const defineCustomElements = async (win, options) => {
6
6
  if (typeof window === 'undefined') return undefined;
7
7
  await globalScripts();
8
- return bootstrapLazy([["mds-modal",[[1,"mds-modal",{"opened":[1540],"position":[1537],"animating":[1537]},[[4,"mdsModalClose","onModalCloseListener"],[4,"mdsBannerClose","onBannerCloseListener"]],{"opened":["handleOpenProp"]}]]]], options);
8
+ return bootstrapLazy([["mds-modal",[[1,"mds-modal",{"opened":[1540],"position":[1537],"animating":[1537],"overflow":[513]},[[4,"mdsModalClose","onModalCloseListener"],[4,"mdsBannerClose","onBannerCloseListener"]],{"opened":["handleOpenProp"]}]]]], options);
9
9
  };
10
10
 
11
11
  export { defineCustomElements };