@maggioli-design-system/mds-accordion-timer 3.3.0 → 3.4.1

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 (56) hide show
  1. package/dist/cjs/{index-b99075ba.js → index-569353a6.js} +191 -45
  2. package/dist/cjs/loader.cjs.js +2 -11
  3. package/dist/cjs/mds-accordion-timer.cjs.entry.js +1 -1
  4. package/dist/cjs/mds-accordion-timer.cjs.js +2 -2
  5. package/dist/collection/collection-manifest.json +3 -3
  6. package/dist/collection/common/aria.js +9 -1
  7. package/dist/collection/components/mds-accordion-timer/mds-accordion-timer.js +4 -1
  8. package/dist/collection/components/mds-accordion-timer/test/mds-accordion-timer.e2e.js +10 -0
  9. package/dist/collection/components/mds-accordion-timer/test/mds-accordion-timer.stories.js +2 -2
  10. package/dist/collection/dictionary/icon.js +2 -2
  11. package/dist/components/index.d.ts +5 -3
  12. package/dist/components/index.js +1 -2
  13. package/dist/components/mds-accordion-timer.js +1 -1
  14. package/dist/documentation.d.ts +361 -88
  15. package/dist/documentation.json +28 -7
  16. package/dist/esm/{index-bd689d6a.js → index-8c22e0f7.js} +191 -45
  17. package/dist/esm/loader.js +3 -12
  18. package/dist/esm/mds-accordion-timer.entry.js +1 -1
  19. package/dist/esm/mds-accordion-timer.js +3 -3
  20. package/dist/esm-es5/index-8c22e0f7.js +2 -0
  21. package/dist/esm-es5/loader.js +1 -1
  22. package/dist/esm-es5/mds-accordion-timer.entry.js +1 -1
  23. package/dist/esm-es5/mds-accordion-timer.js +1 -1
  24. package/dist/mds-accordion-timer/mds-accordion-timer.esm.js +1 -1
  25. package/dist/mds-accordion-timer/mds-accordion-timer.js +2 -6
  26. package/dist/mds-accordion-timer/p-0bdccf30.js +2 -0
  27. package/dist/mds-accordion-timer/{p-778834a9.entry.js → p-8c113821.entry.js} +1 -1
  28. package/dist/mds-accordion-timer/{p-5e09eed0.system.js → p-9036e977.system.js} +1 -1
  29. package/dist/mds-accordion-timer/{p-2a65b768.system.entry.js → p-bb796904.system.entry.js} +1 -1
  30. package/dist/mds-accordion-timer/p-df0a41f6.system.js +2 -0
  31. package/dist/stats.json +41 -33
  32. package/dist/types/common/aria.d.ts +2 -1
  33. package/dist/types/components/mds-accordion-timer/mds-accordion-timer.d.ts +3 -0
  34. package/dist/types/stencil-public-runtime.d.ts +32 -17
  35. package/documentation.json +381 -9
  36. package/loader/index.d.ts +2 -2
  37. package/package.json +5 -5
  38. package/readme.md +10 -1
  39. package/src/common/aria.ts +12 -0
  40. package/src/components/mds-accordion-timer/mds-accordion-timer.tsx +4 -0
  41. package/src/components/mds-accordion-timer/readme.md +8 -1
  42. package/src/fixtures/icons.json +22 -0
  43. package/src/fixtures/iconsauce.json +19 -0
  44. package/www/build/mds-accordion-timer.esm.js +1 -1
  45. package/www/build/mds-accordion-timer.js +2 -6
  46. package/www/build/p-0bdccf30.js +2 -0
  47. package/www/build/{p-778834a9.entry.js → p-8c113821.entry.js} +1 -1
  48. package/www/build/{p-5e09eed0.system.js → p-9036e977.system.js} +1 -1
  49. package/www/build/{p-2a65b768.system.entry.js → p-bb796904.system.entry.js} +1 -1
  50. package/www/build/p-df0a41f6.system.js +2 -0
  51. package/dist/esm/polyfills/css-shim.js +0 -1
  52. package/dist/esm-es5/index-bd689d6a.js +0 -2
  53. package/dist/mds-accordion-timer/p-5029b85d.system.js +0 -2
  54. package/dist/mds-accordion-timer/p-a7b74010.js +0 -2
  55. package/www/build/p-5029b85d.system.js +0 -2
  56. package/www/build/p-a7b74010.js +0 -2
@@ -49,6 +49,13 @@ const uniqueTime = (key, measureText) => {
49
49
  };
50
50
  const HYDRATED_CSS = '{visibility:hidden}[hydrated]{visibility:inherit}';
51
51
  const isDef = (v) => v != null;
52
+ /**
53
+ * Check whether a value is a 'complex type', defined here as an object or a
54
+ * function.
55
+ *
56
+ * @param o the value to check
57
+ * @returns whether it's a complex type or not
58
+ */
52
59
  const isComplexType = (o) => {
53
60
  // https://jsperf.com/typeof-fn-object/5
54
61
  o = typeof o;
@@ -217,9 +224,9 @@ const registerStyle = (scopeId, cssText, allowCS) => {
217
224
  }
218
225
  styles.set(scopeId, style);
219
226
  };
220
- const addStyle = (styleContainerNode, cmpMeta, mode, hostElm) => {
227
+ const addStyle = (styleContainerNode, cmpMeta, mode) => {
221
228
  var _a;
222
- let scopeId = getScopeId(cmpMeta);
229
+ const scopeId = getScopeId(cmpMeta);
223
230
  const style = styles.get(scopeId);
224
231
  // if an element is NOT connected then getRootNode() will return the wrong root node
225
232
  // so the fallback is to always use the document for the root node in those cases
@@ -234,10 +241,8 @@ const addStyle = (styleContainerNode, cmpMeta, mode, hostElm) => {
234
241
  }
235
242
  if (!appliedStyles.has(scopeId)) {
236
243
  {
237
- {
238
- styleElm = doc.createElement('style');
239
- styleElm.innerHTML = style;
240
- }
244
+ styleElm = doc.createElement('style');
245
+ styleElm.innerHTML = style;
241
246
  // Apply CSP nonce to the style tag if it exists
242
247
  const nonce = (_a = plt.$nonce$) !== null && _a !== void 0 ? _a : queryNonceMetaTagContent(doc);
243
248
  if (nonce != null) {
@@ -355,15 +360,16 @@ const addVnodes = (parentElm, before, parentVNode, vnodes, startIdx, endIdx) =>
355
360
  * @param vnodes a list of virtual DOM nodes to remove
356
361
  * @param startIdx the index at which to start removing nodes (inclusive)
357
362
  * @param endIdx the index at which to stop removing nodes (inclusive)
358
- * @param vnode a VNode
359
- * @param elm an element
360
363
  */
361
- const removeVnodes = (vnodes, startIdx, endIdx, vnode, elm) => {
362
- for (; startIdx <= endIdx; ++startIdx) {
363
- if ((vnode = vnodes[startIdx])) {
364
- elm = vnode.$elm$;
365
- // remove the vnode's element from the dom
366
- elm.remove();
364
+ const removeVnodes = (vnodes, startIdx, endIdx) => {
365
+ for (let index = startIdx; index <= endIdx; ++index) {
366
+ const vnode = vnodes[index];
367
+ if (vnode) {
368
+ const elm = vnode.$elm$;
369
+ if (elm) {
370
+ // remove the vnode's element from the dom
371
+ elm.remove();
372
+ }
367
373
  }
368
374
  }
369
375
  };
@@ -603,12 +609,39 @@ const patch = (oldVNode, newVNode) => {
603
609
  * @param hostRef data needed to root and render the virtual DOM tree, such as
604
610
  * the DOM node into which it should be rendered.
605
611
  * @param renderFnResults the virtual DOM nodes to be rendered
612
+ * @param isInitialLoad whether or not this is the first call after page load
606
613
  */
607
- const renderVdom = (hostRef, renderFnResults) => {
614
+ const renderVdom = (hostRef, renderFnResults, isInitialLoad = false) => {
608
615
  const hostElm = hostRef.$hostElement$;
609
616
  const oldVNode = hostRef.$vnode$ || newVNode(null, null);
617
+ // if `renderFnResults` is a Host node then we can use it directly. If not,
618
+ // we need to call `h` again to wrap the children of our component in a
619
+ // 'dummy' Host node (well, an empty vnode) since `renderVdom` assumes
620
+ // implicitly that the top-level vdom node is 1) an only child and 2)
621
+ // contains attrs that need to be set on the host element.
610
622
  const rootVnode = isHost(renderFnResults) ? renderFnResults : h(null, null, renderFnResults);
611
623
  hostTagName = hostElm.tagName;
624
+ // On the first render and *only* on the first render we want to check for
625
+ // any attributes set on the host element which are also set on the vdom
626
+ // node. If we find them, we override the value on the VDom node attrs with
627
+ // the value from the host element, which allows developers building apps
628
+ // with Stencil components to override e.g. the `role` attribute on a
629
+ // component even if it's already set on the `Host`.
630
+ if (isInitialLoad && rootVnode.$attrs$) {
631
+ for (const key of Object.keys(rootVnode.$attrs$)) {
632
+ // We have a special implementation in `setAccessor` for `style` and
633
+ // `class` which reconciles values coming from the VDom with values
634
+ // already present on the DOM element, so we don't want to override those
635
+ // attributes on the VDom tree with values from the host element if they
636
+ // are present.
637
+ //
638
+ // Likewise, `ref` and `key` are special internal values for the Stencil
639
+ // runtime and we don't want to override those either.
640
+ if (hostElm.hasAttribute(key) && !['key', 'ref', 'style', 'class'].includes(key)) {
641
+ rootVnode.$attrs$[key] = hostElm[key];
642
+ }
643
+ }
644
+ }
612
645
  rootVnode.$tag$ = null;
613
646
  rootVnode.$flags$ |= 4 /* VNODE_FLAGS.isHost */;
614
647
  hostRef.$vnode$ = rootVnode;
@@ -639,24 +672,85 @@ const scheduleUpdate = (hostRef, isInitialLoad) => {
639
672
  const dispatch = () => dispatchHooks(hostRef, isInitialLoad);
640
673
  return writeTask(dispatch) ;
641
674
  };
675
+ /**
676
+ * Dispatch initial-render and update lifecycle hooks, enqueuing calls to
677
+ * component lifecycle methods like `componentWillLoad` as well as
678
+ * {@link updateComponent}, which will kick off the virtual DOM re-render.
679
+ *
680
+ * @param hostRef a reference to a host DOM node
681
+ * @param isInitialLoad whether we're on the initial load or not
682
+ * @returns an empty Promise which is used to enqueue a series of operations for
683
+ * the component
684
+ */
642
685
  const dispatchHooks = (hostRef, isInitialLoad) => {
643
686
  const endSchedule = createTime('scheduleUpdate', hostRef.$cmpMeta$.$tagName$);
644
687
  const instance = hostRef.$lazyInstance$ ;
645
- let promise;
688
+ // We're going to use this variable together with `enqueue` to implement a
689
+ // little promise-based queue. We start out with it `undefined`. When we add
690
+ // the first function to the queue we'll set this variable to be that
691
+ // function's return value. When we attempt to add subsequent values to the
692
+ // queue we'll check that value and, if it was a `Promise`, we'll then chain
693
+ // the new function off of that `Promise` using `.then()`. This will give our
694
+ // queue two nice properties:
695
+ //
696
+ // 1. If all functions added to the queue are synchronous they'll be called
697
+ // synchronously right away.
698
+ // 2. If all functions added to the queue are asynchronous they'll all be
699
+ // called in order after `dispatchHooks` exits.
700
+ let maybePromise;
646
701
  if (isInitialLoad) {
647
702
  {
648
703
  hostRef.$flags$ |= 256 /* HOST_FLAGS.isListenReady */;
649
704
  if (hostRef.$queuedListeners$) {
650
705
  hostRef.$queuedListeners$.map(([methodName, event]) => safeCall(instance, methodName, event));
651
- hostRef.$queuedListeners$ = null;
706
+ hostRef.$queuedListeners$ = undefined;
652
707
  }
653
708
  }
654
709
  }
655
710
  endSchedule();
656
- return then(promise, () => updateComponent(hostRef, instance, isInitialLoad));
711
+ return enqueue(maybePromise, () => updateComponent(hostRef, instance, isInitialLoad));
657
712
  };
713
+ /**
714
+ * This function uses a Promise to implement a simple first-in, first-out queue
715
+ * of functions to be called.
716
+ *
717
+ * The queue is ordered on the basis of the first argument. If it's
718
+ * `undefined`, then nothing is on the queue yet, so the provided function can
719
+ * be called synchronously (although note that this function may return a
720
+ * `Promise`). The idea is that then the return value of that enqueueing
721
+ * operation is kept around, so that if it was a `Promise` then subsequent
722
+ * functions can be enqueued by calling this function again with that `Promise`
723
+ * as the first argument.
724
+ *
725
+ * @param maybePromise either a `Promise` which should resolve before the next function is called or an 'empty' sentinel
726
+ * @param fn a function to enqueue
727
+ * @returns either a `Promise` or the return value of the provided function
728
+ */
729
+ const enqueue = (maybePromise, fn) => isPromisey(maybePromise) ? maybePromise.then(fn) : fn();
730
+ /**
731
+ * Check that a value is a `Promise`. To check, we first see if the value is an
732
+ * instance of the `Promise` global. In a few circumstances, in particular if
733
+ * the global has been overwritten, this is could be misleading, so we also do
734
+ * a little 'duck typing' check to see if the `.then` property of the value is
735
+ * defined and a function.
736
+ *
737
+ * @param maybePromise it might be a promise!
738
+ * @returns whether it is or not
739
+ */
740
+ const isPromisey = (maybePromise) => maybePromise instanceof Promise ||
741
+ (maybePromise && maybePromise.then && typeof maybePromise.then === 'function');
742
+ /**
743
+ * Update a component given reference to its host elements and so on.
744
+ *
745
+ * @param hostRef an object containing references to the element's host node,
746
+ * VDom nodes, and other metadata
747
+ * @param instance a reference to the underlying host element where it will be
748
+ * rendered
749
+ * @param isInitialLoad whether or not this function is being called as part of
750
+ * the first render cycle
751
+ */
658
752
  const updateComponent = async (hostRef, instance, isInitialLoad) => {
659
- // updateComponent
753
+ var _a;
660
754
  const elm = hostRef.$hostElement$;
661
755
  const endUpdate = createTime('update', hostRef.$cmpMeta$.$tagName$);
662
756
  const rc = elm['s-rc'];
@@ -666,7 +760,7 @@ const updateComponent = async (hostRef, instance, isInitialLoad) => {
666
760
  }
667
761
  const endRender = createTime('render', hostRef.$cmpMeta$.$tagName$);
668
762
  {
669
- callRender(hostRef, instance);
763
+ callRender(hostRef, instance, elm, isInitialLoad);
670
764
  }
671
765
  if (rc) {
672
766
  // ok, so turns out there are some child host elements
@@ -678,7 +772,7 @@ const updateComponent = async (hostRef, instance, isInitialLoad) => {
678
772
  endRender();
679
773
  endUpdate();
680
774
  {
681
- const childrenPromises = elm['s-p'];
775
+ const childrenPromises = (_a = elm['s-p']) !== null && _a !== void 0 ? _a : [];
682
776
  const postUpdate = () => postUpdateComponent(hostRef);
683
777
  if (childrenPromises.length === 0) {
684
778
  postUpdate();
@@ -690,7 +784,19 @@ const updateComponent = async (hostRef, instance, isInitialLoad) => {
690
784
  }
691
785
  }
692
786
  };
693
- const callRender = (hostRef, instance, elm) => {
787
+ /**
788
+ * Handle making the call to the VDom renderer with the proper context given
789
+ * various build variables
790
+ *
791
+ * @param hostRef an object containing references to the element's host node,
792
+ * VDom nodes, and other metadata
793
+ * @param instance a reference to the underlying host element where it will be
794
+ * rendered
795
+ * @param elm the Host element for the component
796
+ * @param isInitialLoad whether or not this function is being called as part of
797
+ * @returns an empty promise
798
+ */
799
+ const callRender = (hostRef, instance, elm, isInitialLoad) => {
694
800
  try {
695
801
  instance = instance.render() ;
696
802
  {
@@ -705,7 +811,7 @@ const callRender = (hostRef, instance, elm) => {
705
811
  // or we need to update the css class/attrs on the host element
706
812
  // DOM WRITE!
707
813
  {
708
- renderVdom(hostRef, instance);
814
+ renderVdom(hostRef, instance, isInitialLoad);
709
815
  }
710
816
  }
711
817
  }
@@ -776,9 +882,6 @@ const safeCall = (instance, method, arg) => {
776
882
  }
777
883
  return undefined;
778
884
  };
779
- const then = (promise, thenFn) => {
780
- return promise && promise.then ? promise.then(thenFn) : thenFn();
781
- };
782
885
  const addHydratedFlag = (elm) => elm.setAttribute('hydrated', '')
783
886
  ;
784
887
  const getValue = (ref, propName) => getHostRef(ref).$instanceValues$.get(propName);
@@ -818,6 +921,7 @@ const setValue = (ref, propName, newVal, cmpMeta) => {
818
921
  * @returns a reference to the same constructor passed in (but now mutated)
819
922
  */
820
923
  const proxyComponent = (Cstr, cmpMeta, flags) => {
924
+ var _a;
821
925
  if (cmpMeta.$members$) {
822
926
  // It's better to have a const than two Object.entries()
823
927
  const members = Object.entries(cmpMeta.$members$);
@@ -842,7 +946,7 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
842
946
  });
843
947
  if ((flags & 1 /* PROXY_FLAGS.isElementConstructor */)) {
844
948
  const attrNameToPropName = new Map();
845
- prototype.attributeChangedCallback = function (attrName, _oldValue, newValue) {
949
+ prototype.attributeChangedCallback = function (attrName, oldValue, newValue) {
846
950
  plt.jmp(() => {
847
951
  const propName = attrNameToPropName.get(attrName);
848
952
  // In a web component lifecycle the attributeChangedCallback runs prior to connectedCallback
@@ -865,12 +969,12 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
865
969
  // customElements.define('my-component', MyComponent);
866
970
  // </script>
867
971
  // ```
868
- // In this case if we do not unshadow here and use the value of the shadowing property, attributeChangedCallback
972
+ // In this case if we do not un-shadow here and use the value of the shadowing property, attributeChangedCallback
869
973
  // will be called with `newValue = "some-value"` and will set the shadowed property (this.someAttribute = "another-value")
870
974
  // to the value that was set inline i.e. "some-value" from above example. When
871
- // the connectedCallback attempts to unshadow it will use "some-value" as the initial value rather than "another-value"
975
+ // the connectedCallback attempts to un-shadow it will use "some-value" as the initial value rather than "another-value"
872
976
  //
873
- // The case where the attribute was NOT set inline but was not set programmatically shall be handled/unshadowed
977
+ // The case where the attribute was NOT set inline but was not set programmatically shall be handled/un-shadowed
874
978
  // by connectedCallback as this attributeChangedCallback will not fire.
875
979
  //
876
980
  // https://developers.google.com/web/fundamentals/web-components/best-practices#lazy-properties
@@ -890,18 +994,46 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
890
994
  // `propName` to be converted to a `DOMString`, which may not be what we want for other primitive props.
891
995
  return;
892
996
  }
997
+ else if (propName == null) {
998
+ // At this point we should know this is not a "member", so we can treat it like watching an attribute
999
+ // on a vanilla web component
1000
+ const hostRef = getHostRef(this);
1001
+ const flags = hostRef === null || hostRef === void 0 ? void 0 : hostRef.$flags$;
1002
+ // We only want to trigger the callback(s) if:
1003
+ // 1. The instance is ready
1004
+ // 2. The watchers are ready
1005
+ // 3. The value has changed
1006
+ if (!(flags & 8 /* HOST_FLAGS.isConstructingInstance */) &&
1007
+ flags & 128 /* HOST_FLAGS.isWatchReady */ &&
1008
+ newValue !== oldValue) {
1009
+ const instance = hostRef.$lazyInstance$ ;
1010
+ const entry = cmpMeta.$watchers$[attrName];
1011
+ entry === null || entry === void 0 ? void 0 : entry.forEach((callbackName) => {
1012
+ if (instance[callbackName] != null) {
1013
+ instance[callbackName].call(instance, newValue, oldValue, attrName);
1014
+ }
1015
+ });
1016
+ }
1017
+ return;
1018
+ }
893
1019
  this[propName] = newValue === null && typeof this[propName] === 'boolean' ? false : newValue;
894
1020
  });
895
1021
  };
896
- // create an array of attributes to observe
897
- // and also create a map of html attribute name to js property name
898
- Cstr.observedAttributes = members
899
- .filter(([_, m]) => m[0] & 15 /* MEMBER_FLAGS.HasAttribute */) // filter to only keep props that should match attributes
900
- .map(([propName, m]) => {
901
- const attrName = m[1] || propName;
902
- attrNameToPropName.set(attrName, propName);
903
- return attrName;
904
- });
1022
+ // Create an array of attributes to observe
1023
+ // This list in comprised of all strings used within a `@Watch()` decorator
1024
+ // on a component as well as any Stencil-specific "members" (`@Prop()`s and `@State()`s).
1025
+ // As such, there is no way to guarantee type-safety here that a user hasn't entered
1026
+ // an invalid attribute.
1027
+ Cstr.observedAttributes = Array.from(new Set([
1028
+ ...Object.keys((_a = cmpMeta.$watchers$) !== null && _a !== void 0 ? _a : {}),
1029
+ ...members
1030
+ .filter(([_, m]) => m[0] & 15 /* MEMBER_FLAGS.HasAttribute */)
1031
+ .map(([propName, m]) => {
1032
+ const attrName = m[1] || propName;
1033
+ attrNameToPropName.set(attrName, propName);
1034
+ return attrName;
1035
+ }),
1036
+ ]));
905
1037
  }
906
1038
  }
907
1039
  return Cstr;
@@ -909,9 +1041,9 @@ const proxyComponent = (Cstr, cmpMeta, flags) => {
909
1041
  const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId, Cstr) => {
910
1042
  // initializeComponent
911
1043
  if ((hostRef.$flags$ & 32 /* HOST_FLAGS.hasInitializedComponent */) === 0) {
1044
+ // Let the runtime know that the component has been initialized
1045
+ hostRef.$flags$ |= 32 /* HOST_FLAGS.hasInitializedComponent */;
912
1046
  {
913
- // we haven't initialized this element yet
914
- hostRef.$flags$ |= 32 /* HOST_FLAGS.hasInitializedComponent */;
915
1047
  // lazy loaded components
916
1048
  // request the component's implementation to be
917
1049
  // wired up with the host element
@@ -975,6 +1107,8 @@ const initializeComponent = async (elm, hostRef, cmpMeta, hmrVersionId, Cstr) =>
975
1107
  schedule();
976
1108
  }
977
1109
  };
1110
+ const fireConnectedCallback = (instance) => {
1111
+ };
978
1112
  const connectedCallback = (elm) => {
979
1113
  if ((plt.$flags$ & 1 /* PLATFORM_FLAGS.isTmpDisconnected */) === 0) {
980
1114
  const hostRef = getHostRef(elm);
@@ -1018,22 +1152,34 @@ const connectedCallback = (elm) => {
1018
1152
  // reattach any event listeners to the host
1019
1153
  // since they would have been removed when disconnected
1020
1154
  addHostEventListeners(elm, hostRef, cmpMeta.$listeners$);
1155
+ // fire off connectedCallback() on component instance
1156
+ if (hostRef === null || hostRef === void 0 ? void 0 : hostRef.$lazyInstance$) ;
1157
+ else if (hostRef === null || hostRef === void 0 ? void 0 : hostRef.$onReadyPromise$) {
1158
+ hostRef.$onReadyPromise$.then(() => fireConnectedCallback());
1159
+ }
1021
1160
  }
1022
1161
  endConnected();
1023
1162
  }
1024
1163
  };
1025
- const disconnectedCallback = (elm) => {
1164
+ const disconnectInstance = (instance) => {
1165
+ {
1166
+ safeCall(instance, 'disconnectedCallback');
1167
+ }
1168
+ };
1169
+ const disconnectedCallback = async (elm) => {
1026
1170
  if ((plt.$flags$ & 1 /* PLATFORM_FLAGS.isTmpDisconnected */) === 0) {
1027
1171
  const hostRef = getHostRef(elm);
1028
- const instance = hostRef.$lazyInstance$ ;
1029
1172
  {
1030
1173
  if (hostRef.$rmListeners$) {
1031
1174
  hostRef.$rmListeners$.map((rmListener) => rmListener());
1032
1175
  hostRef.$rmListeners$ = undefined;
1033
1176
  }
1034
1177
  }
1035
- {
1036
- safeCall(instance, 'disconnectedCallback');
1178
+ if (hostRef === null || hostRef === void 0 ? void 0 : hostRef.$lazyInstance$) {
1179
+ disconnectInstance(hostRef.$lazyInstance$);
1180
+ }
1181
+ else if (hostRef === null || hostRef === void 0 ? void 0 : hostRef.$onReadyPromise$) {
1182
+ hostRef.$onReadyPromise$.then(() => disconnectInstance(hostRef.$lazyInstance$));
1037
1183
  }
1038
1184
  }
1039
1185
  };
@@ -2,20 +2,11 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const index = require('./index-b99075ba.js');
6
-
7
- /*
8
- Stencil Client Patch Esm v2.22.3 | MIT Licensed | https://stenciljs.com
9
- */
10
- const patchEsm = () => {
11
- return index.promiseResolve();
12
- };
5
+ const index = require('./index-569353a6.js');
13
6
 
14
7
  const defineCustomElements = (win, options) => {
15
- if (typeof window === 'undefined') return Promise.resolve();
16
- return patchEsm().then(() => {
8
+ if (typeof window === 'undefined') return undefined;
17
9
  return index.bootstrapLazy([["mds-accordion-timer.cjs",[[1,"mds-accordion-timer",{"duration":[2],"time":[32]},[[0,"mdsAccordionTimerItemClickSelect","onClickActive"],[0,"mdsAccordionTimerItemMouseEnterSelect","onMouseEnterSelect"],[0,"mdsAccordionTimerItemMouseLeaveSelect","onMouseLeaveSelect"]]]]]], options);
18
- });
19
10
  };
20
11
 
21
12
  exports.setNonce = index.setNonce;
@@ -2,7 +2,7 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const index = require('./index-b99075ba.js');
5
+ const index = require('./index-569353a6.js');
6
6
 
7
7
  const mdsAccordionTimerCss = ":host{--mds-accordion-timer-progress-bar-color:rgb(var(--tone-neutral-03));--mds-accordion-timer-progress-bar-background:rgb(var(--tone-neutral-08));--mds-accordion-timer-progress-bar-thickness:0.25rem;--mds-accordion-timer-duration:500ms;display:block}";
8
8
 
@@ -2,10 +2,10 @@
2
2
 
3
3
  Object.defineProperty(exports, '__esModule', { value: true });
4
4
 
5
- const index = require('./index-b99075ba.js');
5
+ const index = require('./index-569353a6.js');
6
6
 
7
7
  /*
8
- Stencil Client Patch Browser v2.22.3 | MIT Licensed | https://stenciljs.com
8
+ Stencil Client Patch Browser v4.3.0 | MIT Licensed | https://stenciljs.com
9
9
  */
10
10
  const patchBrowser = () => {
11
11
  const importMeta = (typeof document === 'undefined' ? new (require('u' + 'rl').URL)('file:' + __filename).href : (document.currentScript && document.currentScript.src || new URL('mds-accordion-timer.cjs.js', document.baseURI).href));
@@ -1,11 +1,11 @@
1
1
  {
2
2
  "entries": [
3
- "./components/mds-accordion-timer/mds-accordion-timer.js"
3
+ "components/mds-accordion-timer/mds-accordion-timer.js"
4
4
  ],
5
5
  "compiler": {
6
6
  "name": "@stencil/core",
7
- "version": "2.22.3",
8
- "typescriptVersion": "4.9.4"
7
+ "version": "4.3.0",
8
+ "typescriptVersion": "5.1.6"
9
9
  },
10
10
  "collections": [],
11
11
  "bundles": []
@@ -5,6 +5,7 @@ const hash = (s) => {
5
5
  }
6
6
  return h.toString();
7
7
  };
8
+ const randomInt = (max) => Math.floor(Math.random() * max);
8
9
  const unslugName = (name) => {
9
10
  var _a, _b, _c;
10
11
  return (_c = (_b = (_a = name.split('/')) === null || _a === void 0 ? void 0 : _a.slice(-1).pop()) === null || _b === void 0 ? void 0 : _b.replace(/-/g, ' ')) !== null && _c !== void 0 ? _c : name;
@@ -18,4 +19,11 @@ const setAttributeIfEmpty = (element, attribute, value) => {
18
19
  return value;
19
20
  };
20
21
  const hashValue = (value) => `${value}-${hash(value)}`;
21
- export { unslugName, setAttributeIfEmpty, hashValue, };
22
+ const hashRandomValue = (value) => {
23
+ const randomValue = randomInt(1000000);
24
+ if (value) {
25
+ return `${value}-${hash(randomValue.toString())}`;
26
+ }
27
+ return hash(randomValue.toString());
28
+ };
29
+ export { unslugName, setAttributeIfEmpty, hashRandomValue, hashValue, };
@@ -1,4 +1,7 @@
1
- import { Host, h } from '@stencil/core';
1
+ import { Host, h } from "@stencil/core";
2
+ /**
3
+ * @slot default - Add `mds-accordion-timer-item` element/s.
4
+ */
2
5
  export class MdsAccordionTimer {
3
6
  constructor() {
4
7
  this.clearIntervals = () => {
@@ -0,0 +1,10 @@
1
+ import { newE2EPage } from "@stencil/core/testing";
2
+ describe('mds-accordion-timer', () => {
3
+ it('renders', async () => {
4
+ const page = await newE2EPage();
5
+ await page.setContent('<mds-accordion-timer></mds-accordion-timer>');
6
+ const element = await page.find('mds-accordion-timer');
7
+ expect(element).toHaveAttribute('hydrated');
8
+ expect(true).toBe(true);
9
+ });
10
+ });
@@ -1,5 +1,5 @@
1
- import { h } from '@stencil/core';
2
- import { lokiDisabled } from '@test/loki-disabled';
1
+ import { h } from "@stencil/core";
2
+ import { lokiDisabled } from "@test/loki-disabled";
3
3
  export default {
4
4
  title: 'UI / Accordion Timer',
5
5
  argTypes: {
@@ -1,5 +1,5 @@
1
- import jsonIconsDictionary from '../fixtures/icons.json';
2
- import jsonMggIconsDictionary from '../fixtures/iconsauce.json';
1
+ import jsonIconsDictionary from "../fixtures/icons.json";
2
+ import jsonMggIconsDictionary from "../fixtures/iconsauce.json";
3
3
  const iconsDictionary = jsonIconsDictionary;
4
4
  const mggIconsDictionary = jsonMggIconsDictionary;
5
5
  export { iconsDictionary, mggIconsDictionary, };
@@ -1,5 +1,8 @@
1
- /* MdsAccordionTimer custom elements */
2
- export { MdsAccordionTimer as MdsAccordionTimer } from '../types/components/mds-accordion-timer/mds-accordion-timer';
1
+ /**
2
+ * Get the base path to where the assets can be found. Use "setAssetPath(path)"
3
+ * if the path needs to be customized.
4
+ */
5
+ export declare const getAssetPath: (path: string) => string;
3
6
 
4
7
  /**
5
8
  * Used to manually set the base path where assets can be found.
@@ -28,4 +31,3 @@ export interface SetPlatformOptions {
28
31
  rel?: (el: EventTarget, eventName: string, listener: EventListenerOrEventListenerObject, options: boolean | AddEventListenerOptions) => void;
29
32
  }
30
33
  export declare const setPlatformOptions: (opts: SetPlatformOptions) => void;
31
- export * from '../types/components';
@@ -1,2 +1 @@
1
- export { setAssetPath, setNonce, setPlatformOptions } from '@stencil/core/internal/client';
2
- export { MdsAccordionTimer, defineCustomElement as defineCustomElementMdsAccordionTimer } from './mds-accordion-timer.js';
1
+ export { getAssetPath, setAssetPath, setNonce, setPlatformOptions } from '@stencil/core/internal/client';
@@ -2,7 +2,7 @@ import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/
2
2
 
3
3
  const mdsAccordionTimerCss = ":host{--mds-accordion-timer-progress-bar-color:rgb(var(--tone-neutral-03));--mds-accordion-timer-progress-bar-background:rgb(var(--tone-neutral-08));--mds-accordion-timer-progress-bar-thickness:0.25rem;--mds-accordion-timer-duration:500ms;display:block}";
4
4
 
5
- const MdsAccordionTimer$1 = /*@__PURE__*/ proxyCustomElement(class extends HTMLElement {
5
+ const MdsAccordionTimer$1 = /*@__PURE__*/ proxyCustomElement(class MdsAccordionTimer extends HTMLElement {
6
6
  constructor() {
7
7
  super();
8
8
  this.__registerHost();