@baloise/ds-core 19.8.3-snapshot.1877-5fcfacefc → 19.8.4

package/dist/collection/components/bal-field/bal-field-control/bal-field-control.js

@@ -33,14 +33,14 @@ export class FieldControl {
         return '';
     }
     render() {
-        return (h(Host, { key: '4aecfd6cf7bc49df8feb26cd3161af9174097fcc', class: {
+        return (h(Host, { key: 'f2dbde868506b54d5b5e2fc14b5c29c417d42891', class: {
                 'bal-field-control': true,
                 'control': true,
                 'has-icons-left': !!this.iconLeft,
                 'has-icons-right': !!this.iconRight,
                 'is-loading': this.loading,
                 'bal-field-control--expanded-on-mobile': !!this.expandedOnMobile,
-            } }, h("slot", { key: 'b1d4c61b4ba0cbd96c11d5540e12dafcc4b2518e' }), this.buildIconLeftTemplate, this.buildIconRightTemplate));
+            } }, h("slot", { key: '274cd16bccefc825d85e4b1222da7c523a1aa937' }), this.buildIconLeftTemplate, this.buildIconRightTemplate));
     }
     static get is() { return "bal-field-control"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/bal-field/bal-field-hint/bal-field-hint.js

@@ -28,7 +28,7 @@ export class FieldHint {
     }
     render() {
         const block = BEM.block('field-hint');
-        return (h(Host, { key: 'a5f895c418c0dfa249da93d3bc39f5563d31b547', class: Object.assign({}, block.class()) }, h("bal-hint", { key: '83d9c59c6fce044b361fbd471bf83780314c62e9', class: Object.assign({}, block.element('hint').class()), "data-testid": "bal-field-hint", closeLabel: this.closeLabel, small: this.small }, this.subject && !(this.hideTitleOnDesktop && this.isDesktop) ? (h("bal-hint-title", null, this.subject)) : (''), h("bal-hint-text", { key: '38b6ef5120c8b5adef31a05ad54f474ed55305f5' }, h("slot", { key: '040d24c305badac88e0bb64d21e513a067f6e177' })))));
+        return (h(Host, { key: '90dbf0da0a0c7ec498538721135e2fdefc4ac238', class: Object.assign({}, block.class()) }, h("bal-hint", { key: '1976d07de449aa8b2897a375f61953f0c705e4ae', class: Object.assign({}, block.element('hint').class()), "data-testid": "bal-field-hint", closeLabel: this.closeLabel, small: this.small }, this.subject && !(this.hideTitleOnDesktop && this.isDesktop) ? (h("bal-hint-title", null, this.subject)) : (''), h("bal-hint-text", { key: 'ae2b48186e4f4c1adbfe7b3ed57a798a55a4cad0' }, h("slot", { key: 'e4a33e9e14ab86a15e78321fbd9f7325e0420ec5' })))));
     }
     static get is() { return "bal-field-hint"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/bal-field/bal-field-label/bal-field-label.js

@@ -64,7 +64,7 @@ export class FieldLabel {
      * ------------------------------------------------------
      */
     render() {
-        return (h(Host, { key: '049f3e7c80126a7ffbc005e6c69a1bdc8203979b', class: "bal-field-label" }, h("bal-label", { key: '269ecb6de6a5daf2f4d4504b37f3980d05b1a121', multiline: true, size: this.size, htmlFor: this.htmlFor, required: this.required, valid: this.valid, invalid: this.invalid, disabled: this.disabled, readonly: this.readonly, weight: this.weight }, h("slot", { key: 'd832133cb85456ec6b7b1a999b5459044579e783' }))));
+        return (h(Host, { key: '6685a5711aba2152b975fe49fe114a9edb400679', class: "bal-field-label" }, h("bal-label", { key: 'f677ab02ba144832c6304dc99c3e2900079e38b7', multiline: true, size: this.size, htmlFor: this.htmlFor, required: this.required, valid: this.valid, invalid: this.invalid, disabled: this.disabled, readonly: this.readonly, weight: this.weight }, h("slot", { key: '687bfc73cab2cf7bef4e3e15b6a9090d5ba29d38' }))));
     }
     static get is() { return "bal-field-label"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/bal-field/bal-field-message/bal-field-message.js

@@ -35,14 +35,14 @@ export class FieldMessage {
         this.ariaForm = Object.assign({}, ariaForm);
     }
     render() {
-        return (h(Host, { key: 'f0425dd945959866c1edbfe0affa56a5c325a014', id: this.ariaForm.messageId, class: {
+        return (h(Host, { key: '24a1ad8e6d848841fd1e83428aa14430ed6fe5fc', id: this.ariaForm.messageId, class: {
                 'bal-field-message': true,
                 'help': true,
                 'is-danger': this.invalid,
                 'is-success': this.valid,
                 'is-disabled': this.disabled || this.readonly,
                 [`is-${this.color}`]: !!this.color,
-            }, style: { minHeight: this.noReservedSpace ? '0' : undefined } }, h("slot", { key: 'c693909e5e98a82db73d2884a4f804cf20e24ab3' })));
+            }, style: { minHeight: this.noReservedSpace ? '0' : undefined } }, h("slot", { key: '2cb9fb2480527f5b4ae63611f3a424fcc202bc36' })));
     }
     static get is() { return "bal-field-message"; }
     static get properties() {

package/dist/collection/components/bal-field/bal-field.js

@@ -188,12 +188,12 @@ export class Field {
         components.forEach(c => callback(c));
     }
     render() {
-        return (h(Host, { key: 'ce893d29bd46dbe6b7646c28410a86b9171661b9', id: this.fieldId, class: {
+        return (h(Host, { key: 'ef05b294a516d40c5089d051feeb46715f581bc1', id: this.fieldId, class: {
                 'bal-field': true,
                 'field': true,
                 'bal-field--invalid': this.invalid === true,
                 'bal-field--horizontal': this.horizontal === true,
-            } }, h("slot", { key: '9ed0398262848664e0b6e4491bb7c0af45da341d' }), h("span", { key: '6cddb052cb69b66ccb29f3c9e2f70723557da014', class: "bal-field-hidden" })));
+            } }, h("slot", { key: '5710d7fd141b21d699004d7982d5d5bb7238cd94' }), h("span", { key: 'e1b36343cdcb60960bcdac4d938c946f40041334', class: "bal-field-hidden" })));
     }
     static get is() { return "bal-field"; }
     static get originalStyleUrls() {

package/dist/collection/components/bal-file-upload/bal-file-upload.js

@@ -234,16 +234,16 @@ export class FileUpload {
      */
     render() {
         const id = this.ariaForm.controlId || this.fileUploadId;
-        return (h(Host, { key: '438044d74c8a20cee269a65e7492a19c800c8f60', onClick: this.onHostClick, "aria-disabled": ariaBooleanToString(this.disabled), class: {
+        return (h(Host, { key: '05b754f351fce01410a7b962aac9df747a2199ff', onClick: this.onHostClick, "aria-disabled": ariaBooleanToString(this.disabled), class: {
                 'bal-file-upload': true,
-            } }, h("div", { key: 'ea6316e2f4765d3385c0fc38d1dd6e9b55d711d0', class: {
+            } }, h("div", { key: '9e2f871f72b1c666ed8d911e91cfedaf548c2519', class: {
                 'file': true,
                 'is-disabled': this.disabled || this.readonly || this.loading,
                 'is-danger': this.invalid,
-            } }, h("label", { key: 'a75f2f2f116c6c9f7672ddbbfe2d4636039d2c64', htmlFor: id, ref: el => (this.labelEl = el), class: {
+            } }, h("label", { key: '9976fcf5ba8dd68ff8d01bf0c963a0feee42fd21', htmlFor: id, ref: el => (this.labelEl = el), class: {
                 'file-label': true,
                 'is-disabled': this.disabled || this.loading || this.readonly,
-            } }, h("input", { key: '2ab53c147961166e12b4cab0fa0e0862557a325f', class: "file-input", type: "file", id: id, "aria-labelledby": this.ariaForm.labelId, "aria-describedby": this.ariaForm.messageId, "aria-invalid": this.invalid === true ? 'true' : 'false', "aria-disabled": ariaBooleanToString(this.disabled), name: this.name, multiple: this.multiple, disabled: this.disabled || this.loading || this.readonly, readonly: this.readonly, required: this.required, accept: this.accept, onClick: this.onInputClick, onChange: this.onInputChange, onFocus: this.onInputFocus, onBlur: this.onInputBlur, ref: el => (this.nativeInput = el), "data-testid": "bal-file-upload-input" }), this.loading ? (h("span", { class: "file-cta" }, h("bal-spinner", null))) : (h("span", { class: "file-cta" }, h("span", { class: "file-icon" }, h("bal-icon", { name: "upload", size: "medium", color: this.disabled || this.loading || this.readonly ? 'grey-light' : this.invalid ? 'danger' : 'blue' })), h("span", { class: "file-label", "data-testid": "bal-file-upload-label" }, this.label))))), this.hasFileList && this.files.length > 0 ? (h(FileListComponent, { files: this.files, disabled: this.disabled || this.readonly || this.loading, subTitle: this.subTitle, onRemoveFile: this.onRemoveFile })) : ('')));
+            } }, h("input", { key: '7596fa2c3174ac804b3b3b950c6e181a25080d80', class: "file-input", type: "file", id: id, "aria-labelledby": this.ariaForm.labelId, "aria-describedby": this.ariaForm.messageId, "aria-invalid": this.invalid === true ? 'true' : 'false', "aria-disabled": ariaBooleanToString(this.disabled), name: this.name, multiple: this.multiple, disabled: this.disabled || this.loading || this.readonly, readonly: this.readonly, required: this.required, accept: this.accept, onClick: this.onInputClick, onChange: this.onInputChange, onFocus: this.onInputFocus, onBlur: this.onInputBlur, ref: el => (this.nativeInput = el), "data-testid": "bal-file-upload-input" }), this.loading ? (h("span", { class: "file-cta" }, h("bal-spinner", null))) : (h("span", { class: "file-cta" }, h("span", { class: "file-icon" }, h("bal-icon", { name: "upload", size: "medium", color: this.disabled || this.loading || this.readonly ? 'grey-light' : this.invalid ? 'danger' : 'blue' })), h("span", { class: "file-label", "data-testid": "bal-file-upload-label" }, this.label))))), this.hasFileList && this.files.length > 0 ? (h(FileListComponent, { files: this.files, disabled: this.disabled || this.readonly || this.loading, subTitle: this.subTitle, onRemoveFile: this.onRemoveFile })) : ('')));
     }
     static get is() { return "bal-file-upload"; }
     static get originalStyleUrls() {

package/dist/collection/components/bal-footer/bal-footer.js

@@ -120,14 +120,14 @@ export class Footer {
         const elWrapper = elLanguage.element('wrapper');
         const elLegalLinks = elLinksContainer.element('legal-links');
         const elSocialMediaLinks = elLinksContainer.element('social-media-links');
-        return (h(Host, { key: '04ec38780841ea9902e3f465b8fd4e3561a9092e', class: Object.assign({}, block.class()) }, h("footer", { key: 'dc1fa3c156ad78d3d05d3f5d219c81801bca5044', class: Object.assign({}, elInner.class()) }, h("div", { key: 'e8f1144c09a1b52fb956bc03438671086e801895', class: Object.assign({}, elInnerWrapper.class()) }, h("div", { key: 'b6d1e0c4deed43eec0e0889cc4011cc5465db527', class: Object.assign(Object.assign({ container: true }, elContainer.class()), elHeaderContainer.class()) }, h("div", { key: '6102cc926e8542a0a2802b1fa8914b054a9391b4', class: Object.assign({}, elLogo.class()) }, this.logoHref ? (h("img", { src: this.logoHref, alt: "Logo" })) : this.logoSvgContent ? (h("div", { innerHTML: this.logoSvgContent })) : (h("bal-logo", { color: "white" }))), h("div", { key: '5cd3a29dd8d40a4704f85635e32bcca1d0af0546', class: Object.assign({}, elLanguage.class()), style: {
+        return (h(Host, { key: 'ca5dacc6c906754b6bb466c448be4f6bb5b38dff', class: Object.assign({}, block.class()) }, h("footer", { key: '8d42cfff788350c5e5ae26f86b613fcd5144085d', class: Object.assign({}, elInner.class()) }, h("div", { key: 'a60281af0dcf73da3901cb605b49d35b3bb3e6ed', class: Object.assign({}, elInnerWrapper.class()) }, h("div", { key: '857d35746558b5b0a5ec79562b3f2c0e30037141', class: Object.assign(Object.assign({ container: true }, elContainer.class()), elHeaderContainer.class()) }, h("div", { key: 'c1e5bae12ba5449888156244789fd79dbdc3a388', class: Object.assign({}, elLogo.class()) }, this.logoHref ? (h("img", { src: this.logoHref, alt: "Logo" })) : this.logoSvgContent ? (h("div", { innerHTML: this.logoSvgContent })) : (h("bal-logo", { color: "white" }))), h("div", { key: 'de3b93d01ad75facf4219df8954016095aa143ab', class: Object.assign({}, elLanguage.class()), style: {
                 display: this.hideLanguageSelection || this.allowedLanguages.length <= 1 ? 'none' : 'flex',
-            } }, h("div", { key: '023ba95e77cc80681af23b8a0ed50b49a94b81fd', class: Object.assign({}, elWrapper.class()) }, h("bal-icon", { key: '3c5ce093f139a07def8c73fdfbcf6060de8893b3', class: Object.assign({}, elWrapper.element('icon').class()), name: "web", color: "white" }), h("select", { key: '7cd8af0cb134b8b8a9733333df37a1c9f909e9fb', class: Object.assign({}, elWrapper.element('select').class()), onChange: event => this.changeLanguage(event.target.value), "data-testid": "bal-footer-language" }, this.allowedLanguages.map(language => (h("option", { key: language, value: language, selected: language === this.language }, language.toLocaleUpperCase() + ' - ' + i18nBalFooter[language].name))))))), h("div", { key: '017b017c8d5714e5b8568cf10e12a96a468b722e', class: Object.assign({}, elSlot.class()) }, h("slot", { key: 'e09a963ac71e749cecfe38751ae330759e626080' })), h("div", { key: '993161e25ae9c3fccc18fd7f2b032b74b3120106', class: Object.assign(Object.assign({ container: true }, elContainer.class()), elLinksContainer.class()) }, h("div", { key: 'eee88e5f349aebf4d16333462f7e18a029bfe82e', class: Object.assign({}, elSocialMediaLinks.class()), style: {
+            } }, h("div", { key: '7be8f0588d5da5e436b72214c67542316d325481', class: Object.assign({}, elWrapper.class()) }, h("bal-icon", { key: '935dfaa39b97f40cd946ce8c8a0a0f421b3876b6', class: Object.assign({}, elWrapper.element('icon').class()), name: "web", color: "white" }), h("select", { key: 'd8408623006a257fa422b0789bc1e021461f1b1e', class: Object.assign({}, elWrapper.element('select').class()), onChange: event => this.changeLanguage(event.target.value), "data-testid": "bal-footer-language" }, this.allowedLanguages.map(language => (h("option", { key: language, value: language, selected: language === this.language }, language.toLocaleUpperCase() + ' - ' + i18nBalFooter[language].name))))))), h("div", { key: '422e8cae4fd1cd625afb3cc81bc7c0cfac99fe65', class: Object.assign({}, elSlot.class()) }, h("slot", { key: 'b7c73e907ffbe0b64eb4608143774bcf7c56ff30' })), h("div", { key: '7bc64923fe79674a26e96f263785abf96dba1af6', class: Object.assign(Object.assign({ container: true }, elContainer.class()), elLinksContainer.class()) }, h("div", { key: '5e5c86e58b3df89978657217ba145555786becfb', class: Object.assign({}, elSocialMediaLinks.class()), style: {
                 display: !this.showSocialMedia ? 'none' : 'flex',
             } }, this.socialMediaLinks.map(link => (h("a", { key: link.link, href: link.link, target: "_blank", class: {
                 'link': true,
                 'is-inverted': true,
-            } }, h("bal-icon", { name: link.label.toLowerCase() }))))), h("div", { key: 'fdd8006cd0d1ec2f6e3fa6ee418705a7d607f9c8', class: Object.assign({}, elLegalLinks.class()), style: { display: this.hideLinks ? 'none' : 'flex' } }, this.links &&
+            } }, h("bal-icon", { name: link.label.toLowerCase() }))))), h("div", { key: '610e34f952fd08cba92099a213371e45c5f7ebc6', class: Object.assign({}, elLegalLinks.class()), style: { display: this.hideLinks ? 'none' : 'flex' } }, this.links &&
             this.links.map(link => (h("a", { key: link.link, href: link.link, target: "_blank", class: {
                     'link': true,
                     'is-light': true,

package/dist/collection/components/bal-form/bal-form.js

@@ -32,7 +32,7 @@ export class Form {
                 novalidate: this.novalidate,
             };
         }
-        return (h(Host, { key: 'd25c1b6664e41d72f2d2c5b2ad6532fa184d66bf' }, h(NativeEl, Object.assign({ key: '37eefa8920cf3fb639d235d7b21cb7a44be6bd06' }, attrs, { class: this.formClass }), h("slot", { key: '7eff7f47f3fd4732988e17944be73373e6133e32' }))));
+        return (h(Host, { key: '8b3d28034718b1594fef9900e776ff718e16441d' }, h(NativeEl, Object.assign({ key: '4a21539e4b24d63f95813654d92ac8aa2c0f948b' }, attrs, { class: this.formClass }), h("slot", { key: '9b2a367a300b2803a4868c057e54d14952a557ca' }))));
     }
     static get is() { return "bal-form"; }
     static get originalStyleUrls() {

package/dist/collection/components/bal-form-grid/bal-form-col/bal-form-col.js

@@ -5,7 +5,7 @@ export class FormCol {
         this.size = 'full';
     }
     render() {
-        return (h(Host, { key: 'd2157c5ff125226d4d2825f97302196de41483fd', class: {
+        return (h(Host, { key: '39b569057a21775679f548ca50cc2313c4864371', class: {
                 [`${this.colClass}`]: true,
                 'py-none': true,
                 'touch:is-12': true,
@@ -15,7 +15,7 @@ export class FormCol {
                 'is-8': this.size === 'two-thirds',
                 'is-3': this.size === 'one-quarter',
                 'is-9': this.size === 'three-quarters',
-            } }, h("slot", { key: '25c2e4928d8aee7a28bb4dd554b3fb2090dd29e2' })));
+            } }, h("slot", { key: 'bad28679d1a5cc68bca310fc095117c164a668b8' })));
     }
     static get is() { return "bal-form-col"; }
     static get properties() {

package/dist/collection/components/bal-form-grid/bal-form-grid.js

@@ -1,7 +1,7 @@
 import { h, Host } from "@stencil/core";
 export class FormGrid {
     render() {
-        return (h(Host, { key: '164b3b6f4a81dacf2f53d5005ec64752a7aba56d', class: `bal-form-grid grid is-multiline my-none py-none` }, h("slot", { key: 'dac6ae11535688ca5b0958366137edc226dc584f' })));
+        return (h(Host, { key: '7dd05e54b6f2070956b4630a542c249734981731', class: `bal-form-grid grid is-multiline my-none py-none` }, h("slot", { key: 'd9490a9e4153d985dad9258dc795ea1b092930f4' })));
     }
     static get is() { return "bal-form-grid"; }
     static get originalStyleUrls() {

package/dist/collection/components/bal-heading/bal-heading.js

@@ -100,7 +100,7 @@ export class Heading {
         const bemTextEl = block.element('text');
         const Heading = this.tag;
         const fontColor = this.fontColor;
-        return (h(Host, { key: '3c9251d3a1d15a8470baa6e930fe902d322ca281', class: Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier(`space-${this.space}`).class(this.space !== undefined)), block.modifier(`level-${this.level}`).class()) }, h(Heading, { key: 'f0d7a82d43789b991e52881e7962fbf7ee6b8b2a', class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, bemTextEl.class()), bemTextEl.modifier('no-wrap').class(this.noWrap)), bemTextEl.modifier('subtitle').class(this.subtitle)), bemTextEl.modifier('shadow').class(this.shadow)), bemTextEl.modifier(`color-${fontColor}`).class()), bemTextEl.modifier(`size-${this.autoFontSize}`).class()), ref: (headingEl) => (this.headingEl = headingEl), "data-testid": "bal-heading" }, h("slot", { key: '9e6893fe656db354b740c3b1d040ec1c7a137883' }))));
+        return (h(Host, { key: 'bb045a6d0ed10c2143cb77f5852ac967e1b3b21a', class: Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier(`space-${this.space}`).class(this.space !== undefined)), block.modifier(`level-${this.level}`).class()) }, h(Heading, { key: 'ff31969a001a5706206f134d96c7f85dd8334176', class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, bemTextEl.class()), bemTextEl.modifier('no-wrap').class(this.noWrap)), bemTextEl.modifier('subtitle').class(this.subtitle)), bemTextEl.modifier('shadow').class(this.shadow)), bemTextEl.modifier(`color-${fontColor}`).class()), bemTextEl.modifier(`size-${this.autoFontSize}`).class()), ref: (headingEl) => (this.headingEl = headingEl), "data-testid": "bal-heading" }, h("slot", { key: '5ce82d9f2158abb4c0243cb6028d45ba3c60e7c5' }))));
     }
     static get is() { return "bal-heading"; }
     static get originalStyleUrls() {

package/dist/collection/components/bal-hint/bal-hint-text/bal-hint-text.js

@@ -6,7 +6,7 @@ export class HintText {
         const elContent = block.element('content');
         const elText = elContent.element('text');
         const elTextField = elText.element('field');
-        return (h(Host, { key: '37d17b229f86f236fe7ddaadd42fc91f611c6d05', class: Object.assign({}, elText.class()) }, h("p", { key: '3fb5e40a5c38c89842a63c08dcd249ae626c8f14', class: Object.assign({}, elTextField.class()) }, h("slot", { key: 'ffd2db1c493980e60f352d6d0f25deb0a5516b49' }))));
+        return (h(Host, { key: '24898db6c3c51d19a7df6552a2e0f370c8812f95', class: Object.assign({}, elText.class()) }, h("p", { key: '2ff7501b81213d1a553f2a9a9c98df6d9577e5e8', class: Object.assign({}, elTextField.class()) }, h("slot", { key: 'e2f5ecd78ad99fc53713576807011f39884ad7fb' }))));
     }
     static get is() { return "bal-hint-text"; }
 }

package/dist/collection/components/bal-hint/bal-hint-title/bal-hint-title.js

@@ -6,7 +6,7 @@ export class HintTitle {
         const elContent = block.element('content');
         const elTitle = elContent.element('title');
         const elHeading = elTitle.element('heading');
-        return (h(Host, { key: '334f645b02c2c685b596139d58bf5ad980a48138', class: Object.assign({}, elTitle.class()) }, h("h3", { key: 'f886724a8db46d3faf6c17ada13a9712cb5b1f5b', class: Object.assign({}, elHeading.class()) }, h("span", { key: 'b6c6d4d61f8f7e0e11941e4ebc9b2004b153167d' }, h("slot", { key: 'c23c7caf0d57c3456341ca2fa5c08233baa881b1' })))));
+        return (h(Host, { key: '6304fd03629ecdbaeff48777da6e9950a02e02bf', class: Object.assign({}, elTitle.class()) }, h("h3", { key: '5cdfc4c2319f7b8b17f23d02aeae7cbc534134af', class: Object.assign({}, elHeading.class()) }, h("span", { key: '6e5ce498f0574fe356778d87fb98f59b446bd8e3' }, h("slot", { key: '9604fad3ee38908e2a51ab295e7d17dad7b3d7fc' })))));
     }
     static get is() { return "bal-hint-title"; }
 }

package/dist/collection/components/bal-icon/bal-icon.js

@@ -182,7 +182,7 @@ export class Icon {
     render() {
         const color = this.parseColor();
         const block = BEM.block('icon');
-        return (h(Host, { key: '2476f8105bacbacdc93c5df13bcd2332786178f7', "aria-hidden": "true", class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier('tile').class(this.tile)), block.modifier(`tile-color-${this.tileColor}`).class(this.tile && !!this.tileColor)), block.modifier('is-inverted').class(this.inverted)), block.modifier('is-inline').class(this.inline)), block.modifier('is-disabled').class(this.disabled)), block.modifier('shadow').class(this.shadow)), block.modifier(`is-${this.size}`).class(!!this.size)), block.modifier(`is-${color}`).class()) }, h("div", { key: 'b9e5656133e200500d1425a3df2897eeeda462dc', class: Object.assign(Object.assign(Object.assign(Object.assign({}, block.element('inner').class()), block.element('inner').modifier(`turn-${this.name}`).class(this.turn)), block.element('inner').modifier('tile').class(this.tile)), block.modifier(`is-${this.size}`).class(!!this.size)), innerHTML: this.svgContent })));
+        return (h(Host, { key: '1e9a500d95dbf86f756d4f4e3e34a9fe0cf7ae1c', "aria-hidden": "true", class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier('tile').class(this.tile)), block.modifier(`tile-color-${this.tileColor}`).class(this.tile && !!this.tileColor)), block.modifier('is-inverted').class(this.inverted)), block.modifier('is-inline').class(this.inline)), block.modifier('is-disabled').class(this.disabled)), block.modifier('shadow').class(this.shadow)), block.modifier(`is-${this.size}`).class(!!this.size)), block.modifier(`is-${color}`).class()) }, h("div", { key: '6969015d29cd3e94155858ff8bf15b3f4f7fe751', class: Object.assign(Object.assign(Object.assign(Object.assign({}, block.element('inner').class()), block.element('inner').modifier(`turn-${this.name}`).class(this.turn)), block.element('inner').modifier('tile').class(this.tile)), block.modifier(`is-${this.size}`).class(!!this.size)), innerHTML: this.svgContent })));
     }
     static get is() { return "bal-icon"; }
     static get originalStyleUrls() {

package/dist/collection/components/bal-input/bal-input-date/bal-input-date.js

@@ -143,14 +143,14 @@ export class InputDate {
     render() {
         const block = BEM.block('input-date');
         const native = block.element('native');
-        return (h(Host, { key: '49ea7a0000fe4b32077a9f4615dc27dc323c1f9c', onClick: (event) => this.maskAdapter.bindHostClick(event), class: Object.assign({}, block.class()) }, h("input", Object.assign({ key: '337864d4fefa8918d6ac0cfd86520575f66ba191', class: {
+        return (h(Host, { key: '3c71adc69c5270029c588885037338aee6dfc85f', onClick: (event) => this.maskAdapter.bindHostClick(event), class: Object.assign({}, block.class()) }, h("input", Object.assign({ key: '56c3f39f98b9dadb6b18f8bfea4c172e7bc0e607', class: {
                 'input': true,
                 'is-disabled': this.disabled || this.readonly,
                 'is-danger': this.invalid,
                 'is-clickable': this.clickable && !(this.disabled || this.readonly),
                 'bal-focusable': !this.disabled,
                 'has-icon-right': this.hasIconRight,
-            }, "data-testid": "bal-date-input", ref: el => (this.nativeInput = el), 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": ariaBooleanToString(this.disabled), required: this.required, disabled: this.disabled, readonly: this.readonly, autoComplete: this.autocomplete }, this.maskAdapter.attributes, this.inheritedAttributes, { placeholder: this.placeholder, value: this.inputValue, onKeyDown: event => this.maskAdapter.bindKeyDown(event), onClick: event => this.maskAdapter.bindClick(event), onFocus: event => this.maskAdapter.bindFocus(event), onBlur: event => this.maskAdapter.bindBlur(event), onPaste: event => this.maskAdapter.bindPaste(event) })), h("input", { key: '825df1bb8dd5ddd9d2f6b6b7a242f1ab674d003c', type: "date", class: Object.assign({}, native.class()), name: this.name, min: this.min, max: this.max, value: this.value, tabindex: -1, "aria-hidden": "true" })));
+            }, "data-testid": "bal-date-input", ref: el => (this.nativeInput = el), 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": ariaBooleanToString(this.disabled), required: this.required, disabled: this.disabled, readonly: this.readonly, autoComplete: this.autocomplete }, this.maskAdapter.attributes, this.inheritedAttributes, { placeholder: this.placeholder, value: this.inputValue, onKeyDown: event => this.maskAdapter.bindKeyDown(event), onClick: event => this.maskAdapter.bindClick(event), onFocus: event => this.maskAdapter.bindFocus(event), onBlur: event => this.maskAdapter.bindBlur(event), onPaste: event => this.maskAdapter.bindPaste(event) })), h("input", { key: 'dae67450389be6169c8257a0b1eaf877fb81e66b', type: "date", class: Object.assign({}, native.class()), name: this.name, min: this.min, max: this.max, value: this.value, tabindex: -1, "aria-hidden": "true" })));
     }
     static get is() { return "bal-input-date"; }
     static get originalStyleUrls() {

package/dist/collection/components/bal-input/bal-input.js

@@ -390,7 +390,7 @@ export class Input {
         }
         const block = BEM.block('input');
         const id = this.ariaForm.controlId || this.inputId;
-        return (h(Host, { key: 'd47a7009f2e7287b8a0790d260ea6d31778e25cc', onClick: this.handleClick, "aria-disabled": ariaBooleanToString(this.disabled), class: Object.assign({}, block.class()) }, h("input", Object.assign({ key: '7991d871f409abf77600aad25a72b28a5d01f2a2', class: {
+        return (h(Host, { key: 'b23e60aee1d98ef130c5a6526f0d8d4b59295732', onClick: this.handleClick, "aria-disabled": ariaBooleanToString(this.disabled), class: Object.assign({}, block.class()) }, h("input", Object.assign({ key: '9a62bde670992ae4357f6e2747a2a10170d890c2', class: {
                 'input': true,
                 'is-disabled': this.disabled || this.readonly,
                 'is-danger': this.invalid,

package/dist/collection/components/bal-input-group/bal-input-group.js

@@ -21,7 +21,7 @@ export class InputGroup {
         const hasDanger = this.invalid;
         const disabledClass = 'is-disabled';
         const hasDisabled = this.disabled || this.readonly;
-        return (h(Host, { key: '43b94d641ce994b142e21aff354984d3eeb12b8a', class: Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier(dangerClass).class(hasDanger)), block.modifier(disabledClass).class(hasDisabled)) }, h("slot", { key: '81149dce6e958209e08efeaf719b2cec3f4c58c0' })));
+        return (h(Host, { key: '9195a63ef1f2aaa0137b474c18933e80a43e0627', class: Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier(dangerClass).class(hasDanger)), block.modifier(disabledClass).class(hasDisabled)) }, h("slot", { key: 'fe954e0a0cca1ea081567c6ccac571e9107d8d2e' })));
     }
     static get is() { return "bal-input-group"; }
     static get originalStyleUrls() {

package/dist/collection/components/bal-input-slider/bal-input-slider.js

@@ -185,11 +185,11 @@ export class InputSlider {
         const inputValueRightEl = inputValueEl.modifier('right');
         const stepsEl = block.element('steps');
         const stepsItemEl = stepsEl.element('item');
-        return (h(Host, { key: 'a87543d5fe5c37894f5b750ea6ce5d435b35df7d', class: Object.assign(Object.assign({}, block.class()), block.modifier('disabled').class(this.disabled || this.readonly)), onClick: this.handleClick, "aria-disabled": ariaBooleanToString(this.disabled || this.readonly) }, h("div", { key: '3ff7511f087493bb0aa219cc0232aeb52e045068', class: Object.assign(Object.assign({}, backgroundEl.class()), backgroundEl.modifier('disabled').class(this.disabled || this.readonly)) }, h("div", { key: '6ba8bb8e959688aa308d25d4e4bb6fd578b7ddc6', class: Object.assign({}, backgroundUpperEl.class()), style: {
+        return (h(Host, { key: 'ad6fdbbb33727000cb6ff16e7daf168c6d35602b', class: Object.assign(Object.assign({}, block.class()), block.modifier('disabled').class(this.disabled || this.readonly)), onClick: this.handleClick, "aria-disabled": ariaBooleanToString(this.disabled || this.readonly) }, h("div", { key: '0c3ec1cb883d285ef62d06c47b9a8ead7198e235', class: Object.assign(Object.assign({}, backgroundEl.class()), backgroundEl.modifier('disabled').class(this.disabled || this.readonly)) }, h("div", { key: '0c80561dffd1ecbf2ace34f268270dbd0fdd8fe9', class: Object.assign({}, backgroundUpperEl.class()), style: {
                 width: this.cssWidth(),
-            } }, h("div", { key: 'd406cc218eb1b57271c2eadef16b0d8f78870e51', class: Object.assign({}, backgroundUpperInnerEl.class()) })), h("div", { key: '26bb161f03587f6882780769472bd380b5e2ba1c', class: Object.assign({}, backgroundLowerEl.class()), style: {
+            } }, h("div", { key: '7ae875637c76f930b34acef9c0b1063a14c11110', class: Object.assign({}, backgroundUpperInnerEl.class()) })), h("div", { key: 'd767b75c90733f309a6f2d11eadc22b4c8d8a579', class: Object.assign({}, backgroundLowerEl.class()), style: {
                 width: this.cssWidth(true),
-            } }, h("div", { key: 'c50c416febf03f75fc41c9c717157932f221459c', class: Object.assign({}, backgroundLowerInnerEl.class()) }))), h("div", { key: '2c31725d1b6ceec56736bf07b23ee784ee4d8f8f', class: Object.assign({}, inputEl.class()) }, h("div", { key: 'baa9b2ef71e3163c9a594f819cf1bebbd5e1131b', class: Object.assign(Object.assign({}, inputValueEl.class()), inputValueLeftEl.class()) }), h("input", { key: '2d03a2b790cc97e7277f1b040415f3e2b19590c7', type: "range", class: Object.assign(Object.assign({}, inputNativeEl.class()), inputNativeEl.modifier('disabled').class(this.disabled || this.readonly)), ref: inputEl => (this.nativeInput = inputEl), id: this.ariaForm.controlId || this.inputId, "aria-labelledby": this.ariaForm.labelId, "aria-describedby": this.ariaForm.messageId, "aria-disabled": ariaBooleanToString(this.disabled), "aria-invalid": this.invalid === true ? 'true' : 'false', disabled: this.disabled, readonly: this.readonly, name: this.name, required: this.required, tabIndex: this.balTabindex, step: this.step, min: this.min, max: this.max, value: this.value !== '' && this.value !== undefined ? this.value : 0, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus, onKeyPress: e => this.balKeyPress.emit(e), "data-testid": "bal-input-slider" }), h("div", { key: '83596fcfc7462ed3e2045343e11d8d66e71d652b', class: Object.assign(Object.assign({}, inputValueEl.class()), inputValueRightEl.class()) })), h("div", { key: '7e44fea845c11cd5bb6e7e80cbb83cc4dacc2126', class: Object.assign({}, stepsEl.class()), style: { display: this.hasTicks ? 'flex' : 'none' } }, this.getNumberOfSteps().map(step => (h("div", { key: step, class: Object.assign(Object.assign({}, stepsItemEl.class()), stepsItemEl.modifier('disabled').class(this.disabled || this.readonly)), "data-step-id": step }))))));
+            } }, h("div", { key: '414cc007b301fa2f2775c40d4134295797a970b9', class: Object.assign({}, backgroundLowerInnerEl.class()) }))), h("div", { key: '8e474c378f92ffe8df9d65a3063114fe3833159e', class: Object.assign({}, inputEl.class()) }, h("div", { key: '811d58e16f4a261065b3f4ad446cc802d4e32c30', class: Object.assign(Object.assign({}, inputValueEl.class()), inputValueLeftEl.class()) }), h("input", { key: 'fb5781181cbba5f4438b70429a3d53a6aabdada0', type: "range", class: Object.assign(Object.assign({}, inputNativeEl.class()), inputNativeEl.modifier('disabled').class(this.disabled || this.readonly)), ref: inputEl => (this.nativeInput = inputEl), id: this.ariaForm.controlId || this.inputId, "aria-labelledby": this.ariaForm.labelId, "aria-describedby": this.ariaForm.messageId, "aria-disabled": ariaBooleanToString(this.disabled), "aria-invalid": this.invalid === true ? 'true' : 'false', disabled: this.disabled, readonly: this.readonly, name: this.name, required: this.required, tabIndex: this.balTabindex, step: this.step, min: this.min, max: this.max, value: this.value !== '' && this.value !== undefined ? this.value : 0, onInput: this.onInput, onBlur: this.onBlur, onFocus: this.onFocus, onKeyPress: e => this.balKeyPress.emit(e), "data-testid": "bal-input-slider" }), h("div", { key: '48e05291bc6fb797d06bb0d022ac47d4b1f6fc3f', class: Object.assign(Object.assign({}, inputValueEl.class()), inputValueRightEl.class()) })), h("div", { key: '0fd9bcddf9a98ac5c8706c6e7d33d1d0161dd8ed', class: Object.assign({}, stepsEl.class()), style: { display: this.hasTicks ? 'flex' : 'none' } }, this.getNumberOfSteps().map(step => (h("div", { key: step, class: Object.assign(Object.assign({}, stepsItemEl.class()), stepsItemEl.modifier('disabled').class(this.disabled || this.readonly)), "data-step-id": step }))))));
     }
     static get is() { return "bal-input-slider"; }
     static get originalStyleUrls() {

package/dist/collection/components/bal-input-stepper/bal-input-stepper.js

@@ -160,7 +160,7 @@ export class InputStepper {
         const elText = elInner.element('text');
         const increaseLabel = i18nBalInputStepper[this.language].increase;
         const decreaseLabel = i18nBalInputStepper[this.language].decrease;
-        return (h(Host, { key: '6ad60111cc0d03d2375d5a7a490820d593b4b097', "aria-disabled": ariaBooleanToString(this.disabled), "aria-focused": this.focused ? 'true' : null, class: Object.assign({}, block.class()) }, h("div", { key: '734da03d0a55c27c8f7d7fa1fa10bbc6d270d775', class: Object.assign({}, elInner.class()) }, h("bal-button", { key: 'f80b191693808639c9abff0548e02a673064375b', a11yTitle: decreaseLabel, a11yLabel: decreaseLabel, a11yControls: this.ariaForm.controlId || this.inputId, size: "small", square: true, "data-testid": "bal-input-stepper-decrease", outlined: !this.invalid, icon: "minus", color: this.invalid ? 'danger' : 'info', disabled: this.disabled || this.readonly || this.value <= this.min, onClick: _ => this.decrease(), onBalFocus: ev => this.onFocusDecrease(ev), onBalBlur: ev => this.onBlurDecrease(ev) }), h("span", { key: 'd83ce4220e317063f70833d02d9bd8b71cfa9cf8', "data-testid": "bal-input-stepper-text", class: Object.assign(Object.assign(Object.assign({}, elText.class()), elText.modifier('invalid').class(this.invalid)), elText.modifier('disabled').class(this.disabled || this.readonly)) }, formatLocaleNumber(this.value)), h("bal-button", { key: '15bf9caae4095f6b38e3f3405c7a0a555951fa5f', a11yTitle: increaseLabel, a11yLabel: increaseLabel, a11yControls: this.ariaForm.controlId || this.inputId, size: "small", "data-testid": "bal-input-stepper-increase", square: true, outlined: !this.invalid, icon: "plus", color: this.invalid ? 'danger' : 'info', disabled: this.disabled || this.readonly || this.value >= this.max, onClick: _ => this.increase(), onBalFocus: ev => this.onFocusIncrease(ev), onBalBlur: ev => this.onBlurIncrease(ev) })), h("input", Object.assign({ key: '073cfbee7952b558bfcb15e66fb666894a85666d', class: Object.assign({}, elInput.class()), 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": ariaBooleanToString(this.disabled), "data-testid": "bal-input-stepper", type: "text", value: this.value, name: this.name, tabindex: "-1", ref: inputEl => (this.nativeInput = inputEl), readonly: this.readonly, disabled: this.disabled }, this.inheritedAttributes))));
+        return (h(Host, { key: 'b017edbea55108f2a839654ec284de97e833da65', "aria-disabled": ariaBooleanToString(this.disabled), "aria-focused": this.focused ? 'true' : null, class: Object.assign({}, block.class()) }, h("div", { key: 'd41f63eed88cd2f29901f23837978ff42cde96aa', class: Object.assign({}, elInner.class()) }, h("bal-button", { key: '7acb51cae824f1e30f3348685903b61d8dae2746', a11yTitle: decreaseLabel, a11yLabel: decreaseLabel, a11yControls: this.ariaForm.controlId || this.inputId, size: "small", square: true, "data-testid": "bal-input-stepper-decrease", outlined: !this.invalid, icon: "minus", color: this.invalid ? 'danger' : 'info', disabled: this.disabled || this.readonly || this.value <= this.min, onClick: _ => this.decrease(), onBalFocus: ev => this.onFocusDecrease(ev), onBalBlur: ev => this.onBlurDecrease(ev) }), h("span", { key: '5b14445f6049a7fc7786d780f9ec1e88e8ba73bc', "data-testid": "bal-input-stepper-text", class: Object.assign(Object.assign(Object.assign({}, elText.class()), elText.modifier('invalid').class(this.invalid)), elText.modifier('disabled').class(this.disabled || this.readonly)) }, formatLocaleNumber(this.value)), h("bal-button", { key: '286ba68697b2dafcf2d543ad545d79474adae092', a11yTitle: increaseLabel, a11yLabel: increaseLabel, a11yControls: this.ariaForm.controlId || this.inputId, size: "small", "data-testid": "bal-input-stepper-increase", square: true, outlined: !this.invalid, icon: "plus", color: this.invalid ? 'danger' : 'info', disabled: this.disabled || this.readonly || this.value >= this.max, onClick: _ => this.increase(), onBalFocus: ev => this.onFocusIncrease(ev), onBalBlur: ev => this.onBlurIncrease(ev) })), h("input", Object.assign({ key: '5dfc042c5452657a0d53ba55ca2b7bfc7d3e6d8c', class: Object.assign({}, elInput.class()), 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": ariaBooleanToString(this.disabled), "data-testid": "bal-input-stepper", type: "text", value: this.value, name: this.name, tabindex: "-1", ref: inputEl => (this.nativeInput = inputEl), readonly: this.readonly, disabled: this.disabled }, this.inheritedAttributes))));
     }
     static get is() { return "bal-input-stepper"; }
     static get originalStyleUrls() {

package/dist/collection/components/bal-label/bal-label.js

@@ -115,7 +115,7 @@ export class Label {
         const xxxLarge = this.size === 'xxx-large';
         const id = this.ariaForm.labelId || this.htmlId;
         const htmlFor = this.htmlFor || this.ariaForm.controlId;
-        return (h(Host, { key: '2620eadc609b839758da29e243657a0ea164f471', class: Object.assign({}, block.class()) }, h("label", { key: '7b49cc747b8078cb4bd8e14a3cf30f67ffb203fb', id: id, htmlFor: htmlFor, class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, block.element('native').class()), block.element('native').modifier('multiline').class(this.multiline)), block.element('native').modifier('no-wrap').class(this.noWrap)), block.element('native').modifier('disabled').class(disabled)), block.element('native').modifier('danger').class(danger)), block.element('native').modifier('success').class(success)), block.element('native').modifier('regular').class(regular)), block.element('native').modifier('small').class(small)), block.element('native').modifier('large').class(large)), block.element('native').modifier('x-large').class(xLarge)), block.element('native').modifier('xx-large').class(xxLarge)), block.element('native').modifier('xxx-large').class(xxxLarge)), block.element('native').modifier('hovered').class(this.hovered)), block.element('native').modifier('pressed').class(this.pressed)) }, h("slot", { key: '1861584b6cf9125d3fd314e6fb0f7b2a8c6de581' }), suffix)));
+        return (h(Host, { key: '84c07a4280f41852128ec5994de83c043d1858e9', class: Object.assign({}, block.class()) }, h("label", { key: 'a85d81f26e1439240ee560fda4ba736c29f23187', id: id, htmlFor: htmlFor, class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, block.element('native').class()), block.element('native').modifier('multiline').class(this.multiline)), block.element('native').modifier('no-wrap').class(this.noWrap)), block.element('native').modifier('disabled').class(disabled)), block.element('native').modifier('danger').class(danger)), block.element('native').modifier('success').class(success)), block.element('native').modifier('regular').class(regular)), block.element('native').modifier('small').class(small)), block.element('native').modifier('large').class(large)), block.element('native').modifier('x-large').class(xLarge)), block.element('native').modifier('xx-large').class(xxLarge)), block.element('native').modifier('xxx-large').class(xxxLarge)), block.element('native').modifier('hovered').class(this.hovered)), block.element('native').modifier('pressed').class(this.pressed)) }, h("slot", { key: '74757f068bbc4e5377176f29323978cdfe5ac743' }), suffix)));
     }
     static get is() { return "bal-label"; }
     static get originalStyleUrls() {

package/dist/collection/components/bal-list/bal-list-item-content/bal-list-item-content.js

@@ -1,10 +1,10 @@
 import { Host, h } from "@stencil/core";
 export class ListItemContent {
     render() {
-        return (h(Host, { key: 'ff41e3e7206f2ae2726946792976e069c1acb912', class: {
+        return (h(Host, { key: '753736cc273f562a957f83b78ddcf3c46d96c3c2', class: {
                 'bal-list__item__content': true,
                 [`bal-list__item__content--${this.contentAlignment}`]: this.contentAlignment !== undefined,
-            } }, h("slot", { key: '4b80e9bdf59313040e09f9489d01e558feefe120' })));
+            } }, h("slot", { key: 'a039d83497e2981173d0cea77227ec9eb58d8b9b' })));
     }
     static get is() { return "bal-list-item-content"; }
     static get properties() {

package/dist/collection/components/bal-list/bal-list-item-icon/bal-list-item-icon.js

@@ -7,10 +7,10 @@ export class ListItemIcon {
         this.right = false;
     }
     render() {
-        return (h(Host, { key: 'a5df37a7b24207e4fbb45f4bbdfa8003b006f4b0', class: {
+        return (h(Host, { key: 'a260b7e90eb381a23de3181688a8445eed735701', class: {
                 'bal-list__item__icon': true,
                 'bal-list__item__icon--right': this.right,
-            } }, h("slot", { key: 'b09891d8fae3028f6d72259caee78388b7deef10' })));
+            } }, h("slot", { key: '9b34490944c48da6666883e7b7d4cb0ec6097e53' })));
     }
     static get is() { return "bal-list-item-icon"; }
     static get properties() {

package/dist/collection/components/bal-list/bal-list-item-subtitle/bal-list-item-subtitle.js

@@ -1,7 +1,7 @@
 import { Host, h } from "@stencil/core";
 export class ListItemSubtitle {
     render() {
-        return (h(Host, { key: 'eff2c5e9cbae81b088de4a53b8c34e89d3420237', class: "bal-list__item__subtitle" }, h("slot", { key: 'b7aa01d80f67900658bcb9a8dcaba44c0ab65f00' })));
+        return (h(Host, { key: 'aed0f61d51b0f2822432686915a0072320ba29d7', class: "bal-list__item__subtitle" }, h("slot", { key: '14bfb0cb477c8da62cef9ff2c51a7216462eb3de' })));
     }
     static get is() { return "bal-list-item-subtitle"; }
 }

package/dist/collection/components/bal-list/bal-list-item-title/bal-list-item-title.js

@@ -7,7 +7,7 @@ export class ListItemTitle {
         this.level = 'h5';
     }
     render() {
-        return (h(Host, { key: '27a0d868c30e08a9a085af6274fed65a5dac9e6e', class: "bal-list__item__title" }, h("bal-heading", { key: '5da1989b9e7f8f8dc3745b0301f8c0f6a62dd600', level: this.level, visualLevel: this.visualLevel, space: "none" }, h("slot", { key: '52804ffe48149a90d92f2a26b4a99684f2906bdb' }))));
+        return (h(Host, { key: 'b2afc2dad242ca699ed349d5767d66f2451486e1', class: "bal-list__item__title" }, h("bal-heading", { key: '38f5855e07ff971dc31ad56a6db20936f3825c02', level: this.level, visualLevel: this.visualLevel, space: "none" }, h("slot", { key: '032e327a6ad730378710bb8cd5ebe4ae0506665e' }))));
     }
     static get is() { return "bal-list-item-title"; }
     static get properties() {

package/dist/collection/components/bal-list/bal-list.js

@@ -36,7 +36,7 @@ export class List {
         const block = BEM.block('list');
         const closestListEl = this.el.closest('.bal-list');
         const nested = closestListEl !== null && closestListEl !== this.el;
-        return (h(Host, { key: '0d645eb9443b6c5c60f5875949905a8c85df6b15', role: "list", class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier('nested').class(nested)), block.modifier('disabled').class(this.disabled)), block.modifier('border').class(this.border)), block.modifier(`size-${this.size || 'normal'}`).class()), block.modifier(`background-${this.background}`).class()) }, h("slot", { key: 'b470e521ebcff2eb376f7ed3c9cbf1fcd475a61a' })));
+        return (h(Host, { key: '0281c452d5bd2104752752af0d20b5d2202b9d79', role: "list", class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier('nested').class(nested)), block.modifier('disabled').class(this.disabled)), block.modifier('border').class(this.border)), block.modifier(`size-${this.size || 'normal'}`).class()), block.modifier(`background-${this.background}`).class()) }, h("slot", { key: 'e8a76162ebc3582e1402f0688ac9c008a811aae1' })));
     }
     static get is() { return "bal-list"; }
     static get originalStyleUrls() {

package/dist/collection/components/bal-modal/bal-modal-body/bal-modal-body.js

@@ -1,7 +1,7 @@
 import { Host, h } from "@stencil/core";
 export class ModalBody {
     render() {
-        return (h(Host, { key: '4a3cf0d4ca4d8e0fa57745fe87aa9e03c9bc4bef', class: "bal-modal__body" }, h("slot", { key: '4f42e2817d50f6633e18e548f3194387802cb251' })));
+        return (h(Host, { key: '2bef5892f7f6e90bb4c893f4c5ca5027dece343a', class: "bal-modal__body" }, h("slot", { key: '45b45f4141bd105c11f57628e6ea2ba989ef1a55' })));
     }
     static get is() { return "bal-modal-body"; }
 }

package/dist/collection/components/bal-modal/bal-modal-header/bal-modal-header.js

@@ -12,7 +12,7 @@ export class ModalHeader {
     }
     render() {
         var _a;
-        return (h(Host, { key: 'fa05e7fa9f1a04125400d4e8dc620ef41b8ee8e0', class: "bal-modal__header" }, h("div", { key: 'eff6b456ba712662d46cc8034e4e0781e9b56910', class: "bal-modal__header__title" }, h("bal-heading", { key: '68d8992f401e949c0323054389e4f8c4a2a731de', level: "h2", space: "none" }, h("slot", { key: '7abb147d4ee07d0f9e62daca6d77018bb17d7261' }))), ((_a = this.parentModal) === null || _a === void 0 ? void 0 : _a.isClosable) ? (h("bal-close", { class: "bal-modal__header__close data-test-modal-close", onClick: this.closeHandler })) : ('')));
+        return (h(Host, { key: 'b115e1393596c7d7124ce8b3015e4a2c4c56dcd4', class: "bal-modal__header" }, h("div", { key: '06407c1c1848ea62615f30aaa13966facb3e5246', class: "bal-modal__header__title" }, h("bal-heading", { key: 'c0784a83d66a5d28e028fc66f26b8ef72f5689df', level: "h2", space: "none" }, h("slot", { key: '41a254e6b622293d5ef84a65e7b0c02241bc7014' }))), ((_a = this.parentModal) === null || _a === void 0 ? void 0 : _a.isClosable) ? (h("bal-close", { class: "bal-modal__header__close data-test-modal-close", onClick: this.closeHandler })) : ('')));
     }
     static get is() { return "bal-modal-header"; }
     static get elementRef() { return "el"; }

package/dist/collection/components/bal-modal/bal-modal.js

@@ -212,17 +212,17 @@ export class Modal {
         return false;
     }
     render() {
-        return (h(Host, { key: '2f549c1b2f23df85b241d4f791db9e7b7d6c6d99', "aria-modal": "true", "aria-presented": this.presented ? 'true' : null, "data-testid": this.dataTestId, tabindex: "-1", class: Object.assign({ 'bal-modal': true, 'bal-modal--is-closable': this.isClosable, 'bal-modal--is-active': this.presented, [FOCUS_TRAP_DISABLE_CLASS]: this.focusTrap === false }, getClassMap(this.cssClass)), style: {
+        return (h(Host, { key: '21dbd50aedd60d75a2960d6701b44cf61ccc7329', "aria-modal": "true", "aria-presented": this.presented ? 'true' : null, "data-testid": this.dataTestId, tabindex: "-1", class: Object.assign({ 'bal-modal': true, 'bal-modal--is-closable': this.isClosable, 'bal-modal--is-active': this.presented, [FOCUS_TRAP_DISABLE_CLASS]: this.focusTrap === false }, getClassMap(this.cssClass)), style: {
                 '--bal-width': `${this.modalWidth}px`,
-            } }, h("div", { key: '611459787dc3ed3f9d88f2c7079644ff23afe385', class: {
+            } }, h("div", { key: '69921023055a78f365056dda59e297e985220d4a', class: {
                 'bal-modal__background': true,
                 'is-hidden': !this.hasBackdrop,
-            }, ref: div => (this.modalBackgroundElement = div) }), h("div", { key: 'c8553af2894b82528ac43390b5599478a15963b0', class: {
+            }, ref: div => (this.modalBackgroundElement = div) }), h("div", { key: '59af5c19fcfb216e36a1d2ac540f25f35be03c59', class: {
                 'bal-modal__container': true,
-            }, ref: div => (this.modalContainerElement = div) }, h("div", { key: '3b61064fb8f36d0b875768621867d0429329028b', class: {
+            }, ref: div => (this.modalContainerElement = div) }, h("div", { key: '02dd5fe3d3172f0aea3c0b3b7a3a6882ad8fb39b', class: {
                 'bal-modal__content': true,
                 [`bal-modal__content--has-spacing-${this.space}`]: true,
-            }, ref: div => (this.modalContentElement = div) }, h("slot", { key: '0ff7a01a8236ea6ef754cd38a89f3fb7337df3b8' })))));
+            }, ref: div => (this.modalContentElement = div) }, h("slot", { key: '3b5532f46d38d8b598be0540df655f4f813629fb' })))));
     }
     static get is() { return "bal-modal"; }
     static get originalStyleUrls() {

package/dist/collection/components/bal-nav/bal-nav-link/bal-nav-link.js

@@ -43,10 +43,10 @@ export class NavLink {
         if (hasLink) {
             linkAttributes = { href, target, rel };
         }
-        return (h(Host, { key: '094bc385a6c8158fe7be5ad0e4198523d51d65e8', class: Object.assign(Object.assign({}, block.class()), block.modifier(`variant-${this.variant}`).class(hasVariant)) }, h(Link, Object.assign({ key: '4220958041c73bc8041af337067c72e0744b3828', "data-testid": "bal-nav-link", class: Object.assign(Object.assign(Object.assign({}, block.element('native').class()), block.element('native').modifier(`variant-${this.variant}`).class(hasVariant)), block
+        return (h(Host, { key: 'fe011833d71cd4fc35585f27ee3cb8fe11dadfb8', class: Object.assign(Object.assign({}, block.class()), block.modifier(`variant-${this.variant}`).class(hasVariant)) }, h(Link, Object.assign({ key: 'ea4ba1bd04867399453d2e4cc2141c250862950f', "data-testid": "bal-nav-link", class: Object.assign(Object.assign(Object.assign({}, block.element('native').class()), block.element('native').modifier(`variant-${this.variant}`).class(hasVariant)), block
                 .element('native')
                 .modifier('selected')
-                .class(this.selected && (hasLink || this.clickable))) }, linkAttributes), h("slot", { key: 'b383a410acfa49f21449ccc8677a6f14b4cd70e3' }))));
+                .class(this.selected && (hasLink || this.clickable))) }, linkAttributes), h("slot", { key: '1889dedfa23b00eb2eaf3aca568e313845482875' }))));
     }
     static get is() { return "bal-nav-link"; }
     static get originalStyleUrls() {

package/dist/collection/components/bal-nav/bal-nav-link-grid/bal-nav-link-grid.js

@@ -12,7 +12,7 @@ export class NavLinkGrid {
      */
     render() {
         const block = BEM.block('nav-link-grid');
-        return (h(Host, { key: 'cf120f164d237ac949800e041f354c577ec9a4c2', class: Object.assign({}, block.class()) }, h("slot", { key: 'c8b40348d598dc98dc5d1cdbd61a5dc57736041a' })));
+        return (h(Host, { key: '7e58a9b6c677d60837d56404af5f6b03a7d96073', class: Object.assign({}, block.class()) }, h("slot", { key: '4e7abb8d92056b3f99b42ebad4c1d7752cffca4e' })));
     }
     static get is() { return "bal-nav-link-grid"; }
     static get originalStyleUrls() {

package/dist/collection/components/bal-nav/bal-nav-link-grid-col/bal-nav-link-grid-col.js

@@ -23,7 +23,7 @@ export class NavLinkGridCol {
     render() {
         const block = BEM.block('nav-link-grid-col');
         const innerEl = block.element('inner');
-        return (h(Host, { key: 'd7acb4f8e0e7d438e80b429883332e397da63372', class: Object.assign(Object.assign({}, block.class()), block.modifier('is-static').class(this.staticCol)) }, h("div", { key: '45840d28afac2acd60020bcbb2365fc5f2942d53', class: Object.assign({}, innerEl.class()) }, h("slot", { key: 'c3938c0a946e3fdd55222635b7dc5a057fcab0d6' }))));
+        return (h(Host, { key: 'b4cba3fc9a569b19d2921f0f728d8865b97ccd55', class: Object.assign(Object.assign({}, block.class()), block.modifier('is-static').class(this.staticCol)) }, h("div", { key: '36c2d569a02ea2dc1adb8ecedaab21576f61c0dc', class: Object.assign({}, innerEl.class()) }, h("slot", { key: 'c99e184492ca2665cdebad028cd3ab3e97d3249a' }))));
     }
     static get is() { return "bal-nav-link-grid-col"; }
     static get originalStyleUrls() {

package/dist/collection/components/bal-nav/bal-nav-link-group/bal-nav-link-group.js

@@ -23,7 +23,7 @@ export class NavLinkGroup {
     render() {
         const block = BEM.block('nav-link-group');
         const hasColor = this.color !== '';
-        return (h(Host, { key: '430702a9ee2d0b8e90c22a6d5a710e1ff937fa41', class: Object.assign(Object.assign({}, block.class()), block.modifier(`is-${this.color}`).class(hasColor)) }, h("slot", { key: 'cf882ef1d17029c47e2bb5cb6b7a2a68b4875492' })));
+        return (h(Host, { key: '12c1c4d22dc3827a4c186c6591b7b043f1dd378b', class: Object.assign(Object.assign({}, block.class()), block.modifier(`is-${this.color}`).class(hasColor)) }, h("slot", { key: '0c503bfaa7b2587f50936cc3d699e5a1bd9995a7' })));
     }
     static get is() { return "bal-nav-link-group"; }
     static get originalStyleUrls() {

package/dist/collection/components/bal-nav/bal-nav-menu-bar/bal-nav-menu-bar.js

@@ -36,7 +36,7 @@ export class NavMenuBar {
     render() {
         const block = BEM.block('nav-menu-bar');
         const innerBlock = block.element('inner');
-        return (h(Host, { key: 'c512c5c56732da21be09b4f425cadf3e59cd42f9', id: this.navMenuBarId, class: Object.assign(Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier(`hidden-mobile`).class(this.invisible === 'mobile')), block.modifier(`hidden-tablet`).class(this.invisible === 'tablet')), block.modifier(`position-${this.position}`).class(this.position !== 'none')) }, h("div", { key: '79c4e0d458b0a7ced671b8fe9268d10748f676f8', class: Object.assign({}, innerBlock.class()) }, h("div", { key: '565d5c9f36f2e1d835f1e918308d7b4435cf650a', class: Object.assign({}, block.element('container').class()) }, h("slot", { key: 'ab610c474c6c6a9e1b15036a298aa3b273ae4207' })))));
+        return (h(Host, { key: 'b640ec27088cbff1fefcd079a84ac42505aff646', id: this.navMenuBarId, class: Object.assign(Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier(`hidden-mobile`).class(this.invisible === 'mobile')), block.modifier(`hidden-tablet`).class(this.invisible === 'tablet')), block.modifier(`position-${this.position}`).class(this.position !== 'none')) }, h("div", { key: '390e0f6e814ebe41e163650eb3a4e92cad9cbd8e', class: Object.assign({}, innerBlock.class()) }, h("div", { key: '72c9ae70c27cfe8717358e0effcc210d76573146', class: Object.assign({}, block.element('container').class()) }, h("slot", { key: 'b195f883a809c0e65513a81bb33715da46e1bfa1' })))));
     }
     static get is() { return "bal-nav-menu-bar"; }
     static get originalStyleUrls() {

package/dist/collection/components/bal-nav/bal-nav-menu-flyout/bal-nav-menu-flyout.js

@@ -63,7 +63,7 @@ export class NavMenuFlyout {
     render() {
         const block = BEM.block('nav-menu-flyout');
         const line = block.element('line');
-        return (h(Host, { key: '5b8b721ba798c1b821379db4eb80bb99d03cbc5b', id: `${this.navId}-menu-flyout`, class: Object.assign({}, block.class()) }, h("div", { key: 'b17ee85558e1fcd48d98f1b1744f7484f105e5dc', class: Object.assign({}, line.class()) }), h("div", { key: 'b864ab407819d5169e5ac03108d15f1cd0383715', class: Object.assign({}, block.element('container').class()) }, h("slot", { key: '2e517d14555faa2f42447ea55208c3580882fa7b' }))));
+        return (h(Host, { key: '0ade6170ce034d4820781f4c990d3635bb0dfe79', id: `${this.navId}-menu-flyout`, class: Object.assign({}, block.class()) }, h("div", { key: 'a76e5c0918a3b972fee334a7d9262fae315b85c9', class: Object.assign({}, line.class()) }), h("div", { key: 'd71930bf624ee077c46cf7139f012c7116dc1dc7', class: Object.assign({}, block.element('container').class()) }, h("slot", { key: 'ff98f9f52e602ec787230b9a91a64920531e1152' }))));
     }
     static get is() { return "bal-nav-menu-flyout"; }
     static get originalStyleUrls() {

package/dist/collection/components/bal-nav/bal-nav-meta-bar/bal-nav-meta-bar.js

@@ -77,7 +77,7 @@ export class NavMetaBar {
      */
     render() {
         const block = BEM.block('nav-meta-bar');
-        return (h(Host, { key: '25684e02977f5a4d967d30008b547d8cf44e3226', id: this.navMetaBarId, class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier(`variant-${this.variant}`).class()), block.modifier(`size-${this.size}`).class()), block.modifier(`position-${this.position}`).class(this.position !== 'none')), block.modifier(`hidden-mobile`).class(this.invisible === 'mobile')), block.modifier(`hidden-tablet`).class(this.invisible === 'tablet')), block.modifier(`stay-on-top`).class(this.stayOnTopOfBackdrop)) }, h("div", { key: 'f57d830449b096a918c3c95afdc3c10bfe0aebab', class: Object.assign({}, block.element('container').class()) }, h("slot", { key: 'bff11fca547605a1f0f1993fd7ffefa4b3c500a6' }))));
+        return (h(Host, { key: '9d2cee16f0b6f542d42085aca4e263d727707849', id: this.navMetaBarId, class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier(`variant-${this.variant}`).class()), block.modifier(`size-${this.size}`).class()), block.modifier(`position-${this.position}`).class(this.position !== 'none')), block.modifier(`hidden-mobile`).class(this.invisible === 'mobile')), block.modifier(`hidden-tablet`).class(this.invisible === 'tablet')), block.modifier(`stay-on-top`).class(this.stayOnTopOfBackdrop)) }, h("div", { key: '6b581e5abc62a58085a57cdf74346290130fe807', class: Object.assign({}, block.element('container').class()) }, h("slot", { key: '75bdbcc78e502814264e1548697a987df10af720' }))));
     }
     static get is() { return "bal-nav-meta-bar"; }
     static get originalStyleUrls() {

package/dist/collection/components/bal-nav/bal-nav.js

@@ -283,7 +283,7 @@ export class Nav {
         const block = BEM.block('nav');
         const flyoutBlock = block.element('flyout');
         this.hasRenderedWithFlyoutActive = this.isFlyoutActive;
-        return (h(Host, { key: 'bd3aaf8839666e5d482640dfa9274b799036fec3', id: this.navId, class: Object.assign({}, block.class()) }, h("div", { key: '0ff02ba7e1ad39d2707e84f500768385cd8058f6', class: {
+        return (h(Host, { key: '68752269e49bc046d352536ca5ae29761bae5769', id: this.navId, class: Object.assign({}, block.class()) }, h("div", { key: 'b19421bedd6da29673adddbe3511439936cf76e1', class: {
                 'bal-nav-meta-bar-transform': true,
                 'bal-nav-meta-bar-transform-touch': this.isTouch,
             } }, this.isDesktop ? (h("bal-nav-meta-bar", { variant: "primary", size: "small", position: "sticky-top", ref: metaBarEl => (this.metaBarEl = metaBarEl) }, h("bal-stack", { space: "auto" }, this.linkItems.length > 1 ? (h("bal-tabs", { inverted: true, context: "meta", value: this.activeMetaLinkValue, "aria-label": i18nNavBars[this.language].mainNavigation, onBalChange: ev => this.onMetaBarTabChange(ev) }, this.linkItems.map(item => item.render({
@@ -326,7 +326,7 @@ export class Nav {
                     });
                 }
             } }, h("bal-nav-link", { role: "listitem", variant: "overview", href: (_c = (_b = this.activeMenuLinkItem) === null || _b === void 0 ? void 0 : _b.overviewLink) === null || _c === void 0 ? void 0 : _c.href, target: (_e = (_d = this.activeMenuLinkItem) === null || _d === void 0 ? void 0 : _d.overviewLink) === null || _e === void 0 ? void 0 : _e.target, onClick: () => { var _a; return this.linkItemClickListener((_a = this.activeMenuLinkItem) === null || _a === void 0 ? void 0 : _a.overviewLink); } }, (_g = (_f = this.activeMenuLinkItem) === null || _f === void 0 ? void 0 : _f.overviewLink) === null || _g === void 0 ? void 0 :
-            _g.label, ' ', ((_j = (_h = this.activeMenuLinkItem) === null || _h === void 0 ? void 0 : _h.overviewLink) === null || _j === void 0 ? void 0 : _j.label) ? '➞' : ''), this.renderGridLinks(this.activeMenuLinkItem))) : (''))) : (''), h("div", { key: '5d7ce9a508ca9c83120c8f288c946ff42001d41d' }, h("slot", { key: 'a05f492433abe803c255ed42ecd52faf35f42f38' }))), this.isTouch ? (h("bal-nav-meta-bar", { variant: "white", size: "normal" }, h("bal-stack", { space: "auto" }, this.renderLogo(), h("bal-stack", { space: "x-small", "fit-content": true }, this.metaButtons.map(button => button.renderAtTouchTopMetaBar()), h("bal-button", { square: true, color: this.isFlyoutActive ? 'primary' : 'light', icon: this.isFlyoutActive ? 'close' : 'menu-bars', "aria-label": this.isFlyoutActive ? i18nNavBars[this.language].close : i18nNavBars[this.language].open, onClick: ev => this.onTouchToggleFlyout(ev) }))))) : (''), this.isTouch ? (h("div", { class: Object.assign(Object.assign({}, flyoutBlock.class()), flyoutBlock.modifier('visible').class(this.isFlyoutActive)) }, h("nav", { class: Object.assign({}, flyoutBlock.element('container').class()) }, h("ul", { class: Object.assign({}, block.element('mobile-meta-list').class()) }, this.linkItems.map(item => item.renderTouch({
+            _g.label, ' ', ((_j = (_h = this.activeMenuLinkItem) === null || _h === void 0 ? void 0 : _h.overviewLink) === null || _j === void 0 ? void 0 : _j.label) ? '➞' : ''), this.renderGridLinks(this.activeMenuLinkItem))) : (''))) : (''), h("div", { key: 'a13bae3ec1ab7881bb6448bab61d2f8c34ca7141' }, h("slot", { key: 'd231a2fca50d45089ec4e1dc7467085b273a2488' }))), this.isTouch ? (h("bal-nav-meta-bar", { variant: "white", size: "normal" }, h("bal-stack", { space: "auto" }, this.renderLogo(), h("bal-stack", { space: "x-small", "fit-content": true }, this.metaButtons.map(button => button.renderAtTouchTopMetaBar()), h("bal-button", { square: true, color: this.isFlyoutActive ? 'primary' : 'light', icon: this.isFlyoutActive ? 'close' : 'menu-bars', "aria-label": this.isFlyoutActive ? i18nNavBars[this.language].close : i18nNavBars[this.language].open, onClick: ev => this.onTouchToggleFlyout(ev) }))))) : (''), this.isTouch ? (h("div", { class: Object.assign(Object.assign({}, flyoutBlock.class()), flyoutBlock.modifier('visible').class(this.isFlyoutActive)) }, h("nav", { class: Object.assign({}, flyoutBlock.element('container').class()) }, h("ul", { class: Object.assign({}, block.element('mobile-meta-list').class()) }, this.linkItems.map(item => item.renderTouch({
             activeMetaLinkValue: this.activeMetaLinkValue,
             activeMenuLinkValue: this.activeMenuLinkValue,
         })))))) : (''), this.isTouch && this.isFlyoutActive ? (h("bal-nav-meta-bar", { stayOnTopOfBackdrop: true, variant: "grey", size: "normal" }, h("bal-stack", { space: "x-small", align: "center" }, this.metaButtons.map(button => button.renderAtTouchBottomMetaBar())))) : ('')));

package/dist/collection/components/bal-navbar/bal-navbar-brand/bal-navbar-brand.js

@@ -107,7 +107,7 @@ export class NavbarBrand {
                 .modifier('small')
                 .class(this.logoSize === 'small')), src: this.logo, alt: "Logo" })) : (h("bal-logo", { animated: this.animated, color: 'white', size: this.logoSize }));
         const logoLabel = this.logoLabel ? this.logoLabel : i18nBalNavbarBrand[this.language].logoButtonLabel;
-        return (h(Host, { key: 'e2534fabd7b620bef928e4e5e224295832bc5665', class: Object.assign(Object.assign({}, navbarBrandEl.class()), navbarBrandEl.modifier(`context-${this.interface}`).class()) }, this.href ? (h("a", { "aria-label": logoLabel, title: logoLabel, href: this.href, rel: this.rel, target: this.target, onClick: (ev) => this.balNavigate.emit(ev) }, logoTemplate)) : this.logoClickable ? (h("button", { "aria-label": logoLabel, title: logoLabel, onClick: (ev) => this.balNavigate.emit(ev) }, logoTemplate)) : (logoTemplate), h("span", { key: '72f3cb42aee12c085ecbc2ecd0a7ef4adbe6e306', class: Object.assign({}, navbarBrandEl.element('title').class()) }, h("slot", { key: 'e2e58abba878ec1f05624e319a3c8965680aebac' })), h("bal-button", { key: 'd98c54c44c7739518eb62da8fa53df3291592c12', class: Object.assign(Object.assign({}, navbarBrandEl.element('burger').class()), navbarBrandEl
+        return (h(Host, { key: 'a15da2fb97dbef0b32324709d548fe38af7fa84b', class: Object.assign(Object.assign({}, navbarBrandEl.class()), navbarBrandEl.modifier(`context-${this.interface}`).class()) }, this.href ? (h("a", { "aria-label": logoLabel, title: logoLabel, href: this.href, rel: this.rel, target: this.target, onClick: (ev) => this.balNavigate.emit(ev) }, logoTemplate)) : this.logoClickable ? (h("button", { "aria-label": logoLabel, title: logoLabel, onClick: (ev) => this.balNavigate.emit(ev) }, logoTemplate)) : (logoTemplate), h("span", { key: '9c70804fe300d6f0b17bee14bb356078db7b587d', class: Object.assign({}, navbarBrandEl.element('title').class()) }, h("slot", { key: '53e5729ff4823597e8407a0f7dbacc86696d34aa' })), h("bal-button", { key: '5b0d8585d122add66365aef3f9f0a6f27e72212f', class: Object.assign(Object.assign({}, navbarBrandEl.element('burger').class()), navbarBrandEl
                 .element('burger')
                 .modifier('hidden')
                 .class(this.interface === 'simple')), color: "light", inverted: true, square: true, icon: this.isMenuActive ? 'close' : 'menu-bars', onClick: () => this.onClick() })));