@baloise/ds-core 19.2.0 → 19.3.0-nightly.20250630

package/dist/cjs/bal-modal_3.cjs.entry.js

@@ -1,13 +1,8 @@
 'use strict';
 
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-84f42282.js');
-const overlays = require('./overlays-94ebb271.js');
-const helpers = require('./helpers-debb881a.js');
-const scroll = require('./scroll-dc37ea84.js');
-const browser = require('./browser-1d542d0f.js');
-require('./config.utils-df30e424.js');
+var index = require('./index-D4vG8k57.js');
+var overlays = require('./overlays-D69-iSa6.js');
+var scroll = require('./scroll-D7ot6_a-.js');
 
 const attachComponent = async (delegate, container, component, cssClasses, componentProps) => {
     if (delegate) {
@@ -26,7 +21,7 @@ const attachComponent = async (delegate, container, component, cssClasses, compo
         Object.assign(el, componentProps);
     }
     container.appendChild(el);
-    await new Promise(resolve => helpers.componentOnReady(el, resolve));
+    await new Promise(resolve => index.componentOnReady(el, resolve));
     return el;
 };
 const detachComponent = (delegate, element) => {
@@ -57,37 +52,65 @@ const getClassList = (classes) => {
 };
 
 const balModalCss = ".bal-modal,.bal-modal__background{bottom:0;left:0;position:absolute;right:0;top:0}:root{--bal-modal-background:var(--bal-color-white);--bal-modal-backdrop-background:var(--bal-color-primary-6);--bal-modal-backdrop-opacity:.6;--bal-modal-radius:var(--bal-radius-large)}.bal-modal{-ms-flex-align:center;align-items:center;display:none;-ms-flex-direction:column;flex-direction:column;-ms-flex-pack:start;justify-content:flex-start;overflow:hidden;position:fixed;z-index:var(--bal-z-index-modal)}.bal-modal--is-active{display:-ms-flexbox;display:flex}.bal-modal__background{background:var(--bal-modal-backdrop-background);opacity:var(--bal-modal-backdrop-opacity)}.bal-modal__header__title{padding-right:2.5rem;line-height:2rem}.bal-modal__header__close{position:absolute !important;display:-ms-flexbox !important;display:flex !important;right:1.25rem !important;top:1.5rem !important;-ms-flex-align:center;align-items:center;-ms-flex-pack:center;justify-content:center;min-width:2rem;max-width:2rem;min-height:2rem;max-height:2rem}.bal-modal__container{position:fixed;top:0;bottom:0;left:0;right:0;overflow-x:none;overflow-y:auto;-ms-overflow-y:visible;padding:.5rem}@media screen and (min-width: 769px),print{.bal-modal__container{padding:0}}.bal-modal__content{overflow:none;position:relative;width:100%;display:-ms-flexbox;display:flex;-ms-flex-direction:column;flex-direction:column;background:var(--bal-modal-background);border-radius:var(--bal-modal-radius);padding:1rem}@media screen and (min-width: 769px),print{.bal-modal__content{margin:3rem auto;width:var(--bal-modal-width, var(--bal-width, 40rem))}}.bal-modal__content .bal-modal__header{padding-bottom:1rem}.bal-modal__content .bal-modal__header__close{right:1.2rem !important;top:.7rem !important}@media screen and (min-width: 769px),print{.bal-modal__content{padding:1.5rem}.bal-modal__content .bal-modal__header{padding-bottom:1.5rem}.bal-modal__content .bal-modal__header__close{right:1.6rem !important;top:1.2rem !important}}@media screen and (min-width: 1024px){.bal-modal__content{padding:2.5rem}.bal-modal__content .bal-modal__header{padding-bottom:2.5rem}.bal-modal__content .bal-modal__header__close{right:2.7rem !important;top:2.2rem !important}}@media screen and (min-width: 769px),print{.bal-modal__content--has-spacing-small{padding:1rem}.bal-modal__content--has-spacing-small .bal-modal__header{padding-bottom:1rem}.bal-modal__content--has-spacing-small .bal-modal__header__close{right:1.1rem !important;top:.7rem !important}}@media screen and (min-width: 1024px){.bal-modal__content--has-spacing-small{padding:1rem}.bal-modal__content--has-spacing-small .bal-modal__header{padding-bottom:1rem}.bal-modal__content--has-spacing-small .bal-modal__header__close{right:1.1rem !important;top:.7rem !important}}@media screen and (min-width: 769px),print{.bal-modal__content--has-spacing-medium{padding:1.5rem}.bal-modal__content--has-spacing-medium .bal-modal__header{padding-bottom:1.5rem}.bal-modal__content--has-spacing-medium .bal-modal__header__close{right:1.6rem !important;top:1.2rem !important}}@media screen and (min-width: 1024px){.bal-modal__content--has-spacing-medium{padding:1.5rem}.bal-modal__content--has-spacing-medium .bal-modal__header{padding-bottom:1.5rem}.bal-modal__content--has-spacing-medium .bal-modal__header__close{right:1.6rem !important;top:1.2rem !important}}.bal-modal__body>bal-button-group{padding-top:1rem}";
-const BalModalStyle0 = balModalCss;
 
 const Modal = class {
     constructor(hostRef) {
         index.registerInstance(this, hostRef);
-        this.didPresent = index.createEvent(this, "balModalDidPresent", 7);
-        this.willPresent = index.createEvent(this, "balModalWillPresent", 7);
-        this.willDismiss = index.createEvent(this, "balModalWillDismiss", 7);
-        this.didDismiss = index.createEvent(this, "balModalDidDismiss", 7);
+        this.didPresent = index.createEvent(this, "balModalDidPresent");
+        this.willPresent = index.createEvent(this, "balModalWillPresent");
+        this.willDismiss = index.createEvent(this, "balModalWillDismiss");
+        this.didDismiss = index.createEvent(this, "balModalDidDismiss");
         this.isClickedOutsideOnMouseDown = false;
         this.isClickedOutsideOnMouseUp = false;
         this.bodyScrollHandler = new scroll.BalScrollHandler();
         this.presented = false;
-        this.overlayIndex = undefined;
-        this.delegate = undefined;
-        this.dataTestId = undefined;
+        /**
+         * Defines the width of the modal body
+         */
         this.modalWidth = 640;
+        /**
+         * Defines the space/padding of the modal
+         */
         this.space = '';
+        /**
+         * If `true`, a backdrop will be displayed behind the modal.
+         */
         this.hasBackdrop = true;
+        /**
+         * If `true`, the modal can be closed with the escape key or the little close button.
+         */
         this.isClosable = true;
-        this.component = undefined;
-        this.componentProps = undefined;
-        this.cssClass = undefined;
+        /**
+         * If `true`, the modal can be closed with the click outside of the modal
+         */
         this.backdropDismiss = true;
+        /**
+         * If `true`, focus will not be allowed to move outside of this overlay.
+         * If `false`, focus will be allowed to move outside of the overlay.
+         *
+         * In most scenarios this property should remain set to `true`. Setting
+         * this property to `false` can cause severe accessibility issues as users
+         * relying on assistive technologies may be able to move focus into
+         * a confusing state. We recommend only setting this to `false` when
+         * absolutely necessary.
+         *
+         * Developers may want to consider disabling focus trapping if this
+         * overlay presents a non-Ionic overlay from a 3rd party library.
+         * Developers would disable focus trapping on the Ionic overlay
+         * when presenting the 3rd party overlay and then re-enable
+         * focus trapping when dismissing the 3rd party overlay and moving
+         * focus back to the Ionic overlay.
+         */
         this.focusTrap = true;
+        /**
+         * @internal
+         */
         this.demo = false;
     }
     connectedCallback() {
         this.bodyScrollHandler.connect();
         overlays.prepareOverlay(this);
-        if (browser.balBrowser.hasDocument && this.demo) {
+        if (index.balBrowser.hasDocument && this.demo) {
             this.open();
         }
     }
@@ -98,7 +121,7 @@ const Modal = class {
      * @internal Opens the modal.
      */
     async open() {
-        await helpers.deepReady(this.usersElement);
+        await index.deepReady(this.usersElement);
         this.setModalActiveOnBody();
         index.writeTask(() => {
             if (this.modalBackgroundElement) {
@@ -113,7 +136,7 @@ const Modal = class {
         }
         this.willPresent.emit();
         this.presented = true;
-        await helpers.wait(150);
+        await index.wait(150);
         index.writeTask(() => {
             if (this.modalBackgroundElement) {
                 this.modalBackgroundElement.classList.remove('fadeIn');
@@ -167,7 +190,7 @@ const Modal = class {
                     this.modalContentElement.classList.add('fadeOutUp');
                 }
             });
-            await helpers.wait(140);
+            await index.wait(140);
         });
         if (dismissed) {
             await detachComponent(this.delegate, this.usersElement);
@@ -256,7 +279,7 @@ const Modal = class {
     }
     get el() { return index.getElement(this); }
 };
-Modal.style = BalModalStyle0;
+Modal.style = balModalCss;
 
 const ModalBody = class {
     constructor(hostRef) {