@baloise/ds-core 19.3.0-nightly.20250704 → 19.3.0

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

@@ -2,18 +2,8 @@ import { Host, h } from "@stencil/core";
 import { BEM } from "../../utils/bem";
 export class Notification {
     constructor() {
-        /**
-         * Defines the color of the element
-         * Color type primary is deprecated, please use info instead.
-         */
         this.color = '';
-        /**
-         * If `true` the notifications are presented in a light variant
-         */
         this.light = false;
-        /**
-         * If `true` there will be no icon provided
-         */
         this.noIcon = false;
     }
     render() {
@@ -36,7 +26,6 @@ export class Notification {
         return {
             "color": {
                 "type": "string",
-                "attribute": "color",
                 "mutable": false,
                 "complexType": {
                     "original": "BalProps.BalNotificationColor",
@@ -56,12 +45,12 @@ export class Notification {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "color",
                 "reflect": false,
                 "defaultValue": "''"
             },
             "light": {
                 "type": "boolean",
-                "attribute": "light",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -76,12 +65,12 @@ export class Notification {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "light",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "noIcon": {
                 "type": "boolean",
-                "attribute": "no-icon",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -96,6 +85,7 @@ export class Notification {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "no-icon",
                 "reflect": false,
                 "defaultValue": "false"
             }

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

@@ -20,56 +20,6 @@ export class NumberInput {
         this.lastValue = '';
         this.inputValue = this.value;
         this.initialValue = undefined;
-        this.focused = false;
-        this.language = defaultConfig.language;
-        this.region = defaultConfig.region;
-        this.ariaForm = defaultBalAriaForm;
-        this.nativeInputValue = '';
-        this.inputPattern = this.createPattern();
-        /**
-         * PUBLIC PROPERTY API
-         * ------------------------------------------------------
-         */
-        /**
-         * The name of the control, which is submitted with the form data.
-         */
-        this.name = this.inputId;
-        /**
-         * If `true` the component gets a invalid style.
-         */
-        this.invalid = false;
-        /**
-         * Defines the allowed decimal points for the `number-input`.
-         */
-        this.decimal = 0;
-        /**
-         * If `true`, the user must fill in a value before submitting a form.
-         */
-        this.required = false;
-        /**
-         * 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.
-         */
-        this.disabled = false;
-        /**
-         * If `true` the element can not mutated, meaning the user can not edit the control.
-         */
-        this.readonly = false;
-        /**
-         * If `true` the input value has 0 as default value
-         */
-        this.exactNumber = false;
-        /**
-         * Set the amount of time, in milliseconds, to wait to trigger the `balChange` event after each keystroke. This also impacts form bindings such as `ngModel` or `v-model`.
-         */
-        this.debounce = 0;
-        /**
-         * The value of the input.
-         */
-        this.value = undefined;
-        /**
-         * If `true`, in Angular reactive forms the control will not be set invalid
-         */
-        this.autoInvalidOff = false;
         /**
          * EVENT BINDING
          * ------------------------------------------------------
@@ -131,6 +81,27 @@ export class NumberInput {
                 return stopEventBubbling(ev);
             }
         };
+        this.focused = false;
+        this.language = defaultConfig.language;
+        this.region = defaultConfig.region;
+        this.ariaForm = defaultBalAriaForm;
+        this.nativeInputValue = '';
+        this.inputPattern = this.createPattern();
+        this.name = this.inputId;
+        this.invalid = false;
+        this.decimal = 0;
+        this.suffix = undefined;
+        this.pattern = undefined;
+        this.placeholder = undefined;
+        this.required = false;
+        this.disabled = false;
+        this.readonly = false;
+        this.exactNumber = false;
+        this.max = undefined;
+        this.min = undefined;
+        this.debounce = 0;
+        this.value = undefined;
+        this.autoInvalidOff = false;
     }
     createLogger(log) {
         this.log = log;
@@ -283,7 +254,6 @@ export class NumberInput {
         return {
             "name": {
                 "type": "string",
-                "attribute": "name",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -298,12 +268,12 @@ export class NumberInput {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "name",
                 "reflect": false,
                 "defaultValue": "this.inputId"
             },
             "invalid": {
                 "type": "boolean",
-                "attribute": "invalid",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -318,12 +288,12 @@ export class NumberInput {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "invalid",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "decimal": {
                 "type": "number",
-                "attribute": "decimal",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -338,12 +308,12 @@ export class NumberInput {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "decimal",
                 "reflect": false,
                 "defaultValue": "0"
             },
             "suffix": {
                 "type": "string",
-                "attribute": "suffix",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -358,11 +328,11 @@ export class NumberInput {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "suffix",
                 "reflect": false
             },
             "pattern": {
                 "type": "string",
-                "attribute": "pattern",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -377,11 +347,11 @@ export class NumberInput {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "pattern",
                 "reflect": false
             },
             "placeholder": {
                 "type": "string",
-                "attribute": "placeholder",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -396,11 +366,11 @@ export class NumberInput {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "placeholder",
                 "reflect": false
             },
             "required": {
                 "type": "boolean",
-                "attribute": "required",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -415,12 +385,12 @@ export class NumberInput {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "required",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "disabled": {
                 "type": "boolean",
-                "attribute": "disabled",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -435,12 +405,12 @@ export class NumberInput {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "disabled",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "readonly": {
                 "type": "boolean",
-                "attribute": "readonly",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -455,12 +425,12 @@ export class NumberInput {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "readonly",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "exactNumber": {
                 "type": "boolean",
-                "attribute": "exact-number",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -475,12 +445,12 @@ export class NumberInput {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "exact-number",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "max": {
                 "type": "string",
-                "attribute": "max",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -495,11 +465,11 @@ export class NumberInput {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "max",
                 "reflect": false
             },
             "min": {
                 "type": "string",
-                "attribute": "min",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -514,11 +484,11 @@ export class NumberInput {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "min",
                 "reflect": false
             },
             "debounce": {
                 "type": "number",
-                "attribute": "debounce",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -533,12 +503,12 @@ export class NumberInput {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "debounce",
                 "reflect": false,
                 "defaultValue": "0"
             },
             "value": {
                 "type": "any",
-                "attribute": "value",
                 "mutable": true,
                 "complexType": {
                     "original": "number | string",
@@ -553,12 +523,12 @@ export class NumberInput {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "value",
                 "reflect": false,
                 "defaultValue": "undefined"
             },
             "autoInvalidOff": {
                 "type": "boolean",
-                "attribute": "auto-invalid-off",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -573,6 +543,7 @@ export class NumberInput {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "auto-invalid-off",
                 "reflect": true,
                 "defaultValue": "false"
             }

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

@@ -9,44 +9,6 @@ import { Logger } from "../../utils/log";
 export class Option {
     constructor() {
         this.inputId = `bal-option-${balOptionIds++}`;
-        this.checkbox = false;
-        this.interactionState = BalElementStateListener.DefaultState;
-        /**
-         * PUBLIC PROPERTY API
-         * ------------------------------------------------------
-         */
-        /**
-         * Label will be shown in the input element when it got selected
-         */
-        this.label = '';
-        /**
-         * The value of the select option. This value will be returned by the parent `<bal-select>` element.
-         */
-        this.value = '';
-        /**
-         * If `true`, the user cannot interact with the option.
-         */
-        this.disabled = false;
-        /**
-         * If `true`, the option can present in more than one line.
-         */
-        this.multiline = false;
-        /**
-         * If `true`, the option is shown in red.
-         */
-        this.invalid = false;
-        /**
-         * If `true`, the option is selected.
-         */
-        this.selected = false;
-        /**
-         * If `true`, the option is focused.
-         */
-        this.focused = false;
-        /**
-         * If `true`, the option is hidden.
-         */
-        this.hidden = false;
         /**
          * EVENT BINDING
          * ------------------------------------------------------
@@ -67,6 +29,16 @@ export class Option {
                 }
             }
         };
+        this.checkbox = false;
+        this.interactionState = BalElementStateListener.DefaultState;
+        this.label = '';
+        this.value = '';
+        this.disabled = false;
+        this.multiline = false;
+        this.invalid = false;
+        this.selected = false;
+        this.focused = false;
+        this.hidden = false;
     }
     createLogger(log) {
         this.log = log;
@@ -141,7 +113,6 @@ export class Option {
         return {
             "label": {
                 "type": "string",
-                "attribute": "label",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -156,12 +127,12 @@ export class Option {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "label",
                 "reflect": false,
                 "defaultValue": "''"
             },
             "value": {
                 "type": "string",
-                "attribute": "value",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -176,12 +147,12 @@ export class Option {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "value",
                 "reflect": false,
                 "defaultValue": "''"
             },
             "disabled": {
                 "type": "boolean",
-                "attribute": "disabled",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -196,12 +167,12 @@ export class Option {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "disabled",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "multiline": {
                 "type": "boolean",
-                "attribute": "multiline",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -216,12 +187,12 @@ export class Option {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "multiline",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "invalid": {
                 "type": "boolean",
-                "attribute": "invalid",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -236,12 +207,12 @@ export class Option {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "invalid",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "selected": {
                 "type": "boolean",
-                "attribute": "selected",
                 "mutable": true,
                 "complexType": {
                     "original": "boolean",
@@ -256,12 +227,12 @@ export class Option {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "selected",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "focused": {
                 "type": "boolean",
-                "attribute": "focused",
                 "mutable": true,
                 "complexType": {
                     "original": "boolean",
@@ -276,12 +247,12 @@ export class Option {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "focused",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "hidden": {
                 "type": "boolean",
-                "attribute": "hidden",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -296,6 +267,7 @@ export class Option {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "hidden",
                 "reflect": false,
                 "defaultValue": "false"
             }

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

@@ -13,33 +13,12 @@ export class OptionList {
         this.inputId = `bal-option-list-${balOptionListIds++}`;
         this.inheritAttributes = {};
         this.ariaForm = defaultBalAriaForm;
-        /**
-         * PUBLIC PROPERTY API
-         * ------------------------------------------------------
-         */
-        /**
-         * If `true` the list supports multiple selections
-         */
         this.multiple = false;
-        /**
-         * If `true`, the user cannot interact with the option.
-         */
         this.disabled = false;
-        /**
-         * If `true`, the user must fill in a value before submitting a form.
-         */
         this.required = false;
-        /**
-         * Defines the focused option with his index value
-         */
         this.focusIndex = -1;
-        /**
-         * Defines the filter logic of the list
-         */
+        this.labelledby = undefined;
         this.filter = 'includes';
-        /**
-         * Defines the max height of the list element
-         */
         this.contentHeight = 262;
     }
     createLogger(log) {
@@ -453,7 +432,6 @@ export class OptionList {
         return {
             "multiple": {
                 "type": "boolean",
-                "attribute": "multiple",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -468,12 +446,12 @@ export class OptionList {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "multiple",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "disabled": {
                 "type": "boolean",
-                "attribute": "disabled",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -488,12 +466,12 @@ export class OptionList {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "disabled",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "required": {
                 "type": "boolean",
-                "attribute": "required",
                 "mutable": false,
                 "complexType": {
                     "original": "boolean",
@@ -508,12 +486,12 @@ export class OptionList {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "required",
                 "reflect": false,
                 "defaultValue": "false"
             },
             "focusIndex": {
                 "type": "number",
-                "attribute": "focus-index",
                 "mutable": true,
                 "complexType": {
                     "original": "number",
@@ -528,12 +506,12 @@ export class OptionList {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "focus-index",
                 "reflect": false,
                 "defaultValue": "-1"
             },
             "labelledby": {
                 "type": "string",
-                "attribute": "labelledby",
                 "mutable": false,
                 "complexType": {
                     "original": "string",
@@ -548,11 +526,11 @@ export class OptionList {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "labelledby",
                 "reflect": false
             },
             "filter": {
                 "type": "string",
-                "attribute": "filter",
                 "mutable": false,
                 "complexType": {
                     "original": "BalProps.BalOptionListFilter",
@@ -572,12 +550,12 @@ export class OptionList {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "filter",
                 "reflect": false,
                 "defaultValue": "'includes'"
             },
             "contentHeight": {
                 "type": "number",
-                "attribute": "content-height",
                 "mutable": false,
                 "complexType": {
                     "original": "number",
@@ -592,6 +570,7 @@ export class OptionList {
                 },
                 "getter": false,
                 "setter": false,
+                "attribute": "content-height",
                 "reflect": false,
                 "defaultValue": "262"
             }

package/dist/collection/components/bal-pagination/bal-pagination.css

@@ -1 +1 @@
-:root{--bal-pagination-small-background: var(--bal-color-grey);--bal-pagination-small-radius: var(--bal-radius-normal);--bal-pagination-tabs-background: var(--bal-color-white);--bal-pagination-tabs-shadow: var(--bal-shadow-normal);--bal-pagination-tabs-radius: var(--bal-radius-large);--bal-pagination-dot-radius: var(--bal-radius-rounded);--bal-pagination-dot-background-active: var(--bal-color-primary);--bal-pagination-dot-background-inactive: var(--bal-color-white)}.bal-pagination{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:block}.bal-pagination--is-sticky{position:sticky;z-index:var(--bal-z-index-sticky)}.bal-pagination__nav{align-items:center;display:flex;justify-content:center;text-align:center}.bal-pagination__nav--align-start{justify-content:flex-start}.bal-pagination__nav--align-end{justify-content:flex-end}.bal-pagination__nav--context-small{padding-top:1rem}.bal-pagination__nav__pagination-previous{order:1}.bal-pagination__nav__pagination-previous--context-small[disabled] button:hover{background-color:rgba(0,0,0,0);border-color:rgba(0,0,0,0)}.bal-pagination__nav__pagination-next{order:3}.bal-pagination__nav__pagination-next--context-small[disabled] button:hover{background-color:rgba(0,0,0,0);border-color:rgba(0,0,0,0)}.bal-pagination__nav__pagination-list{display:flex;justify-content:center;align-items:center;gap:4px;padding-left:8px;padding-right:8px;order:2;width:unset;text-align:center}.bal-pagination__nav__pagination-list>span{font-weight:var(--bal-font-weight-bold)}@media screen and (min-width: 769px),print{.bal-pagination__nav__pagination-list{gap:8px}}@media screen and (min-width: 1024px){.bal-pagination__nav__pagination-list{gap:8px}}.bal-pagination__nav__pagination-list--context-small{gap:8px;max-width:88px;min-width:63px;min-height:1.25rem;margin:0 20px 0 !important;background:var(--bal-pagination-small-background);border-radius:var(--bal-pagination-small-radius)}.bal-pagination__nav__pagination-list--context-tabs{flex-grow:1;padding:8px;background:var(--bal-pagination-tabs-background);box-shadow:var(--bal-pagination-tabs-shadow);border-radius:var(--bal-pagination-tabs-radius)}.bal-pagination__nav__pagination-list__dot{cursor:pointer;height:8px;width:8px;gap:30px;border-radius:var(--bal-pagination-dot-radius);display:block}.bal-pagination__nav__pagination-list__dot--active{background-color:var(--bal-pagination-dot-background-active)}.bal-pagination__nav__pagination-list__dot--inactive{background-color:var(--bal-pagination-dot-background-inactive)}.bal-pagination__nav__pagination-list--more{width:2rem}@media screen and (min-width: 769px),print{.bal-pagination__nav__pagination-list--more{width:2rem}}@media screen and (min-width: 1024px){.bal-pagination__nav__pagination-list--more{width:3rem}}.bal-pagination__nav__pagination-list--more>span{display:inline;font-family:var(--bal-text-line-height-title);font-weight:700}.bal-pagination__nav__pagination-list__tab{flex:1}.bal-pagination__nav__pagination-list.is-disabled li{pointer-events:none}
+:root{--bal-pagination-small-background: var(--bal-color-grey);--bal-pagination-small-radius: var(--bal-radius-normal);--bal-pagination-tabs-background: var(--bal-color-white);--bal-pagination-tabs-shadow: var(--bal-shadow-normal);--bal-pagination-tabs-radius: var(--bal-radius-large);--bal-pagination-dot-radius: var(--bal-radius-rounded);--bal-pagination-dot-background-active: var(--bal-color-primary);--bal-pagination-dot-background-inactive: var(--bal-color-white)}.bal-pagination{-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;display:block}.bal-pagination--is-sticky{position:sticky;z-index:var(--bal-z-index-sticky)}.bal-pagination__nav{align-items:center;display:flex;justify-content:center;text-align:center}.bal-pagination__nav--align-start{justify-content:flex-start}.bal-pagination__nav--align-end{justify-content:flex-end}.bal-pagination__nav--context-small{padding-top:1rem}.bal-pagination__nav__pagination-previous{order:1}.bal-pagination__nav__pagination-previous--context-small[disabled] button:hover{background-color:rgba(0,0,0,0);border-color:rgba(0,0,0,0)}.bal-pagination__nav__pagination-next{order:3}.bal-pagination__nav__pagination-next--context-small[disabled] button:hover{background-color:rgba(0,0,0,0);border-color:rgba(0,0,0,0)}.bal-pagination__nav__pagination-list{display:flex;justify-content:center;align-items:center;gap:4px;padding-left:8px;padding-right:8px;order:2;width:unset;text-align:center}.bal-pagination__nav__pagination-list>span{font-weight:var(--bal-font-weight-bold)}@media screen and (min-width: 769px),print{.bal-pagination__nav__pagination-list{gap:8px}}@media screen and (min-width: 1024px){.bal-pagination__nav__pagination-list{gap:8px}}.bal-pagination__nav__pagination-list--context-small{gap:8px;max-width:88px;min-width:63px;min-height:1.25rem;margin:0 20px 0 !important;background:var(--bal-pagination-small-background);border-radius:var(--bal-pagination-small-radius)}.bal-pagination__nav__pagination-list--context-tabs{flex-grow:1;padding:8px;background:var(--bal-pagination-tabs-background);box-shadow:var(--bal-pagination-tabs-shadow);border-radius:var(--bal-pagination-tabs-radius)}.bal-pagination__nav__pagination-list__dot{cursor:pointer;height:8px;width:8px;gap:30px;border-radius:var(--bal-pagination-dot-radius);display:block}.bal-pagination__nav__pagination-list__dot--active{background-color:var(--bal-pagination-dot-background-active)}.bal-pagination__nav__pagination-list__dot--inactive{background-color:var(--bal-pagination-dot-background-inactive)}.bal-pagination__nav__pagination-list--more{width:2rem}@media screen and (min-width: 769px),print{.bal-pagination__nav__pagination-list--more{width:2rem}}@media screen and (min-width: 1024px){.bal-pagination__nav__pagination-list--more{width:3rem}}.bal-pagination__nav__pagination-list__tab{flex:1}.bal-pagination__nav__pagination-list.is-disabled li{pointer-events:none}