@heartlandone/vega 2.73.0 → 2.74.0-RTE-table-preview

package/dist/vega/vega-modal.entry.js

@@ -0,0 +1,1287 @@
+import { h, g as Host, F as Fragment, r as registerInstance, e as createEvent, i as getElement } from './index-01a2f9c9.js';
+import { s as sanitizeVegaComponent } from './component-0cff85cf.js';
+import { V as VegaSlimmer, b as MapToComponentField, M as MapToComponentMethod, a as InjectVegaSlimmer, m as methodPlaceholder, e as InjectVegaGlobalSlimmer } from './vega-slimmer-core-83fd0e22.js';
+import { c as createEventEmitSlimmer } from './event-emit-slimmer-61db3eef.js';
+import { C as ChildNodesEventPreventSlimmer } from './child-nodes-event-prevent-slimmer-fcfc9c8b.js';
+import { N as VegaOpen, f as VegaClose } from './vega-event-id-61c8bd9f.js';
+import { C as ComponentGlobalStyleSlimmer } from './component-global-style-slimmer-6ecf43d7.js';
+import { c as createDeprecatedPropertySlimmer } from './deprecated-property-slimmer-52281ebd.js';
+import { V as VegaComponentUsageRuntimeMetricsSlimmer } from './component-usage-runtime-metrics-0513698f.js';
+import { c as createEnterKeyHandlerToTriggerClick } from './accessibility-e5fd0fab.js';
+import { f as formatAndValidResponsiveToken } from './design-token-4e585c60.js';
+import { r as responsiveFormatFacade } from './responsive-format-facade-d4abfdb9.js';
+import { D as DefaultModalSize } from './ui-189dae23.js';
+import { P as PageResizeObserverSlimmer, g as getCurrentBreakpoint } from './page-resize-observer-slimmer-ee8774a6.js';
+import { p as parseToPixelString } from './pixel-f32c07ce.js';
+import { g as getDeviceType, D as DeviceType, f as findParent } from './ui-5f775fd9.js';
+import { C as ChangeManager } from './change-manager-b115783e.js';
+import { S as SHADOW_ROOT_ELEMENT_SCROLLING } from './static-subject-title-6fdf8c8b.js';
+import { I as InternalVegaZIndexManager } from './internal-vega-z-index-manager-f0ca0975.js';
+import './dom-node-subject-factory-5798693b.js';
+import './dom-node-subject-observer-factory-3b49c6b3.js';
+import './observer-3959f9dd.js';
+import './internal-vega-event-manager-826279b7.js';
+import './try-get-document-bef0f526.js';
+import './vega-env-manager-8f8dc473.js';
+import './feature-flag-controller-24b9f956.js';
+import './index-1f9eab8f.js';
+import './_commonjsHelpers-2088bffa.js';
+import './vega-nonce-manager-497e5eb5.js';
+import './object-66c37948.js';
+import './type-guard-09acedc9.js';
+import './breakpoints-d9faf11c.js';
+import './typography-396de03f.js';
+import './index-81ce67e2.js';
+import './create-public-api-runtime-metrics-slimmer-8565f08b.js';
+import './number-4398f2e1.js';
+import './array-a1d98264.js';
+import './public-api-a77a0b33.js';
+import './dark-mode-style-controller-e2a2f76c.js';
+import './internal-icon-manager-9279071a.js';
+import './valid-credit-card-number-rule-04b032a6.js';
+import './internal-form-field-validation-rule.abstract-f5b6bdbf.js';
+import './index-b04c1ee0.js';
+import './vega-internal-event-id-b65a01a3.js';
+import './content-state-fc9d98e0.js';
+import './code-block-b5f8fc8a.js';
+import './string-a953eafc.js';
+import './dto-renderer-manager-12bc9121.js';
+import './base-renderer-101f6d04.js';
+import './column-operation-a1620c67.js';
+import './remote-invocation-registry-4219120b.js';
+import './timer-9321173b.js';
+import './styles.constants-b320e4a7.js';
+import './range-429fb0e2.js';
+
+const vegaModalDisableBodyScrollCss = "body.disable-scroll-in-desktop{max-height:100vh !important;overflow:hidden !important}";
+
+const VegaModalRuntimeMetricsPayloadDefinition = [
+  {
+    payloadKey: 'IS_VERTICALLY_CENTER',
+    payloadDescription: '@deprecated Determines whether the modal is vertically centered on the screen.',
+    /**
+     * The function checks if the `isVerticallyCenter` property of the `host` element is equal to 'true'.
+     * If it is, the function will return `true`.
+     *
+     * @param {HTMLElement} host - The element to check
+     * @returns {boolean} A boolean value
+     */
+    payloadValue: (host) => host.isVerticallyCenter === true,
+  },
+  {
+    payloadKey: 'IS_NOT_VERTICALLY_CENTER',
+    payloadDescription: '@deprecated Determines whether the modal is vertically centered on the screen.',
+    /**
+     * The function checks if the `isVerticallyCenter` property of the `host` element is equal to 'false'.
+     * If it is, the function will return `true`.
+     *
+     * @param {HTMLElement} host - The element to check
+     * @returns {boolean} A boolean value
+     */
+    payloadValue: (host) => host.isVerticallyCenter === false,
+  },
+];
+
+var __decorate$9 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+/**
+ * Nested modal controller
+ */
+class VegaNestedModalController extends VegaSlimmer {
+  /**
+   * Component lifecycle - [connectedCallback]
+   */
+  connectedCallback() {
+    this.appendNestedModalToBody();
+  }
+  /**
+   * The function appends all nested 'vega-modal' elements found within the host element to the document
+   * body.
+   */
+  appendNestedModalToBody() {
+    this.host.querySelectorAll('vega-modal').forEach((modal) => {
+      // eslint-disable-next-line no-restricted-globals
+      document.body.append(modal);
+    });
+  }
+}
+__decorate$9([
+  MapToComponentField()
+], VegaNestedModalController.prototype, "host", void 0);
+__decorate$9([
+  MapToComponentMethod('connectedCallback')
+], VegaNestedModalController.prototype, "connectedCallback", null);
+
+var __decorate$8 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+/**
+ * Modal renderer
+ */
+class VegaModalRenderer extends VegaSlimmer {
+  getModalContentRef() {
+    return this.modalContent;
+  }
+  getModalFooterRef() {
+    return this.modalFooter;
+  }
+  getModalContainerRef() {
+    return this.modalContainer;
+  }
+  render() {
+    return (h(Host, { class: {
+        'align-center': this.deprecatedPropertySlimmer.getValue() && this.openState.isOpen,
+        'animation': this.animation,
+      } },
+      h("div", { class: "modal-dialog" }, this.renderContainer())));
+  }
+  renderContainer() {
+    const padding = formatAndValidResponsiveToken(this.padding, 'padding');
+    return (h("div", { class: "modal-container", ref: (node) => (this.modalContainer = node) },
+      this.renderHeader(padding),
+      this.renderContent(padding),
+      this.renderFooter(padding)));
+  }
+  renderHeader(padding) {
+    return (h("div", { class: {
+        'vega-modal-header': true,
+        'vega-modal-header-with-title': this.hasModalTitle(),
+        'vega-modal-header-with-icon': this.showCloseButton,
+        'vega-modal-header-with-content-scroll': this.isContentScrollable(),
+        [padding]: true,
+      } },
+      this.renderTitle(),
+      this.showCloseButton && this.renderCloseBtn()));
+  }
+  renderContent(padding) {
+    return (h("div", { class: {
+        'vega-modal-content': true,
+        'vega-modal-content-with-scroll': this.isContentScrollable(),
+        [padding]: true,
+      }, ref: (e) => (this.modalContent = e) },
+      h(Fragment, null,
+        h("slot", null),
+        h("slot", { name: "content" }),
+        h("slot", { name: "modal-content" }))));
+  }
+  renderFooter(padding) {
+    return (h("div", { class: {
+        'vega-modal-footer': true,
+        'vega-modal-footer-with-slot': this.hasModalFooter(),
+        'vega-modal-footer-with-content-scroll': this.isContentScrollable(),
+        [padding]: true,
+      }, ref: (e) => (this.modalFooter = e) },
+      h(Fragment, null,
+        h("slot", { name: "footer" }),
+        h("slot", { name: "modal-footer" }))));
+  }
+  renderTitle() {
+    return (h("div", { class: "vega-modal-title" }, this.modalTitle ? (h("div", { innerHTML: this.modalTitle })) : (h(Fragment, null,
+      h("slot", { name: "title" }),
+      h("slot", { name: "modal-title" })))));
+  }
+  renderCloseBtn() {
+    return (h("div", { "aria-label": "Close Button", class: "vega-modal-close-btn", "data-dismiss": "modal", onClick: this.openStateController.onModalClose, role: 'button', tabIndex: 0, onKeyDown: createEnterKeyHandlerToTriggerClick() },
+      h("vega-icon", { icon: "close", size: "size-16" })));
+  }
+  hasModalFooter() {
+    return (this.host.querySelector(`[slot='modal-footer']`) !== null ||
+      this.host.querySelector(`[slot='footer']`) !== null);
+  }
+  isContentScrollable() {
+    return Boolean(this.contentMaxHeight);
+  }
+  hasModalTitle() {
+    return (Boolean(this.modalTitle) ||
+      this.host.querySelector(`[slot='modal-title']`) !== null ||
+      this.host.querySelector(`[slot='title']`) !== null);
+  }
+}
+__decorate$8([
+  MapToComponentField()
+], VegaModalRenderer.prototype, "host", void 0);
+__decorate$8([
+  MapToComponentField()
+], VegaModalRenderer.prototype, "animation", void 0);
+__decorate$8([
+  MapToComponentField()
+], VegaModalRenderer.prototype, "open", void 0);
+__decorate$8([
+  MapToComponentField()
+], VegaModalRenderer.prototype, "openState", void 0);
+__decorate$8([
+  MapToComponentField()
+], VegaModalRenderer.prototype, "padding", void 0);
+__decorate$8([
+  MapToComponentField()
+], VegaModalRenderer.prototype, "showCloseButton", void 0);
+__decorate$8([
+  MapToComponentField()
+], VegaModalRenderer.prototype, "modalTitle", void 0);
+__decorate$8([
+  MapToComponentField()
+], VegaModalRenderer.prototype, "contentMaxHeight", void 0);
+__decorate$8([
+  MapToComponentField()
+], VegaModalRenderer.prototype, "handleClose", void 0);
+__decorate$8([
+  MapToComponentField()
+], VegaModalRenderer.prototype, "deprecatedPropertySlimmer", void 0);
+__decorate$8([
+  MapToComponentField()
+], VegaModalRenderer.prototype, "openStateController", void 0);
+
+var __decorate$7 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+/**
+ * Modal layout controller
+ */
+class VegaModalLayoutController extends VegaSlimmer {
+  constructor() {
+    super(...arguments);
+    /*
+     * The below method is e2e-test covered in
+     * @see{module:vega-modal-resize-e2e}
+     */
+    this.pageResizeObserverSlimmer = new PageResizeObserverSlimmer({
+      callback: 
+      /* istanbul ignore next */
+      // eslint-disable-next-line jsdoc/require-jsdoc
+      () => {
+        this.setModalWidth('update');
+        this.setContentMaxHeight();
+      },
+      isDeferred: true,
+    });
+    this.isModalWidthSet = false;
+  }
+  /**
+   * Component lifecycle - [connectedCallback]
+   */
+  componentDidLoad() {
+    this.setContentMaxHeight();
+  }
+  /*
+   * The below method is e2e-test covered in
+   * @see{module:vega-modal-resize-e2e}
+   */
+  /* istanbul ignore next */
+  /**
+   * Listen watch size method to be called
+   */
+  watchSize() {
+    this.setModalWidth('update');
+  }
+  /**
+   * Listen watchContentMaxHeight method to be called
+   */
+  watchContentMaxHeight() {
+    this.setContentMaxHeight();
+  }
+  /*
+   * The below method is e2e-test covered in
+   * @see{module:vega-modal-default-e2e}
+   * @see{module:vega-modal-size-number-e2e}
+   * @see{module:vega-modal-size-responsive-e2e}
+   * @see{module:vega-modal-resize-e2e}
+   * While call toggle method for modal show or hide, it will call this method.
+   * but we should really update the modal width while first initialize modal, window resize and size changed.
+   * So to avoid repeated calls by toggle, we add a flag as parameter,
+   */
+  /* istanbul ignore next */
+  /**
+   * Set width of modal.
+   *
+   * @param {'initialize' | 'update'} flag - Is trigger by
+   */
+  setModalWidth(flag = 'initialize') {
+    if (this.isModalWidthSet && flag === 'initialize')
+      return;
+    const size = this.getModalSize();
+    const dialog = this.host.shadowRoot.querySelector('.modal-dialog');
+    typeof size === 'number'
+      ? (dialog.style['width'] = `${size}px`)
+      : (dialog.style['width'] = `${size}`);
+    this.isModalWidthSet = true;
+  }
+  /*
+   * The below method is e2e-test covered in
+   * @see{module:vega-modal-content-max-height-responsive-e2e}
+   */
+  /* istanbul ignore next */
+  /**
+   * Set max height of modal content.
+   */
+  setContentMaxHeight() {
+    const maxHeight = responsiveFormatFacade.formatCustom(this.contentMaxHeight);
+    if (typeof maxHeight === 'number' || typeof maxHeight === 'string') {
+      this.renderer.getModalContentRef().style.maxHeight = parseToPixelString(maxHeight);
+    }
+  }
+  /*
+   * The below method is e2e-test covered in
+   * @see{module:vega-modal-default-e2e}
+   * @see{module:vega-modal-size-number-e2e}
+   * @see{module:vega-modal-size-responsive-e2e}
+   * @see{module:vega-modal-resize-e2e}
+   * @see{module:vega-modal-default-width-S-320-e2e}
+   * @see{module:vega-modal-default-width-S-600-e2e}
+   */
+  /* istanbul ignore next */
+  /**
+   * Get size of modal.
+   *
+   * @returns {number | string} - Modal size.
+   */
+  getModalSize() {
+    const size = responsiveFormatFacade.format(this.size, 'size');
+    if (size) {
+      return size;
+    }
+    else {
+      return DefaultModalSize[getCurrentBreakpoint()];
+    }
+  }
+}
+__decorate$7([
+  MapToComponentField()
+], VegaModalLayoutController.prototype, "host", void 0);
+__decorate$7([
+  MapToComponentField()
+], VegaModalLayoutController.prototype, "contentMaxHeight", void 0);
+__decorate$7([
+  MapToComponentField()
+], VegaModalLayoutController.prototype, "size", void 0);
+__decorate$7([
+  MapToComponentField()
+], VegaModalLayoutController.prototype, "renderer", void 0);
+__decorate$7([
+  InjectVegaSlimmer()
+], VegaModalLayoutController.prototype, "pageResizeObserverSlimmer", void 0);
+__decorate$7([
+  MapToComponentMethod('componentDidLoad')
+], VegaModalLayoutController.prototype, "componentDidLoad", null);
+__decorate$7([
+  MapToComponentMethod('watchSize')
+], VegaModalLayoutController.prototype, "watchSize", null);
+__decorate$7([
+  MapToComponentMethod('watchContentMaxHeight')
+], VegaModalLayoutController.prototype, "watchContentMaxHeight", null);
+
+var __decorate$6 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+/**
+ * Modal mobile controller
+ */
+class VegaModalMobileController extends VegaSlimmer {
+  /* istanbul ignore next */
+  /**
+   * Component lifecycle - [connectedCallback]
+   */
+  componentDidLoad() {
+    if (getDeviceType() !== DeviceType.DESKTOP && this.backdrop !== 'none') {
+      this.disableBackdropTouchMove();
+    }
+  }
+  /* istanbul ignore next */
+  /**
+   * There are two situations in modal scrolling:
+   * 1. Scrolls the non-modal content part in vega-modal (e.g. backdrop, modal dialog).
+   * 2. Scrolls the modal content (if scrollable) in vega-modal.
+   * On the mobile side, we need to prevent scrolling in the area outside the modal content.
+   *
+   * TODO: If the modal content is too long, a scroll bar will appear and the body cannot be scrolled,
+   * but on the IOS side, the body content of the scrolling modal will occasionally appear scrolling.
+   * This problem is reproduced on the following websites, and there is no solution yet.
+   * https://v5.bootcss.com/docs/components/modal/
+   * https://mui.com/material-ui/react-dialog/
+   */
+  disableBackdropTouchMove() {
+    this.host.addEventListener('touchstart', (e) => {
+      this.touchStartY = e.targetTouches[0].pageY;
+    }, { capture: true });
+    this.host.addEventListener('touchmove', (e) => {
+      const isScrolledTop = this.host.scrollTop <= 0;
+      const isScrolledBottom = this.host.scrollHeight - this.host.scrollTop <= this.host.clientHeight;
+      const isToBottomMove = this.touchStartY < e.targetTouches[0].pageY;
+      const isToTopMove = this.touchStartY > e.targetTouches[0].pageY;
+      if (e.target === this.host &&
+        ((isScrolledTop && isToBottomMove) || (isScrolledBottom && isToTopMove))) {
+        e.preventDefault();
+      }
+    }, { capture: true });
+  }
+}
+__decorate$6([
+  MapToComponentField()
+], VegaModalMobileController.prototype, "host", void 0);
+__decorate$6([
+  MapToComponentField()
+], VegaModalMobileController.prototype, "backdrop", void 0);
+__decorate$6([
+  MapToComponentMethod('componentDidLoad')
+], VegaModalMobileController.prototype, "componentDidLoad", null);
+
+var __decorate$5 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+/**
+ * Modal scroll controller
+ */
+class VegaModalScrollController extends VegaSlimmer {
+  constructor() {
+    super(...arguments);
+    this.scrollEventListenerAdded = false;
+  }
+  /**
+   * Component lifecycle - [connectedCallback]
+   */
+  componentDidLoad() {
+    if (this.isContentScrollable()) {
+      this.listenContentScroll();
+    }
+  }
+  /**
+   * Listen watchContentMaxHeight method to be called
+   */
+  watchContentMaxHeight() {
+    if (!this.scrollEventListenerAdded && this.isContentScrollable()) {
+      this.listenContentScroll();
+    }
+  }
+  /**
+   * Is modal content scrollable.
+   *
+   * @returns {boolean} - Is scrollable.
+   */
+  isContentScrollable() {
+    return Boolean(this.contentMaxHeight);
+  }
+  /*
+   * The below method is e2e-test covered in
+   * @see{module:vega-modal-content-scroll-to-bottom}
+   */
+  /* istanbul ignore next */
+  /**
+   * Listen content scroll
+   */
+  listenContentScroll() {
+    const modalContent = this.renderer.getModalContentRef();
+    const modalFooter = this.renderer.getModalFooterRef();
+    modalContent.addEventListener('scroll', () => {
+      if (modalContent.scrollHeight - modalContent.scrollTop <= modalContent.clientHeight) {
+        modalFooter.classList.add('vega-modal-footer-with-content-scroll-to-bottom');
+      }
+      else {
+        modalFooter.classList.remove('vega-modal-footer-with-content-scroll-to-bottom');
+      }
+      this.notifyContentScrolling();
+    });
+    this.scrollEventListenerAdded = true;
+  }
+  /*
+   * The below method is e2e-test covered in
+   * @see{module:vega-modal-shadow-root-scrolling-e2e}
+   */
+  /* istanbul ignore next */
+  /**
+   * Notifies the `ChangeManager` about scrolling in a specific element within a shadow root.
+   */
+  notifyContentScrolling() {
+    ChangeManager.notify(SHADOW_ROOT_ELEMENT_SCROLLING, {
+      host: this.host,
+    });
+  }
+}
+__decorate$5([
+  MapToComponentField()
+], VegaModalScrollController.prototype, "host", void 0);
+__decorate$5([
+  MapToComponentField()
+], VegaModalScrollController.prototype, "contentMaxHeight", void 0);
+__decorate$5([
+  MapToComponentField()
+], VegaModalScrollController.prototype, "renderer", void 0);
+__decorate$5([
+  MapToComponentMethod('componentDidLoad')
+], VegaModalScrollController.prototype, "componentDidLoad", null);
+__decorate$5([
+  MapToComponentMethod('watchContentMaxHeight')
+], VegaModalScrollController.prototype, "watchContentMaxHeight", null);
+
+/**
+ * Represents the modal open state and the source that triggered the state change.
+ */
+class VegaModalOpenState {
+  constructor(isOpen, triggerBy) {
+    this.isOpen = isOpen;
+    this.triggerBy = triggerBy;
+  }
+}
+
+var __decorate$4 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+/**
+ * Modal open state controller
+ */
+class VegaModalOpenStateController extends VegaSlimmer {
+  constructor() {
+    super(...arguments);
+    /*
+     * The below method is e2e-test covered in
+     * @see{module:vega-modal-toggle-interactive-e2e}
+     */
+    /* istanbul ignore next */
+    /**
+     * Listen modal close event and close modal.
+     *
+     * @param {MouseEvent} e - Close modal event.
+     */
+    this.onModalClose = (e) => {
+      e.preventDefault();
+      e.stopPropagation();
+      if (!this.handleClose || this.handleClose()) {
+        this.close('close-button');
+      }
+    };
+  }
+  /**
+   * Component lifecycle - [disconnectedCallback]
+   */
+  disconnectedCallback() {
+    this.close('remove-node');
+  }
+  /**
+   * Component lifecycle - [componentDidLoad]
+   */
+  componentDidLoad() {
+    if (this.openState.isOpen) {
+      this.toggle();
+    }
+  }
+  /**
+   * Toggle modal while openState changed.
+   *
+   * @param {VegaModalOpenState} newState Specifies the new openState.
+   * @param {VegaModalOpenState} oldState Specifies the old openState.
+   */
+  watchOpenState(newState, oldState) {
+    if (newState.isOpen !== oldState.isOpen) {
+      this.toggle();
+      this.open = newState.isOpen;
+    }
+  }
+  /**
+   * Listen the target element clicked has a `data-target='modal'` attribute and open the modal if it does.
+   *
+   * @param {MouseEvent} e - Open modal event.
+   */
+  listenDataTarget(e) {
+    /*
+     * vega-backdrop cannot be clicked and is completely covered by vega-modal. Click events cannot be added to the backdrop.
+     */
+    const target = e.composedPath()[0];
+    if (target.tagName === 'VEGA-MODAL' && this.backdrop === 'default' && target === this.host) {
+      /**
+       * The below method is e2e-test covered in
+       *
+       * @see module:vega-modal-backdrop-mousedown-mouseup-e2e
+       */
+      /* istanbul ignore next */
+      if (this.backdropMouseDownOnHost && this.backdropMouseUpOnHost) {
+        this.close('backdrop');
+      }
+      else {
+        this.changeOpenState(true, 'backdrop');
+      }
+      this.resetBackdropClickFlags();
+    }
+    if (this.host.id &&
+      (target.getAttribute('data-target') === this.host.id ||
+        findParent(target, `[data-target=${this.host.id}]`))) {
+      e.preventDefault();
+      this.changeOpenState(true, 'data-target');
+    }
+  }
+  /*
+   * The below method is e2e-test covered in
+   * @see{module:vega-modal-toggle-interactive-e2e}
+   */
+  /* istanbul ignore next */
+  /**
+   * Listen the target element clicked has a `data-dismiss='modal'` attribute and closes the modal if it does.
+   *
+   * @param {MouseEvent} e - Close modal event.
+   */
+  listenDataDismiss(e) {
+    const target = e.target.closest(`[data-dismiss='modal']`);
+    if (target) {
+      e.preventDefault();
+      this.close('data-dismiss');
+    }
+  }
+  /*
+   * The below method is e2e-test covered in
+   * @see{@module:vega-modal-backdrop-mousedown-mouseup-e2e}
+   */
+  /* istanbul ignore next */
+  /**
+   * Listen the target element mousedown event
+   *
+   * @param {MouseEvent} e - mousedown event.
+   */
+  listenMouseDown(e) {
+    this.backdropMouseDownOnHost = this.isBackdropClickTargeted(e);
+  }
+  /*
+   * The below method is e2e-test covered in
+   * @see{@module:vega-modal-backdrop-mousedown-mouseup-e2e}
+   */
+  /* istanbul ignore next */
+  /**
+   * Listen the target element mousedown event
+   *
+   * @param {MouseEvent} e - mousedown event.
+   */
+  listenMouseUp(e) {
+    this.backdropMouseUpOnHost = this.isBackdropClickTargeted(e);
+  }
+  /* The below method is e2e-test covered in
+   * @see{module:vega-modal-toggle-interactive-e2e}
+   */
+  /**
+   * Handles the public modal API (`show` / `hide`).
+   *
+   * @param {'show' | 'hide'} option - Determines which state change to perform.
+   */
+  modal(option) {
+    switch (option) {
+      case 'show':
+        this.changeOpenState(true, 'method');
+        break;
+      default:
+        this.close('method');
+        break;
+    }
+  }
+  /**
+   * Close the modal via the provided trigger and emit the pending detail.
+   *
+   * @param {VegaModalOpenStateChangeTrigger} trigger - Indicates what initiated the close.
+   */
+  close(trigger) {
+    if (!this.openState.isOpen) {
+      return;
+    }
+    const event = this.closeEventEmitter.emit({ trigger });
+    if (!(event && event.defaultPrevented)) {
+      this.changeOpenState(false, trigger);
+    }
+  }
+  /**
+   * Updates the internal open state snapshot so watchers can react to the new value.
+   *
+   * @param {boolean} isOpen - Desired open flag for the modal.
+   * @param {VegaModalOpenStateChangeTrigger} triggerBy - Source that initiated the change.
+   */
+  changeOpenState(isOpen, triggerBy) {
+    if (this.openState.isOpen === isOpen) {
+      return;
+    }
+    this.openState = new VegaModalOpenState(isOpen, triggerBy);
+  }
+  /*
+   * The below method is e2e-test covered in
+   * @see{module:vega-modal-toggle-interactive-e2e}
+   */
+  /* istanbul ignore next */
+  /**
+   * Manages the visibility and behavior of a modal by updating various properties
+   * and emitting an event.
+   */
+  toggle() {
+    this.openState.isOpen
+      ? this.openedModalStackController.push()
+      : this.openedModalStackController.remove();
+    this.updateDocumentRootOverflow();
+    this.backdropController.setBackdrop();
+    this.zIndexController.setModalZIndex();
+    this.removeBackdropWhileNoModalShow();
+    this.layoutController.setModalWidth();
+    this.emitEvent();
+    this.setModalVisibility();
+  }
+  /*
+   * The below method is e2e-test covered in
+   * @see{module:vega-modal-toggle-interactive-e2e}
+   */
+  /* istanbul ignore next */
+  /**
+   * Toggles the display property of a modal element between 'flex' and
+   * 'none' based on the value of the `open` property.
+   */
+  setModalVisibility() {
+    this.host.style['display'] = this.openState.isOpen ? 'flex' : 'none';
+  }
+  /**
+   * Emits either an open or close event based on the value of the `open` property.
+   */
+  emitEvent() {
+    if (this.openState.isOpen) {
+      this.openEventEmitter.emit();
+      return;
+    }
+    if (this.openState.triggerBy === 'property') {
+      this.closeEventEmitter.emit({ trigger: 'property' });
+    }
+  }
+  /**
+   * In desktop, we should add 'overflow: hidden' to the body to prevent the body scroll.
+   */
+  updateDocumentRootOverflow() {
+    if (this.backdrop === 'none')
+      return;
+    const openedModalStackLength = this.openedModalStackController.length();
+    if (this.openState.isOpen && openedModalStackLength === 1) {
+      // eslint-disable-next-line no-restricted-globals
+      document.body.classList.add('disable-scroll-in-desktop');
+    }
+    else if (!this.openState.isOpen && openedModalStackLength === 0) {
+      // eslint-disable-next-line no-restricted-globals
+      document.body.classList.remove('disable-scroll-in-desktop');
+    }
+  }
+  /*
+   * The below method is e2e-test covered in
+   * @see{module:vega-modal-disconnected-callback-e2e }
+   */
+  /* istanbul ignore next */
+  /**
+   * Removes the backdrop element if no modals are currently visible.
+   */
+  removeBackdropWhileNoModalShow() {
+    if (!this.openState.isOpen && this.openedModalStackController.length() === 0) {
+      this.backdropController.removeBackdrop();
+    }
+  }
+  /*
+   * The below method is e2e-test covered in
+   * @see{@module:vega-modal-backdrop-mousedown-mouseup-e2e}
+   */
+  /* istanbul ignore next */
+  /**
+   * Check if mouse event originates from vega-modal backdrop.
+   *
+   * @param {MouseEvent} e - The mousedown or mouseup event.
+   * @returns { boolean } Return true if is within backdrop otherwise, false
+   */
+  isBackdropClickTargeted(e) {
+    const target = e.composedPath()[0];
+    return target.tagName === 'VEGA-MODAL' && target === this.host;
+  }
+  /**
+   * Reset backdrop click flags.
+   */
+  resetBackdropClickFlags() {
+    this.backdropMouseDownOnHost = false;
+    this.backdropMouseUpOnHost = false;
+  }
+}
+__decorate$4([
+  MapToComponentField()
+], VegaModalOpenStateController.prototype, "host", void 0);
+__decorate$4([
+  MapToComponentField({ writable: true })
+], VegaModalOpenStateController.prototype, "open", void 0);
+__decorate$4([
+  MapToComponentField({ writable: true })
+], VegaModalOpenStateController.prototype, "openState", void 0);
+__decorate$4([
+  MapToComponentField()
+], VegaModalOpenStateController.prototype, "backdrop", void 0);
+__decorate$4([
+  MapToComponentField()
+], VegaModalOpenStateController.prototype, "handleClose", void 0);
+__decorate$4([
+  MapToComponentField()
+], VegaModalOpenStateController.prototype, "closeEventEmitter", void 0);
+__decorate$4([
+  MapToComponentField()
+], VegaModalOpenStateController.prototype, "openEventEmitter", void 0);
+__decorate$4([
+  MapToComponentField()
+], VegaModalOpenStateController.prototype, "layoutController", void 0);
+__decorate$4([
+  MapToComponentField()
+], VegaModalOpenStateController.prototype, "backdropController", void 0);
+__decorate$4([
+  MapToComponentField()
+], VegaModalOpenStateController.prototype, "openedModalStackController", void 0);
+__decorate$4([
+  MapToComponentField()
+], VegaModalOpenStateController.prototype, "zIndexController", void 0);
+__decorate$4([
+  MapToComponentMethod('disconnectedCallback')
+], VegaModalOpenStateController.prototype, "disconnectedCallback", null);
+__decorate$4([
+  MapToComponentMethod('componentDidLoad')
+], VegaModalOpenStateController.prototype, "componentDidLoad", null);
+__decorate$4([
+  MapToComponentMethod('watchOpenState')
+], VegaModalOpenStateController.prototype, "watchOpenState", null);
+__decorate$4([
+  MapToComponentMethod('listenDataTarget')
+], VegaModalOpenStateController.prototype, "listenDataTarget", null);
+__decorate$4([
+  MapToComponentMethod('listenDataDismiss')
+], VegaModalOpenStateController.prototype, "listenDataDismiss", null);
+__decorate$4([
+  MapToComponentMethod('listenMouseDown')
+], VegaModalOpenStateController.prototype, "listenMouseDown", null);
+__decorate$4([
+  MapToComponentMethod('listenMouseUp')
+], VegaModalOpenStateController.prototype, "listenMouseUp", null);
+__decorate$4([
+  MapToComponentMethod('modal')
+], VegaModalOpenStateController.prototype, "modal", null);
+
+var __decorate$3 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+/**
+ * Modal backdrop controller
+ */
+class VegaModalBackdropController extends VegaSlimmer {
+  /**
+   * Get the backdropRef element or null.
+   *
+   * @returns {HTMLElement | null} - The backdropRef.
+   */
+  getBackdropRef() {
+    return this.backdropRef;
+  }
+  /*
+   * The below method is e2e-test covered in
+   * @see{module:vega-modal-backdrop-color-default-e2e}
+   * @see{module:vega-modal-backdrop-color-semi-e2e}
+   * @see{module:vega-modal-backdrop-color-none-e2e}
+   * @see{module:vega-modal-default-e2e}
+   */
+  /* istanbul ignore next */
+  /**
+   * Set backdrop of modal.
+   */
+  setBackdrop() {
+    if (this.backdrop === 'none')
+      return;
+    // eslint-disable-next-line no-restricted-globals
+    let backdrop = document.querySelector('vega-backdrop.modal-backdrop');
+    if (!backdrop) {
+      // eslint-disable-next-line no-restricted-globals
+      backdrop = document.createElement('vega-backdrop');
+      backdrop.classList.add('modal-backdrop');
+      backdrop.color = VegaModalBackdropController.backdropColorMap[this.backdropColor];
+      backdrop.visible = true;
+      // eslint-disable-next-line no-restricted-globals
+      document.querySelector('body').append(backdrop);
+    }
+    this.backdropRef = backdrop;
+  }
+  /**
+   * Removes the backdrop element if it exists.
+   */
+  removeBackdrop() {
+    this.backdropRef && this.backdropRef.remove();
+  }
+}
+VegaModalBackdropController.backdropColorMap = {
+  default: 'bg-backdrop-modal',
+  semi: 'bg-backdrop-popover',
+  none: 'bg-transparent',
+};
+__decorate$3([
+  MapToComponentField()
+], VegaModalBackdropController.prototype, "host", void 0);
+__decorate$3([
+  MapToComponentField()
+], VegaModalBackdropController.prototype, "backdrop", void 0);
+__decorate$3([
+  MapToComponentField()
+], VegaModalBackdropController.prototype, "backdropColor", void 0);
+
+var __decorate$2 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+/**
+ * Opened modal stack controller
+ */
+class VegaModalOpenedModalStackController extends VegaSlimmer {
+  /**
+   * Adds the current host element to an array in a modal toggle controller.
+   */
+  push() {
+    VegaModalOpenedModalStackController.openedModalStack.push(this.host);
+  }
+  /**
+   * Removes the current modal from the opened modal stack.
+   */
+  remove() {
+    VegaModalOpenedModalStackController.openedModalStack =
+      VegaModalOpenedModalStackController.openedModalStack.filter((modal) => modal !== this.host);
+  }
+  //TODO: Record the nest modal by an array.
+  /**
+   * Get visible modal length.
+   *
+   * @returns {number} - Visible modal length.
+   */
+  length() {
+    return VegaModalOpenedModalStackController.openedModalStack.length;
+  }
+  /**
+   * Returns the previous HTMLVegaModalElement from the openedModalStack if it exists.
+   *
+   * @returns {Nullable<HTMLVegaModalElement>} - The previous HTMLVegaModalElement.
+   */
+  peek() {
+    const length = this.length();
+    if (length > 0) {
+      return VegaModalOpenedModalStackController.openedModalStack[length - 1];
+    }
+    /* istanbul ignore next */
+    return null;
+  }
+}
+VegaModalOpenedModalStackController.openedModalStack = [];
+__decorate$2([
+  MapToComponentField()
+], VegaModalOpenedModalStackController.prototype, "host", void 0);
+
+var __decorate$1 = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+  else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+/**
+ * Modal z-index controller
+ */
+class VegaModalZIndexController extends VegaSlimmer {
+  /**
+   * Manages the z-index of modal elements based on their visibility status.
+   */
+  setModalZIndex() {
+    const backdropRef = this.backdropController.getBackdropRef();
+    if (this.openState.isOpen) {
+      InternalVegaZIndexManager.setZIndex(backdropRef, 'base');
+      InternalVegaZIndexManager.setZIndex(this.host, 'base');
+    }
+    else {
+      InternalVegaZIndexManager.removeZIndex(backdropRef, 'base');
+      InternalVegaZIndexManager.removeZIndex(this.host, 'base');
+      if (this.openedModalStackController.length() > 0) {
+        InternalVegaZIndexManager.setZIndex(backdropRef, 'base');
+        InternalVegaZIndexManager.setZIndex(this.openedModalStackController.peek(), 'base');
+      }
+    }
+  }
+}
+__decorate$1([
+  MapToComponentField()
+], VegaModalZIndexController.prototype, "host", void 0);
+__decorate$1([
+  MapToComponentField()
+], VegaModalZIndexController.prototype, "open", void 0);
+__decorate$1([
+  MapToComponentField()
+], VegaModalZIndexController.prototype, "openState", void 0);
+__decorate$1([
+  MapToComponentField()
+], VegaModalZIndexController.prototype, "backdropController", void 0);
+__decorate$1([
+  MapToComponentField()
+], VegaModalZIndexController.prototype, "openedModalStackController", void 0);
+
+const vegaModalCss = ":host(.v-p-0),.v-p-0{padding:0px}:host(.v-px-0),.v-px-0{padding-left:0px;padding-right:0px}:host(.v-py-0),.v-py-0{padding-top:0px;padding-bottom:0px}:host(.v-pt-0),.v-pt-0{padding-top:0px}:host(.v-pb-0),.v-pb-0{padding-bottom:0px}:host(.v-pr-0),.v-pr-0{padding-right:0px}:host(.v-pl-0),.v-pl-0{padding-left:0px}:host(.v-p-size-0),.v-p-size-0{padding:0px}:host(.v-px-size-0),.v-px-size-0{padding-left:0px;padding-right:0px}:host(.v-py-size-0),.v-py-size-0{padding-top:0px;padding-bottom:0px}:host(.v-pt-size-0),.v-pt-size-0{padding-top:0px}:host(.v-pb-size-0),.v-pb-size-0{padding-bottom:0px}:host(.v-pr-size-0),.v-pr-size-0{padding-right:0px}:host(.v-pl-size-0),.v-pl-size-0{padding-left:0px}:host(.v-p-size-4),.v-p-size-4{padding:4px}:host(.v-px-size-4),.v-px-size-4{padding-left:4px;padding-right:4px}:host(.v-py-size-4),.v-py-size-4{padding-top:4px;padding-bottom:4px}:host(.v-pt-size-4),.v-pt-size-4{padding-top:4px}:host(.v-pb-size-4),.v-pb-size-4{padding-bottom:4px}:host(.v-pr-size-4),.v-pr-size-4{padding-right:4px}:host(.v-pl-size-4),.v-pl-size-4{padding-left:4px}:host(.v-p-size-8),.v-p-size-8{padding:8px}:host(.v-px-size-8),.v-px-size-8{padding-left:8px;padding-right:8px}:host(.v-py-size-8),.v-py-size-8{padding-top:8px;padding-bottom:8px}:host(.v-pt-size-8),.v-pt-size-8{padding-top:8px}:host(.v-pb-size-8),.v-pb-size-8{padding-bottom:8px}:host(.v-pr-size-8),.v-pr-size-8{padding-right:8px}:host(.v-pl-size-8),.v-pl-size-8{padding-left:8px}:host(.v-p-size-12),.v-p-size-12{padding:12px}:host(.v-px-size-12),.v-px-size-12{padding-left:12px;padding-right:12px}:host(.v-py-size-12),.v-py-size-12{padding-top:12px;padding-bottom:12px}:host(.v-pt-size-12),.v-pt-size-12{padding-top:12px}:host(.v-pb-size-12),.v-pb-size-12{padding-bottom:12px}:host(.v-pr-size-12),.v-pr-size-12{padding-right:12px}:host(.v-pl-size-12),.v-pl-size-12{padding-left:12px}:host(.v-p-size-16),.v-p-size-16{padding:16px}:host(.v-px-size-16),.v-px-size-16{padding-left:16px;padding-right:16px}:host(.v-py-size-16),.v-py-size-16{padding-top:16px;padding-bottom:16px}:host(.v-pt-size-16),.v-pt-size-16{padding-top:16px}:host(.v-pb-size-16),.v-pb-size-16{padding-bottom:16px}:host(.v-pr-size-16),.v-pr-size-16{padding-right:16px}:host(.v-pl-size-16),.v-pl-size-16{padding-left:16px}:host(.v-p-size-20),.v-p-size-20{padding:20px}:host(.v-px-size-20),.v-px-size-20{padding-left:20px;padding-right:20px}:host(.v-py-size-20),.v-py-size-20{padding-top:20px;padding-bottom:20px}:host(.v-pt-size-20),.v-pt-size-20{padding-top:20px}:host(.v-pb-size-20),.v-pb-size-20{padding-bottom:20px}:host(.v-pr-size-20),.v-pr-size-20{padding-right:20px}:host(.v-pl-size-20),.v-pl-size-20{padding-left:20px}:host(.v-p-size-24),.v-p-size-24{padding:24px}:host(.v-px-size-24),.v-px-size-24{padding-left:24px;padding-right:24px}:host(.v-py-size-24),.v-py-size-24{padding-top:24px;padding-bottom:24px}:host(.v-pt-size-24),.v-pt-size-24{padding-top:24px}:host(.v-pb-size-24),.v-pb-size-24{padding-bottom:24px}:host(.v-pr-size-24),.v-pr-size-24{padding-right:24px}:host(.v-pl-size-24),.v-pl-size-24{padding-left:24px}:host(.v-p-size-32),.v-p-size-32{padding:32px}:host(.v-px-size-32),.v-px-size-32{padding-left:32px;padding-right:32px}:host(.v-py-size-32),.v-py-size-32{padding-top:32px;padding-bottom:32px}:host(.v-pt-size-32),.v-pt-size-32{padding-top:32px}:host(.v-pb-size-32),.v-pb-size-32{padding-bottom:32px}:host(.v-pr-size-32),.v-pr-size-32{padding-right:32px}:host(.v-pl-size-32),.v-pl-size-32{padding-left:32px}:host(.v-p-size-40),.v-p-size-40{padding:40px}:host(.v-px-size-40),.v-px-size-40{padding-left:40px;padding-right:40px}:host(.v-py-size-40),.v-py-size-40{padding-top:40px;padding-bottom:40px}:host(.v-pt-size-40),.v-pt-size-40{padding-top:40px}:host(.v-pb-size-40),.v-pb-size-40{padding-bottom:40px}:host(.v-pr-size-40),.v-pr-size-40{padding-right:40px}:host(.v-pl-size-40),.v-pl-size-40{padding-left:40px}:host(.v-p-size-48),.v-p-size-48{padding:48px}:host(.v-px-size-48),.v-px-size-48{padding-left:48px;padding-right:48px}:host(.v-py-size-48),.v-py-size-48{padding-top:48px;padding-bottom:48px}:host(.v-pt-size-48),.v-pt-size-48{padding-top:48px}:host(.v-pb-size-48),.v-pb-size-48{padding-bottom:48px}:host(.v-pr-size-48),.v-pr-size-48{padding-right:48px}:host(.v-pl-size-48),.v-pl-size-48{padding-left:48px}:host(.v-p-size-64),.v-p-size-64{padding:64px}:host(.v-px-size-64),.v-px-size-64{padding-left:64px;padding-right:64px}:host(.v-py-size-64),.v-py-size-64{padding-top:64px;padding-bottom:64px}:host(.v-pt-size-64),.v-pt-size-64{padding-top:64px}:host(.v-pb-size-64),.v-pb-size-64{padding-bottom:64px}:host(.v-pr-size-64),.v-pr-size-64{padding-right:64px}:host(.v-pl-size-64),.v-pl-size-64{padding-left:64px}:host(.v-p-size-72),.v-p-size-72{padding:72px}:host(.v-px-size-72),.v-px-size-72{padding-left:72px;padding-right:72px}:host(.v-py-size-72),.v-py-size-72{padding-top:72px;padding-bottom:72px}:host(.v-pt-size-72),.v-pt-size-72{padding-top:72px}:host(.v-pb-size-72),.v-pb-size-72{padding-bottom:72px}:host(.v-pr-size-72),.v-pr-size-72{padding-right:72px}:host(.v-pl-size-72),.v-pl-size-72{padding-left:72px}:host(.v-p-size-80),.v-p-size-80{padding:80px}:host(.v-px-size-80),.v-px-size-80{padding-left:80px;padding-right:80px}:host(.v-py-size-80),.v-py-size-80{padding-top:80px;padding-bottom:80px}:host(.v-pt-size-80),.v-pt-size-80{padding-top:80px}:host(.v-pb-size-80),.v-pb-size-80{padding-bottom:80px}:host(.v-pr-size-80),.v-pr-size-80{padding-right:80px}:host(.v-pl-size-80),.v-pl-size-80{padding-left:80px}:host(.v-p-size-112),.v-p-size-112{padding:112px}:host(.v-px-size-112),.v-px-size-112{padding-left:112px;padding-right:112px}:host(.v-py-size-112),.v-py-size-112{padding-top:112px;padding-bottom:112px}:host(.v-pt-size-112),.v-pt-size-112{padding-top:112px}:host(.v-pb-size-112),.v-pb-size-112{padding-bottom:112px}:host(.v-pr-size-112),.v-pr-size-112{padding-right:112px}:host(.v-pl-size-112),.v-pl-size-112{padding-left:112px}:host(.v-p-size-2),.v-p-size-2{padding:2px}:host(.v-px-size-2),.v-px-size-2{padding-left:2px;padding-right:2px}:host(.v-py-size-2),.v-py-size-2{padding-top:2px;padding-bottom:2px}:host(.v-pt-size-2),.v-pt-size-2{padding-top:2px}:host(.v-pb-size-2),.v-pb-size-2{padding-bottom:2px}:host(.v-pr-size-2),.v-pr-size-2{padding-right:2px}:host(.v-pl-size-2),.v-pl-size-2{padding-left:2px}@media (min-width: 320px){:host(.S\\:v-p-0),.S\\:v-p-0{padding:0px}:host(.S\\:v-px-0),.S\\:v-px-0{padding-left:0px;padding-right:0px}:host(.S\\:v-py-0),.S\\:v-py-0{padding-top:0px;padding-bottom:0px}:host(.S\\:v-pt-0),.S\\:v-pt-0{padding-top:0px}:host(.S\\:v-pb-0),.S\\:v-pb-0{padding-bottom:0px}:host(.S\\:v-pr-0),.S\\:v-pr-0{padding-right:0px}:host(.S\\:v-pl-0),.S\\:v-pl-0{padding-left:0px}:host(.S\\:v-p-size-0),.S\\:v-p-size-0{padding:0px}:host(.S\\:v-px-size-0),.S\\:v-px-size-0{padding-left:0px;padding-right:0px}:host(.S\\:v-py-size-0),.S\\:v-py-size-0{padding-top:0px;padding-bottom:0px}:host(.S\\:v-pt-size-0),.S\\:v-pt-size-0{padding-top:0px}:host(.S\\:v-pb-size-0),.S\\:v-pb-size-0{padding-bottom:0px}:host(.S\\:v-pr-size-0),.S\\:v-pr-size-0{padding-right:0px}:host(.S\\:v-pl-size-0),.S\\:v-pl-size-0{padding-left:0px}:host(.S\\:v-p-size-4),.S\\:v-p-size-4{padding:4px}:host(.S\\:v-px-size-4),.S\\:v-px-size-4{padding-left:4px;padding-right:4px}:host(.S\\:v-py-size-4),.S\\:v-py-size-4{padding-top:4px;padding-bottom:4px}:host(.S\\:v-pt-size-4),.S\\:v-pt-size-4{padding-top:4px}:host(.S\\:v-pb-size-4),.S\\:v-pb-size-4{padding-bottom:4px}:host(.S\\:v-pr-size-4),.S\\:v-pr-size-4{padding-right:4px}:host(.S\\:v-pl-size-4),.S\\:v-pl-size-4{padding-left:4px}:host(.S\\:v-p-size-8),.S\\:v-p-size-8{padding:8px}:host(.S\\:v-px-size-8),.S\\:v-px-size-8{padding-left:8px;padding-right:8px}:host(.S\\:v-py-size-8),.S\\:v-py-size-8{padding-top:8px;padding-bottom:8px}:host(.S\\:v-pt-size-8),.S\\:v-pt-size-8{padding-top:8px}:host(.S\\:v-pb-size-8),.S\\:v-pb-size-8{padding-bottom:8px}:host(.S\\:v-pr-size-8),.S\\:v-pr-size-8{padding-right:8px}:host(.S\\:v-pl-size-8),.S\\:v-pl-size-8{padding-left:8px}:host(.S\\:v-p-size-12),.S\\:v-p-size-12{padding:12px}:host(.S\\:v-px-size-12),.S\\:v-px-size-12{padding-left:12px;padding-right:12px}:host(.S\\:v-py-size-12),.S\\:v-py-size-12{padding-top:12px;padding-bottom:12px}:host(.S\\:v-pt-size-12),.S\\:v-pt-size-12{padding-top:12px}:host(.S\\:v-pb-size-12),.S\\:v-pb-size-12{padding-bottom:12px}:host(.S\\:v-pr-size-12),.S\\:v-pr-size-12{padding-right:12px}:host(.S\\:v-pl-size-12),.S\\:v-pl-size-12{padding-left:12px}:host(.S\\:v-p-size-16),.S\\:v-p-size-16{padding:16px}:host(.S\\:v-px-size-16),.S\\:v-px-size-16{padding-left:16px;padding-right:16px}:host(.S\\:v-py-size-16),.S\\:v-py-size-16{padding-top:16px;padding-bottom:16px}:host(.S\\:v-pt-size-16),.S\\:v-pt-size-16{padding-top:16px}:host(.S\\:v-pb-size-16),.S\\:v-pb-size-16{padding-bottom:16px}:host(.S\\:v-pr-size-16),.S\\:v-pr-size-16{padding-right:16px}:host(.S\\:v-pl-size-16),.S\\:v-pl-size-16{padding-left:16px}:host(.S\\:v-p-size-20),.S\\:v-p-size-20{padding:20px}:host(.S\\:v-px-size-20),.S\\:v-px-size-20{padding-left:20px;padding-right:20px}:host(.S\\:v-py-size-20),.S\\:v-py-size-20{padding-top:20px;padding-bottom:20px}:host(.S\\:v-pt-size-20),.S\\:v-pt-size-20{padding-top:20px}:host(.S\\:v-pb-size-20),.S\\:v-pb-size-20{padding-bottom:20px}:host(.S\\:v-pr-size-20),.S\\:v-pr-size-20{padding-right:20px}:host(.S\\:v-pl-size-20),.S\\:v-pl-size-20{padding-left:20px}:host(.S\\:v-p-size-24),.S\\:v-p-size-24{padding:24px}:host(.S\\:v-px-size-24),.S\\:v-px-size-24{padding-left:24px;padding-right:24px}:host(.S\\:v-py-size-24),.S\\:v-py-size-24{padding-top:24px;padding-bottom:24px}:host(.S\\:v-pt-size-24),.S\\:v-pt-size-24{padding-top:24px}:host(.S\\:v-pb-size-24),.S\\:v-pb-size-24{padding-bottom:24px}:host(.S\\:v-pr-size-24),.S\\:v-pr-size-24{padding-right:24px}:host(.S\\:v-pl-size-24),.S\\:v-pl-size-24{padding-left:24px}:host(.S\\:v-p-size-32),.S\\:v-p-size-32{padding:32px}:host(.S\\:v-px-size-32),.S\\:v-px-size-32{padding-left:32px;padding-right:32px}:host(.S\\:v-py-size-32),.S\\:v-py-size-32{padding-top:32px;padding-bottom:32px}:host(.S\\:v-pt-size-32),.S\\:v-pt-size-32{padding-top:32px}:host(.S\\:v-pb-size-32),.S\\:v-pb-size-32{padding-bottom:32px}:host(.S\\:v-pr-size-32),.S\\:v-pr-size-32{padding-right:32px}:host(.S\\:v-pl-size-32),.S\\:v-pl-size-32{padding-left:32px}:host(.S\\:v-p-size-40),.S\\:v-p-size-40{padding:40px}:host(.S\\:v-px-size-40),.S\\:v-px-size-40{padding-left:40px;padding-right:40px}:host(.S\\:v-py-size-40),.S\\:v-py-size-40{padding-top:40px;padding-bottom:40px}:host(.S\\:v-pt-size-40),.S\\:v-pt-size-40{padding-top:40px}:host(.S\\:v-pb-size-40),.S\\:v-pb-size-40{padding-bottom:40px}:host(.S\\:v-pr-size-40),.S\\:v-pr-size-40{padding-right:40px}:host(.S\\:v-pl-size-40),.S\\:v-pl-size-40{padding-left:40px}:host(.S\\:v-p-size-48),.S\\:v-p-size-48{padding:48px}:host(.S\\:v-px-size-48),.S\\:v-px-size-48{padding-left:48px;padding-right:48px}:host(.S\\:v-py-size-48),.S\\:v-py-size-48{padding-top:48px;padding-bottom:48px}:host(.S\\:v-pt-size-48),.S\\:v-pt-size-48{padding-top:48px}:host(.S\\:v-pb-size-48),.S\\:v-pb-size-48{padding-bottom:48px}:host(.S\\:v-pr-size-48),.S\\:v-pr-size-48{padding-right:48px}:host(.S\\:v-pl-size-48),.S\\:v-pl-size-48{padding-left:48px}:host(.S\\:v-p-size-64),.S\\:v-p-size-64{padding:64px}:host(.S\\:v-px-size-64),.S\\:v-px-size-64{padding-left:64px;padding-right:64px}:host(.S\\:v-py-size-64),.S\\:v-py-size-64{padding-top:64px;padding-bottom:64px}:host(.S\\:v-pt-size-64),.S\\:v-pt-size-64{padding-top:64px}:host(.S\\:v-pb-size-64),.S\\:v-pb-size-64{padding-bottom:64px}:host(.S\\:v-pr-size-64),.S\\:v-pr-size-64{padding-right:64px}:host(.S\\:v-pl-size-64),.S\\:v-pl-size-64{padding-left:64px}:host(.S\\:v-p-size-72),.S\\:v-p-size-72{padding:72px}:host(.S\\:v-px-size-72),.S\\:v-px-size-72{padding-left:72px;padding-right:72px}:host(.S\\:v-py-size-72),.S\\:v-py-size-72{padding-top:72px;padding-bottom:72px}:host(.S\\:v-pt-size-72),.S\\:v-pt-size-72{padding-top:72px}:host(.S\\:v-pb-size-72),.S\\:v-pb-size-72{padding-bottom:72px}:host(.S\\:v-pr-size-72),.S\\:v-pr-size-72{padding-right:72px}:host(.S\\:v-pl-size-72),.S\\:v-pl-size-72{padding-left:72px}:host(.S\\:v-p-size-80),.S\\:v-p-size-80{padding:80px}:host(.S\\:v-px-size-80),.S\\:v-px-size-80{padding-left:80px;padding-right:80px}:host(.S\\:v-py-size-80),.S\\:v-py-size-80{padding-top:80px;padding-bottom:80px}:host(.S\\:v-pt-size-80),.S\\:v-pt-size-80{padding-top:80px}:host(.S\\:v-pb-size-80),.S\\:v-pb-size-80{padding-bottom:80px}:host(.S\\:v-pr-size-80),.S\\:v-pr-size-80{padding-right:80px}:host(.S\\:v-pl-size-80),.S\\:v-pl-size-80{padding-left:80px}:host(.S\\:v-p-size-112),.S\\:v-p-size-112{padding:112px}:host(.S\\:v-px-size-112),.S\\:v-px-size-112{padding-left:112px;padding-right:112px}:host(.S\\:v-py-size-112),.S\\:v-py-size-112{padding-top:112px;padding-bottom:112px}:host(.S\\:v-pt-size-112),.S\\:v-pt-size-112{padding-top:112px}:host(.S\\:v-pb-size-112),.S\\:v-pb-size-112{padding-bottom:112px}:host(.S\\:v-pr-size-112),.S\\:v-pr-size-112{padding-right:112px}:host(.S\\:v-pl-size-112),.S\\:v-pl-size-112{padding-left:112px}:host(.S\\:v-p-size-2),.S\\:v-p-size-2{padding:2px}:host(.S\\:v-px-size-2),.S\\:v-px-size-2{padding-left:2px;padding-right:2px}:host(.S\\:v-py-size-2),.S\\:v-py-size-2{padding-top:2px;padding-bottom:2px}:host(.S\\:v-pt-size-2),.S\\:v-pt-size-2{padding-top:2px}:host(.S\\:v-pb-size-2),.S\\:v-pb-size-2{padding-bottom:2px}:host(.S\\:v-pr-size-2),.S\\:v-pr-size-2{padding-right:2px}:host(.S\\:v-pl-size-2),.S\\:v-pl-size-2{padding-left:2px}}@media (min-width: 768px){:host(.M\\:v-p-0),.M\\:v-p-0{padding:0px}:host(.M\\:v-px-0),.M\\:v-px-0{padding-left:0px;padding-right:0px}:host(.M\\:v-py-0),.M\\:v-py-0{padding-top:0px;padding-bottom:0px}:host(.M\\:v-pt-0),.M\\:v-pt-0{padding-top:0px}:host(.M\\:v-pb-0),.M\\:v-pb-0{padding-bottom:0px}:host(.M\\:v-pr-0),.M\\:v-pr-0{padding-right:0px}:host(.M\\:v-pl-0),.M\\:v-pl-0{padding-left:0px}:host(.M\\:v-p-size-0),.M\\:v-p-size-0{padding:0px}:host(.M\\:v-px-size-0),.M\\:v-px-size-0{padding-left:0px;padding-right:0px}:host(.M\\:v-py-size-0),.M\\:v-py-size-0{padding-top:0px;padding-bottom:0px}:host(.M\\:v-pt-size-0),.M\\:v-pt-size-0{padding-top:0px}:host(.M\\:v-pb-size-0),.M\\:v-pb-size-0{padding-bottom:0px}:host(.M\\:v-pr-size-0),.M\\:v-pr-size-0{padding-right:0px}:host(.M\\:v-pl-size-0),.M\\:v-pl-size-0{padding-left:0px}:host(.M\\:v-p-size-4),.M\\:v-p-size-4{padding:4px}:host(.M\\:v-px-size-4),.M\\:v-px-size-4{padding-left:4px;padding-right:4px}:host(.M\\:v-py-size-4),.M\\:v-py-size-4{padding-top:4px;padding-bottom:4px}:host(.M\\:v-pt-size-4),.M\\:v-pt-size-4{padding-top:4px}:host(.M\\:v-pb-size-4),.M\\:v-pb-size-4{padding-bottom:4px}:host(.M\\:v-pr-size-4),.M\\:v-pr-size-4{padding-right:4px}:host(.M\\:v-pl-size-4),.M\\:v-pl-size-4{padding-left:4px}:host(.M\\:v-p-size-8),.M\\:v-p-size-8{padding:8px}:host(.M\\:v-px-size-8),.M\\:v-px-size-8{padding-left:8px;padding-right:8px}:host(.M\\:v-py-size-8),.M\\:v-py-size-8{padding-top:8px;padding-bottom:8px}:host(.M\\:v-pt-size-8),.M\\:v-pt-size-8{padding-top:8px}:host(.M\\:v-pb-size-8),.M\\:v-pb-size-8{padding-bottom:8px}:host(.M\\:v-pr-size-8),.M\\:v-pr-size-8{padding-right:8px}:host(.M\\:v-pl-size-8),.M\\:v-pl-size-8{padding-left:8px}:host(.M\\:v-p-size-12),.M\\:v-p-size-12{padding:12px}:host(.M\\:v-px-size-12),.M\\:v-px-size-12{padding-left:12px;padding-right:12px}:host(.M\\:v-py-size-12),.M\\:v-py-size-12{padding-top:12px;padding-bottom:12px}:host(.M\\:v-pt-size-12),.M\\:v-pt-size-12{padding-top:12px}:host(.M\\:v-pb-size-12),.M\\:v-pb-size-12{padding-bottom:12px}:host(.M\\:v-pr-size-12),.M\\:v-pr-size-12{padding-right:12px}:host(.M\\:v-pl-size-12),.M\\:v-pl-size-12{padding-left:12px}:host(.M\\:v-p-size-16),.M\\:v-p-size-16{padding:16px}:host(.M\\:v-px-size-16),.M\\:v-px-size-16{padding-left:16px;padding-right:16px}:host(.M\\:v-py-size-16),.M\\:v-py-size-16{padding-top:16px;padding-bottom:16px}:host(.M\\:v-pt-size-16),.M\\:v-pt-size-16{padding-top:16px}:host(.M\\:v-pb-size-16),.M\\:v-pb-size-16{padding-bottom:16px}:host(.M\\:v-pr-size-16),.M\\:v-pr-size-16{padding-right:16px}:host(.M\\:v-pl-size-16),.M\\:v-pl-size-16{padding-left:16px}:host(.M\\:v-p-size-20),.M\\:v-p-size-20{padding:20px}:host(.M\\:v-px-size-20),.M\\:v-px-size-20{padding-left:20px;padding-right:20px}:host(.M\\:v-py-size-20),.M\\:v-py-size-20{padding-top:20px;padding-bottom:20px}:host(.M\\:v-pt-size-20),.M\\:v-pt-size-20{padding-top:20px}:host(.M\\:v-pb-size-20),.M\\:v-pb-size-20{padding-bottom:20px}:host(.M\\:v-pr-size-20),.M\\:v-pr-size-20{padding-right:20px}:host(.M\\:v-pl-size-20),.M\\:v-pl-size-20{padding-left:20px}:host(.M\\:v-p-size-24),.M\\:v-p-size-24{padding:24px}:host(.M\\:v-px-size-24),.M\\:v-px-size-24{padding-left:24px;padding-right:24px}:host(.M\\:v-py-size-24),.M\\:v-py-size-24{padding-top:24px;padding-bottom:24px}:host(.M\\:v-pt-size-24),.M\\:v-pt-size-24{padding-top:24px}:host(.M\\:v-pb-size-24),.M\\:v-pb-size-24{padding-bottom:24px}:host(.M\\:v-pr-size-24),.M\\:v-pr-size-24{padding-right:24px}:host(.M\\:v-pl-size-24),.M\\:v-pl-size-24{padding-left:24px}:host(.M\\:v-p-size-32),.M\\:v-p-size-32{padding:32px}:host(.M\\:v-px-size-32),.M\\:v-px-size-32{padding-left:32px;padding-right:32px}:host(.M\\:v-py-size-32),.M\\:v-py-size-32{padding-top:32px;padding-bottom:32px}:host(.M\\:v-pt-size-32),.M\\:v-pt-size-32{padding-top:32px}:host(.M\\:v-pb-size-32),.M\\:v-pb-size-32{padding-bottom:32px}:host(.M\\:v-pr-size-32),.M\\:v-pr-size-32{padding-right:32px}:host(.M\\:v-pl-size-32),.M\\:v-pl-size-32{padding-left:32px}:host(.M\\:v-p-size-40),.M\\:v-p-size-40{padding:40px}:host(.M\\:v-px-size-40),.M\\:v-px-size-40{padding-left:40px;padding-right:40px}:host(.M\\:v-py-size-40),.M\\:v-py-size-40{padding-top:40px;padding-bottom:40px}:host(.M\\:v-pt-size-40),.M\\:v-pt-size-40{padding-top:40px}:host(.M\\:v-pb-size-40),.M\\:v-pb-size-40{padding-bottom:40px}:host(.M\\:v-pr-size-40),.M\\:v-pr-size-40{padding-right:40px}:host(.M\\:v-pl-size-40),.M\\:v-pl-size-40{padding-left:40px}:host(.M\\:v-p-size-48),.M\\:v-p-size-48{padding:48px}:host(.M\\:v-px-size-48),.M\\:v-px-size-48{padding-left:48px;padding-right:48px}:host(.M\\:v-py-size-48),.M\\:v-py-size-48{padding-top:48px;padding-bottom:48px}:host(.M\\:v-pt-size-48),.M\\:v-pt-size-48{padding-top:48px}:host(.M\\:v-pb-size-48),.M\\:v-pb-size-48{padding-bottom:48px}:host(.M\\:v-pr-size-48),.M\\:v-pr-size-48{padding-right:48px}:host(.M\\:v-pl-size-48),.M\\:v-pl-size-48{padding-left:48px}:host(.M\\:v-p-size-64),.M\\:v-p-size-64{padding:64px}:host(.M\\:v-px-size-64),.M\\:v-px-size-64{padding-left:64px;padding-right:64px}:host(.M\\:v-py-size-64),.M\\:v-py-size-64{padding-top:64px;padding-bottom:64px}:host(.M\\:v-pt-size-64),.M\\:v-pt-size-64{padding-top:64px}:host(.M\\:v-pb-size-64),.M\\:v-pb-size-64{padding-bottom:64px}:host(.M\\:v-pr-size-64),.M\\:v-pr-size-64{padding-right:64px}:host(.M\\:v-pl-size-64),.M\\:v-pl-size-64{padding-left:64px}:host(.M\\:v-p-size-72),.M\\:v-p-size-72{padding:72px}:host(.M\\:v-px-size-72),.M\\:v-px-size-72{padding-left:72px;padding-right:72px}:host(.M\\:v-py-size-72),.M\\:v-py-size-72{padding-top:72px;padding-bottom:72px}:host(.M\\:v-pt-size-72),.M\\:v-pt-size-72{padding-top:72px}:host(.M\\:v-pb-size-72),.M\\:v-pb-size-72{padding-bottom:72px}:host(.M\\:v-pr-size-72),.M\\:v-pr-size-72{padding-right:72px}:host(.M\\:v-pl-size-72),.M\\:v-pl-size-72{padding-left:72px}:host(.M\\:v-p-size-80),.M\\:v-p-size-80{padding:80px}:host(.M\\:v-px-size-80),.M\\:v-px-size-80{padding-left:80px;padding-right:80px}:host(.M\\:v-py-size-80),.M\\:v-py-size-80{padding-top:80px;padding-bottom:80px}:host(.M\\:v-pt-size-80),.M\\:v-pt-size-80{padding-top:80px}:host(.M\\:v-pb-size-80),.M\\:v-pb-size-80{padding-bottom:80px}:host(.M\\:v-pr-size-80),.M\\:v-pr-size-80{padding-right:80px}:host(.M\\:v-pl-size-80),.M\\:v-pl-size-80{padding-left:80px}:host(.M\\:v-p-size-112),.M\\:v-p-size-112{padding:112px}:host(.M\\:v-px-size-112),.M\\:v-px-size-112{padding-left:112px;padding-right:112px}:host(.M\\:v-py-size-112),.M\\:v-py-size-112{padding-top:112px;padding-bottom:112px}:host(.M\\:v-pt-size-112),.M\\:v-pt-size-112{padding-top:112px}:host(.M\\:v-pb-size-112),.M\\:v-pb-size-112{padding-bottom:112px}:host(.M\\:v-pr-size-112),.M\\:v-pr-size-112{padding-right:112px}:host(.M\\:v-pl-size-112),.M\\:v-pl-size-112{padding-left:112px}:host(.M\\:v-p-size-2),.M\\:v-p-size-2{padding:2px}:host(.M\\:v-px-size-2),.M\\:v-px-size-2{padding-left:2px;padding-right:2px}:host(.M\\:v-py-size-2),.M\\:v-py-size-2{padding-top:2px;padding-bottom:2px}:host(.M\\:v-pt-size-2),.M\\:v-pt-size-2{padding-top:2px}:host(.M\\:v-pb-size-2),.M\\:v-pb-size-2{padding-bottom:2px}:host(.M\\:v-pr-size-2),.M\\:v-pr-size-2{padding-right:2px}:host(.M\\:v-pl-size-2),.M\\:v-pl-size-2{padding-left:2px}}@media (min-width: 1024px){:host(.L\\:v-p-0),.L\\:v-p-0{padding:0px}:host(.L\\:v-px-0),.L\\:v-px-0{padding-left:0px;padding-right:0px}:host(.L\\:v-py-0),.L\\:v-py-0{padding-top:0px;padding-bottom:0px}:host(.L\\:v-pt-0),.L\\:v-pt-0{padding-top:0px}:host(.L\\:v-pb-0),.L\\:v-pb-0{padding-bottom:0px}:host(.L\\:v-pr-0),.L\\:v-pr-0{padding-right:0px}:host(.L\\:v-pl-0),.L\\:v-pl-0{padding-left:0px}:host(.L\\:v-p-size-0),.L\\:v-p-size-0{padding:0px}:host(.L\\:v-px-size-0),.L\\:v-px-size-0{padding-left:0px;padding-right:0px}:host(.L\\:v-py-size-0),.L\\:v-py-size-0{padding-top:0px;padding-bottom:0px}:host(.L\\:v-pt-size-0),.L\\:v-pt-size-0{padding-top:0px}:host(.L\\:v-pb-size-0),.L\\:v-pb-size-0{padding-bottom:0px}:host(.L\\:v-pr-size-0),.L\\:v-pr-size-0{padding-right:0px}:host(.L\\:v-pl-size-0),.L\\:v-pl-size-0{padding-left:0px}:host(.L\\:v-p-size-4),.L\\:v-p-size-4{padding:4px}:host(.L\\:v-px-size-4),.L\\:v-px-size-4{padding-left:4px;padding-right:4px}:host(.L\\:v-py-size-4),.L\\:v-py-size-4{padding-top:4px;padding-bottom:4px}:host(.L\\:v-pt-size-4),.L\\:v-pt-size-4{padding-top:4px}:host(.L\\:v-pb-size-4),.L\\:v-pb-size-4{padding-bottom:4px}:host(.L\\:v-pr-size-4),.L\\:v-pr-size-4{padding-right:4px}:host(.L\\:v-pl-size-4),.L\\:v-pl-size-4{padding-left:4px}:host(.L\\:v-p-size-8),.L\\:v-p-size-8{padding:8px}:host(.L\\:v-px-size-8),.L\\:v-px-size-8{padding-left:8px;padding-right:8px}:host(.L\\:v-py-size-8),.L\\:v-py-size-8{padding-top:8px;padding-bottom:8px}:host(.L\\:v-pt-size-8),.L\\:v-pt-size-8{padding-top:8px}:host(.L\\:v-pb-size-8),.L\\:v-pb-size-8{padding-bottom:8px}:host(.L\\:v-pr-size-8),.L\\:v-pr-size-8{padding-right:8px}:host(.L\\:v-pl-size-8),.L\\:v-pl-size-8{padding-left:8px}:host(.L\\:v-p-size-12),.L\\:v-p-size-12{padding:12px}:host(.L\\:v-px-size-12),.L\\:v-px-size-12{padding-left:12px;padding-right:12px}:host(.L\\:v-py-size-12),.L\\:v-py-size-12{padding-top:12px;padding-bottom:12px}:host(.L\\:v-pt-size-12),.L\\:v-pt-size-12{padding-top:12px}:host(.L\\:v-pb-size-12),.L\\:v-pb-size-12{padding-bottom:12px}:host(.L\\:v-pr-size-12),.L\\:v-pr-size-12{padding-right:12px}:host(.L\\:v-pl-size-12),.L\\:v-pl-size-12{padding-left:12px}:host(.L\\:v-p-size-16),.L\\:v-p-size-16{padding:16px}:host(.L\\:v-px-size-16),.L\\:v-px-size-16{padding-left:16px;padding-right:16px}:host(.L\\:v-py-size-16),.L\\:v-py-size-16{padding-top:16px;padding-bottom:16px}:host(.L\\:v-pt-size-16),.L\\:v-pt-size-16{padding-top:16px}:host(.L\\:v-pb-size-16),.L\\:v-pb-size-16{padding-bottom:16px}:host(.L\\:v-pr-size-16),.L\\:v-pr-size-16{padding-right:16px}:host(.L\\:v-pl-size-16),.L\\:v-pl-size-16{padding-left:16px}:host(.L\\:v-p-size-20),.L\\:v-p-size-20{padding:20px}:host(.L\\:v-px-size-20),.L\\:v-px-size-20{padding-left:20px;padding-right:20px}:host(.L\\:v-py-size-20),.L\\:v-py-size-20{padding-top:20px;padding-bottom:20px}:host(.L\\:v-pt-size-20),.L\\:v-pt-size-20{padding-top:20px}:host(.L\\:v-pb-size-20),.L\\:v-pb-size-20{padding-bottom:20px}:host(.L\\:v-pr-size-20),.L\\:v-pr-size-20{padding-right:20px}:host(.L\\:v-pl-size-20),.L\\:v-pl-size-20{padding-left:20px}:host(.L\\:v-p-size-24),.L\\:v-p-size-24{padding:24px}:host(.L\\:v-px-size-24),.L\\:v-px-size-24{padding-left:24px;padding-right:24px}:host(.L\\:v-py-size-24),.L\\:v-py-size-24{padding-top:24px;padding-bottom:24px}:host(.L\\:v-pt-size-24),.L\\:v-pt-size-24{padding-top:24px}:host(.L\\:v-pb-size-24),.L\\:v-pb-size-24{padding-bottom:24px}:host(.L\\:v-pr-size-24),.L\\:v-pr-size-24{padding-right:24px}:host(.L\\:v-pl-size-24),.L\\:v-pl-size-24{padding-left:24px}:host(.L\\:v-p-size-32),.L\\:v-p-size-32{padding:32px}:host(.L\\:v-px-size-32),.L\\:v-px-size-32{padding-left:32px;padding-right:32px}:host(.L\\:v-py-size-32),.L\\:v-py-size-32{padding-top:32px;padding-bottom:32px}:host(.L\\:v-pt-size-32),.L\\:v-pt-size-32{padding-top:32px}:host(.L\\:v-pb-size-32),.L\\:v-pb-size-32{padding-bottom:32px}:host(.L\\:v-pr-size-32),.L\\:v-pr-size-32{padding-right:32px}:host(.L\\:v-pl-size-32),.L\\:v-pl-size-32{padding-left:32px}:host(.L\\:v-p-size-40),.L\\:v-p-size-40{padding:40px}:host(.L\\:v-px-size-40),.L\\:v-px-size-40{padding-left:40px;padding-right:40px}:host(.L\\:v-py-size-40),.L\\:v-py-size-40{padding-top:40px;padding-bottom:40px}:host(.L\\:v-pt-size-40),.L\\:v-pt-size-40{padding-top:40px}:host(.L\\:v-pb-size-40),.L\\:v-pb-size-40{padding-bottom:40px}:host(.L\\:v-pr-size-40),.L\\:v-pr-size-40{padding-right:40px}:host(.L\\:v-pl-size-40),.L\\:v-pl-size-40{padding-left:40px}:host(.L\\:v-p-size-48),.L\\:v-p-size-48{padding:48px}:host(.L\\:v-px-size-48),.L\\:v-px-size-48{padding-left:48px;padding-right:48px}:host(.L\\:v-py-size-48),.L\\:v-py-size-48{padding-top:48px;padding-bottom:48px}:host(.L\\:v-pt-size-48),.L\\:v-pt-size-48{padding-top:48px}:host(.L\\:v-pb-size-48),.L\\:v-pb-size-48{padding-bottom:48px}:host(.L\\:v-pr-size-48),.L\\:v-pr-size-48{padding-right:48px}:host(.L\\:v-pl-size-48),.L\\:v-pl-size-48{padding-left:48px}:host(.L\\:v-p-size-64),.L\\:v-p-size-64{padding:64px}:host(.L\\:v-px-size-64),.L\\:v-px-size-64{padding-left:64px;padding-right:64px}:host(.L\\:v-py-size-64),.L\\:v-py-size-64{padding-top:64px;padding-bottom:64px}:host(.L\\:v-pt-size-64),.L\\:v-pt-size-64{padding-top:64px}:host(.L\\:v-pb-size-64),.L\\:v-pb-size-64{padding-bottom:64px}:host(.L\\:v-pr-size-64),.L\\:v-pr-size-64{padding-right:64px}:host(.L\\:v-pl-size-64),.L\\:v-pl-size-64{padding-left:64px}:host(.L\\:v-p-size-72),.L\\:v-p-size-72{padding:72px}:host(.L\\:v-px-size-72),.L\\:v-px-size-72{padding-left:72px;padding-right:72px}:host(.L\\:v-py-size-72),.L\\:v-py-size-72{padding-top:72px;padding-bottom:72px}:host(.L\\:v-pt-size-72),.L\\:v-pt-size-72{padding-top:72px}:host(.L\\:v-pb-size-72),.L\\:v-pb-size-72{padding-bottom:72px}:host(.L\\:v-pr-size-72),.L\\:v-pr-size-72{padding-right:72px}:host(.L\\:v-pl-size-72),.L\\:v-pl-size-72{padding-left:72px}:host(.L\\:v-p-size-80),.L\\:v-p-size-80{padding:80px}:host(.L\\:v-px-size-80),.L\\:v-px-size-80{padding-left:80px;padding-right:80px}:host(.L\\:v-py-size-80),.L\\:v-py-size-80{padding-top:80px;padding-bottom:80px}:host(.L\\:v-pt-size-80),.L\\:v-pt-size-80{padding-top:80px}:host(.L\\:v-pb-size-80),.L\\:v-pb-size-80{padding-bottom:80px}:host(.L\\:v-pr-size-80),.L\\:v-pr-size-80{padding-right:80px}:host(.L\\:v-pl-size-80),.L\\:v-pl-size-80{padding-left:80px}:host(.L\\:v-p-size-112),.L\\:v-p-size-112{padding:112px}:host(.L\\:v-px-size-112),.L\\:v-px-size-112{padding-left:112px;padding-right:112px}:host(.L\\:v-py-size-112),.L\\:v-py-size-112{padding-top:112px;padding-bottom:112px}:host(.L\\:v-pt-size-112),.L\\:v-pt-size-112{padding-top:112px}:host(.L\\:v-pb-size-112),.L\\:v-pb-size-112{padding-bottom:112px}:host(.L\\:v-pr-size-112),.L\\:v-pr-size-112{padding-right:112px}:host(.L\\:v-pl-size-112),.L\\:v-pl-size-112{padding-left:112px}:host(.L\\:v-p-size-2),.L\\:v-p-size-2{padding:2px}:host(.L\\:v-px-size-2),.L\\:v-px-size-2{padding-left:2px;padding-right:2px}:host(.L\\:v-py-size-2),.L\\:v-py-size-2{padding-top:2px;padding-bottom:2px}:host(.L\\:v-pt-size-2),.L\\:v-pt-size-2{padding-top:2px}:host(.L\\:v-pb-size-2),.L\\:v-pb-size-2{padding-bottom:2px}:host(.L\\:v-pr-size-2),.L\\:v-pr-size-2{padding-right:2px}:host(.L\\:v-pl-size-2),.L\\:v-pl-size-2{padding-left:2px}}@media (min-width: 1440px){:host(.XL\\:v-p-0),.XL\\:v-p-0{padding:0px}:host(.XL\\:v-px-0),.XL\\:v-px-0{padding-left:0px;padding-right:0px}:host(.XL\\:v-py-0),.XL\\:v-py-0{padding-top:0px;padding-bottom:0px}:host(.XL\\:v-pt-0),.XL\\:v-pt-0{padding-top:0px}:host(.XL\\:v-pb-0),.XL\\:v-pb-0{padding-bottom:0px}:host(.XL\\:v-pr-0),.XL\\:v-pr-0{padding-right:0px}:host(.XL\\:v-pl-0),.XL\\:v-pl-0{padding-left:0px}:host(.XL\\:v-p-size-0),.XL\\:v-p-size-0{padding:0px}:host(.XL\\:v-px-size-0),.XL\\:v-px-size-0{padding-left:0px;padding-right:0px}:host(.XL\\:v-py-size-0),.XL\\:v-py-size-0{padding-top:0px;padding-bottom:0px}:host(.XL\\:v-pt-size-0),.XL\\:v-pt-size-0{padding-top:0px}:host(.XL\\:v-pb-size-0),.XL\\:v-pb-size-0{padding-bottom:0px}:host(.XL\\:v-pr-size-0),.XL\\:v-pr-size-0{padding-right:0px}:host(.XL\\:v-pl-size-0),.XL\\:v-pl-size-0{padding-left:0px}:host(.XL\\:v-p-size-4),.XL\\:v-p-size-4{padding:4px}:host(.XL\\:v-px-size-4),.XL\\:v-px-size-4{padding-left:4px;padding-right:4px}:host(.XL\\:v-py-size-4),.XL\\:v-py-size-4{padding-top:4px;padding-bottom:4px}:host(.XL\\:v-pt-size-4),.XL\\:v-pt-size-4{padding-top:4px}:host(.XL\\:v-pb-size-4),.XL\\:v-pb-size-4{padding-bottom:4px}:host(.XL\\:v-pr-size-4),.XL\\:v-pr-size-4{padding-right:4px}:host(.XL\\:v-pl-size-4),.XL\\:v-pl-size-4{padding-left:4px}:host(.XL\\:v-p-size-8),.XL\\:v-p-size-8{padding:8px}:host(.XL\\:v-px-size-8),.XL\\:v-px-size-8{padding-left:8px;padding-right:8px}:host(.XL\\:v-py-size-8),.XL\\:v-py-size-8{padding-top:8px;padding-bottom:8px}:host(.XL\\:v-pt-size-8),.XL\\:v-pt-size-8{padding-top:8px}:host(.XL\\:v-pb-size-8),.XL\\:v-pb-size-8{padding-bottom:8px}:host(.XL\\:v-pr-size-8),.XL\\:v-pr-size-8{padding-right:8px}:host(.XL\\:v-pl-size-8),.XL\\:v-pl-size-8{padding-left:8px}:host(.XL\\:v-p-size-12),.XL\\:v-p-size-12{padding:12px}:host(.XL\\:v-px-size-12),.XL\\:v-px-size-12{padding-left:12px;padding-right:12px}:host(.XL\\:v-py-size-12),.XL\\:v-py-size-12{padding-top:12px;padding-bottom:12px}:host(.XL\\:v-pt-size-12),.XL\\:v-pt-size-12{padding-top:12px}:host(.XL\\:v-pb-size-12),.XL\\:v-pb-size-12{padding-bottom:12px}:host(.XL\\:v-pr-size-12),.XL\\:v-pr-size-12{padding-right:12px}:host(.XL\\:v-pl-size-12),.XL\\:v-pl-size-12{padding-left:12px}:host(.XL\\:v-p-size-16),.XL\\:v-p-size-16{padding:16px}:host(.XL\\:v-px-size-16),.XL\\:v-px-size-16{padding-left:16px;padding-right:16px}:host(.XL\\:v-py-size-16),.XL\\:v-py-size-16{padding-top:16px;padding-bottom:16px}:host(.XL\\:v-pt-size-16),.XL\\:v-pt-size-16{padding-top:16px}:host(.XL\\:v-pb-size-16),.XL\\:v-pb-size-16{padding-bottom:16px}:host(.XL\\:v-pr-size-16),.XL\\:v-pr-size-16{padding-right:16px}:host(.XL\\:v-pl-size-16),.XL\\:v-pl-size-16{padding-left:16px}:host(.XL\\:v-p-size-20),.XL\\:v-p-size-20{padding:20px}:host(.XL\\:v-px-size-20),.XL\\:v-px-size-20{padding-left:20px;padding-right:20px}:host(.XL\\:v-py-size-20),.XL\\:v-py-size-20{padding-top:20px;padding-bottom:20px}:host(.XL\\:v-pt-size-20),.XL\\:v-pt-size-20{padding-top:20px}:host(.XL\\:v-pb-size-20),.XL\\:v-pb-size-20{padding-bottom:20px}:host(.XL\\:v-pr-size-20),.XL\\:v-pr-size-20{padding-right:20px}:host(.XL\\:v-pl-size-20),.XL\\:v-pl-size-20{padding-left:20px}:host(.XL\\:v-p-size-24),.XL\\:v-p-size-24{padding:24px}:host(.XL\\:v-px-size-24),.XL\\:v-px-size-24{padding-left:24px;padding-right:24px}:host(.XL\\:v-py-size-24),.XL\\:v-py-size-24{padding-top:24px;padding-bottom:24px}:host(.XL\\:v-pt-size-24),.XL\\:v-pt-size-24{padding-top:24px}:host(.XL\\:v-pb-size-24),.XL\\:v-pb-size-24{padding-bottom:24px}:host(.XL\\:v-pr-size-24),.XL\\:v-pr-size-24{padding-right:24px}:host(.XL\\:v-pl-size-24),.XL\\:v-pl-size-24{padding-left:24px}:host(.XL\\:v-p-size-32),.XL\\:v-p-size-32{padding:32px}:host(.XL\\:v-px-size-32),.XL\\:v-px-size-32{padding-left:32px;padding-right:32px}:host(.XL\\:v-py-size-32),.XL\\:v-py-size-32{padding-top:32px;padding-bottom:32px}:host(.XL\\:v-pt-size-32),.XL\\:v-pt-size-32{padding-top:32px}:host(.XL\\:v-pb-size-32),.XL\\:v-pb-size-32{padding-bottom:32px}:host(.XL\\:v-pr-size-32),.XL\\:v-pr-size-32{padding-right:32px}:host(.XL\\:v-pl-size-32),.XL\\:v-pl-size-32{padding-left:32px}:host(.XL\\:v-p-size-40),.XL\\:v-p-size-40{padding:40px}:host(.XL\\:v-px-size-40),.XL\\:v-px-size-40{padding-left:40px;padding-right:40px}:host(.XL\\:v-py-size-40),.XL\\:v-py-size-40{padding-top:40px;padding-bottom:40px}:host(.XL\\:v-pt-size-40),.XL\\:v-pt-size-40{padding-top:40px}:host(.XL\\:v-pb-size-40),.XL\\:v-pb-size-40{padding-bottom:40px}:host(.XL\\:v-pr-size-40),.XL\\:v-pr-size-40{padding-right:40px}:host(.XL\\:v-pl-size-40),.XL\\:v-pl-size-40{padding-left:40px}:host(.XL\\:v-p-size-48),.XL\\:v-p-size-48{padding:48px}:host(.XL\\:v-px-size-48),.XL\\:v-px-size-48{padding-left:48px;padding-right:48px}:host(.XL\\:v-py-size-48),.XL\\:v-py-size-48{padding-top:48px;padding-bottom:48px}:host(.XL\\:v-pt-size-48),.XL\\:v-pt-size-48{padding-top:48px}:host(.XL\\:v-pb-size-48),.XL\\:v-pb-size-48{padding-bottom:48px}:host(.XL\\:v-pr-size-48),.XL\\:v-pr-size-48{padding-right:48px}:host(.XL\\:v-pl-size-48),.XL\\:v-pl-size-48{padding-left:48px}:host(.XL\\:v-p-size-64),.XL\\:v-p-size-64{padding:64px}:host(.XL\\:v-px-size-64),.XL\\:v-px-size-64{padding-left:64px;padding-right:64px}:host(.XL\\:v-py-size-64),.XL\\:v-py-size-64{padding-top:64px;padding-bottom:64px}:host(.XL\\:v-pt-size-64),.XL\\:v-pt-size-64{padding-top:64px}:host(.XL\\:v-pb-size-64),.XL\\:v-pb-size-64{padding-bottom:64px}:host(.XL\\:v-pr-size-64),.XL\\:v-pr-size-64{padding-right:64px}:host(.XL\\:v-pl-size-64),.XL\\:v-pl-size-64{padding-left:64px}:host(.XL\\:v-p-size-72),.XL\\:v-p-size-72{padding:72px}:host(.XL\\:v-px-size-72),.XL\\:v-px-size-72{padding-left:72px;padding-right:72px}:host(.XL\\:v-py-size-72),.XL\\:v-py-size-72{padding-top:72px;padding-bottom:72px}:host(.XL\\:v-pt-size-72),.XL\\:v-pt-size-72{padding-top:72px}:host(.XL\\:v-pb-size-72),.XL\\:v-pb-size-72{padding-bottom:72px}:host(.XL\\:v-pr-size-72),.XL\\:v-pr-size-72{padding-right:72px}:host(.XL\\:v-pl-size-72),.XL\\:v-pl-size-72{padding-left:72px}:host(.XL\\:v-p-size-80),.XL\\:v-p-size-80{padding:80px}:host(.XL\\:v-px-size-80),.XL\\:v-px-size-80{padding-left:80px;padding-right:80px}:host(.XL\\:v-py-size-80),.XL\\:v-py-size-80{padding-top:80px;padding-bottom:80px}:host(.XL\\:v-pt-size-80),.XL\\:v-pt-size-80{padding-top:80px}:host(.XL\\:v-pb-size-80),.XL\\:v-pb-size-80{padding-bottom:80px}:host(.XL\\:v-pr-size-80),.XL\\:v-pr-size-80{padding-right:80px}:host(.XL\\:v-pl-size-80),.XL\\:v-pl-size-80{padding-left:80px}:host(.XL\\:v-p-size-112),.XL\\:v-p-size-112{padding:112px}:host(.XL\\:v-px-size-112),.XL\\:v-px-size-112{padding-left:112px;padding-right:112px}:host(.XL\\:v-py-size-112),.XL\\:v-py-size-112{padding-top:112px;padding-bottom:112px}:host(.XL\\:v-pt-size-112),.XL\\:v-pt-size-112{padding-top:112px}:host(.XL\\:v-pb-size-112),.XL\\:v-pb-size-112{padding-bottom:112px}:host(.XL\\:v-pr-size-112),.XL\\:v-pr-size-112{padding-right:112px}:host(.XL\\:v-pl-size-112),.XL\\:v-pl-size-112{padding-left:112px}:host(.XL\\:v-p-size-2),.XL\\:v-p-size-2{padding:2px}:host(.XL\\:v-px-size-2),.XL\\:v-px-size-2{padding-left:2px;padding-right:2px}:host(.XL\\:v-py-size-2),.XL\\:v-py-size-2{padding-top:2px;padding-bottom:2px}:host(.XL\\:v-pt-size-2),.XL\\:v-pt-size-2{padding-top:2px}:host(.XL\\:v-pb-size-2),.XL\\:v-pb-size-2{padding-bottom:2px}:host(.XL\\:v-pr-size-2),.XL\\:v-pr-size-2{padding-right:2px}:host(.XL\\:v-pl-size-2),.XL\\:v-pl-size-2{padding-left:2px}}:host{display:none;box-sizing:border-box;overflow-y:auto;text-align:left;position:fixed;top:0px;left:0px;right:0px;bottom:0px;align-items:flex-start}.modal-dialog{margin-left:auto;margin-right:auto;margin-top:64px;margin-bottom:64px}:host(.align-center){align-items:center}.modal-container{background-color:rgba(var(--v-bg-primary, 252, 252, 252, 1));color:rgba(var(--v-text-primary, 32, 54, 69, 1));box-shadow:var(--v-shadow-modal, 0px 6px 40px 0px rgba(2, 2, 15, 0.04), 0px 4px 24px 0px rgba(2, 2, 15, 0.08), 0px 8px 80px 0px rgba(2, 2, 15, 0.16));border-radius:12px;box-sizing:border-box;pointer-events:auto;overflow:hidden}:host(.animation) .modal-container{animation-name:animatetop;animation-duration:0.4s}.vega-modal-header{display:flex;align-items:center;flex-direction:row;gap:8px;padding-bottom:0px}.vega-modal-header.vega-modal-header-with-title,.vega-modal-header.vega-modal-header-with-icon{padding-bottom:16px}.vega-modal-header-with-content-scroll:not(.vega-modal-header-with-title):not(.vega-modal-header-with-icon){padding-top:0px;padding-bottom:0px}.vega-modal-header-with-content-scroll.vega-modal-header-with-icon,.vega-modal-header-with-content-scroll.vega-modal-header-with-title{box-shadow:var(--v-shadow-modal-header, 0px 1px 0px 0px rgba(45, 76, 97, 0.15))}.vega-modal-title{color:rgba(var(--v-text-primary, 32, 54, 69, 1));font-family:\"Inter\", sans-serif;font-size:24px;font-weight:700;line-height:32px;letter-spacing:0px;flex-grow:1;word-break:break-word}@media screen and (min-width: 768px) and (max-width: 1023px){.vega-modal-title{font-family:\"Inter\", sans-serif;font-size:24px;font-weight:700;line-height:32px;letter-spacing:0px}}@media screen and (min-width: 1024px) and (max-width: 1439px){.vega-modal-title{font-family:\"Inter\", sans-serif;font-size:24px;font-weight:700;line-height:32px;letter-spacing:0px}}@media screen and (min-width: 1440px) and (max-width: 9999px){.vega-modal-title{font-family:\"Inter\", sans-serif;font-size:28px;font-weight:700;line-height:36px;letter-spacing:0px}}.vega-modal-close-btn{cursor:pointer}.vega-modal-close-btn vega-icon{display:block}.vega-modal-content{padding-top:0px;padding-bottom:0px}.vega-modal-content-with-scroll{padding-top:24px;padding-bottom:24px;overflow:auto}.vega-modal-footer:not(.vega-modal-footer-with-slot){padding-top:0px}.vega-modal-footer-with-content-scroll:not(.vega-modal-footer-with-slot){padding-top:0px;padding-bottom:0px}.vega-modal-footer-with-content-scroll.vega-modal-footer-with-slot{box-shadow:var(--v-shadow-modal-footer, 0px -2px 8px 0px rgba(45, 76, 97, 0.2), 0px -1px 0px 0px rgba(45, 76, 97, 0.15))}.vega-modal-footer-with-content-scroll.vega-modal-footer-with-slot.vega-modal-footer-with-content-scroll-to-bottom{box-shadow:var(--v-shadow-modal-footer-no-scroll, 0px -1px 0px 0px rgba(45, 76, 97, 0.15))}@keyframes animatetop{from{top:-300px;opacity:0}to{top:0;opacity:1}}";
+
+var __decorate = (undefined && undefined.__decorate) || function (decorators, target, key, desc) {
+  var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+  if (typeof Reflect === "object" && typeof Reflect.decorate === "function")
+    r = Reflect.decorate(decorators, target, key, desc);
+  else
+    for (var i = decorators.length - 1; i >= 0; i--)
+      if (d = decorators[i])
+        r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+  return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+const VegaModal = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.vegaClose = createEvent(this, "vegaClose", 7);
+    this.close = createEvent(this, "close", 7);
+    this.vegaOpen = createEvent(this, "vegaOpen", 7);
+    this.modalOpen = createEvent(this, "modalOpen", 7);
+    this.globalSlimmers = {};
+    this.nestedModalController = new VegaNestedModalController();
+    this.openStateController = new VegaModalOpenStateController();
+    this.mobileController = new VegaModalMobileController();
+    this.scrollController = new VegaModalScrollController();
+    this.layoutController = new VegaModalLayoutController();
+    this.backdropController = new VegaModalBackdropController();
+    this.openedModalStackController = new VegaModalOpenedModalStackController();
+    this.zIndexController = new VegaModalZIndexController();
+    this.renderer = new VegaModalRenderer();
+    this.openEventEmitter = createEventEmitSlimmer(VegaModal, VegaOpen);
+    this.closeEventEmitter = createEventEmitSlimmer(VegaModal, VegaClose);
+    this.childNodesEventPrevent = new ChildNodesEventPreventSlimmer([VegaOpen, VegaClose], () => this.renderer.getModalContainerRef());
+    this.componentGlobalStyleSlimmer = new ComponentGlobalStyleSlimmer(vegaModalDisableBodyScrollCss);
+    this.deprecatedPropertySlimmer = createDeprecatedPropertySlimmer(VegaModal, 'isVerticallyCentered', 'isVerticallyCenter', false);
+    this.vegaComponentUsageRuntimeMetricsSlimmer = new VegaComponentUsageRuntimeMetricsSlimmer(VegaModalRuntimeMetricsPayloadDefinition);
+    this.openState = this.initOpenState();
+    /**
+     * Provides options for controlling the behavior of the backdrop.
+     * - `default`:
+     *      indicates that the user can close the modal
+     *      by clicking on the backdrop.
+     * - `static`:
+     *      means that the user cannot close the modal by
+     *      clicking on the backdrop.
+     * - `none`:
+     *      specifies that the backdrop will not be rendered.
+     *
+     * _Note_:
+     *    When changing this value, a page refresh is required
+     *    for the changes to take effect.
+     *
+     * @vegaVersion 1.0.6
+     */
+    this.backdrop = 'default';
+    /**
+     * Determines whether the modal is initially open.
+     *
+     * @vegaVersion 1.0.6
+     */
+    /* eslint-disable-next-line @stencil/strict-mutable */
+    this.open = false;
+    /**
+     * Specifies whether the modal uses an animated transition
+     *    when it appears.
+     *
+     * @vegaVersion 1.0.11
+     */
+    this.animation = false;
+    /**
+     * Represents the title displayed within the modal.
+     *
+     * @vegaVersion 1.3.0
+     */
+    this.modalTitle = '';
+    /**
+     * Specifies the background color of the modal's backdrop.
+     *
+     * @vegaVersion 1.3.0
+     */
+    this.backdropColor = 'default';
+    /**
+     * Determines whether the modal is vertically centered
+     *    on the screen.
+     * @deprecated This property will be removed soon and replaced by prop isVerticallyCentered
+     *
+     * @vegaVersion 1.3.0
+     */
+    this.isVerticallyCenter = false;
+    /**
+     * Determines whether the modal is vertically centered
+     *    on the screen.
+     *
+     * @vegaVersion 2.2.0
+     */
+    this.isVerticallyCentered = false;
+    /**
+     * Determines whether the modal displays a close button to
+     *    allow hiding or closing of the modal.
+     *
+     * @vegaVersion 1.3.0
+     */
+    this.showCloseButton = true;
+    /**
+     * Specifies the amount of space or padding within the modal.
+     *
+     * It can be set as a ResponsiveType or any size value.
+     *
+     * @vegaVersion 1.0.10
+     */
+    this.padding = 'size-24';
+    /**
+     * Provides a callback function that is triggered when a user clicks the
+     *    close button located in the top right corner of the modal.
+     *
+     * If the callback function returns `true`, the modal will be closed.
+     *
+     * If the callback function returns `false` or does not return any value, the modal will remain open.
+     *
+     * @vegaVersion 1.22.0
+     */
+    this.handleClose = undefined;
+  }
+  watchOpenState() {
+    methodPlaceholder();
+  }
+  /**
+   * The below method is e2e-test covered in
+   * @see{module:vega-modal-size-number-e2e}
+   * @see{module:vega-modal-size-responsive-e2e}
+   */
+  /* istanbul ignore next */
+  watchSize() {
+    methodPlaceholder();
+  }
+  watchOpen() {
+    this.openState = new VegaModalOpenState(this.open, 'property');
+  }
+  watchContentMaxHeight() {
+    methodPlaceholder();
+  }
+  /**
+   * Clicking on a non-static current modal should close this modal, not other modals.
+   * The below method is e2e-test covered in
+   * @see{module:vega-modal-toggle-interactive-e2e}
+   */
+  /* istanbul ignore next */
+  listenDataTarget(e) {
+    methodPlaceholder(e);
+  }
+  /**
+   * The below method is e2e-test covered in
+   * @see{module:vega-modal-toggle-interactive-e2e}
+   */
+  /* istanbul ignore next */
+  listenDataDismiss(e) {
+    methodPlaceholder(e);
+  }
+  /**
+   * The below method is e2e-test covered in
+   * @see{module:vega-modal-backdrop-mousedown-mouseup-e2e}
+   */
+  /* istanbul ignore next */
+  listenMouseDown(e) {
+    methodPlaceholder(e);
+  }
+  /**
+   * The below method is e2e-test covered in
+   * @see{module:vega-modal-backdrop-mousedown-mouseup-e2e}
+   */
+  /* istanbul ignore next */
+  listenMouseUp(e) {
+    methodPlaceholder(e);
+  }
+  /**
+   * Invoke this method to show or hide the modal.
+   *
+   * @vegaVersion 1.0.6
+   */
+  /* The below method is e2e-test covered in
+   * @see{module:vega-modal-toggle-interactive-e2e}
+   */
+  /* istanbul ignore next
+   *
+   */
+  async modal(option) {
+    methodPlaceholder(option);
+  }
+  render() {
+    return sanitizeVegaComponent(this.renderer.render(), this.host);
+  }
+  /**
+   * Returns the initial open state of the modal.
+   */
+  initOpenState() {
+    return new VegaModalOpenState(this.open, 'property');
+  }
+  get host() { return getElement(this); }
+  static get watchers() { return {
+    "openState": ["watchOpenState"],
+    "size": ["watchSize"],
+    "open": ["watchOpen"],
+    "contentMaxHeight": ["watchContentMaxHeight"]
+  }; }
+};
+__decorate([
+  InjectVegaGlobalSlimmer()
+], VegaModal.prototype, "globalSlimmers", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaModal.prototype, "nestedModalController", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaModal.prototype, "openStateController", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaModal.prototype, "mobileController", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaModal.prototype, "scrollController", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaModal.prototype, "layoutController", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaModal.prototype, "backdropController", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaModal.prototype, "openedModalStackController", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaModal.prototype, "zIndexController", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaModal.prototype, "renderer", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaModal.prototype, "openEventEmitter", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaModal.prototype, "closeEventEmitter", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaModal.prototype, "childNodesEventPrevent", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaModal.prototype, "componentGlobalStyleSlimmer", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaModal.prototype, "deprecatedPropertySlimmer", void 0);
+__decorate([
+  InjectVegaSlimmer()
+], VegaModal.prototype, "vegaComponentUsageRuntimeMetricsSlimmer", void 0);
+VegaModal.style = vegaModalCss;
+
+export { VegaModal as vega_modal };