flight-search/modals/fs-saver-switch-confirm

Open Main dialog Open First dialog Open Premium dialog Open Premium green dialog

Status: None

# 🏠 Properties

Name Type

# 🎰 Slots

Name Default value 
            
Show  Code

            
<script src="/components/shared/component-base.js"></script>
<script src="/components/fs-saver-switch-confirm/main.js"></script>
<link rel="stylesheet" href="/components/shared/component-base.css" />
<script type="text/javascript">
  toggleInterruption = (classInput) => {
    document.querySelector('saver-switch-confirm').setAttribute('fareClass', classInput);
    document.dispatchEvent(new Event("saverSwitchConfirmOpen", {
      bubbles: true,
      cancelable: false,
      composed: true,
    }));
  }

  document.addEventListener("saverSwitchConfirmClear", () => {
    document.querySelector(".status").innerHTML = "Status: Fare cleared";
  });

  document.addEventListener("saverSwitchConfirmMove", () => {
    document.querySelector(".status").innerHTML = "Status: Fare moved to main";
  });
</script>

<saver-switch-confirm price="39"></saver-switch-confirm>
<auro-button onClick="toggleInterruption('Main')">Open Main dialog</auro-button>
<auro-button onClick="toggleInterruption('First')">Open First dialog</auro-button>
<auro-button onClick="toggleInterruption('Premium')">Open Premium dialog</auro-button>
<auro-button onClick="toggleInterruption('Premium-Green')">Open Premium green dialog</auro-button>
<p style="padding-top: var(--auro-size-md)" class="status">Status: None</p>