@baloise/ds-core 17.2.1 → 17.2.2-nightly.20250109

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

@@ -10,7 +10,6 @@ import { stopEventBubbling } from "../../utils/form-input";
 import { BEM } from "../../utils/bem";
 import { Logger } from "../../utils/log";
 import { defaultBalAriaForm } from "../../utils/form";
-import { ListenTo } from "../../utils/listen";
 const isHuman = true;
 const isNotHuman = false;
 export class Select {
@@ -681,7 +680,7 @@ export class Select {
      */
     render() {
         var _a;
-        const Chip = (props) => (h("bal-tag", { key: '4b1cc586f9d9b2a7b08a01b35e60a1b1a9f595cd', size: "", closable: !this.disabled, disabled: this.disabled, invalid: this.invalid, tabindex: -1, onBalCloseClick: _ => this.removeValue(props.value), "data-testid": "bal-select-chip" }, findLabelByValue(this.options, props.value) || props.value));
+        const Chip = (props) => (h("bal-tag", { key: '79401261d2710c20cf092eb9fbb7fb9df4a8b58c', size: "", closable: !this.disabled, disabled: this.disabled, invalid: this.invalid, tabindex: -1, onBalCloseClick: _ => this.removeValue(props.value), "data-testid": "bal-select-chip" }, findLabelByValue(this.options, props.value) || props.value));
         const valuesArray = getValues(this.rawValue);
         const block = BEM.block('select');
         const nativeEl = block.element('native');
@@ -695,19 +694,19 @@ export class Select {
         const optionContentEl = optionEl.element('content');
         const optionContentCheckboxEl = optionContentEl.element('checkbox');
         const optionContentLabelEl = optionContentEl.element('label');
-        return (h(Host, { key: '0a96668b7026a0727bb790bd8a832586fac60198', role: "listbox", onClick: this.handleClick, "aria-disabled": this.disabled ? 'true' : null, "data-value": (_a = this.rawValue) === null || _a === void 0 ? void 0 : _a.map(v => findLabelByValue(this.options, v)).join(','), class: Object.assign(Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier('disabled').class(this.disabled || this.readonly)), block.modifier('inverted').class(this.inverted)), block.modifier('inverted-footer').class(this.inverted)) }, h("select", { key: '171e653ec3b49ef15466a0f6c337a61573ddc86b', class: Object.assign({}, nativeEl.class()), name: this.name, multiple: this.multiple, required: this.required, tabindex: -1, ref: el => (this.nativeSelectEl = el) }, valuesArray.map((value) => (h("option", { key: value, value: value, selected: true }, value)))), h("bal-popover", { key: '570c0f670158386819df181079f49d0d534da6c7', onBalChange: this.handlePopoverChange, ref: el => (this.popoverElement = el) }, h("div", { key: '121bf963a166d7523954b199bb776accaa84ae7a', "bal-popover-trigger": true, class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, controlEl.class()), controlEl.modifier('invalid').class(this.invalid)), controlEl.modifier('disabled').class(this.disabled || this.readonly)), controlEl.modifier('focused').class(this.isPopoverOpen)), controlEl.modifier('inverted-footer').class(this.inverted)) }, h("div", { key: '0bf2ba2f0ef23aaa222b547df175c5dfc4b3d6c6', class: Object.assign(Object.assign({}, controlSelectionsEl.class()), controlSelectionsEl
+        return (h(Host, { key: '6f73b54fd82f27f6aec3afde83fa9b6df2b2783b', role: "listbox", onClick: this.handleClick, "aria-disabled": this.disabled ? 'true' : null, "data-value": (_a = this.rawValue) === null || _a === void 0 ? void 0 : _a.map(v => findLabelByValue(this.options, v)).join(','), class: Object.assign(Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier('disabled').class(this.disabled || this.readonly)), block.modifier('inverted').class(this.inverted)), block.modifier('inverted-footer').class(this.inverted)) }, h("select", { key: 'acac08e4b77913e59024df94a888d06a9f839084', class: Object.assign({}, nativeEl.class()), name: this.name, multiple: this.multiple, required: this.required, tabindex: -1, ref: el => (this.nativeSelectEl = el) }, valuesArray.map((value) => (h("option", { key: value, value: value, selected: true }, value)))), h("bal-popover", { key: '0bb66730c86b7730411c2ccee9fa1a1903b51df5', onBalChange: this.handlePopoverChange, ref: el => (this.popoverElement = el) }, h("div", { key: '65ad688a0ea4c704e25eedf57cdde2f0b7042839', "bal-popover-trigger": true, class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, controlEl.class()), controlEl.modifier('invalid').class(this.invalid)), controlEl.modifier('disabled').class(this.disabled || this.readonly)), controlEl.modifier('focused').class(this.isPopoverOpen)), controlEl.modifier('inverted-footer').class(this.inverted)) }, h("div", { key: '5c92ecce5f080f9219838cefa496b8f86e6a5e1e', class: Object.assign(Object.assign({}, controlSelectionsEl.class()), controlSelectionsEl
                 .modifier('clickable')
                 .class(!this.isPopoverOpen && !this.disabled && !this.readonly)), onClick: this.handleInputClick, ref: el => (this.selectionEl = el) }, valuesArray
             .filter(_ => this.multiple)
-            .map((value) => (h(Chip, { value: value }))), h("input", { key: '45872c26a2889e0dd79851bc8ea6854d9f9fe33e', type: "text", class: Object.assign(Object.assign({}, controlInputEl.class()), { 'input': true, 'is-inverted': this.inverted, 'is-danger': this.invalid, 'is-disabled': this.disabled || this.readonly, 'is-clickable': !this.isPopoverOpen && !this.disabled && !this.readonly, 'data-test-select-input': true }), 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, "data-testid": "bal-select-input", autocomplete: this.autocomplete, "aria-autocomplete": this.autocomplete === 'off' ? 'none' : null, placeholder: this.inputPlaceholder, readonly: !this.typeahead || this.disabled || this.readonly, contentEditable: this.typeahead, disabled: this.disabled, maxLength: this.maxLength, tabindex: this.balTabindex, onInput: this.handleInput, onClick: this.handleInputClick, onChange: this.handleInputChange, onFocus: this.handleInputFocus, onBlur: this.handleInputBlur, onKeyPress: this.handleKeyPress, ref: el => (this.inputElement = el) })), !this.freeSolo && !this.loading ? (h("bal-icon", { class: Object.assign(Object.assign(Object.assign({}, controlIconEl.class()), controlIconEl.modifier('loading').class(this.loading)), controlIconEl.modifier('clickable').class(!this.disabled && !this.readonly)), name: !this.inverted ? 'caret-down' : 'caret-up', color: this.disabled || this.readonly
+            .map((value) => (h(Chip, { value: value }))), h("input", { key: 'f3fdeee4cd978843101e662b9654ff48c379a706', type: "text", class: Object.assign(Object.assign({}, controlInputEl.class()), { 'input': true, 'is-inverted': this.inverted, 'is-danger': this.invalid, 'is-disabled': this.disabled || this.readonly, 'is-clickable': !this.isPopoverOpen && !this.disabled && !this.readonly, 'data-test-select-input': true }), 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, "data-testid": "bal-select-input", autocomplete: this.autocomplete, "aria-autocomplete": this.autocomplete === 'off' ? 'none' : null, placeholder: this.inputPlaceholder, readonly: !this.typeahead || this.disabled || this.readonly, contentEditable: this.typeahead, disabled: this.disabled, maxLength: this.maxLength, tabindex: this.balTabindex, onInput: this.handleInput, onClick: this.handleInputClick, onChange: this.handleInputChange, onFocus: this.handleInputFocus, onBlur: this.handleInputBlur, onKeyPress: this.handleKeyPress, ref: el => (this.inputElement = el) })), !this.freeSolo && !this.loading ? (h("bal-icon", { class: Object.assign(Object.assign(Object.assign({}, controlIconEl.class()), controlIconEl.modifier('loading').class(this.loading)), controlIconEl.modifier('clickable').class(!this.disabled && !this.readonly)), name: !this.inverted ? 'caret-down' : 'caret-up', color: this.disabled || this.readonly
                 ? 'grey-light'
                 : this.inverted
                     ? 'white'
                     : this.invalid
                         ? 'danger'
-                        : 'primary', turn: this.isPopoverOpen, onClick: ev => this.handleInputClick(ev, true), size: !this.inverted ? '' : 'x-small' })) : ('')), h("bal-popover-content", { key: 'dd84e4a49c36226341c8a064988c8cf4c9b5e828', class: Object.assign({}, popoverContentEl.class()), scrollable: this.scrollable, spaceless: true, expanded: true }, this.optionArray.map((option, index) => (h("button", { key: option.value, type: "button", role: "option", id: option.id, "data-value": option.value, "data-label": option.label, class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, optionEl.class()), optionEl
+                        : 'primary', turn: this.isPopoverOpen, onClick: ev => this.handleInputClick(ev, true), size: !this.inverted ? '' : 'x-small' })) : ('')), h("bal-popover-content", { key: '858a34fd9deb5e3f681f44587d4b1092f0107386', class: Object.assign({}, popoverContentEl.class()), scrollable: this.scrollable, spaceless: true, expanded: true }, this.optionArray.map((option, index) => (h("button", { key: option.value, type: "button", role: "option", id: option.id, "data-value": option.value, "data-label": option.label, class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, optionEl.class()), optionEl
                 .modifier('selected')
-                .class(valuesArray.includes(option.value) && !(this.typeahead && !this.multiple))), optionEl.modifier('focused').class(this.focusIndex === index)), optionEl.modifier('checkbox').class(this.multiple)), optionEl.modifier('disabled').class(option.disabled === true)), "data-testid": "bal-select-option", disabled: option.disabled, tabIndex: -1, onMouseEnter: () => this.handleOptionMouseEnter(index), onClick: () => this.optionSelected(option) }, h("div", { class: Object.assign({}, optionContentEl.class()) }, h("span", { class: Object.assign({}, optionContentCheckboxEl.class()), style: { display: this.multiple ? 'flex' : 'none' } }, h("bal-checkbox", { checked: valuesArray.includes(option.value), tabindex: -1, nonSubmit: true, flat: true, onBalChange: preventDefault })), h("span", { class: Object.assign({}, optionContentLabelEl.class()), innerHTML: option.innerHTML }))))), h("div", { key: '824accbd7d97809ed3b91403a959528efaf448ce', class: Object.assign(Object.assign({}, popoverContentEmptyEl.class()), popoverContentEmptyEl
+                .class(valuesArray.includes(option.value) && !(this.typeahead && !this.multiple))), optionEl.modifier('focused').class(this.focusIndex === index)), optionEl.modifier('checkbox').class(this.multiple)), optionEl.modifier('disabled').class(option.disabled === true)), "data-testid": "bal-select-option", disabled: option.disabled, tabIndex: -1, onMouseEnter: () => this.handleOptionMouseEnter(index), onClick: () => this.optionSelected(option) }, h("div", { class: Object.assign({}, optionContentEl.class()) }, h("span", { class: Object.assign({}, optionContentCheckboxEl.class()), style: { display: this.multiple ? 'flex' : 'none' } }, h("bal-checkbox", { checked: valuesArray.includes(option.value), tabindex: -1, nonSubmit: true, flat: true, onBalChange: preventDefault })), h("span", { class: Object.assign({}, optionContentLabelEl.class()), innerHTML: option.innerHTML }))))), h("div", { key: '5df467dccba15602535dfacaae0ea7b410cf3d6d', class: Object.assign(Object.assign({}, popoverContentEmptyEl.class()), popoverContentEmptyEl
                 .modifier('hidden')
                 .class(this.noDataLabel === undefined || this.hasOptions() || !this.typeahead || this.selectionOptional)) }, this.noDataLabel)))));
     }
@@ -738,6 +737,8 @@ export class Select {
                     "tags": [],
                     "text": "The name of the control, which is submitted with the form data."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "name",
                 "reflect": false,
                 "defaultValue": "this.inputId"
@@ -756,6 +757,8 @@ export class Select {
                     "tags": [],
                     "text": "If `true` the component gets a invalid style."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "invalid",
                 "reflect": false,
                 "defaultValue": "false"
@@ -779,6 +782,8 @@ export class Select {
                     "tags": [],
                     "text": "If `true` the component gets a invalid style."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "filter",
                 "reflect": false,
                 "defaultValue": "'includes'"
@@ -797,6 +802,8 @@ export class Select {
                     "tags": [],
                     "text": "The tabindex of the control."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "bal-tabindex",
                 "reflect": false,
                 "defaultValue": "0"
@@ -815,6 +822,8 @@ export class Select {
                     "tags": [],
                     "text": "If `true` there will be no trigger icon visible, so no UX indicator for a popup"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "free-solo",
                 "reflect": false,
                 "defaultValue": "false"
@@ -833,6 +842,8 @@ export class Select {
                     "tags": [],
                     "text": "If `true` multiple option can be selected"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "multiple",
                 "reflect": false,
                 "defaultValue": "false"
@@ -851,6 +862,8 @@ export class Select {
                     "tags": [],
                     "text": "Defines the max length of the value."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "max-length",
                 "reflect": false
             },
@@ -868,6 +881,8 @@ export class Select {
                     "tags": [],
                     "text": "This label is shown if typeahead is active and all the options are filtered out."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "no-data-label",
                 "reflect": false
             },
@@ -890,6 +905,8 @@ export class Select {
                     "tags": [],
                     "text": "Indicates whether the value of the control can be automatically completed by the browser."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "autocomplete",
                 "reflect": false,
                 "defaultValue": "'off'"
@@ -908,6 +925,8 @@ export class Select {
                     "tags": [],
                     "text": "If `true` the user can search by typing into the input field."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "typeahead",
                 "reflect": false,
                 "defaultValue": "false"
@@ -926,6 +945,8 @@ export class Select {
                     "tags": [],
                     "text": "If `true` the options are a proposal and the user can also create his\nown value. Can only be used with the typeahead property."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "selection-optional",
                 "reflect": false,
                 "defaultValue": "false"
@@ -944,6 +965,8 @@ export class Select {
                     "tags": [],
                     "text": "If `true`, the element is not mutable, focusable, or even submitted with the form. The user can neither edit nor focus on the control, nor its form control descendants."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "disabled",
                 "reflect": false,
                 "defaultValue": "false"
@@ -962,6 +985,8 @@ export class Select {
                     "tags": [],
                     "text": "If `true` the element can not mutated, meaning the user can not edit the control."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "readonly",
                 "reflect": false,
                 "defaultValue": "false"
@@ -980,6 +1005,8 @@ export class Select {
                     "tags": [],
                     "text": "If `true`, the user must fill in a value before submitting a form."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "required",
                 "reflect": false,
                 "defaultValue": "false"
@@ -1001,6 +1028,8 @@ export class Select {
                         }],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "inverted",
                 "reflect": false,
                 "defaultValue": "false"
@@ -1019,6 +1048,8 @@ export class Select {
                     "tags": [],
                     "text": "The text to display when the select is empty."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "placeholder",
                 "reflect": false
             },
@@ -1036,6 +1067,8 @@ export class Select {
                     "tags": [],
                     "text": "Defines the height of the popover list."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "scrollable",
                 "reflect": false,
                 "defaultValue": "250"
@@ -1054,6 +1087,8 @@ export class Select {
                     "tags": [],
                     "text": "Defines if the select is in a loading state."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "loading",
                 "reflect": false,
                 "defaultValue": "false"
@@ -1072,6 +1107,8 @@ export class Select {
                     "tags": [],
                     "text": "If `true` the filtering is done outside the component."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "remote",
                 "reflect": false,
                 "defaultValue": "false"
@@ -1090,6 +1127,8 @@ export class Select {
                     "tags": [],
                     "text": "If `true`, in Angular reactive forms the control will not be set invalid"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "auto-invalid-off",
                 "reflect": true,
                 "defaultValue": "false"
@@ -1108,6 +1147,8 @@ export class Select {
                     "tags": [],
                     "text": "Selected option values. Could also be passed as a string, which gets transformed."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "value",
                 "reflect": false,
                 "defaultValue": "[]"
@@ -1433,6 +1474,27 @@ export class Select {
                 "methodName": "valueWatcher"
             }];
     }
+    static get listeners() {
+        return [{
+                "name": "click",
+                "method": "listenOnClick",
+                "target": "document",
+                "capture": true,
+                "passive": false
+            }, {
+                "name": "reset",
+                "method": "resetHandler",
+                "target": "document",
+                "capture": true,
+                "passive": false
+            }, {
+                "name": "keydown",
+                "method": "handleKeyDown",
+                "target": "window",
+                "capture": false,
+                "passive": false
+            }];
+    }
 }
 __decorate([
     Logger('bal-select'),
@@ -1440,22 +1502,4 @@ __decorate([
     __metadata("design:paramtypes", [Function]),
     __metadata("design:returntype", void 0)
 ], Select.prototype, "createLogger", null);
-__decorate([
-    ListenTo('click', { capture: true, target: 'document' }),
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", [UIEvent]),
-    __metadata("design:returntype", void 0)
-], Select.prototype, "listenOnClick", null);
-__decorate([
-    ListenTo('reset', { capture: true, target: 'document' }),
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", [UIEvent]),
-    __metadata("design:returntype", void 0)
-], Select.prototype, "resetHandler", null);
-__decorate([
-    ListenTo('keydown', { target: 'window' }),
-    __metadata("design:type", Function),
-    __metadata("design:paramtypes", [KeyboardEvent]),
-    __metadata("design:returntype", Promise)
-], Select.prototype, "handleKeyDown", null);
 let selectIds = 0;

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

@@ -42,11 +42,11 @@ export class Shape {
     render() {
         const block = BEM.block('shape');
         const shapes = [
-            h("g", { key: 'd5eb6f2e514c14102db76e006ac910e10a292a2e', id: "e8353d3b-35a2-4e20-9245-0eceed641ae5" }, h("g", { key: '97523387b4f6285ce5703706cfbdf91758fc2235', id: "af87362a-72b2-42cf-8efe-c9917dc1f7f6" }, h("path", { key: '1801ccf2b5a9198f83860a4d5eba5b2a20b75751', class: "st0", d: "M132,66v66H66V66H132z M132,0v66H66V0H132z M66,0v66H0V6.4C0,4.2,0,3,0.4,2.2c0.4-0.7,1-1.4,1.7-1.7\n            C3,0,4.2,0,6.4,0H66z M191.6,0c2.2,0,3.4,0,4.2,0.4c0.7,0.4,1.4,1,1.7,1.7c0.4,0.9,0.4,2,0.4,4.2V66h-66V0H191.6z M0,125.6V66h66\n            v66H6.4H0 M198,132v59.6c0,2.2,0,3.4-0.4,4.2c-0.4,0.7-1,1.4-1.7,1.7c-0.9,0.4-2,0.4-4.2,0.4H132v-66H198z" }))),
-            h("g", { key: 'b3b9f265a395632430bead0a05cd93e69007c001', id: "b949d602-8478-437e-a171-ad3f26649cb4" }, h("g", { key: '7fc20715e27f56ecf346cdf9b2cb2fbca51643f3', id: "ae3574e0-2065-4681-8937-4318b8656147" }, h("path", { key: '982cdba6eae902df4fdbc4799c28f8d8ca670429', class: "b9f37b2d-094d-4f18-b17c-7c5acf36f9a6", d: "M132,66v66H66V66ZM191.6,0c2.24,0,3.36,0,4.22.44a4,4,0,0,1,1.74,1.74c.44.86.44,2,.44,4.22V66H132V0ZM66,0V66H0V6.4C0,4.16,0,3,.44,2.18A4,4,0,0,1,2.18.44C3,0,4.16,0,6.4,0Zm0,132v66H6.4c-2.24,0-3.36,0-4.22-.44a4,4,0,0,1-1.74-1.74C0,195,0,193.84,0,191.6V132Zm66,0v66H66V132Zm66,0v59.6c0,2.24,0,3.36-.44,4.22a4,4,0,0,1-1.74,1.74c-.86.44-2,.44-4.22.44H132V132Zm0-66v66H132V66Z" }))),
-            h("g", { key: '386c20e69b6d4bb30c6f7b071059c765d337bbcf', id: "e827a936-cbcd-43b3-971a-aa8f8714fdff" }, h("g", { key: '04334c11d48ec0fa51dea5df6b6b42ce8aefcdde', id: "e540dca8-23ca-45dc-b462-df9071c1317d" }, h("path", { key: '99db2d7bafde38e77b92919ed447bb3eeb93d938', class: "st0", d: "M132,66v66H66V66H132z M132,0v66H66V0H132z M66,0v66H0V6.4C0,4.2,0,3,0.4,2.2c0.4-0.7,1-1.4,1.7-1.7\n            C3,0,4.2,0,6.4,0H66z M66,132v66H6.4c-2.2,0-3.4,0-4.2-0.4c-0.7-0.4-1.4-1-1.7-1.7C0,195,0,193.8,0,191.6V132H66z M132,132v66H66\n            v-66H132z M198,132v59.6c0,2.2,0,3.4-0.4,4.2c-0.4,0.7-1,1.4-1.7,1.7c-0.9,0.4-2,0.4-4.2,0.4H132v-66H198z M198,66v66h-66V66" }))),
+            h("g", { key: 'de1b671a72c880799b60fef1308672abe446166c', id: "e8353d3b-35a2-4e20-9245-0eceed641ae5" }, h("g", { key: 'a983eb96f493bfd2cf02719297d3bd8d2440eb05', id: "af87362a-72b2-42cf-8efe-c9917dc1f7f6" }, h("path", { key: 'b4062c1822d1081f1a3d52904a3513ba5f2c4341', class: "st0", d: "M132,66v66H66V66H132z M132,0v66H66V0H132z M66,0v66H0V6.4C0,4.2,0,3,0.4,2.2c0.4-0.7,1-1.4,1.7-1.7\n            C3,0,4.2,0,6.4,0H66z M191.6,0c2.2,0,3.4,0,4.2,0.4c0.7,0.4,1.4,1,1.7,1.7c0.4,0.9,0.4,2,0.4,4.2V66h-66V0H191.6z M0,125.6V66h66\n            v66H6.4H0 M198,132v59.6c0,2.2,0,3.4-0.4,4.2c-0.4,0.7-1,1.4-1.7,1.7c-0.9,0.4-2,0.4-4.2,0.4H132v-66H198z" }))),
+            h("g", { key: '2fe7fb095c5365dd22532bf9c4d604e3c88b1c19', id: "b949d602-8478-437e-a171-ad3f26649cb4" }, h("g", { key: '20b2c62739c1acb495e77e445250a12a9209f4b8', id: "ae3574e0-2065-4681-8937-4318b8656147" }, h("path", { key: '0c3b6854fb232675f36f965066003dfe90289ee0', class: "b9f37b2d-094d-4f18-b17c-7c5acf36f9a6", d: "M132,66v66H66V66ZM191.6,0c2.24,0,3.36,0,4.22.44a4,4,0,0,1,1.74,1.74c.44.86.44,2,.44,4.22V66H132V0ZM66,0V66H0V6.4C0,4.16,0,3,.44,2.18A4,4,0,0,1,2.18.44C3,0,4.16,0,6.4,0Zm0,132v66H6.4c-2.24,0-3.36,0-4.22-.44a4,4,0,0,1-1.74-1.74C0,195,0,193.84,0,191.6V132Zm66,0v66H66V132Zm66,0v59.6c0,2.24,0,3.36-.44,4.22a4,4,0,0,1-1.74,1.74c-.86.44-2,.44-4.22.44H132V132Zm0-66v66H132V66Z" }))),
+            h("g", { key: 'b61433ddfc2fccd997543008b16dbc1ab311367e', id: "e827a936-cbcd-43b3-971a-aa8f8714fdff" }, h("g", { key: '203e43411756d49dd668d636efd98fb1aeb27025', id: "e540dca8-23ca-45dc-b462-df9071c1317d" }, h("path", { key: 'a8ebeeddcd4503ea96f0ccfff30f6ca36825d708', class: "st0", d: "M132,66v66H66V66H132z M132,0v66H66V0H132z M66,0v66H0V6.4C0,4.2,0,3,0.4,2.2c0.4-0.7,1-1.4,1.7-1.7\n            C3,0,4.2,0,6.4,0H66z M66,132v66H6.4c-2.2,0-3.4,0-4.2-0.4c-0.7-0.4-1.4-1-1.7-1.7C0,195,0,193.8,0,191.6V132H66z M132,132v66H66\n            v-66H132z M198,132v59.6c0,2.2,0,3.4-0.4,4.2c-0.4,0.7-1,1.4-1.7,1.7c-0.9,0.4-2,0.4-4.2,0.4H132v-66H198z M198,66v66h-66V66" }))),
         ];
-        return (h(Host, { key: '93f3b67cfef8a01eac7ccd0334a4315ee0c67b25', class: Object.assign(Object.assign({}, block.class()), block.modifier(`is-rotation-${this.rotation}`).class()) }, h("svg", { key: 'b90bc3346d6000d65aeeb8a7749d8d777886e9cf', version: "1.1", x: "0px", y: "0px", viewBox: "0 0 198 198", focusable: "false", "aria-hidden": "true", fill: this.getHex() }, shapes[parseInt(this.variation) - 1])));
+        return (h(Host, { key: '9910db97943399c0d6c28eeaadd1bfd1e8ad8583', class: Object.assign(Object.assign({}, block.class()), block.modifier(`is-rotation-${this.rotation}`).class()) }, h("svg", { key: '6fc42eae2b805af1178afabc9f0b6a61133b2e2f', version: "1.1", x: "0px", y: "0px", viewBox: "0 0 198 198", focusable: "false", "aria-hidden": "true", fill: this.getHex() }, shapes[parseInt(this.variation) - 1])));
     }
     static get is() { return "bal-shape"; }
     static get originalStyleUrls() {
@@ -80,6 +80,8 @@ export class Shape {
                     "tags": [],
                     "text": "The shape variation"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "variation",
                 "reflect": false,
                 "defaultValue": "'1'"
@@ -103,6 +105,8 @@ export class Shape {
                     "tags": [],
                     "text": "The shape color"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "color",
                 "reflect": false,
                 "defaultValue": "'green'"
@@ -126,6 +130,8 @@ export class Shape {
                     "tags": [],
                     "text": "The shape rotation"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "rotation",
                 "reflect": false,
                 "defaultValue": "'0'"

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

@@ -9,7 +9,7 @@ export class Sheet {
         const container = block.element('container');
         const containerInner = container.element('inner');
         const containerModifier = this.containerSize !== '' ? `is-${this.containerSize}` : '';
-        return (h(Host, { key: '4e3a48a62cf91e0fb73147b7094f241006fdcf53', class: Object.assign({}, block.class()) }, h("div", { key: 'be36688a38f49a790ab29065e4770ba36e274509', class: Object.assign(Object.assign({}, container.class()), { container: true, [containerModifier]: true }) }, h("div", { key: 'e3b946a97a16b4b84f4c3c37088d9ca76b70463e', class: Object.assign({}, containerInner.class()) }, h("slot", { key: '3e821e1e7b313f02508abf5f3b6ddf18aec0f541' })))));
+        return (h(Host, { key: '08918a50e7643179cdfa6bd97f5e9253c82049f3', class: Object.assign({}, block.class()) }, h("div", { key: 'da9f0aebc37f624ec7b462d3f95e8823184b3cb3', class: Object.assign(Object.assign({}, container.class()), { container: true, [containerModifier]: true }) }, h("div", { key: '55d36f30f2dfb7745442cecb789a2d527bf3792f', class: Object.assign({}, containerInner.class()) }, h("slot", { key: '140ccc5765257da3c03f2c748e93cc6caf53f9ab' })))));
     }
     static get is() { return "bal-sheet"; }
     static get originalStyleUrls() {
@@ -43,6 +43,8 @@ export class Sheet {
                     "tags": [],
                     "text": "Defines content width of the stage"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "container-size",
                 "reflect": false,
                 "defaultValue": "''"

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

@@ -55,7 +55,7 @@ export class Snackbar {
         if (this.message !== undefined && this.message !== '') {
             labelAttributes.innerHTML = this.message;
         }
-        return (h(Host, { key: '025208382b976a13acddf5a3adfe83335015f346', id: this.snackbarId, class: "bal-snackbar" }, h("div", { key: 'f8f1516176a0bc0f13782dc5293da759cd6d9a3d', role: "alert", class: `bal-snackbar__inner ${this.animationClass} ${this.colorType}` }, h("div", { key: '8269a2d81217b90e9765a696824135c75bb7abd5', class: "bal-snackbar__header" }, h("span", { key: '811abcabe5fb53f70d611d89baa4c21efd101b66', class: "icon-text" }, h("span", { key: 'a32da69137a594c3f759c15c17072b0bbd512c3b', class: "icon", style: { display: this.icon ? '' : 'none' } }, h("bal-icon", { key: '4e0c29abdceb6ca9c08116ca9e441747e31e3865', name: this.icon, color: 'primary' })), h("bal-heading", { key: 'b13bb1286c21cbd33d29c35f234e855da29b5202', level: "h5", space: "none", "data-testid": "bal-snackbar-heading" }, this.subject))), h("span", Object.assign({ key: '2aafbb985aea6ea5be7730ab60745226506f9db2', class: "bal-snackbar__label", "data-testid": "bal-snackbar-label" }, labelAttributes), h("slot", { key: 'f85d16eb9ad20733633fc4d8869e8fc9836044b2' }), h("span", { key: '5fb81eb312a2106f338b34823a4e3144c47e3a94', class: "hidden" })), h("bal-close", { key: '11f42cbed4f48a8bf029b3e6bae6ecf537fd121c', class: "bal-snackbar__close", "data-testid": "bal-snackbar-close", onClick: () => this.close() }), this.action ? (h("div", { class: "bal-snackbar__footer" }, h("bal-button", { color: "info", href: this.href, target: this.target, onClick: () => this.onActionHandler(), "data-testid": "bal-snackbar-action" }, this.action))) : (''))));
+        return (h(Host, { key: '302d36cf1491bdb34cc87139c604c605b873dea8', id: this.snackbarId, class: "bal-snackbar" }, h("div", { key: '2d7d2e2c2fc3509d52d0079ba0e2dd024fafa27f', role: "alert", class: `bal-snackbar__inner ${this.animationClass} ${this.colorType}` }, h("div", { key: '80c1136fe846cc3393b36b20cd8b483ba5cdde2c', class: "bal-snackbar__header" }, h("span", { key: '43c09569ff714e596dc925532a6a23c62ad1480c', class: "icon-text" }, h("span", { key: '8d2631bfb6a6323a9b89279d428d04fa858ae222', class: "icon", style: { display: this.icon ? '' : 'none' } }, h("bal-icon", { key: 'e95d781626faf9691da3e26ea8cb02d036cd7783', name: this.icon, color: 'primary' })), h("bal-heading", { key: 'd07fa9dea7ab0008be54e971416e1df9e06043d1', level: "h5", space: "none", "data-testid": "bal-snackbar-heading" }, this.subject))), h("span", Object.assign({ key: '5596bf1d718f4609835316a9521522c8fcbd3f59', class: "bal-snackbar__label", "data-testid": "bal-snackbar-label" }, labelAttributes), h("slot", { key: 'c46f14807eaf146bde235c3bd121d401df670ed1' }), h("span", { key: '7a33a791aec0799c4650dfd1ba91c297d6e6156d', class: "hidden" })), h("bal-close", { key: 'b3565119bae15c11394786e0b0e9413f03417d88', class: "bal-snackbar__close", "data-testid": "bal-snackbar-close", onClick: () => this.close() }), this.action ? (h("div", { class: "bal-snackbar__footer" }, h("bal-button", { color: "info", href: this.href, target: this.target, onClick: () => this.onActionHandler(), "data-testid": "bal-snackbar-action" }, this.action))) : (''))));
     }
     static get is() { return "bal-snackbar"; }
     static get originalStyleUrls() {
@@ -89,6 +89,8 @@ export class Snackbar {
                     "tags": [],
                     "text": "The theme type of the snackbar."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "color",
                 "reflect": false,
                 "defaultValue": "''"
@@ -107,6 +109,8 @@ export class Snackbar {
                     "tags": [],
                     "text": "The duration of the snackbar"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "duration",
                 "reflect": false,
                 "defaultValue": "0"
@@ -125,6 +129,8 @@ export class Snackbar {
                     "tags": [],
                     "text": "The subject of the snackbar header"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "subject",
                 "reflect": false,
                 "defaultValue": "''"
@@ -143,6 +149,8 @@ export class Snackbar {
                     "tags": [],
                     "text": "The message of the snackbar as html content"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "message",
                 "reflect": false,
                 "defaultValue": "''"
@@ -161,6 +169,8 @@ export class Snackbar {
                     "tags": [],
                     "text": "The icon of the snackbar header"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "icon",
                 "reflect": false,
                 "defaultValue": "''"
@@ -179,6 +189,8 @@ export class Snackbar {
                     "tags": [],
                     "text": "Label text for the action button"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "action",
                 "reflect": false,
                 "defaultValue": "''"
@@ -200,6 +212,8 @@ export class Snackbar {
                         }],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "defaultValue": "() => void 0"
             },
             "actionHandler": {
@@ -219,6 +233,8 @@ export class Snackbar {
                         }],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "defaultValue": "() => void 0"
             },
             "href": {
@@ -235,6 +251,8 @@ export class Snackbar {
                     "tags": [],
                     "text": "Specifies the URL of the page the link goes to"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "href",
                 "reflect": false
             },
@@ -257,6 +275,8 @@ export class Snackbar {
                     "tags": [],
                     "text": "Specifies where to display the linked URL.\nOnly applies when an `href` is provided."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "target",
                 "reflect": false,
                 "defaultValue": "'_self'"

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

@@ -1,6 +1,6 @@
 import { __decorate, __metadata } from "tslib";
 import { h, Host } from "@stencil/core";
-import { rLCP } from "../../utils/helpers";
+import { rOnLoad } from "../../utils/helpers";
 import { Logger } from "../../utils/log";
 import { raf } from "../../utils/helpers";
 import { BEM } from "../../utils/bem";
@@ -53,7 +53,7 @@ export class Spinner {
                     return resolve();
                 }
                 else {
-                    rLCP(async () => {
+                    rOnLoad(async () => {
                         import(/* @vite-ignore */ './bal-spinner.animation')
                             .then(module => {
                             this.animationFunction = module.animate;
@@ -134,7 +134,7 @@ export class Spinner {
      */
     render() {
         const block = BEM.block('spinner');
-        return (h(Host, { key: '4e0c8e497d846873ca310d73be3ec92f9fe1a4d9', class: Object.assign(Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier('circle').class(this.variation === 'circle')), block.modifier('small').class(this.small)), block.modifier('animated').class(this.animated)), role: "progressbar", "aria-hidden": "true" }));
+        return (h(Host, { key: '4aaf8217ef26f408e1cab309a966cc9ec52f7044', class: Object.assign(Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier('circle').class(this.variation === 'circle')), block.modifier('small').class(this.small)), block.modifier('animated').class(this.animated)), role: "progressbar", "aria-hidden": "true" }));
     }
     static get is() { return "bal-spinner"; }
     static get originalStyleUrls() {
@@ -163,6 +163,8 @@ export class Spinner {
                     "tags": [],
                     "text": "If `true` the component can be used on dark background"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "inverted",
                 "reflect": false,
                 "defaultValue": "false"
@@ -181,6 +183,8 @@ export class Spinner {
                     "tags": [],
                     "text": "If `true` the component will not add the spinner animation svg"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "deactivated",
                 "reflect": false,
                 "defaultValue": "false"
@@ -204,6 +208,8 @@ export class Spinner {
                     "tags": [],
                     "text": "Defines the color of the spinner."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "color",
                 "reflect": false,
                 "defaultValue": "'blue'"
@@ -222,6 +228,8 @@ export class Spinner {
                     "tags": [],
                     "text": "If `true` the component is smaller"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "small",
                 "reflect": false,
                 "defaultValue": "false"
@@ -245,6 +253,8 @@ export class Spinner {
                     "tags": [],
                     "text": "Defines the look of the spinner"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "variation",
                 "reflect": false,
                 "defaultValue": "'logo'"

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

@@ -44,7 +44,7 @@ export class Stack {
         if (alignment) {
             alignValue = this.alignment.split(' ').join('-');
         }
-        return (h(Host, { key: '536a3cf3f4979288a0035ef0cdc966c4d390ff60', class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier(`use-wrap`).class(useWrap)), block.modifier(`layout-${layoutValue}`).class(layout || direction)), block.modifier(`align-${alignValue}`).class(align || alignment)), block.modifier(`space-${this.space}`).class(space)), block.modifier(`space-row-${this.spaceRow}`).class(spaceRow)), block.modifier(`space-row-${this.spaceColumn}`).class(spaceColumn)), block.modifier(`px-${this.px}`).class(px)), block.modifier(`py-${this.py}`).class(py)), block.modifier(`fit-content`).class(fitContent)) }, h("slot", { key: 'd1101bb18f49fb392e3ef7b1949f5ce5d797a204' })));
+        return (h(Host, { key: 'ae7ee9d0fde5a1324d87d8a6549a1afc10647cff', class: Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier(`use-wrap`).class(useWrap)), block.modifier(`layout-${layoutValue}`).class(layout || direction)), block.modifier(`align-${alignValue}`).class(align || alignment)), block.modifier(`space-${this.space}`).class(space)), block.modifier(`space-row-${this.spaceRow}`).class(spaceRow)), block.modifier(`space-row-${this.spaceColumn}`).class(spaceColumn)), block.modifier(`px-${this.px}`).class(px)), block.modifier(`py-${this.py}`).class(py)), block.modifier(`fit-content`).class(fitContent)) }, h("slot", { key: '364013576169de63cc540f287cd5b59e21dd7a7b' })));
     }
     static get is() { return "bal-stack"; }
     static get originalStyleUrls() {
@@ -78,6 +78,8 @@ export class Stack {
                     "tags": [],
                     "text": "Defines the position of the child elements if they\nare showed verticaly or horizontally. Default is horizontally."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "layout",
                 "reflect": false,
                 "defaultValue": "'horizontal'"
@@ -101,6 +103,8 @@ export class Stack {
                     "tags": [],
                     "text": "Defines the text positioning like center, right or\ndefault to start."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "align",
                 "reflect": false,
                 "defaultValue": "''"
@@ -124,6 +128,8 @@ export class Stack {
                     "tags": [],
                     "text": "Defines the space between the child elements. Default is normal."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "space",
                 "reflect": false,
                 "defaultValue": "'normal'"
@@ -147,6 +153,8 @@ export class Stack {
                     "tags": [],
                     "text": "Defines the space between the child elements. Default is normal."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "space-row",
                 "reflect": false
             },
@@ -169,6 +177,8 @@ export class Stack {
                     "tags": [],
                     "text": "Defines the space between the child elements. Default is normal."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "space-column",
                 "reflect": false
             },
@@ -191,6 +201,8 @@ export class Stack {
                     "tags": [],
                     "text": "Defines the horizontal padding left and right of the stack element."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "px",
                 "reflect": false,
                 "defaultValue": "''"
@@ -214,6 +226,8 @@ export class Stack {
                     "tags": [],
                     "text": "Defines the vertical padding top and bottom of the stack element."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "py",
                 "reflect": false,
                 "defaultValue": "''"
@@ -232,6 +246,8 @@ export class Stack {
                     "tags": [],
                     "text": "Defines if the child elements will wrap to the next line if there\nis not enough space left"
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "use-wrap",
                 "reflect": false,
                 "defaultValue": "false"
@@ -250,6 +266,8 @@ export class Stack {
                     "tags": [],
                     "text": "Defines the width of the stack to be exactly the with of the content."
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "fit-content",
                 "reflect": false,
                 "defaultValue": "false"
@@ -276,6 +294,8 @@ export class Stack {
                         }],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "direction",
                 "reflect": false,
                 "defaultValue": "''"
@@ -302,6 +322,8 @@ export class Stack {
                         }],
                     "text": ""
                 },
+                "getter": false,
+                "setter": false,
                 "attribute": "alignment",
                 "reflect": false,
                 "defaultValue": "''"