@aurodesignsystem-dev/auro-formkit 0.0.0-pr1603.5 → 0.0.0-pr1604.0

package/components/checkbox/demo/customize.min.js

@@ -1284,7 +1284,7 @@ class AuroHelpText extends i$2 {
   }
 }
 
-var formkitVersion = '202609012013';
+var formkitVersion = '202609011830';
 
 // Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.

package/components/checkbox/demo/getting-started.min.js

@@ -1284,7 +1284,7 @@ class AuroHelpText extends i$2 {
   }
 }
 
-var formkitVersion = '202609012013';
+var formkitVersion = '202609011830';
 
 // Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.

package/components/checkbox/demo/index.min.js

@@ -1284,7 +1284,7 @@ class AuroHelpText extends i$2 {
   }
 }
 
-var formkitVersion = '202609012013';
+var formkitVersion = '202609011830';
 
 // Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.

package/components/checkbox/dist/index.js

@@ -1237,7 +1237,7 @@ class AuroHelpText extends LitElement {
   }
 }
 
-var formkitVersion = '202609012013';
+var formkitVersion = '202609011830';
 
 // Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.

package/components/checkbox/dist/registered.js

@@ -1237,7 +1237,7 @@ class AuroHelpText extends LitElement {
   }
 }
 
-var formkitVersion = '202609012013';
+var formkitVersion = '202609011830';
 
 // Copyright (c) 2026 Alaska Airlines. All rights reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.

package/components/combobox/demo/customize.min.js

@@ -5066,7 +5066,7 @@ let AuroHelpText$2 = class AuroHelpText extends i$3 {
   }
 };
 
-var formkitVersion$2 = '202609012013';
+var formkitVersion$2 = '202609011830';
 
 /**
  * AuroElement is the shared base class for layout-aware Auro form components.
@@ -18935,7 +18935,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$3 {
   }
 };
 
-var formkitVersion$1 = '202609012013';
+var formkitVersion$1 = '202609011830';
 
 // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.
@@ -20127,7 +20127,7 @@ class AuroBibtemplate extends i$3 {
   }
 }
 
-var formkitVersion = '202609012013';
+var formkitVersion = '202609011830';
 
 var styleCss$3 = i$6`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}:host{display:block;text-align:left}:host [auro-dropdown]{--ds-auro-dropdown-trigger-background-color: transparent}:host #inputInBib::part(wrapper){box-shadow:none}:host #inputInBib::part(accent-left){display:none}:host([layout*=classic]) [auro-input]{width:100%}:host([layout*=classic]) [auro-input]::part(helpText){display:none}:host([layout*=classic]) #slotHolder{display:none}`;
 
@@ -20568,11 +20568,6 @@ class AuroCombobox extends AuroElement {
     this.behavior = "suggestion";
     this.clearBtnFocused = false;
 
-    // One-shot: set when the input's clear button is activated so the
-    // SPA-preselect guard in handleInputValueChange doesn't swallow the
-    // genuine clear (AB#1634257).
-    this._clearBtnActivated = false;
-
     // Defaults that effect the overall layout of the combobox
     this.checkmark = false;
     this.dvInputOnly = false;
@@ -21530,13 +21525,6 @@ class AuroCombobox extends AuroElement {
     this.bibtemplate = this.dropdown.querySelector(this.bibtemplateTag._$litStatic$);
     this.inputInBib = this.bibtemplate.querySelector(this.inputTag._$litStatic$);
 
-    // Mirror the trigger's clear-button tracking onto the fullscreen bib input
-    // so clearing there also fully resets the combobox (AB#1634257). See
-    // trackClearBtnActivation for why this must run in the capture phase.
-    if (this.inputInBib && this.inputInBib !== this.input) {
-      this.trackClearBtnActivation(this.inputInBib);
-    }
-
     // Pass label text to the dropdown bib for accessible dialog naming
     const labelElement = this.querySelector('[slot="label"]');
     if (labelElement) {
@@ -21922,52 +21910,6 @@ class AuroCombobox extends AuroElement {
         this.clearBtnFocused = false;
       }
     });
-
-    this.trackClearBtnActivation(this.input);
-  }
-
-  /**
-   * Flags genuine clear-button activations on an auro-input so the SPA-preselect
-   * guard in handleInputValueChange doesn't swallow them.
-   *
-   * The auro-input clear button fires an `isProgrammatic` input event (via
-   * notifyValueChanged) that is indistinguishable in shape from the
-   * SPA-preselect echo that guard bails on (isProgrammatic + set value + empty
-   * input). Without this one-shot flag, clicking clear would leave
-   * this.value/optionSelected stale (AB#1634257).
-   *
-   * Delegated on the shadow root so it works regardless of when .clearBtn
-   * renders (it only exists after a value is set), and covers both real clicks
-   * and programmatic clearBtn.click() (which no focusin precedes). Registered in
-   * the CAPTURE phase so the flag is set BEFORE the button's own @click
-   * (handleClickClear) fires its synchronous input event — which is when
-   * handleInputValueChange reads the flag.
-   * @private
-   * @param {Element} inputEl - The auro-input whose clear button to track.
-   * @returns {void}
-   */
-  trackClearBtnActivation(inputEl) {
-    if (!inputEl || !inputEl.shadowRoot) {
-      return;
-    }
-    inputEl.shadowRoot.addEventListener('click', (event) => {
-      if (event.target.closest('.clearBtn')) {
-        this._clearBtnActivated = true;
-
-        // Bound the flag's lifetime to this synchronous clear -> input window.
-        // auro-input's handleClickClear fires its input event synchronously
-        // (before any macrotask runs), so handleInputValueChange consumes the
-        // flag first and this reset is a harmless no-op. It only does real work
-        // if that input event never arrives (e.g. auro-input throws mid-clear),
-        // guaranteeing the flag can't survive to be misread as a genuine clear
-        // by a later unrelated event such as an SPA-preselect echo (AB#1634257).
-        // Scheduled via _scheduleTimer so disconnectedCallback cancels it if the
-        // component tears down inside that window.
-        this._scheduleTimer(() => {
-          this._clearBtnActivated = false;
-        }, 0);
-      }
-    }, true);
   }
 
   /**
@@ -22009,17 +21951,6 @@ class AuroCombobox extends AuroElement {
    * @returns {void}
    */
   handleInputValueChange(event) {
-    // Consume the one-shot clear-button flag on EVERY entry, before any branch
-    // below can early-return. trackClearBtnActivation sets it in the capture
-    // phase right before auro-input's clear button fires its synchronous input
-    // event; reading and immediately clearing it here guarantees the flag never
-    // survives a handleInputValueChange call to leak into a later event (e.g.
-    // the bib branch bailing at _syncingDisplayValue, or an SPA-preselect echo)
-    // where it would defeat the guard below. Held in a local so that guard can
-    // still tell a genuine clear from the init-render echo (AB#1634257).
-    const clearBtnActivated = this._clearBtnActivated;
-    this._clearBtnActivated = false;
-
     // When the event comes from the fullscreen bib input, sync the value to
     // the trigger input. Setting trigger.value triggers Lit's updated()
     // (async, microtask) which fires notifyValueChanged() → another 'input'
@@ -22067,12 +21998,7 @@ class AuroCombobox extends AuroElement {
     // to the exact shape of that echo (isProgrammatic + non-empty combobox
     // value + empty input.value) so it doesn't affect the swap/typed paths
     // where value/input already track each other through the sync helpers.
-    // The clear button's echo has the same shape (isProgrammatic + set value +
-    // empty input) but is a genuine user clear that MUST reset this.value and
-    // optionSelected below. clearBtnActivated (consumed at the top of this
-    // method) is true only for that genuine clear, so only the real
-    // SPA-preselect echo bails (AB#1634257).
-    if (event && event.isProgrammatic && this.value && !this.input.value && !clearBtnActivated) {
+    if (event && event.isProgrammatic && this.value && !this.input.value) {
       return;
     }
 
@@ -22217,14 +22143,6 @@ class AuroCombobox extends AuroElement {
     // retry would otherwise keep rescheduling itself indefinitely.
     this._pendingTimers.forEach((id) => clearTimeout(id));
     this._pendingTimers.clear();
-
-    // Cancelling the timers above drops the macrotask that would have reset
-    // _clearBtnActivated, so reset it here too. Otherwise a disconnect inside
-    // the clear-click -> macrotask window strands the flag `true`; instance
-    // state survives reconnect, and the first matching input event (including
-    // an SPA-preselect echo) would then bypass the guard in
-    // handleInputValueChange and silently clear value/optionSelected (AB#1634257).
-    this._clearBtnActivated = false;
   }
 
   firstUpdated() {
@@ -22323,14 +22241,6 @@ class AuroCombobox extends AuroElement {
       }
       if (this.menu.value || this.menu.optionSelected) {
         this.menu.reset();
-      } else {
-        // The menu's selection properties are already cleared, but option
-        // elements can still carry a stale `selected` attribute (e.g. the menu
-        // options were rebuilt after the value was set, orphaning the DOM from
-        // the now-null optionSelected). reset() is skipped above in that case,
-        // so re-sync the option DOM directly to guarantee no option renders as
-        // selected once the field is cleared (AB#1634259).
-        this.menu.clearSelection();
       }
     } finally {
       this._clearing = false;
@@ -23782,22 +23692,6 @@ class AuroMenu extends AuroElement {
     this.value = undefined;
     this._selectedKey = undefined;
     this._index = -1;
-
-    // Eagerly sync the option DOM to the now-empty selection. Nulling the
-    // reactive properties above normally schedules updated() → updateItemsState,
-    // but that only runs when a property actually changes. If an option still
-    // carries a stale `selected`/`aria-selected` attribute while these
-    // properties are already undefined (e.g. options were rebuilt after a value
-    // was set), no re-render fires and the option keeps rendering as selected.
-    // Strip that state now so no option looks selected after a clear (AB#1634259).
-    // Intentionally leaves `active`/`optionActive` untouched so a highlighted
-    // option remains keyboard-re-selectable after emptying the value (AB#1606433).
-    this.updateItemsState(new Map([
-      [
-        'optionSelected',
-        true
-      ]
-    ]));
   }
 
   /**

package/components/combobox/demo/getting-started.md

@@ -394,6 +394,55 @@ Ensure your `tsconfig.json` uses `"moduleResolution": "bundler"` so TypeScript c
 <p>Programmatically moves focus to the combobox trigger input.</p>
 <auro-header level="3" id="reset">reset()</auro-header>
 <p>Resets the component to its initial state, clearing the value, input text, and validation state.</p>
+<div class="exampleWrapper">
+<!-- AURO-GENERATED-CONTENT:START (FILE:src=./../apiExamples/reset-state.html) -->
+<!-- The below content is automatically added from ./../apiExamples/reset-state.html -->
+<auro-button id="resetStateBtn">Reset</auro-button>
+<br /><br />
+<auro-combobox id="resetStateExample" required>
+<span slot="bib.fullscreen.headline">Bib Header</span>
+<span slot="label">Name</span>
+<auro-menu>
+<auro-menuoption value="Apples" id="option-0">Apples</auro-menuoption>
+<auro-menuoption value="Oranges" id="option-1">Oranges</auro-menuoption>
+<auro-menuoption value="Peaches" id="option-2">Peaches</auro-menuoption>
+<auro-menuoption value="Grapes" id="option-3">Grapes</auro-menuoption>
+<auro-menuoption value="Cherries" id="option-4">Cherries</auro-menuoption>
+<auro-menuoption static nomatch>No matching option</auro-menuoption>
+</auro-menu>
+</auro-combobox>
+<!-- AURO-GENERATED-CONTENT:END -->
+</div>
+<auro-accordion alignRight>
+<span slot="trigger">See code</span>
+<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/reset-state.html) -->
+<!-- The below code snippet is automatically added from ./../apiExamples/reset-state.html -->
+<pre class="language-html"><code class="language-html">&lt;auro-button id="resetStateBtn"&gt;Reset&lt;/auro-button&gt;
+&lt;br /&gt;&lt;br /&gt;
+&lt;auro-combobox id="resetStateExample" required&gt;
+  &lt;span slot="bib.fullscreen.headline"&gt;Bib Header&lt;/span&gt;
+  &lt;span slot="label"&gt;Name&lt;/span&gt;
+  &lt;auro-menu&gt;
+    &lt;auro-menuoption value="Apples" id="option-0"&gt;Apples&lt;/auro-menuoption&gt;
+    &lt;auro-menuoption value="Oranges" id="option-1"&gt;Oranges&lt;/auro-menuoption&gt;
+    &lt;auro-menuoption value="Peaches" id="option-2"&gt;Peaches&lt;/auro-menuoption&gt;
+    &lt;auro-menuoption value="Grapes" id="option-3"&gt;Grapes&lt;/auro-menuoption&gt;
+    &lt;auro-menuoption value="Cherries" id="option-4"&gt;Cherries&lt;/auro-menuoption&gt;
+    &lt;auro-menuoption static nomatch&gt;No matching option&lt;/auro-menuoption&gt;
+  &lt;/auro-menu&gt;
+&lt;/auro-combobox&gt;</code></pre>
+<!-- AURO-GENERATED-CONTENT:END -->
+<!-- AURO-GENERATED-CONTENT:START (CODE:src=./../apiExamples/reset-state.js) -->
+<!-- The below code snippet is automatically added from ./../apiExamples/reset-state.js -->
+<pre class="language-js"><code class="language-js">export function resetStateExample() {
+  const elem = document.querySelector('#resetStateExample');
+​
+  document.querySelector('#resetStateBtn').addEventListener('click', () =&gt; {
+    elem.reset();
+  });
+}</code></pre>
+<!-- AURO-GENERATED-CONTENT:END -->
+</auro-accordion>
 <auro-header level="3" id="validate">validate()</auro-header>
 <p>Triggers validation on the component. Pass <code>true</code> to force validation even when <code>noValidate</code> is set.</p>
 <auro-header level="3" id="hideBib">hideBib()</auro-header>

package/components/combobox/demo/getting-started.min.js

@@ -5066,7 +5066,7 @@ let AuroHelpText$2 = class AuroHelpText extends i$3 {
   }
 };
 
-var formkitVersion$2 = '202609012013';
+var formkitVersion$2 = '202609011830';
 
 /**
  * AuroElement is the shared base class for layout-aware Auro form components.
@@ -18935,7 +18935,7 @@ let AuroHelpText$1 = class AuroHelpText extends i$3 {
   }
 };
 
-var formkitVersion$1 = '202609012013';
+var formkitVersion$1 = '202609011830';
 
 // Copyright (c) 2025 Alaska Airlines. All right reserved. Licensed under the Apache-2.0 license
 // See LICENSE in the project root for license information.
@@ -20127,7 +20127,7 @@ class AuroBibtemplate extends i$3 {
   }
 }
 
-var formkitVersion = '202609012013';
+var formkitVersion = '202609011830';
 
 var styleCss$3 = i$6`.util_displayInline{display:inline}.util_displayInlineBlock{display:inline-block}.util_displayBlock{display:block}.util_displayFlex{display:flex}.util_displayHidden{display:none}.util_displayHiddenVisually{position:absolute;overflow:hidden;clip:rect(1px, 1px, 1px, 1px);width:1px;height:1px;padding:0;border:0}:host{display:block;text-align:left}:host [auro-dropdown]{--ds-auro-dropdown-trigger-background-color: transparent}:host #inputInBib::part(wrapper){box-shadow:none}:host #inputInBib::part(accent-left){display:none}:host([layout*=classic]) [auro-input]{width:100%}:host([layout*=classic]) [auro-input]::part(helpText){display:none}:host([layout*=classic]) #slotHolder{display:none}`;
 
@@ -20568,11 +20568,6 @@ class AuroCombobox extends AuroElement {
     this.behavior = "suggestion";
     this.clearBtnFocused = false;
 
-    // One-shot: set when the input's clear button is activated so the
-    // SPA-preselect guard in handleInputValueChange doesn't swallow the
-    // genuine clear (AB#1634257).
-    this._clearBtnActivated = false;
-
     // Defaults that effect the overall layout of the combobox
     this.checkmark = false;
     this.dvInputOnly = false;
@@ -21530,13 +21525,6 @@ class AuroCombobox extends AuroElement {
     this.bibtemplate = this.dropdown.querySelector(this.bibtemplateTag._$litStatic$);
     this.inputInBib = this.bibtemplate.querySelector(this.inputTag._$litStatic$);
 
-    // Mirror the trigger's clear-button tracking onto the fullscreen bib input
-    // so clearing there also fully resets the combobox (AB#1634257). See
-    // trackClearBtnActivation for why this must run in the capture phase.
-    if (this.inputInBib && this.inputInBib !== this.input) {
-      this.trackClearBtnActivation(this.inputInBib);
-    }
-
     // Pass label text to the dropdown bib for accessible dialog naming
     const labelElement = this.querySelector('[slot="label"]');
     if (labelElement) {
@@ -21922,52 +21910,6 @@ class AuroCombobox extends AuroElement {
         this.clearBtnFocused = false;
       }
     });
-
-    this.trackClearBtnActivation(this.input);
-  }
-
-  /**
-   * Flags genuine clear-button activations on an auro-input so the SPA-preselect
-   * guard in handleInputValueChange doesn't swallow them.
-   *
-   * The auro-input clear button fires an `isProgrammatic` input event (via
-   * notifyValueChanged) that is indistinguishable in shape from the
-   * SPA-preselect echo that guard bails on (isProgrammatic + set value + empty
-   * input). Without this one-shot flag, clicking clear would leave
-   * this.value/optionSelected stale (AB#1634257).
-   *
-   * Delegated on the shadow root so it works regardless of when .clearBtn
-   * renders (it only exists after a value is set), and covers both real clicks
-   * and programmatic clearBtn.click() (which no focusin precedes). Registered in
-   * the CAPTURE phase so the flag is set BEFORE the button's own @click
-   * (handleClickClear) fires its synchronous input event — which is when
-   * handleInputValueChange reads the flag.
-   * @private
-   * @param {Element} inputEl - The auro-input whose clear button to track.
-   * @returns {void}
-   */
-  trackClearBtnActivation(inputEl) {
-    if (!inputEl || !inputEl.shadowRoot) {
-      return;
-    }
-    inputEl.shadowRoot.addEventListener('click', (event) => {
-      if (event.target.closest('.clearBtn')) {
-        this._clearBtnActivated = true;
-
-        // Bound the flag's lifetime to this synchronous clear -> input window.
-        // auro-input's handleClickClear fires its input event synchronously
-        // (before any macrotask runs), so handleInputValueChange consumes the
-        // flag first and this reset is a harmless no-op. It only does real work
-        // if that input event never arrives (e.g. auro-input throws mid-clear),
-        // guaranteeing the flag can't survive to be misread as a genuine clear
-        // by a later unrelated event such as an SPA-preselect echo (AB#1634257).
-        // Scheduled via _scheduleTimer so disconnectedCallback cancels it if the
-        // component tears down inside that window.
-        this._scheduleTimer(() => {
-          this._clearBtnActivated = false;
-        }, 0);
-      }
-    }, true);
   }
 
   /**
@@ -22009,17 +21951,6 @@ class AuroCombobox extends AuroElement {
    * @returns {void}
    */
   handleInputValueChange(event) {
-    // Consume the one-shot clear-button flag on EVERY entry, before any branch
-    // below can early-return. trackClearBtnActivation sets it in the capture
-    // phase right before auro-input's clear button fires its synchronous input
-    // event; reading and immediately clearing it here guarantees the flag never
-    // survives a handleInputValueChange call to leak into a later event (e.g.
-    // the bib branch bailing at _syncingDisplayValue, or an SPA-preselect echo)
-    // where it would defeat the guard below. Held in a local so that guard can
-    // still tell a genuine clear from the init-render echo (AB#1634257).
-    const clearBtnActivated = this._clearBtnActivated;
-    this._clearBtnActivated = false;
-
     // When the event comes from the fullscreen bib input, sync the value to
     // the trigger input. Setting trigger.value triggers Lit's updated()
     // (async, microtask) which fires notifyValueChanged() → another 'input'
@@ -22067,12 +21998,7 @@ class AuroCombobox extends AuroElement {
     // to the exact shape of that echo (isProgrammatic + non-empty combobox
     // value + empty input.value) so it doesn't affect the swap/typed paths
     // where value/input already track each other through the sync helpers.
-    // The clear button's echo has the same shape (isProgrammatic + set value +
-    // empty input) but is a genuine user clear that MUST reset this.value and
-    // optionSelected below. clearBtnActivated (consumed at the top of this
-    // method) is true only for that genuine clear, so only the real
-    // SPA-preselect echo bails (AB#1634257).
-    if (event && event.isProgrammatic && this.value && !this.input.value && !clearBtnActivated) {
+    if (event && event.isProgrammatic && this.value && !this.input.value) {
       return;
     }
 
@@ -22217,14 +22143,6 @@ class AuroCombobox extends AuroElement {
     // retry would otherwise keep rescheduling itself indefinitely.
     this._pendingTimers.forEach((id) => clearTimeout(id));
     this._pendingTimers.clear();
-
-    // Cancelling the timers above drops the macrotask that would have reset
-    // _clearBtnActivated, so reset it here too. Otherwise a disconnect inside
-    // the clear-click -> macrotask window strands the flag `true`; instance
-    // state survives reconnect, and the first matching input event (including
-    // an SPA-preselect echo) would then bypass the guard in
-    // handleInputValueChange and silently clear value/optionSelected (AB#1634257).
-    this._clearBtnActivated = false;
   }
 
   firstUpdated() {
@@ -22323,14 +22241,6 @@ class AuroCombobox extends AuroElement {
       }
       if (this.menu.value || this.menu.optionSelected) {
         this.menu.reset();
-      } else {
-        // The menu's selection properties are already cleared, but option
-        // elements can still carry a stale `selected` attribute (e.g. the menu
-        // options were rebuilt after the value was set, orphaning the DOM from
-        // the now-null optionSelected). reset() is skipped above in that case,
-        // so re-sync the option DOM directly to guarantee no option renders as
-        // selected once the field is cleared (AB#1634259).
-        this.menu.clearSelection();
       }
     } finally {
       this._clearing = false;
@@ -23782,22 +23692,6 @@ class AuroMenu extends AuroElement {
     this.value = undefined;
     this._selectedKey = undefined;
     this._index = -1;
-
-    // Eagerly sync the option DOM to the now-empty selection. Nulling the
-    // reactive properties above normally schedules updated() → updateItemsState,
-    // but that only runs when a property actually changes. If an option still
-    // carries a stale `selected`/`aria-selected` attribute while these
-    // properties are already undefined (e.g. options were rebuilt after a value
-    // was set), no re-render fires and the option keeps rendering as selected.
-    // Strip that state now so no option looks selected after a clear (AB#1634259).
-    // Intentionally leaves `active`/`optionActive` untouched so a highlighted
-    // option remains keyboard-re-selectable after emptying the value (AB#1606433).
-    this.updateItemsState(new Map([
-      [
-        'optionSelected',
-        true
-      ]
-    ]));
   }
 
   /**
@@ -24593,6 +24487,14 @@ class AuroMenuOption extends AuroElement {
 AuroMenu.register();
 AuroMenuOption.register();
 
+function resetStateExample() {
+  const elem = document.querySelector('#resetStateExample');
+
+  document.querySelector('#resetStateBtn').addEventListener('click', () => {
+    elem.reset();
+  });
+}
+
 /* eslint-disable jsdoc/require-jsdoc, no-magic-numbers, no-param-reassign */
 
 
@@ -24600,6 +24502,17 @@ AuroCombobox.register();
 AuroCombobox.register('custom-combobox');
 
 function initExamples(initCount) {
+  initCount = initCount || 0;
+
+  try {
+    resetStateExample();
+  } catch (err) {
+    if (initCount <= 20) {
+      setTimeout(() => {
+        initExamples(initCount + 1);
+      }, 100);
+    }
+  }
 }
 
 export { initExamples };