@baloise/ds-core 17.2.1 → 17.2.2

package/components/bal-tag-group.js

@@ -6,7 +6,7 @@ const TagGroup = /*@__PURE__*/ proxyCustomElement(class TagGroup extends HTMLEle
         this.__registerHost();
     }
     render() {
-        return (h(Host, { key: 'd1f82919080730fd2555d25e4e5adda071f0c6a2', class: "bal-tag-group" }, h("slot", { key: '2f0ce67b5870beb486f86341214f5f32f234ae47' })));
+        return (h(Host, { key: '524a094b4adf71e481268ff8a88eabdfe8323b38', class: "bal-tag-group" }, h("slot", { key: 'b03a1908eec3f767f9547f01f44b26c75e7cb198' })));
     }
 }, [4, "bal-tag-group"]);
 function defineCustomElement$1() {

package/components/bal-tag2.js

@@ -38,7 +38,7 @@ const Tag = /*@__PURE__*/ proxyCustomElement(class Tag extends HTMLElement {
         const hasDisabled = this.disabled;
         const positionClass = `is-${this.position}`;
         const hasPosition = this.position !== undefined;
-        return (h(Host, Object.assign({ key: 'fcb28709fa01ca31a2ae98d59bacfb356e28fd0c', "aria-disabled": this.disabled ? 'true' : null, class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier(sizeClass).class(hasSize)), block.modifier(colorClass).class(hasColor)), block.modifier(disabledClass).class(hasDisabled)), block.modifier(positionClass).class(hasPosition)), block.modifier('is-invalid').class(this.invalid)) }, this.inheritedAttributes), h("span", { key: 'e82b7f7b34add1277872fc105a327f50b305b2f8', class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, elLabel.class()), elLabel.modifier(sizeClass).class(hasSize)), elLabel.modifier(colorClass).class(hasColor)), elLabel.modifier(disabledClass).class(hasDisabled)), elLabel.modifier('is-invalid').class(this.invalid)), "data-testid": "bal-tag-label" }, h("slot", { key: '9a29590870327840f6bbf0c9bedebbcb1be51ba8' })), h("bal-close", Object.assign({ key: 'a236adc61866d6ba1080780813b75806c93ec657', class: Object.assign({}, block.element('close').class()), style: {
+        return (h(Host, Object.assign({ key: 'f7e55913d45b3043066cd32973bfe22ea9cb2e19', "aria-disabled": this.disabled ? 'true' : null, class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier(sizeClass).class(hasSize)), block.modifier(colorClass).class(hasColor)), block.modifier(disabledClass).class(hasDisabled)), block.modifier(positionClass).class(hasPosition)), block.modifier('is-invalid').class(this.invalid)) }, this.inheritedAttributes), h("span", { key: 'a70a1395177d1717117555d406311161c62a87f1', class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, elLabel.class()), elLabel.modifier(sizeClass).class(hasSize)), elLabel.modifier(colorClass).class(hasColor)), elLabel.modifier(disabledClass).class(hasDisabled)), elLabel.modifier('is-invalid').class(this.invalid)), "data-testid": "bal-tag-label" }, h("slot", { key: '9678f086ef39473f3a7a78720b59abba8eeaa0c8' })), h("bal-close", Object.assign({ key: '03f425bbe857348736170c5c75093ed11c8f95d9', class: Object.assign({}, block.element('close').class()), style: {
                 display: this.closable && !this.disabled ? 'flex' : 'none',
             }, size: this.size === 'small' ? 'small' : '', inverted: (['blue', 'primary', 'info', 'success', 'warning', 'danger', 'red', 'purple', 'yellow', 'green'].includes(this.color) &&
                 !this.light) ||

package/components/bal-text2.js

@@ -56,10 +56,10 @@ const Text = /*@__PURE__*/ proxyCustomElement(class Text extends HTMLElement {
         const Text = this.inline ? 'span' : 'p';
         const color = this.parseColor();
         const block = BEM.block('text');
-        return (h(Host, { key: '54ea51b4d2db0793307072aa6dd3bd5969f4e1d0', class: Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier(`space-${this.space}`).class(this.space !== '')), block.modifier(`inline`).class(this.inline)) }, h(Text, { key: 'c894a460f369a284910f224b430dd7fc4b9b5123', class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, block.element('text').class()), block.element('text').modifier(`color-${color}`).class(!!color)), block.element('text').modifier(`bold`).class(this.bold)), block.element('text').modifier(`heading`).class(this.heading)), block.element('text').modifier(`shadow`).class(this.shadow)), block.element('text').modifier(`no-wrap`).class(this.noWrap)), block
+        return (h(Host, { key: '410f0e92f74f64df3047a4c2ae64f2ff4dfa1740', class: Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier(`space-${this.space}`).class(this.space !== '')), block.modifier(`inline`).class(this.inline)) }, h(Text, { key: 'beef074e67dc900f2580e03f2d8944a5257b517a', class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, block.element('text').class()), block.element('text').modifier(`color-${color}`).class(!!color)), block.element('text').modifier(`bold`).class(this.bold)), block.element('text').modifier(`heading`).class(this.heading)), block.element('text').modifier(`shadow`).class(this.shadow)), block.element('text').modifier(`no-wrap`).class(this.noWrap)), block
                 .element('text')
                 .modifier(`size-${this.size}`)
-                .class(this.size !== '')), "data-testid": "bal-text" }, h("slot", { key: '94c09c5d469712da76d9ca0c4a80222c3e76f8a3' }))));
+                .class(this.size !== '')), "data-testid": "bal-text" }, h("slot", { key: '3845390717b94d779233d0f02702231d8144a54e' }))));
     }
     static get style() { return BalTextStyle0; }
 }, [4, "bal-text", {

package/components/bal-textarea.js

@@ -1,11 +1,9 @@
 import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/core/internal/client';
-import { _ as __decorate, a as __metadata } from './tslib.es6.js';
 import { g as getInputTarget, c as inputHandleFocus, d as inputHandleBlur, e as inputHandleChange, f as inputHandleClick, b as inputHandleHostClick, j as inputListenOnClick, k as inputHandleReset, i as inputSetFocus, a as inputSetBlur } from './form-input.js';
-import { n as debounceEvent } from './helpers.js';
+import { o as debounceEvent } from './helpers.js';
 import { i as inheritAttributes } from './attributes.js';
 import { B as BEM } from './bem.js';
 import { d as defaultBalAriaForm } from './form.js';
-import { L as ListenTo } from './listen.js';
 
 const balTextareaCss = ".bal-textarea{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:block;position:relative;-ms-flex:1;flex:1;width:100%;font-family:var(--bal-font-family-text);white-space:pre-wrap;-webkit-box-sizing:border-box;box-sizing:border-box}.bal-textarea__native{margin:0;display:block;width:100%;max-width:100%;max-height:100%;outline:none;background:rgba(0,0,0,0);-webkit-box-sizing:border-box;box-sizing:border-box;resize:none;-webkit-appearance:none;-moz-appearance:none;appearance:none;padding:calc(.75em - 2px)}.bal-textarea__native::-webkit-input-placeholder{padding:0;font-family:inherit}.bal-textarea__native::-moz-placeholder{padding:0;font-family:inherit}.bal-textarea__native:-ms-input-placeholder{padding:0;font-family:inherit}.bal-textarea__native::-ms-input-placeholder{padding:0;font-family:inherit}.bal-textarea__native::placeholder{padding:0;font-family:inherit}";
 const BalTextareaStyle0 = balTextareaCss;
@@ -119,7 +117,7 @@ const Textarea = /*@__PURE__*/ proxyCustomElement(class Textarea extends HTMLEle
         const value = this.getValue();
         const block = BEM.block('textarea');
         const elNative = block.element('native');
-        return (h(Host, { key: 'ab14f059d3785673e315d1201f2f6f400def090f', onClick: this.handleClick, "aria-disabled": this.disabled ? 'true' : null, class: Object.assign({}, block.class()) }, h("textarea", Object.assign({ key: '9cacf375b46777e0f49ab12d7b0bf7a36223c116', class: Object.assign(Object.assign({}, elNative.class()), { 'textarea': true, 'is-disabled': this.disabled || this.readonly, 'is-danger': this.invalid, 'clickable': this.clickable }), "data-testid": "bal-textarea-input", ref: inputEl => (this.nativeInput = inputEl), name: this.name, id: this.ariaForm.controlId || this.inputId, "aria-labelledby": this.ariaForm.labelId, "aria-describedby": this.ariaForm.messageId, "aria-invalid": this.invalid === true ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : null, disabled: this.disabled, readonly: this.readonly, required: this.required, autoCapitalize: this.autocapitalize, autocomplete: this.autocomplete, autoFocus: this.autofocus, minLength: this.minLength, maxLength: this.maxLength, placeholder: this.placeholder, inputMode: this.inputmode, value: this.value, cols: this.cols, rows: this.rows, wrap: this.wrap, onFocus: this.onFocus, onInput: ev => this.onInput(ev), onBlur: this.onBlur, onClick: this.onClick, onKeyPress: e => this.balKeyPress.emit(e) }, this.inheritedAttributes), value, h("slot", { key: 'ccf5fb267d10b8b51532797a4ee71e4ee9fab52e' }))));
+        return (h(Host, { key: '149d29f8d5914cf4b32beb3fe6e1e7e62a85db08', onClick: this.handleClick, "aria-disabled": this.disabled ? 'true' : null, class: Object.assign({}, block.class()) }, h("textarea", Object.assign({ key: '52709d8de1e3b4e02f500d6bcec497156f06fc1d', class: Object.assign(Object.assign({}, elNative.class()), { 'textarea': true, 'is-disabled': this.disabled || this.readonly, 'is-danger': this.invalid, 'clickable': this.clickable }), "data-testid": "bal-textarea-input", ref: inputEl => (this.nativeInput = inputEl), name: this.name, id: this.ariaForm.controlId || this.inputId, "aria-labelledby": this.ariaForm.labelId, "aria-describedby": this.ariaForm.messageId, "aria-invalid": this.invalid === true ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : null, disabled: this.disabled, readonly: this.readonly, required: this.required, autoCapitalize: this.autocapitalize, autocomplete: this.autocomplete, autoFocus: this.autofocus, minLength: this.minLength, maxLength: this.maxLength, placeholder: this.placeholder, inputMode: this.inputmode, value: this.value, cols: this.cols, rows: this.rows, wrap: this.wrap, onFocus: this.onFocus, onInput: ev => this.onInput(ev), onBlur: this.onBlur, onClick: this.onClick, onKeyPress: e => this.balKeyPress.emit(e) }, this.inheritedAttributes), value, h("slot", { key: '48a083ac55240858d9cbf656631739cc349b6cf1' }))));
     }
     get el() { return this; }
     static get watchers() { return {
@@ -152,21 +150,9 @@ const Textarea = /*@__PURE__*/ proxyCustomElement(class Textarea extends HTMLEle
         "setBlur": [64],
         "getInputElement": [64],
         "setAriaForm": [64]
-    }, undefined, {
+    }, [[6, "click", "listenOnClick"], [6, "reset", "resetHandler"]], {
         "debounce": ["debounceChanged"]
     }]);
-__decorate([
-    ListenTo('click', { capture: true, target: 'document' }),
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", [UIEvent]),
-    __metadata("design:returntype", void 0)
-], Textarea.prototype, "listenOnClick", null);
-__decorate([
-    ListenTo('reset', { capture: true, target: 'document' }),
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", [UIEvent]),
-    __metadata("design:returntype", void 0)
-], Textarea.prototype, "resetHandler", null);
 let TextareaIds = 0;
 function defineCustomElement$1() {
     if (typeof customElements === "undefined") {

package/components/bal-time-input.js

@@ -2,14 +2,13 @@ import { proxyCustomElement, HTMLElement, createEvent, h, Host } from '@stencil/
 import { _ as __decorate, a as __metadata } from './tslib.es6.js';
 import { l as lodash_isnil } from './index3.js';
 import { g as getInputTarget, c as inputHandleFocus, d as inputHandleBlur, e as inputHandleChange, s as stopEventBubbling, j as inputListenOnClick, k as inputHandleReset, i as inputSetFocus, a as inputSetBlur } from './form-input.js';
-import { n as debounceEvent } from './helpers.js';
+import { o as debounceEvent } from './helpers.js';
 import { i as inheritAttributes } from './attributes.js';
 import { i as isCtrlOrCommandKey, N as NUMBER_KEYS, A as ACTION_KEYS } from './keys.constant.js';
 import { B as BEM } from './bem.js';
 import { i as i18nBalTimeInput } from './bal-time-input.i18n.js';
 import { d as defaultBalAriaForm } from './form.js';
 import { L as Logger } from './log.js';
-import { L as ListenTo } from './listen.js';
 import { d as defineCustomElement$3 } from './bal-icon2.js';
 import { d as defineCustomElement$2 } from './bal-input-group2.js';
 import { d as defaultConfig } from './config.default.js';
@@ -146,7 +145,7 @@ const TimeInput = /*@__PURE__*/ proxyCustomElement(class TimeInput extends HTMLE
         const value = this.focused ? this.getRawValue() : this.getFormattedValue();
         const block = BEM.block('time-input');
         const native = block.element('native');
-        return (h(Host, { key: '67ec2306c4cf0a9e6b5cee8af80f930e5dc4ee33', "aria-disabled": this.disabled ? 'true' : null, class: Object.assign({}, block.class()) }, h("bal-input-group", { key: '1873f5acc2647eb4b4d4f2634693caafadb98341', disabled: this.disabled || this.readonly, invalid: this.invalid }, h("input", Object.assign({ key: '846d18705dd58f61a418cb4c25fab603e3c9264d', type: "time", class: Object.assign({ 'input': true, 'is-disabled': this.disabled || this.readonly, 'is-danger': this.invalid, 'has-focus': this.focused, 'show-placeholder': !this.focused && (this.value === '' || this.value === undefined), 'has-value': this.value !== '' && this.value !== undefined }, native.class()), ref: input => (this.nativeInput = input), id: this.ariaForm.controlId || this.inputId, "aria-labelledby": this.ariaForm.labelId, "aria-describedby": this.ariaForm.messageId, "aria-invalid": this.invalid === true ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : null, name: this.name, disabled: this.disabled, readonly: this.readonly, required: this.required, placeholder: `${i18nBalTimeInput[this.language].hours}:${i18nBalTimeInput[this.language].minutes}`, value: value, onInput: ev => this.onInput(ev), onFocus: e => this.onFocus(e), onBlur: e => this.onBlur(e), onKeyDown: e => this.onKeydown(e), onKeyPress: e => this.balKeyPress.emit(e) }, this.inheritedAttributes)), h("bal-icon", { key: 'd34d154f6bafaa5fe925a9333796e5c2b1c41dfc', "is-right": true, color: this.disabled || this.readonly ? 'grey' : this.invalid ? 'danger' : 'primary', name: "clock" }))));
+        return (h(Host, { key: '2578b65264137e9434088835c57d22d206103771', "aria-disabled": this.disabled ? 'true' : null, class: Object.assign({}, block.class()) }, h("bal-input-group", { key: 'b01517906f8bf0a8062150353c8ab222b8168d7a', disabled: this.disabled || this.readonly, invalid: this.invalid }, h("input", Object.assign({ key: '07e361337fcfb7089f43f8b01393df8978f3806e', type: "time", class: Object.assign({ 'input': true, 'is-disabled': this.disabled || this.readonly, 'is-danger': this.invalid, 'has-focus': this.focused, 'show-placeholder': !this.focused && (this.value === '' || this.value === undefined), 'has-value': this.value !== '' && this.value !== undefined }, native.class()), ref: input => (this.nativeInput = input), id: this.ariaForm.controlId || this.inputId, "aria-labelledby": this.ariaForm.labelId, "aria-describedby": this.ariaForm.messageId, "aria-invalid": this.invalid === true ? 'true' : 'false', "aria-disabled": this.disabled ? 'true' : null, name: this.name, disabled: this.disabled, readonly: this.readonly, required: this.required, placeholder: `${i18nBalTimeInput[this.language].hours}:${i18nBalTimeInput[this.language].minutes}`, value: value, onInput: ev => this.onInput(ev), onFocus: e => this.onFocus(e), onBlur: e => this.onBlur(e), onKeyDown: e => this.onKeydown(e), onKeyPress: e => this.balKeyPress.emit(e) }, this.inheritedAttributes)), h("bal-icon", { key: 'c5962393a8981a078a6cf0e2f41890ecc534fd11', "is-right": true, color: this.disabled || this.readonly ? 'grey' : this.invalid ? 'danger' : 'primary', name: "clock" }))));
     }
     get el() { return this; }
     static get watchers() { return {
@@ -171,7 +170,7 @@ const TimeInput = /*@__PURE__*/ proxyCustomElement(class TimeInput extends HTMLE
         "setBlur": [64],
         "getInputElement": [64],
         "setAriaForm": [64]
-    }, undefined, {
+    }, [[6, "click", "listenOnClick"], [6, "reset", "resetHandler"]], {
         "debounce": ["debounceChanged"]
     }]);
 __decorate([
@@ -180,18 +179,6 @@ __decorate([
     __metadata("design:paramtypes", [Function]),
     __metadata("design:returntype", void 0)
 ], TimeInput.prototype, "createLogger", null);
-__decorate([
-    ListenTo('click', { capture: true, target: 'document' }),
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", [UIEvent]),
-    __metadata("design:returntype", void 0)
-], TimeInput.prototype, "listenOnClick", null);
-__decorate([
-    ListenTo('reset', { capture: true, target: 'document' }),
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", [UIEvent]),
-    __metadata("design:returntype", void 0)
-], TimeInput.prototype, "resetHandler", null);
 __decorate([
     ListenToConfig(),
     __metadata("design:type", Function),

package/components/bal-toast.js

@@ -43,7 +43,7 @@ const Toast = /*@__PURE__*/ proxyCustomElement(class Toast extends HTMLElement {
         return `bal-toast__inner--is-${this.color}`;
     }
     render() {
-        return (h(Host, { key: '022b79aa15606a15256ff3a4a8ea327cd3d7badf', id: this.toastId, class: "bal-toast" }, h("div", { key: '13e4f7084f3d27ecec0729a229c4ced273b781d7', role: "alert", onClick: () => this.close(), class: `bal-toast__inner ${this.colorType}` }, h("span", { key: 'ba07ca16899d4af96dbc8936e997a424b3c1b584', class: "bal-toast__label", innerHTML: this.message, "data-testid": "bal-toast-label" }, h("slot", { key: '059e7c7095f24eeefa2629e7fc168d1eda116a7c' })), h("bal-close", { key: '3efd56336ee10d4afbdf118c091ec9f306603450', class: "bal-toast__close", inverted: false, "data-testid": "bal-toast-close" }))));
+        return (h(Host, { key: '98efc7e715868158761632175f1d5ebaf2109fef', id: this.toastId, class: "bal-toast" }, h("div", { key: '3d5562a482701cd6013749b5dac2e6b2d6b5452f', role: "alert", onClick: () => this.close(), class: `bal-toast__inner ${this.colorType}` }, h("span", { key: '394cdb2e5000ee33929093cf4e563bd729de44f8', class: "bal-toast__label", innerHTML: this.message, "data-testid": "bal-toast-label" }, h("slot", { key: '69731e615a6212359cfccf7089064525de7f0f89' })), h("bal-close", { key: 'd07cf7ad019afc147c24a7002415359640c19266', class: "bal-toast__close", inverted: false, "data-testid": "bal-toast-close" }))));
     }
     get element() { return this; }
     static get style() { return BalToastStyle0; }

package/components/bal-tooltip.js

@@ -242,7 +242,7 @@ const Tooltip = /*@__PURE__*/ proxyCustomElement(class Tooltip extends HTMLEleme
         const arrowBlock = block.element('arrow');
         const innerBlock = block.element('inner');
         const innerContentBlock = innerBlock.element('content');
-        return (h(Host, { key: 'be527a1b6a3bc6c4958692998c35a935ec529484', class: Object.assign({}, block.class()), role: "dialog", "aria-hidden": `${this.presented !== true}`, "aria-modal": `${this.presented === true}`, "aria-presented": `${this.presented === true}` }, h("div", { key: '1ef5d833c3796839e5f265651867d2a3d17c0251', class: Object.assign({}, containerBlock.class()), ref: containerEl => (this.containerEl = containerEl) }, h("div", { key: '0f29a68c79453bbde28ed48464e91b49caf46ada', class: Object.assign({}, arrowBlock.class()), ref: arrowEl => (this.arrowEl = arrowEl) }), h("bal-stack", { key: '71509e320a90d1e5e8fd92fc689352bd352a5557', layout: "vertical", class: Object.assign({}, innerBlock.class()) }, h("div", { key: '56628c0fce715db27e5a39385d7b698aabc070e1', class: Object.assign({}, innerContentBlock.class()), ref: contentEl => (this.contentEl = contentEl), "data-test": "bal-tooltip-content" }, h("slot", { key: 'a303a3a3b414eaddd6cba0a3ee585451a29be532' }))))));
+        return (h(Host, { key: '0d4c212b2fc53455951d404533f2edee8032a022', class: Object.assign({}, block.class()), role: "dialog", "aria-hidden": `${this.presented !== true}`, "aria-modal": `${this.presented === true}`, "aria-presented": `${this.presented === true}` }, h("div", { key: '33331b2e7e10c448fd3ee2031d15ac6e328237d8', class: Object.assign({}, containerBlock.class()), ref: containerEl => (this.containerEl = containerEl) }, h("div", { key: 'e85f45f6f548350d35c11ad4bbf287022daba636', class: Object.assign({}, arrowBlock.class()), ref: arrowEl => (this.arrowEl = arrowEl) }), h("bal-stack", { key: '33445925363c46f16f06c160a90ea811f2abdc60', layout: "vertical", class: Object.assign({}, innerBlock.class()) }, h("div", { key: '71a9d997a4fdcd5081bd69a3922918c109278377', class: Object.assign({}, innerContentBlock.class()), ref: contentEl => (this.contentEl = contentEl), "data-test": "bal-tooltip-content" }, h("slot", { key: 'df311a2293e02dfe52234ee77815f6e996647736' }))))));
     }
     get el() { return this; }
     static get watchers() { return {

package/components/breakpoints.subject.js

@@ -1,4 +1,4 @@
-import { j as debounce, k as addEventListener, r as removeEventListener } from './helpers.js';
+import { k as debounce, l as addEventListener, r as removeEventListener } from './helpers.js';
 import { b as balBrowser } from './browser.js';
 import { b as balDevice } from './device.js';
 import { L as ListenerAbstract, S as Subject } from './listener.js';

package/components/element-states.decorator.js

@@ -1,6 +1,6 @@
 import { L as ListenerAbstract, a as SingleSubject } from './listener.js';
 import { b as balBrowser } from './browser.js';
-import { k as addEventListener, r as removeEventListener } from './helpers.js';
+import { l as addEventListener, r as removeEventListener } from './helpers.js';
 
 class BalElementStateListener extends ListenerAbstract {
     constructor() {

package/components/floating-ui.js

@@ -1,4 +1,4 @@
-import { l as rLCP } from './helpers.js';
+import { m as rOnLoad } from './helpers.js';
 
 class BalFloatingUiInternal {
     constructor() {
@@ -8,7 +8,7 @@ class BalFloatingUiInternal {
                     return resolve(this.lib);
                 }
                 else {
-                    rLCP(async () => {
+                    rOnLoad(async () => {
                         import(/* @vite-ignore */ './floating-ui.dom.esm.js')
                             .then(module => {
                             this.lib = module;

package/components/focus.decorator.js

@@ -1,6 +1,6 @@
 import { L as ListenerAbstract, a as SingleSubject } from './listener.js';
 import { b as balBrowser } from './browser.js';
-import { d as waitAfterIdleCallback, i as isDescendant, k as addEventListener, r as removeEventListener } from './helpers.js';
+import { d as waitAfterIdleCallback, j as isDescendant, l as addEventListener, r as removeEventListener } from './helpers.js';
 
 class BalFocusListener extends ListenerAbstract {
     constructor() {

package/components/helpers.js

@@ -31,6 +31,25 @@ const rLCP = (callback, timeout = 3000) => {
         return setTimeout(callback, 32);
     }
 };
+const rOnLoad = (callback, timeout = 32) => {
+    let called = false;
+    const callOnce = () => {
+        if (!called) {
+            called = true;
+            callback();
+        }
+    };
+    if (balBrowser.hasWindow) {
+        const timer = setTimeout(callOnce, timeout);
+        window.addEventListener('load', () => {
+            clearTimeout(timer);
+            callOnce();
+        });
+    }
+    else {
+        setTimeout(callOnce, 32);
+    }
+};
 const rIC = (callback, timeout = 5000) => {
     if (balBrowser.hasWindow && 'requestIdleCallback' in window) {
         window.requestIdleCallback(callback, { timeout });
@@ -214,8 +233,16 @@ const waitForComponent = async (el) => {
     await waitAfterIdleCallback();
 };
 const isChildOfEventTarget = async (ev, el, callback) => {
-    if (ev && ev.target && el && el !== ev.target && isDescendant(ev.target, el)) {
-        callback();
+    if (ev && ev.target && el && el !== ev.target) {
+        let target = ev.target;
+        // special case for the navbar case
+        const isNavbarBrand = ev.target.nodeName === 'BAL-NAVBAR-BRAND';
+        if (isNavbarBrand) {
+            target = target.closest('bal-navbar');
+        }
+        if (target && isDescendant(target, el)) {
+            callback();
+        }
     }
 };
 const waitForDesignSystem = async (el, _config) => {
@@ -263,6 +290,9 @@ const waitAfterIdleCallback = () => {
 const waitAfterLargestContentfulPaintCallback = () => {
     return new Promise(resolve => rLCP(() => runHighPrioritizedTask(resolve)));
 };
+const waitOnLoadEventCallback = () => {
+    return new Promise(resolve => rOnLoad(() => runHighPrioritizedTask(resolve)));
+};
 const runHighPrioritizedTask = (callback) => {
     if (balBrowser.hasWindow && 'MessageChannel' in window) {
         const messageChannel = new window.MessageChannel();
@@ -274,4 +304,4 @@ const runHighPrioritizedTask = (callback) => {
     }
 };
 
-export { waitForDesignSystem as a, waitAfterFramePaint as b, componentOnReady as c, waitAfterIdleCallback as d, waitAfterLargestContentfulPaintCallback as e, deepReady as f, getAppRoot as g, wait as h, isDescendant as i, debounce as j, addEventListener as k, rLCP as l, raf as m, debounceEvent as n, rIC as o, hasTagName as p, hasParent as q, removeEventListener as r, shallowReady as s, transitionEndAsync as t, isChildOfEventTarget as u, waitForComponent as w };
+export { waitForDesignSystem as a, waitAfterFramePaint as b, componentOnReady as c, waitAfterIdleCallback as d, waitAfterLargestContentfulPaintCallback as e, waitOnLoadEventCallback as f, getAppRoot as g, deepReady as h, wait as i, isDescendant as j, debounce as k, addEventListener as l, rOnLoad as m, raf as n, debounceEvent as o, rIC as p, hasTagName as q, removeEventListener as r, shallowReady as s, transitionEndAsync as t, hasParent as u, isChildOfEventTarget as v, waitForComponent as w };

package/components/index.js

@@ -14,7 +14,7 @@ export { n as newBalOption } from './option.js';
 export { n as newBalStepOption } from './bal-step.util.js';
 export { n as newBalTabOption } from './bal-tab.util.js';
 import { g as getAppRoot, c as componentOnReady } from './helpers.js';
-export { c as componentOnReady, f as deepReady, g as getAppRoot, i as isDescendant, s as shallowReady, h as wait, b as waitAfterFramePaint, d as waitAfterIdleCallback, e as waitAfterLargestContentfulPaintCallback, w as waitForComponent, a as waitForDesignSystem } from './helpers.js';
+export { c as componentOnReady, h as deepReady, g as getAppRoot, j as isDescendant, s as shallowReady, i as wait, b as waitAfterFramePaint, d as waitAfterIdleCallback, e as waitAfterLargestContentfulPaintCallback, w as waitForComponent, a as waitForDesignSystem, f as waitOnLoadEventCallback } from './helpers.js';
 export { s as scrollToFirstInvalidField } from './form.js';
 export { B as BalScrollHandler } from './scroll.js';
 import { b as balDevice } from './device.js';
@@ -342,7 +342,7 @@ class BalSnackbarController extends BalNoticeController {
 const balSnackbarController = new BalSnackbarController();
 
 // generated by .build/version.js
-const VERSION = '17.2.1';
+const VERSION = '17.2.2';
 
 const initializeBaloiseDesignSystem = (userConfig = {}, platformConfig = undefined, win = {}) => {
     if (Object.keys(win).length === 0 && balBrowser.hasWindow) {

package/components/keyboard.helpers.js

@@ -1,3 +1,9 @@
+/**
+ * Returns `true` if the keyboard event was triggered by the `Enter` key
+ */
+function isTabKey(event) {
+    return event.key === 'Tab';
+}
 /**
  * Returns `true` if the keyboard event was triggered by the `Enter` key
  */
@@ -59,4 +65,4 @@ function isEndKey(event) {
     return event.key === 'End';
 }
 
-export { isSpaceKey as a, isArrowDownKey as b, isArrowUpKey as c, isEscapeKey as d, isBackspaceKey as e, isArrowLeftKey as f, isArrowRightKey as g, isHomeKey as h, isEnterKey as i, isEndKey as j };
+export { isSpaceKey as a, isTabKey as b, isArrowDownKey as c, isArrowUpKey as d, isEscapeKey as e, isArrowLeftKey as f, isArrowRightKey as g, isHomeKey as h, isEnterKey as i, isEndKey as j, isBackspaceKey as k };

package/components/mutation.decorator.js

@@ -1,4 +1,4 @@
-import { f as deepReady, b as waitAfterFramePaint, j as debounce } from './helpers.js';
+import { h as deepReady, b as waitAfterFramePaint, k as debounce } from './helpers.js';
 import { L as ListenerAbstract, a as SingleSubject } from './listener.js';
 
 class BalMutationListener extends ListenerAbstract {
@@ -14,21 +14,24 @@ class BalMutationListener extends ListenerAbstract {
             characterData: true,
         };
         this.mutationCallback = (mutationRecord) => {
-            const hasChanges = mutationRecord.some(record => this.tags.includes(record.target.nodeName));
-            if (hasChanges) {
-                return this.notify(undefined);
-            }
-            const hasRemovedNodeChanges = mutationRecord.some(record => Array.from(record.removedNodes).some((node) => this.tags.includes(node.nodeName)));
-            if (hasRemovedNodeChanges) {
-                return this.notify(undefined);
-            }
+            // default when no tag is provided
             if (this.tags.length === 0 && mutationRecord.length > 0) {
-                const hasCharacterDataChanges = mutationRecord.some(record => record.type === 'characterData');
-                if (hasCharacterDataChanges) {
-                    return this.notify(undefined);
-                }
+                return this.notify(undefined);
             }
-            if (this.tags.length === 0 && mutationRecord.length > 0) {
+            const tagRecords = mutationRecord.filter(record => this.tags.includes(record.target.nodeName.toLowerCase()));
+            // check for added nodes
+            const hasAddedNodeChanges = tagRecords.some(record => Array.from(record.addedNodes).some((node) => this.tags.includes(node.nodeName)));
+            // check for removed nodes
+            const hasRemovedNodeChanges = tagRecords.some(record => Array.from(record.removedNodes).some((node) => this.tags.includes(node.nodeName)));
+            // check for attribute changes
+            const attributeNameCheck = (attributeName) => {
+                return (attributeName !== 'styles' &&
+                    attributeName !== 'class' &&
+                    !attributeName.startsWith('data-') &&
+                    !attributeName.startsWith('aria-'));
+            };
+            const hasAttributeChanges = tagRecords.some(record => record.type === 'attributes' && attributeNameCheck(record.attributeName));
+            if (hasAddedNodeChanges || hasAttributeChanges || hasRemovedNodeChanges) {
                 return this.notify(undefined);
             }
         };

package/components/overlays.js

@@ -1,5 +1,5 @@
 import { b as balBrowser } from './browser.js';
-import { k as addEventListener, r as removeEventListener } from './helpers.js';
+import { l as addEventListener, r as removeEventListener } from './helpers.js';
 
 let lastId = 0;
 const BACKDROP = 'backdrop';

package/components/resize.decorator.js

@@ -1,11 +1,11 @@
 import { L as ListenerAbstract, a as SingleSubject } from './listener.js';
 import { b as balBrowser } from './browser.js';
-import { j as debounce } from './helpers.js';
+import { k as debounce, p as rIC } from './helpers.js';
 
 class BalResizeListener extends ListenerAbstract {
     constructor() {
         super(...arguments);
-        this.debouncedNotify = debounce(() => this.notify(), 10);
+        this.debouncedNotify = debounce((info) => this.notify(info), 10);
     }
     connect(el) {
         var _a;
@@ -23,7 +23,23 @@ class BalResizeListener extends ListenerAbstract {
                     if (!Array.isArray(entries) || !entries.length) {
                         return;
                     }
-                    this.debouncedNotify();
+                    const entry = entries[0];
+                    if (this.lastWidth === undefined && this.lastHeight === undefined) {
+                        this.lastWidth = entry.contentRect.width;
+                        this.lastHeight = entry.contentRect.height;
+                    }
+                    else {
+                        const widthChanged = this.lastWidth !== entry.contentRect.width;
+                        const heightChanged = this.lastHeight !== entry.contentRect.height;
+                        if (widthChanged || heightChanged) {
+                            rIC(() => this.debouncedNotify({
+                                width: widthChanged,
+                                height: heightChanged,
+                            }));
+                            this.lastWidth = entry.contentRect.width;
+                            this.lastHeight = entry.contentRect.height;
+                        }
+                    }
                 });
             }
         });
@@ -39,8 +55,8 @@ class BalResizeListener extends ListenerAbstract {
 
 class BalResizeSubject extends SingleSubject {
     constructor() {
-        super((observer, _data) => {
-            observer.resizeListener({});
+        super((observer, data) => {
+            observer.resizeListener(data);
         });
         this.listener = new BalResizeListener();
     }

package/components/string.js

@@ -0,0 +1,12 @@
+const toKebabCase = (string) => {
+    if (typeof string === 'string') {
+        return string
+            .replace(/([a-z])([0-9])/g, '$1-$2')
+            .replace(/([a-z0-9])([A-Z])/g, '$1-$2')
+            .replace(/[\s_]+/g, '-')
+            .toLowerCase();
+    }
+    return '';
+};
+
+export { toKebabCase as t };

package/components/swipe.subject.js

@@ -1,6 +1,6 @@
 import { b as balDevice } from './device.js';
 import { L as ListenerAbstract, a as SingleSubject } from './listener.js';
-import { l as rLCP } from './helpers.js';
+import { m as rOnLoad } from './helpers.js';
 
 class BalSwipeListener extends ListenerAbstract {
     async connect(el) {
@@ -19,7 +19,7 @@ class BalSwipeListener extends ListenerAbstract {
     }
     async loadLib() {
         return new Promise((resolve, reject) => {
-            rLCP(async () => {
+            rOnLoad(async () => {
                 import(/* @vite-ignore */ './contact.js')
                     .then(module => {
                     this.PointerListenerLib = module.PointerListener;