@baloise/ds-core 19.8.2 → 19.8.3-nightly.20251110

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

@@ -72,7 +72,6 @@ export class Content {
         return {
             "layout": {
                 "type": "string",
-                "attribute": "layout",
                 "mutable": false,
                 "complexType": {
                     "original": "BalProps.BalContentLayout",
@@ -93,11 +92,11 @@ export class Content {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "layout",
                 "defaultValue": "'vertical'"
             },
             "align": {
                 "type": "string",
-                "attribute": "align",
                 "mutable": false,
                 "complexType": {
                     "original": "BalProps.BalContentAlignment",
@@ -118,11 +117,11 @@ export class Content {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "align",
                 "defaultValue": "'start'"
             },
             "space": {
                 "type": "string",
-                "attribute": "space",
                 "mutable": false,
                 "complexType": {
                     "original": "BalProps.BalContentSpace",
@@ -143,11 +142,11 @@ export class Content {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "space",
                 "defaultValue": "'xx-small'"
             },
             "direction": {
                 "type": "string",
-                "attribute": "direction",
                 "mutable": false,
                 "complexType": {
                     "original": "BalProps.BalStackDirection",
@@ -171,11 +170,11 @@ export class Content {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "direction",
                 "defaultValue": "''"
             },
             "alignment": {
                 "type": "string",
-                "attribute": "alignment",
                 "mutable": false,
                 "complexType": {
                     "original": "BalProps.BalStackAlignment",
@@ -199,6 +198,7 @@ export class Content {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "alignment",
                 "defaultValue": "''"
             }
         };

package/dist/collection/components/bal-content/test/bal-content.visual.play.js

@@ -0,0 +1,13 @@
+import { expect, screenshot, test } from "../../../../../../playwright/src/index";
+const TAG = 'bal-content';
+const VARIANTS = ['basic', 'alignment', 'direction', 'space'];
+const image = screenshot(TAG);
+test.beforeEach('Setup', async ({ page }) => {
+    await page.setupVisualTest(`/components/${TAG}/test/${TAG}.visual.html`);
+});
+VARIANTS.forEach(variant => {
+    test(variant, async ({ page }) => {
+        const el = page.getByTestId(variant);
+        await expect(el).toHaveScreenshot(image(`${variant}`));
+    });
+});

package/dist/collection/components/bal-data/bal-data-item/bal-data-item.js

@@ -20,7 +20,6 @@ export class DataItem {
         return {
             "disabled": {
                 "type": "boolean",
-                "attribute": "disabled",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -36,11 +35,11 @@ export class DataItem {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "disabled",
                 "defaultValue": "false"
             },
             "border": {
                 "type": "boolean",
-                "attribute": "border",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -56,6 +55,7 @@ export class DataItem {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "border",
                 "defaultValue": "false"
             }
         };

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

@@ -15,7 +15,6 @@ export class DataLabel {
         return {
             "required": {
                 "type": "boolean",
-                "attribute": "required",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -31,6 +30,7 @@ export class DataLabel {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "required",
                 "defaultValue": "false"
             }
         };

package/dist/collection/components/bal-data/bal-data-value/bal-data-value.js

@@ -1,7 +1,7 @@
-import { Host, h } from "@stencil/core";
+import { h, Host } from "@stencil/core";
 import isNil from "lodash.isnil";
-import { BEM } from "../../../utils/bem";
 import { stopEventBubbling } from "../../../utils/form-input";
+import { BEM } from "../../../utils/bem";
 export class DataValue {
     constructor() {
         /**
@@ -28,14 +28,13 @@ export class DataValue {
     render() {
         const block = BEM.block('data-value');
         const buttonEl = block.element('button');
-        return (h(Host, { key: '1407b2c714f532e06ffcba50e1c21a06d33f34fe', class: Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier('is-editable').class(this.editable)), block.modifier('is-multiline').class(this.multiline)) }, h("div", { key: '71427202ef765e83e32b631eb277b9432b80c8c3' }, h("slot", { key: '0bbe71b9ebe87bc23941aab4f9643f5d58ea31c6' })), h("bal-button", { key: '5ba17c254646c82d8e6d8d9c8e5a229326542b12', class: Object.assign({}, buttonEl.class()), "data-testid": "bal-data-value-button", square: true, outlined: true, color: "text", size: "small", icon: "edit", disabled: this.disabled, onBalBlur: _ => this.balBlur.emit(), onBalFocus: _ => this.balFocus.emit(), onBalClick: ev => this.onClickHandler(ev) })));
+        return (h(Host, { key: '9510a2a23f5823645d757dccb57f533c735b07b3', class: Object.assign(Object.assign(Object.assign({}, block.class()), block.modifier('is-editable').class(this.editable)), block.modifier('is-multiline').class(this.multiline)) }, h("div", { key: '3b09f43f14e28b62d36aa7435a213edc1ad8dbde' }, h("slot", { key: '34ac8848b363263f64e5821e66c43985930bf0a9' })), h("bal-button", { key: '1327e889226e14588eb0d62ab63b0f767fde6413', class: Object.assign({}, buttonEl.class()), "data-testid": "bal-data-value-button", square: true, outlined: true, color: "text", size: "small", icon: "edit", disabled: this.disabled, onBalBlur: _ => this.balBlur.emit(), onBalFocus: _ => this.balFocus.emit(), onBalClick: ev => this.onClickHandler(ev) })));
     }
     static get is() { return "bal-data-value"; }
     static get properties() {
         return {
             "editable": {
                 "type": "boolean",
-                "attribute": "editable",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -51,11 +50,11 @@ export class DataValue {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "editable",
                 "defaultValue": "false"
             },
             "disabled": {
                 "type": "boolean",
-                "attribute": "disabled",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -71,11 +70,11 @@ export class DataValue {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "disabled",
                 "defaultValue": "false"
             },
             "multiline": {
                 "type": "boolean",
-                "attribute": "multiline",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -91,6 +90,7 @@ export class DataValue {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "multiline",
                 "defaultValue": "false"
             }
         };

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

@@ -47,7 +47,6 @@ export class Data {
         return {
             "border": {
                 "type": "boolean",
-                "attribute": "border",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -63,11 +62,11 @@ export class Data {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "border",
                 "defaultValue": "false"
             },
             "horizontal": {
                 "type": "boolean",
-                "attribute": "horizontal",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -83,6 +82,7 @@ export class Data {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "horizontal",
                 "defaultValue": "false"
             }
         };

package/dist/collection/components/bal-data/test/bal-data.visual.play.js

@@ -0,0 +1,13 @@
+import { expect, screenshot, test } from "../../../../../../playwright/src/index";
+const TAG = 'bal-data';
+const VARIANTS = ['basic'];
+const image = screenshot(TAG);
+test.beforeEach('Setup', async ({ page }) => {
+    await page.setupVisualTest(`/components/${TAG}/test/${TAG}.visual.html`);
+});
+VARIANTS.forEach(variant => {
+    test(variant, async ({ page }) => {
+        const el = page.getByTestId(variant);
+        await expect(el).toHaveScreenshot(image(`${variant}`));
+    });
+});

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

@@ -237,7 +237,7 @@ export class DateCalendar {
         const block = BEM.block('date-calendar');
         const blockBody = block.element('body');
         const blockFoot = block.element('foot');
-        return (h(Host, { key: '5d6a297ec24ae26e80aa64800168e0f7c184e803', class: Object.assign({}, block.class()) }, h(CalendarNav, { key: 'd59886c88f34bfb9fc17cc121d6c7262c2a15485', language: this.language, monthFullNames: this.monthFullNames, month: this.month, year: this.year, isCalendarVisible: this.isCalendarVisible, isListVisible: this.isMonthListVisible || this.isYearListVisible, onClickSelectMonthAndYear: this.onClickSelectMonthAndYear, onClickPreviousMonth: this.onClickPreviousMonth, onClickNextMonth: this.onClickNextMonth }), h("div", { key: '53fe06a5f24418668d3a77a03ee6da3e48c5c019', class: Object.assign({}, blockBody.class()) }, h(CalendarGrid, { key: 'f898ac758f1dfcaa1dbd7eb7b56c3cb339971528', isVisible: this.isCalendarVisible, grid: this.calendarGrid, weekdays: this.weekdays, firstDayOfWeek: this.firstDayOfWeek, selectedDate: this.selectedDate, ref: el => (this.gridEl = el), onSelectDay: isoDate => this.onSelectDay(isoDate) }), h(CalendarList, { key: '011bf1c4f7ba1332b7b336ffffdf7ba4dd1f0062', name: "year", isVisible: this.isYearListVisible, girdHeight: girdHeight, list: this.years, ref: el => (this.yearListEl = el), onSelect: item => this.onClickYear(item.value) }), h(CalendarList, { key: '0b3c1d01fea6752b5f954083b18883e0da5a1e96', name: "month", isVisible: this.isMonthListVisible, girdHeight: girdHeight, list: this.months, onSelect: item => this.onClickMonth(item.value) })), h("div", { key: 'a4bd07270d850442b4604a75beaed04baa33c64f', class: Object.assign({}, blockFoot.class()) }, h("slot", { key: '50d760695d612864422574e13ef9cfdf352dbbcc' }))));
+        return (h(Host, { key: '34efddf3c88e5470dcefd22c5cab262873d07de8', class: Object.assign({}, block.class()) }, h(CalendarNav, { key: '9c8942a95ff9f1c8fdc8b1e153a29632145d1c2b', language: this.language, monthFullNames: this.monthFullNames, month: this.month, year: this.year, isCalendarVisible: this.isCalendarVisible, isListVisible: this.isMonthListVisible || this.isYearListVisible, onClickSelectMonthAndYear: this.onClickSelectMonthAndYear, onClickPreviousMonth: this.onClickPreviousMonth, onClickNextMonth: this.onClickNextMonth }), h("div", { key: '6a2cb7bba9c0568c1dc31d8b1c811b90c5845dce', class: Object.assign({}, blockBody.class()) }, h(CalendarGrid, { key: 'a687e1e1f80bc8ea21bdc7ad4709537829005843', isVisible: this.isCalendarVisible, grid: this.calendarGrid, weekdays: this.weekdays, firstDayOfWeek: this.firstDayOfWeek, selectedDate: this.selectedDate, ref: el => (this.gridEl = el), onSelectDay: isoDate => this.onSelectDay(isoDate) }), h(CalendarList, { key: 'cba1e282fb92f5edfa04e97eefcf9b38b57b8428', name: "year", isVisible: this.isYearListVisible, girdHeight: girdHeight, list: this.years, ref: el => (this.yearListEl = el), onSelect: item => this.onClickYear(item.value) }), h(CalendarList, { key: 'ae7cb47aaffec3d3a91d1aab96f1fbdde34b7e6f', name: "month", isVisible: this.isMonthListVisible, girdHeight: girdHeight, list: this.months, onSelect: item => this.onClickMonth(item.value) })), h("div", { key: '6e455964845a4e57abc793cb78916ed51fa0bdb3', class: Object.assign({}, blockFoot.class()) }, h("slot", { key: '277a09ef4cb10f6f051c84b1ba9f9ae79f0d3479' }))));
     }
     static get is() { return "bal-date-calendar"; }
     static get encapsulation() { return "shadow"; }
@@ -255,7 +255,6 @@ export class DateCalendar {
         return {
             "value": {
                 "type": "string",
-                "attribute": "value",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -270,11 +269,11 @@ export class DateCalendar {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "value"
             },
             "defaultDate": {
                 "type": "string",
-                "attribute": "default-date",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -289,11 +288,11 @@ export class DateCalendar {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "default-date"
             },
             "allowedDates": {
                 "type": "unknown",
-                "attribute": "allowed-dates",
                 "mutable": false,
                 "complexType": {
                     "original": "BalProps.BalDateCalendarAllowedDatesCallback | undefined",
@@ -317,7 +316,6 @@ export class DateCalendar {
             },
             "min": {
                 "type": "string",
-                "attribute": "min",
                 "mutable": true,
                 "complexType": {
                     "original": "string",
@@ -332,11 +330,11 @@ export class DateCalendar {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "min"
             },
             "max": {
                 "type": "string",
-                "attribute": "max",
                 "mutable": true,
                 "complexType": {
                     "original": "string",
@@ -351,11 +349,11 @@ export class DateCalendar {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "max"
             },
             "minYearProp": {
                 "type": "number",
-                "attribute": "min-year",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -370,11 +368,11 @@ export class DateCalendar {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "min-year"
             },
             "maxYearProp": {
                 "type": "number",
-                "attribute": "max-year",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -389,7 +387,8 @@ export class DateCalendar {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "max-year"
             }
         };
     }

package/dist/collection/components/bal-date/bal-date-calendar/components/bal-date-calendar__nav.js

@@ -7,7 +7,7 @@ export const CalendarNav = ({ language, onClickSelectMonthAndYear, monthFullName
     const nextMonthLabel = i18nBalDate[language].nextMonth;
     const previousMonthLabel = i18nBalDate[language].previousMonth;
     const selectMonthLabel = i18nBalDate[language].selectMonth;
-    return (h("div", { class: Object.assign({}, blockNav.class()) }, h("div", { class: Object.assign({}, blockNav.modifier('start').class()) }, h("button", { title: selectMonthLabel, "aria-label": selectMonthLabel, tabIndex: -1, "data-test": "change-year-month", onClick: onClickSelectMonthAndYear }, h("span", null, monthFullNames[month - 1], " ", year), h("bal-icon", { name: "caret-up", color: "primary", size: "small", turn: isCalendarVisible }))), h("div", { class: Object.assign({}, blockNav.modifier('end').class()), style: {
+    return (h("div", { class: Object.assign({}, blockNav.class()) }, h("div", { class: Object.assign({}, blockNav.modifier('start').class()) }, h("button", { title: selectMonthLabel, "aria-label": selectMonthLabel, tabIndex: -1, "data-testid": "change-year-month", onClick: onClickSelectMonthAndYear }, h("span", null, monthFullNames[month - 1], " ", year), h("bal-icon", { name: "caret-up", color: "primary", size: "small", turn: isCalendarVisible }))), h("div", { class: Object.assign({}, blockNav.modifier('end').class()), style: {
             display: isListVisible ? 'none' : 'flex',
-        } }, h("button", { title: previousMonthLabel, "aria-label": previousMonthLabel, onClick: onClickPreviousMonth, tabIndex: -1, "data-test": "previous-month" }, h("bal-icon", { name: "caret-left", color: "primary", size: "small" })), h("button", { title: nextMonthLabel, "aria-label": nextMonthLabel, onClick: onClickNextMonth, tabIndex: -1, "data-test": "next-month" }, h("bal-icon", { name: "caret-right", color: "primary", size: "small" })))));
+        } }, h("button", { title: previousMonthLabel, "aria-label": previousMonthLabel, onClick: onClickPreviousMonth, tabIndex: -1, "data-testid": "previous-month" }, h("bal-icon", { name: "caret-left", color: "primary", size: "small" })), h("button", { title: nextMonthLabel, "aria-label": nextMonthLabel, onClick: onClickNextMonth, tabIndex: -1, "data-testid": "next-month" }, h("bal-icon", { name: "caret-right", color: "primary", size: "small" })))));
 };

package/dist/collection/components/bal-date/bal-date-calendar-cell/bal-date-calendar-cell.js

@@ -33,7 +33,6 @@ export class DateCalendarCell {
         return {
             "day": {
                 "type": "number",
-                "attribute": "day",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -48,11 +47,11 @@ export class DateCalendarCell {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "day"
             },
             "month": {
                 "type": "number",
-                "attribute": "month",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -67,11 +66,11 @@ export class DateCalendarCell {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "month"
             },
             "year": {
                 "type": "number",
-                "attribute": "year",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -86,11 +85,11 @@ export class DateCalendarCell {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "year"
             },
             "isoDate": {
                 "type": "string",
-                "attribute": "iso-date",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -105,11 +104,11 @@ export class DateCalendarCell {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "iso-date"
             },
             "fullDate": {
                 "type": "string",
-                "attribute": "full-date",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -124,11 +123,11 @@ export class DateCalendarCell {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false
+                "reflect": false,
+                "attribute": "full-date"
             },
             "selected": {
                 "type": "boolean",
-                "attribute": "selected",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -144,11 +143,11 @@ export class DateCalendarCell {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "selected",
                 "defaultValue": "false"
             },
             "today": {
                 "type": "boolean",
-                "attribute": "today",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -164,11 +163,11 @@ export class DateCalendarCell {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "today",
                 "defaultValue": "false"
             },
             "disabled": {
                 "type": "boolean",
-                "attribute": "disabled",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -184,6 +183,7 @@ export class DateCalendarCell {
                 "getter": false,
                 "setter": false,
                 "reflect": false,
+                "attribute": "disabled",
                 "defaultValue": "false"
             }
         };