@designsystem-se/af 38.0.1-beta.0 → 38.0.1-beta.2

package/hydrate/index.mjs

@@ -9140,6 +9140,12 @@ var ErrorPageStatusCodes;
     ErrorPageStatusCodes["BLOCKED"] = "blocked";
 })(ErrorPageStatusCodes || (ErrorPageStatusCodes = {}));
 
+var ProgressCircleRole;
+(function (ProgressCircleRole) {
+    ProgressCircleRole["NONE"] = "none";
+    ProgressCircleRole["STATUS"] = "status";
+})(ProgressCircleRole || (ProgressCircleRole = {}));
+
 var ProgressIndicatorRole;
 (function (ProgressIndicatorRole) {
     ProgressIndicatorRole["NONE"] = "";
@@ -9767,7 +9773,7 @@ class CalendarDatepicker {
         return this.afSelectedDates;
     }
     render() {
-        return (hAsync(Host, { key: 'e6dcf21e94a0cf58081b2cc351291a9489eadcb6', tabindex: -1 }, hAsync("div", { key: '4040e430dd3c55e9ed0a0e6ed5aa69dea906e7c3', class: Object.assign({ 'digi-calendar-datepicker': true }, this.cssModifiers), id: `${this.afId}-datepicker` }, hAsync("div", { key: '823f9480cb8a77c1e3cecdc1f3982e426ab2e658', class: "digi-calendar-datepicker__input-field" }, hAsync("digi-form-input", { key: '454ca3d0a8d489826891da25bba8d9e0359c1df0', ref: (el) => (this._input = el), class: 'digi-calendar-datepicker__input-component', afLabel: this.afLabel, afLabelDescription: this.afLabelDescription, afName: this.afName, afValue: this.inputValue, afValidation: this.hasBuiltInValidationError()
+        return (hAsync(Host, { key: '6b080d933e012fe050aee0181f927c3252b0bb7e', tabindex: -1 }, hAsync("div", { key: 'ec59a7f209f7a5e06c62d4443fbca980b1030d12', class: Object.assign({ 'digi-calendar-datepicker': true }, this.cssModifiers), id: `${this.afId}-datepicker` }, hAsync("div", { key: '2bf3bd4f0a82c14c4fb04610dab19767fbba595d', class: "digi-calendar-datepicker__input-field" }, hAsync("digi-form-input", { key: 'ebde8123611c021b60104f75c2e4085e35fb4697', ref: (el) => (this._input = el), class: 'digi-calendar-datepicker__input-component', afLabel: this.afLabel, afLabelDescription: this.afLabelDescription, afName: this.afName, afValue: this.inputValue, afValidation: this.hasBuiltInValidationError()
                 ? FormInputValidation.ERROR
                 : this.afValidation, afValidationText: this.getErrorText(), afId: this.afId, afAriaDescribedby: `${this.afId}--validation-message`, afRequired: this.afRequired, afRequiredText: this.afRequiredText, onAfOnChange: (evt) => {
                 evt.stopImmediatePropagation();
@@ -9784,11 +9790,11 @@ class CalendarDatepicker {
                 e.preventDefault();
                 const focusableDateButton = this.hostElement.querySelector('.digi-calendar__date[tabindex="0"]');
                 focusableDateButton === null || focusableDateButton === void 0 ? void 0 : focusableDateButton.focus();
-            } }, hAsync("button", { key: '0ea8d3a9092c41f96a0cf24a2cdc4aa764e40bce', id: this.afId + '-button', class: "digi-calendar-datepicker__input-button", slot: "button", "aria-label": this.showCalendar
+            } }, hAsync("button", { key: '04df5ccb789271d7ba2f693b740f316301f9fae0', id: this.afId + '-button', class: "digi-calendar-datepicker__input-button", slot: "button", "aria-label": this.showCalendar
                 ? this.afCloseCalendarAriaLabel
-                : this.afOpenCalendarAriaLabel, "aria-controls": "calendar-popup", "aria-expanded": this.showCalendar ? 'true' : 'false', onClick: () => this.toggleCalendar(), type: "button" }, hAsync("digi-icon-calendar-alt", { key: '31ceefc7f2be65159840b1ba6d998a71ba0c5543', class: "digi-calendar-datepicker__button-icon", slot: "icon" })))), hAsync("div", { key: 'f8105569c6065a353300f87d1eabd88a10227081', class: "digi-calendar-datepicker__calendar", id: "calendar-popup" }, hAsync("p", { key: 'b7e3556711de8ddb43a17874dada58193341ffcc', role: "alert", class: "digi-calendar-datepicker__sr-instructions" }, this.showCalendar
+                : this.afOpenCalendarAriaLabel, "aria-controls": "calendar-popup", "aria-expanded": this.showCalendar ? 'true' : 'false', onClick: () => this.toggleCalendar(), type: "button" }, hAsync("digi-icon-calendar-alt", { key: '65b9a472f629bbaa46a64c8a304f358da76b0830', class: "digi-calendar-datepicker__button-icon", slot: "icon" })))), hAsync("div", { key: 'd0df89ce680bb2a0ca7f311b2c0ead0f72dc30b6', class: "digi-calendar-datepicker__calendar", id: "calendar-popup" }, hAsync("p", { key: '9796876e15e88b1599d772863c29fc472da24c69', role: "alert", class: "digi-calendar-datepicker__sr-instructions" }, this.showCalendar
             ? `${_t.calendar.screenReaderInstructions}${this.screenReaderUpdateTrigger ? '\u200B' : ''}`
-            : ''), hAsync("digi-calendar", { key: '55286f75c9ff74bb5f11a5098d06aac6f5120017', afActive: this.showCalendar, afShowWeekNumber: this.afShowWeekNumber, afMultipleDates: this.afMultipleDates, afYearSelect: this.afYearSelect, afSelectedDates: this.getSelectedDates, afMinDate: this.afMinDate, afMaxDate: this.afMaxDate, "aria-hidden": !this.showCalendar, afOpenCalendarTo: this.afOpenCalendarTo, onAfOnDateSelectedChange: (evt) => {
+            : ''), hAsync("digi-calendar", { key: 'bd5f34bcdbcb2276b5080c43479337c514861ba9', afActive: this.showCalendar, afShowWeekNumber: this.afShowWeekNumber, afMultipleDates: this.afMultipleDates, afYearSelect: this.afYearSelect, afSelectedDates: this.getSelectedDates, afMinDate: this.afMinDate, afMaxDate: this.afMaxDate, "aria-hidden": !this.showCalendar, afOpenCalendarTo: this.afOpenCalendarTo, onAfOnDateSelectedChange: (evt) => {
                 evt.stopImmediatePropagation();
                 this.parseCalendar(evt);
             }, onKeyDown: (e) => {
@@ -9799,7 +9805,7 @@ class CalendarDatepicker {
                     return;
                 e.preventDefault();
                 this.focusOnCalendarInput();
-            } })), this.afCloseOnSelect && !this.afMultipleDates && (hAsync("div", { key: 'f3d56c38d789cb0874ef1510e9ddd3e618255a76', class: "digi-calendar-datepicker__selected-date-alert", role: this.errorMessageIsAlert ? 'alert' : null }, this.afSelectedDates.length > 0
+            } })), this.afCloseOnSelect && !this.afMultipleDates && (hAsync("div", { key: 'fc150d20f14731e8f67f38c6042e8af4e24eae38', class: "digi-calendar-datepicker__selected-date-alert", role: this.errorMessageIsAlert ? 'alert' : null }, this.afSelectedDates.length > 0
             ? `${_t.calendar.datepicker.selectedDate}: ${this.datesToInputString(this.afSelectedDates)}`
             : '')))));
     }
@@ -14936,7 +14942,13 @@ class ChartLine {
         this._lineTypes = [null, '18, 7', '8,7', '2,6'];
         this._strokeWidth = 2.75;
         this._lineCap = 'round';
-        this._strokeGlyphs = [circle, triangle, square, wye, diamond2];
+        this._strokeGlyphs = [
+            circle,
+            triangle,
+            square,
+            wye,
+            diamond2
+        ];
         this._toggled = false;
         this._tickSize = 0;
         // Selection list from legend chips
@@ -15018,9 +15030,7 @@ class ChartLine {
                     .tickSize(-(this.dims.width - this.margin.left))
                     .tickFormat((d) => formatLocale(this.axisNumberFormat).format(this.formatStyle)(d)));
             }
-            this._yAxisHandle
-                .selectAll('line')
-                .attr('stroke', '#BDBDBD');
+            this._yAxisHandle.selectAll('line').attr('stroke', '#BDBDBD');
             this._yAxisHandle.select('.domain').attr('display', 'none');
             if (init)
                 this.leftSetAxis(init);
@@ -15099,7 +15109,7 @@ class ChartLine {
             container
                 .selectAll('.legendSvg')
                 .filter((...[, i]) => {
-                return i > (this._lineTypes.length - 1);
+                return i > this._lineTypes.length - 1;
             })
                 .append('path')
                 .attr('d', (...[, i]) => this.symbolType(i, 70))
@@ -15256,7 +15266,7 @@ class ChartLine {
                 .selectAll('.symbolGroup')
                 .data(this.reshapeData(this._chartData.data.series.filter(
             // Symbols are only needed, when we are out of line types
-            (...[, index]) => index > (this._lineTypes.length - 1))))
+            (...[, index]) => index > this._lineTypes.length - 1)))
                 .join((enter) => {
                 if (!transition) {
                     enter
@@ -16250,7 +16260,7 @@ class ChartLine {
                 .attr('class', 'linePath')
                 .attr('stroke', (d) => this.colorFunction(d))
                 .attr('stroke-linecap', this._lineCap)
-                .attr('stroke-width', (d) => (d.length > 1 ? this._strokeWidth : 4))
+                .attr('stroke-width', (d) => d.length > 1 ? this._strokeWidth : 4)
                 .attr('fill', 'none')
                 .attr('stroke-dasharray', (d, i) => d.length > 1 ? this.dashFunction(d, i) : null)
                 .attr('d', (d) => this._LineFunc(d.line));
@@ -16520,7 +16530,7 @@ class ChartLine {
             heading = `<${this.afHeadingLevel}>${this._chartData.title}</${this.afHeadingLevel}>`;
         else
             heading = `<${this.afHeadingLevel}>${this._chartData.title}</${this.afHeadingLevel}><p>${this._chartData.subTitle}</p>`;
-        return (hAsync("host", { key: 'eedf8d79973aa2d15f474e93134acbdfb9ef3d0c', ref: (el) => (this._host = el) }, hAsync("div", { key: 'd8500c2d3ca271fac9ebf5ec35c4c4da9aef0abd', class: "topWrapper", ref: (el) => (this._titleDiv = el) }, hAsync("digi-typography", { key: '5c9b87f00f5bba14becd10154e3b13cac48124b7', class: "chartTitle", innerHTML: heading }), hAsync("digi-button", { key: '859a31da8c6afc1c07474ea4914af732588cef5b', class: "buttonWrapper tableButton", "af-size": "medium", "af-variation": "function", "af-full-width": "false", onAfOnClick: this.activateTable, afAriaLabel: `Visa tabell ${this._chartData.title ? this._chartData.title.toLowerCase() : ''}` }, hAsync("digi-icon-table", { key: '3852def8d78f96314ee1a304a8b4b5d787e6f456', slot: "icon" }), "Visa tabell"), hAsync("digi-button", { key: 'b4c53c45553bce7c77d20653d52a39c431597491', style: { display: 'none' }, class: "buttonWrapper chartButton", "af-size": "medium", "af-variation": "function", "af-full-width": "false", onAfOnClick: this.reInitChart, afAriaLabel: `Visa diagram ${this._chartData.title ? this._chartData.title.toLowerCase() : ''}` }, hAsync("digi-icon-chart", { key: '8f5fabf6d507e5e664dcf9c89a73a2bfb5572645', slot: "icon" }), "Visa diagram"), hAsync("div", { key: '7678960d000f436d5b0a9dce2f4489f9b48a0fee', class: "scChartStatus", role: "status", ref: (el) => (this._status = el) })), hAsync("div", { key: '64edcbc78f51256719674dc4f9dc01af0ee7998a', class: "chartTooltip", id: this.afId }, hAsync("div", { key: '0e9d9ffed55146e7aef132df07eea7ff2f5996c0', class: "tooltipHead" }, hAsync("digi-icon-x", { key: '0463a7d4892199fb684f536a07a45132ad458c62', class: "close" }), ' '), hAsync("div", { key: 'a703ec0152cee394b60a9110dfba8090c8e2e0bb', class: "tooltipBody" })), hAsync("div", { key: '36fe4d1b5ede71ff5fd0e04be1ce33a6a5dfa7bd', class: "chart", ref: (el) => (this._chartDiv = el) }), hAsync("div", { key: '558f1c0c8d1c6921d76a2e017197914af3b4e83c', class: "legend", ref: (el) => (this._legendDiv = el) }), hAsync("div", { key: 'f003d37dd680bf77a0fda37ba976edce57a7fcfe', class: "table", ref: (el) => (this._tableDiv = el) }, ' ')));
+        return (hAsync("host", { key: 'a21c09ee91ccabf90f91d2344d301d26710f9a60', ref: (el) => (this._host = el) }, hAsync("div", { key: 'c97af6a0bbc28675a19c843a3c355b35397e5804', class: "topWrapper", ref: (el) => (this._titleDiv = el) }, hAsync("digi-typography", { key: '76085c6924fd317d4a281e93ca4623b85f0fb867', class: "chartTitle", innerHTML: heading }), hAsync("digi-button", { key: '241e30b3094e8eea86c7c24bb2a90f67ea04ef6f', class: "buttonWrapper tableButton", "af-size": "medium", "af-variation": "function", "af-full-width": "false", onAfOnClick: this.activateTable, afAriaLabel: `Visa tabell ${this._chartData.title ? this._chartData.title.toLowerCase() : ''}` }, hAsync("digi-icon-table", { key: '5cc0d03d40d076481d14d0478390b131cdaa61f7', slot: "icon" }), "Visa tabell"), hAsync("digi-button", { key: '241d3e97b9a21f556b3e46cebc63c77ce106d26c', style: { display: 'none' }, class: "buttonWrapper chartButton", "af-size": "medium", "af-variation": "function", "af-full-width": "false", onAfOnClick: this.reInitChart, afAriaLabel: `Visa diagram ${this._chartData.title ? this._chartData.title.toLowerCase() : ''}` }, hAsync("digi-icon-chart", { key: 'f0a5c78bc5e04db994559f2ce1a13c0e7285c36d', slot: "icon" }), "Visa diagram"), hAsync("div", { key: 'f7ebab0f90d1a9f9a306470c93ccaaaf0461a9a7', class: "scChartStatus", role: "status", ref: (el) => (this._status = el) })), hAsync("div", { key: '75672c02d61a14741348dc183782df71f3a4db19', class: "chartTooltip", id: this.afId }, hAsync("div", { key: 'b4e03381d825d68af2bdbf859458896c639b6559', class: "tooltipHead" }, hAsync("digi-icon-x", { key: '1301ab00ff3818e0940e69f17aa09b296c04a86c', class: "close" }), ' '), hAsync("div", { key: 'eb01d362db4495c0a3d4396ad4c71c2a952114ad', class: "tooltipBody" })), hAsync("div", { key: 'accd6776d3db14c662ff84b2e826f6cf713ff38d', class: "chart", ref: (el) => (this._chartDiv = el) }), hAsync("div", { key: '507dfba00c88d5b371fd8304053b9b7762506d25', class: "legend", ref: (el) => (this._legendDiv = el) }), hAsync("div", { key: 'cb3fc091c6a557bfd62e8f7d59863e973da0ee53', class: "table", ref: (el) => (this._tableDiv = el) }, ' ')));
     }
     get element() { return getElement(this); }
     static get watchers() { return {
@@ -20825,7 +20835,7 @@ class FormCheckbox {
         this.afOnInput.emit(e);
     }
     render() {
-        return (hAsync(Host, { key: 'd7e12f0914eb5fc16e1209e0750a73efd66fca33', tabindex: -1 }, hAsync("div", { key: 'b33d1c998d5ae378bb8696252532856b13725e9f', class: Object.assign({ 'digi-form-checkbox': true }, this.cssModifiers) }, hAsync("input", { key: '727323a21a37e0261e0a977d156973299348e624', class: "digi-form-checkbox__input", ref: (el) => {
+        return (hAsync(Host, { key: '93a52532d5ee8e2b89982b3d06509c16b3656bce', tabindex: -1 }, hAsync("div", { key: '3f2fe30e35c36080d80fdec5c57abf8e310ae14b', class: Object.assign({ 'digi-form-checkbox': true }, this.cssModifiers) }, hAsync("input", { key: 'a45c26da379bff48830f0b03ceebcf24b06c3b17', class: "digi-form-checkbox__input", ref: (el) => {
                 var _a;
                 this._input = el;
                 (_a = this === null || this === void 0 ? void 0 : this.afInputRef) === null || _a === void 0 ? void 0 : _a.call(this, el);
@@ -20833,7 +20843,7 @@ class FormCheckbox {
                 ? null
                 : `${this.afAriaDescribedby ? `${this.afAriaDescribedby} ` : ''}${this.afDescription ? `${this.afId}-description` : ''}`, "aria-labelledby": this.afAriaLabelledby, "aria-label": this.afAriaLabel, "aria-invalid": this.afValidation === FormCheckboxValidation.ERROR
                 ? 'true'
-                : 'false', required: this.afRequired, id: this.afId, name: this.afName, type: "checkbox", checked: this.afChecked, value: this.afValue, indeterminate: this.afIndeterminate, autofocus: this.afAutofocus ? this.afAutofocus : null }), hAsync("label", { key: '233961330af245e0aa18ad7dd5ac15ee904f7fee', htmlFor: this.afId, class: "digi-form-checkbox__label" }, hAsync("span", { key: '92dfa2221b06f2103bcb1790c78a9eca5f75bda0', class: "digi-form-checkbox__box" }), this.afLabel), !!this.afDescription && (hAsync("p", { key: '6de87be41c6794767c89fa239a85785e56f1d25f', id: `${this.afId}-description`, class: "digi-form-checkbox__description" }, this.afDescription)))));
+                : 'false', required: this.afRequired, id: this.afId, name: this.afName, type: "checkbox", checked: this.afChecked, value: this.afValue, indeterminate: this.afIndeterminate, autofocus: this.afAutofocus ? this.afAutofocus : null }), hAsync("label", { key: '54cd68f1c10fd023e9dd81bd0fabb2920b911c12', htmlFor: this.afId, class: "digi-form-checkbox__label" }, hAsync("span", { key: 'c7184f48868d38d04485a48f214cc3c37d862ba4', class: "digi-form-checkbox__box" }), this.afLabel), !!this.afDescription && (hAsync("p", { key: 'afc00a7de3cef740bdbf23607cd9247887752759', id: `${this.afId}-description`, class: "digi-form-checkbox__description" }, this.afDescription)))));
     }
     get hostElement() { return getElement(this); }
     static get watchers() { return {
@@ -20888,7 +20898,6 @@ class FormErrorList {
         registerInstance(this, hostRef);
         this.afOnClickLink = createEvent(this, "afOnClickLink", 7);
         this.afOnReady = createEvent(this, "afOnReady", 3);
-        this.linkItems = [];
         this.afHeading = undefined;
         this.afHeadingLevel = FormErrorListHeadingLevel.H2;
         this.afDescription = undefined;
@@ -20929,7 +20938,7 @@ class FormErrorList {
         this.afOnClickLink.emit({ id });
     }
     render() {
-        return (hAsync("div", { key: 'fc8938c08154c626d2adaabf937d9dbe2a8e5081', class: "digi-form-error-list", id: this.afId }, hAsync("digi-notification-alert", { key: '5b40a2ad599aa762aa7e99c53a800036a6a13803', ref: (el) => (this._notificationAlert = el), "af-heading": this.afHeading, "af-heading-level": this.afHeadingLevel, "af-variation": NotificationAlertVariation.DANGER }, this.afDescription && (hAsync("digi-typography", { key: 'd572fbb4b86f28bd4691cb794ea3a4d0178bb6d1', "af-variation": TypographyVariation.SMALL }, hAsync("p", { key: '021b86a736414bacad64f235b17b80d991564cf0', class: "digi-form-error-list__description" }, this.afDescription))), hAsync("slot", { key: 'acc3bc00c90958b753ae608e40383aa0cb725350' }))));
+        return (hAsync("div", { key: '59bc43d4b3dd0149647b50203cc1ae585d829006', class: "digi-form-error-list", id: this.afId }, hAsync("digi-notification-alert", { key: 'a2b034276ff7549c9c0711202020e3753da7808d', ref: (el) => (this._notificationAlert = el), "af-heading": this.afHeading, "af-heading-level": this.afHeadingLevel, "af-variation": NotificationAlertVariation.DANGER }, this.afDescription && (hAsync("digi-typography", { key: '3a61c65373b92a73694770f851c6727e27f853e7', "af-variation": TypographyVariation.SMALL }, hAsync("p", { key: 'a088b4d084f5a6db85cedcb4f469f4dff803f8f6', class: "digi-form-error-list__description" }, this.afDescription))), hAsync("slot", { key: '794c42cdece0d06945255b70a96a6992eb4dcd4c' }))));
     }
     get hostElement() { return getElement(this); }
     static get style() { return DigiFormErrorListStyle0; }
@@ -20943,7 +20952,6 @@ class FormErrorList {
             "afId": [1, "af-id"],
             "afOverrideLink": [4, "af-override-link"],
             "afEnableHeadingFocus": [4, "af-enable-heading-focus"],
-            "linkItems": [32],
             "afMSetHeadingFocus": [64]
         },
         "$listeners$": [[0, "afOnClick", "clickResponse"]],
@@ -22495,9 +22503,9 @@ class FormRadiobutton {
         this.afOnInput.emit(e);
     }
     render() {
-        return (hAsync(Host, { key: 'ec217535e0b0c596d9823eaa069a821d3dace97a', tabindex: -1 }, hAsync("div", { key: '04976fd86d7aaa1bcbfff4b95692b397fd628955', class: Object.assign({ 'digi-form-radiobutton': true }, this.cssModifiers) }, hAsync("input", { key: '5241250e0afc92eea48123accd45ed6944f51ed0', class: "digi-form-radiobutton__input", ref: (el) => (this._input = el), onInput: (e) => this.inputHandler(e), onBlur: (e) => this.blurHandler(e), onChange: (e) => this.changeHandler(e), onFocus: (e) => this.focusHandler(e), onFocusout: (e) => this.focusoutHandler(e), "aria-describedby": this.afAriaDescribedby, "aria-labelledby": this.afAriaLabelledby, "aria-invalid": this.afValidation === FormRadiobuttonValidation.ERROR
+        return (hAsync(Host, { key: 'fe6fc75d677f52442809001913f012b8aaa7817b', tabindex: -1 }, hAsync("div", { key: '87aa662ea170803ea002653f26e03b13c3cbaba4', class: Object.assign({ 'digi-form-radiobutton': true }, this.cssModifiers) }, hAsync("input", { key: '0e138b5b12f6ccd152980395a7ccfad705a0e497', class: "digi-form-radiobutton__input", ref: (el) => (this._input = el), onInput: (e) => this.inputHandler(e), onBlur: (e) => this.blurHandler(e), onChange: (e) => this.changeHandler(e), onFocus: (e) => this.focusHandler(e), onFocusout: (e) => this.focusoutHandler(e), "aria-describedby": this.afAriaDescribedby, "aria-labelledby": this.afAriaLabelledby, "aria-invalid": this.afValidation === FormRadiobuttonValidation.ERROR
                 ? 'true'
-                : 'false', required: this.afRequired, id: this.afId, name: this.afName, type: "radio", checked: this.afChecked, value: this.afValue, autofocus: this.afAutofocus ? this.afAutofocus : null }), hAsync("label", { key: '9a0c06e2e514422bdbbc39df05996c9e445dc093', htmlFor: this.afId, class: "digi-form-radiobutton__label" }, hAsync("span", { key: '1e5ef984c274330cc155d8f9a41e32c861c63d14', class: "digi-form-radiobutton__circle" }), this.afLabel))));
+                : 'false', required: this.afRequired, id: this.afId, name: this.afName, type: "radio", checked: this.afChecked, value: this.afValue, autofocus: this.afAutofocus ? this.afAutofocus : null }), hAsync("label", { key: '14e1da2bd43b84f94497b9529f619a172ba1c0d3', htmlFor: this.afId, class: "digi-form-radiobutton__label" }, hAsync("span", { key: '22ed147d6d453f200abfc5f24752e58111b51595', class: "digi-form-radiobutton__circle" }), this.afLabel))));
     }
     get hostElement() { return getElement(this); }
     static get watchers() { return {
@@ -32615,14 +32623,14 @@ class NavigationTablist {
             cancelAnimationFrame(this._requestAnimationFrame);
     }
     render() {
-        return (hAsync(Host, { key: '44ece2561106040d1fb23f2c24f151c50e7b5432' }, hAsync("div", { key: 'd54cb37e18990fb7706c7e1c3d94f8dfd3b0cee4', class: {
+        return (hAsync(Host, { key: '8bdab05cd034b9940aefcb9f38b16d09b6f0b0c7' }, hAsync("div", { key: '2d2266a9600dcc5817130ed4ece38868779e0b69', class: {
                 'digi-tablist': true,
                 'digi-tablist--overflow-scroll': this.afOverflowMode === OverflowMode.Scroll,
                 'digi-tablist--overflow-controls': this.afOverflowMode === OverflowMode.Controls
-            } }, hAsync("div", { key: 'b8b9665c28711cda30f0568af15c900b948cd212', class: "control-wrapper", style: {
+            } }, hAsync("div", { key: 'a96cd5d9a2eec5b2b52f0d1a00b2810c28e8d4bd', class: "control-wrapper", style: {
                 left: '0',
                 visibility: this.showPrev ? 'visible' : 'hidden'
-            } }, hAsync("button", { key: '8d0e59a36c098a8571f0ea7f64a06d7429935885', tabIndex: -1, type: "button", "aria-hidden": "true", class: { 'tab-control-button': true }, onClick: () => this.handleTabControl(Direction.Previous) }, hAsync("digi-icon-chevron-left", { key: 'a4b2fcb053c4ad8e6cb9ee8599809dfee3a77337' }))), hAsync("div", { key: 'e6e8254781b288332138e6c6d01e1a8bcc7372fe', role: "tablist", ref: (ref) => (this.tablistRef = ref), "aria-labelledby": this.afAriaLabelledby, "aria-label": this.afAriaLabel }, this.tabs.map((tab) => {
+            } }, hAsync("button", { key: '7a9810781c300bd44aa7ce3f3f76f651b1799023', tabIndex: -1, type: "button", "aria-hidden": "true", class: { 'tab-control-button': true }, onClick: () => this.handleTabControl(Direction.Previous) }, hAsync("digi-icon-chevron-left", { key: '8f65c019aa2a60f8d10025c147ad2448d30cdf1d' }))), hAsync("div", { key: '7be08fe744f17f71fab7358d63d010f17e5c977d', role: "tablist", ref: (ref) => (this.tablistRef = ref), "aria-labelledby": this.afAriaLabelledby, "aria-label": this.afAriaLabel }, this.tabs.map((tab) => {
             const focusable = tab.id === this.tabs[this.selectedTab].id;
             const isActive = tab.id === this.tabs[this.activeTab].id;
             const Icon = `digi-icon-${tab.icon}`;
@@ -32631,10 +32639,10 @@ class NavigationTablist {
                     'digi-tab': true,
                     'is-active': isActive
                 }, id: `tab-${tab.id}`, role: "tab", type: "button", tabindex: focusable ? '0' : '-1', "aria-label": tab.ariaLabel, "aria-selected": isActive.toString(), "aria-controls": `tabpanel-${tab.id}`, onClick: () => this.handleTabChange(tab) }, hAsync("div", { class: "content-wrapper" }, hAsync("span", { class: "tablist-content" }, tab.icon && hAsync(Icon, { "aria-hidden": "true" }), hAsync("span", { class: "title", "data-text": tab.title }, tab.title), tab.badgeValue && (hAsync("digi-badge-notification", { afValue: badgeValue, "aria-hidden": "true" }))), hAsync("div", { class: "indicator" }))));
-        })), hAsync("div", { key: 'e645fd960b504e7ff561f13e062fad07be42f4c0', class: "control-wrapper", style: {
+        })), hAsync("div", { key: 'b79ea56eb945fe5c4b2e34529d8b1985018ac46c', class: "control-wrapper", style: {
                 right: '0',
                 visibility: this.showNext ? 'visible' : 'hidden'
-            } }, hAsync("button", { key: 'd5fccaac7b9cfcd7dd289429ee6f455b40a87faa', tabIndex: -1, type: "button", "aria-hidden": "true", class: { 'tab-control-button': true }, onClick: () => this.handleTabControl(Direction.Next) }, hAsync("digi-icon-chevron-right", { key: '0e2d59b5ed8a3cca1b0abb70db9c0f9b33c0f204' })))), hAsync("div", { key: '54e9be2e4ab7f61878a76e21d7d7bd3b50dc5136', ref: (ref) => (this.panelsRef = ref), role: "presentation" }, hAsync("slot", { key: '0beba6fcbf4c7f618a5b7f1e18d00b9452d74bf0' }))));
+            } }, hAsync("button", { key: '3d581fe07f9591f21fef85e700259d3b44332631', tabIndex: -1, type: "button", "aria-hidden": "true", class: { 'tab-control-button': true }, onClick: () => this.handleTabControl(Direction.Next) }, hAsync("digi-icon-chevron-right", { key: '1f3a564d4eff7851ad13901c492e663c5c43d384' })))), hAsync("div", { key: '2cd9aa7d409b36395febee9dfd26eb6e82b02f35', ref: (ref) => (this.panelsRef = ref), role: "presentation" }, hAsync("slot", { key: 'b9f82031b00032dfb1df2358546a8a35934033a0' }))));
     }
     static get watchers() { return {
         "activeTab": ["syncPanels"],
@@ -33621,12 +33629,6 @@ class Paste {
     }; }
 }
 
-var ProgressCircleRole;
-(function (ProgressCircleRole) {
-    ProgressCircleRole["NONE"] = "none";
-    ProgressCircleRole["STATUS"] = "status";
-})(ProgressCircleRole || (ProgressCircleRole = {}));
-
 const progressCircleCss = ".sc-digi-progress-circle-h{--digi--progress-circle--heading--font-weight:var(--digi--typography--heading-2--font-weight--desktop);--digi--progress-circle--heading--font-size:var(--digi--typography--heading-2--font-size--mobile);--digi--progress-circle--label--font-size:var(--digi--typography--label--font-size--desktop);--digi--progress-circle--label--margin:var(--digi--gutter--medium) 0;--digi--progress-circle--border-color:#d5d5d5;--digi--progress-circle--step--line--color:var(--digi--grayscale--700);--digi--progress-circle--step--background--active:var(--digi--color--marking--indication--primary);--digi--progress-circle--icon--width:1rem;--digi--progress-circle--icon--height:1rem;--digi--progress-circle--icon--color:var(--digi--color--icon--secondary);--digi--progress-circle--icon--warning--color:var(--digi--color--icon--validation--warning);--digi--progress-circle--icon--error--color:var(--digi--color--icon--validation--error);--digi--progress-circle--icon--error--background-color:var(--digi--color--background--interactive--validation--error);--digi--progress-circle--icon-status--width:1.75rem;--digi--progress-circle--icon-status--height:1.75rem}.sc-digi-progress-circle-h .digi-progress-circle.sc-digi-progress-circle{box-sizing:border-box}.sc-digi-progress-circle-h .digi-progress-circle__content.sc-digi-progress-circle{font-family:var(--digi--global--typography--font-family--default)}.sc-digi-progress-circle-h .digi-progress-circle__heading.sc-digi-progress-circle{font-weight:var(--digi--progress-circle--heading--font-weight);margin:0;margin-bottom:0.5rem}.sc-digi-progress-circle-h .digi-progress-circle__heading--circle.sc-digi-progress-circle{font-size:var(--digi--progress-circle--heading--font-size);margin-bottom:0.35rem}.sc-digi-progress-circle-h .digi-progress-circle__next.sc-digi-progress-circle{font-size:var(--digi--typography--body--font-size--desktop);font-style:italic;color:var(--digi--color--text--primary);margin:0}.sc-digi-progress-circle-h .digi-progress-circle__next--circle.sc-digi-progress-circle{font-size:var(--digi--typography--tag--font-size--desktop)}.sc-digi-progress-circle-h .digi-progress-circle__icon.sc-digi-progress-circle{--digi--icon--height:var(--digi--progress-circle--icon--width);--digi--icon--width:var(--digi--progress-circle--icon--height);--digi--icon--color:var(--digi--progress-circle--icon--color)}.sc-digi-progress-circle-h .digi-progress-circle__icon--warning.sc-digi-progress-circle{--digi--icon--height:var(--digi--progress-circle--icon-status--height);--digi--icon--width:var(--digi--progress-circle--icon-status--width)}.sc-digi-progress-circle-h .digi-progress-circle__icon--error.sc-digi-progress-circle{margin-top:4px;--digi--icon--height:var(--digi--progress-circle--icon-status--height);--digi--icon--width:var(--digi--progress-circle--icon-status--width);--digi--icon--color:var(--digi--progress-circle--icon--error--color)}.sc-digi-progress-circle-h .digi-progress-circle__label.sc-digi-progress-circle{font-family:var(--digi--global--typography--font-family--default);font-size:var(--digi--progress-circle--label--font-size);line-height:var(--digi--typography--body--line-height--desktop);color:var(--digi--color--text--primary);margin:var(--digi--progress-circle--label--margin)}.sc-digi-progress-circle-h .digi-progress-circle__label--steps.sc-digi-progress-circle{font-weight:600}.sc-digi-progress-circle-h .digi-progress-circle__validation-label.sc-digi-progress-circle{font-family:var(--digi--global--typography--font-family--default);font-size:var(--digi--progress-circle--label--font-size);line-height:var(--digi--typography--body--line-height--desktop);color:var(--digi--color--text--primary);padding:var(--digi--gutter--medium) var(--digi--gutter--medium);display:flex;align-items:center}.sc-digi-progress-circle-h .digi-progress-circle__validation-label.sc-digi-progress-circle span.sc-digi-progress-circle{display:inline-block;margin-left:8px}.sc-digi-progress-circle-h .digi-progress-circle__validation-label--warning.sc-digi-progress-circle{background-color:var(--digi--color--background--interactive--validation--warning)}.sc-digi-progress-circle-h .digi-progress-circle__validation-label--error.sc-digi-progress-circle{background-color:var(--digi--color--background--interactive--validation--error)}.sc-digi-progress-circle-h .digi-progress-circle__circle-wrapper.sc-digi-progress-circle{display:flex;align-items:center}.sc-digi-progress-circle-h .digi-progress-circle__circle.sc-digi-progress-circle{position:relative;display:inline-block}.sc-digi-progress-circle-h .digi-progress-circle__circle.sc-digi-progress-circle svg.sc-digi-progress-circle{transform:rotate(-90deg)}.sc-digi-progress-circle-h .digi-progress-circle__circle-label.sc-digi-progress-circle{position:absolute;top:47%;left:50%;transform:translate(-50%, -50%);font-family:var(--digi--global--typography--font-family--default);font-size:var(--digi--typography--tag--font-size--desktop);line-height:var(--digi--typography--body--line-height--desktop);color:var(--digi--color--text--primary);font-weight:600;margin:0}.sc-digi-progress-circle-h .digi-progress-circle__circle-step-unfinished.sc-digi-progress-circle{stroke:var(--digi--progress-circle--border-color)}.sc-digi-progress-circle-h .digi-progress-circle__circle-step-completed.sc-digi-progress-circle{stroke:var(--digi--progress-circle--step--background--active)}.sc-digi-progress-circle-h .digi-progress-circle__circle-step-warning.sc-digi-progress-circle{stroke:var(--digi--progress-circle--icon--warning--color)}.sc-digi-progress-circle-h .digi-progress-circle__circle-step-error.sc-digi-progress-circle{stroke:var(--digi--progress-circle--icon--error--color)}";
 var DigiProgressCircleStyle0 = progressCircleCss;
 
@@ -34507,7 +34509,7 @@ class Tag {
         return this.afText;
     }
     render() {
-        return (hAsync("digi-button", { key: '8e73c3fad4b8543e65bf9c8c5f722ae036613ad9', onAfOnClick: (e) => this.clickHandler(e), "af-variation": "secondary", "af-size": this.afSize, class: "digi-tag", "af-aria-label": this.ariaLabel }, this.afText, !this.afNoIcon && hAsync("digi-icon-x", { key: '618d56b558da3948e247248bebf998656e7410c7', slot: "icon-secondary" })));
+        return (hAsync("digi-button", { key: 'd45766b0f00a85fafdddc4f4e741f614bafb8963', onAfOnClick: (e) => this.clickHandler(e), "af-variation": "secondary", "af-size": this.afSize, class: "digi-tag", "af-aria-label": this.ariaLabel }, this.afText, !this.afNoIcon && hAsync("digi-icon-x", { key: '2e97ae41c0b848f049d20bff6ece2285fff79a2e', slot: "icon-secondary" })));
     }
     static get style() { return DigiTagStyle0; }
     static get cmpMeta() { return {
@@ -35953,7 +35955,13 @@ class barChart {
         this.defaultDuration = 400;
         // Text and formats
         this.fontSize = '0.875rem';
-        this.colorPalettes = ['--digi--color--background--brand-primary', '--digi--color--infographic--brand--primary', '--digi--color--background--sentiment--beta--primary', '--digi--color--text--interactive--visited', '--digi--color--icon--validation--error'];
+        this.colorPalettes = [
+            '--digi--color--background--brand-primary',
+            '--digi--color--infographic--brand--primary',
+            '--digi--color--background--sentiment--beta--primary',
+            '--digi--color--text--interactive--visited',
+            '--digi--color--icon--validation--error'
+        ];
         // Observer for watching size changes when in line chart mode
         this.barChartObserver = new ResizeObserver((entries) => {
             entries.forEach(() => {
@@ -35963,7 +35971,8 @@ class barChart {
             });
         });
         this.highlightBars = (serie) => {
-            this.barChartContainer.selectAll('.bar')
+            this.barChartContainer
+                .selectAll('.bar')
                 .attr('fill', (barData) => this.colorFunction(barData.serie))
                 .transition('color')
                 .duration(150)
@@ -35972,47 +35981,78 @@ class barChart {
                 if (barData.serie === serie)
                     return this.colorFunction(barData.serie);
                 else {
-                    if (((_a = this.chartData.meta) === null || _a === void 0 ? void 0 : _a.prognosisPattern) && this.series.indexOf(barData.serie) > 0) {
+                    if (((_a = this.chartData.meta) === null || _a === void 0 ? void 0 : _a.prognosisPattern) &&
+                        this.series.indexOf(barData.serie) > 0) {
                         return 'url(#prognosisInactive)';
                     }
                     return this.evalColorVar('--digi--color--background--secondary-accent');
                 }
             });
-            select(this.legendDiv).selectAll('.legendChip').transition('colorLegend').duration(150).style('opacity', (title) => title === serie ? 1 : 0.25);
+            select(this.legendDiv)
+                .selectAll('.legendChip')
+                .transition('colorLegend')
+                .duration(150)
+                .style('opacity', (title) => (title === serie ? 1 : 0.25));
         };
         this.resetBarColor = () => {
-            this.barChartContainer.selectAll('.bar').transition('color').duration(150).attr('fill', (barData) => this.colorFunction(barData.serie));
-            select(this.legendDiv).selectAll('.legendChip').transition('colorLegend').duration(150).style('opacity', 1);
+            this.barChartContainer
+                .selectAll('.bar')
+                .transition('color')
+                .duration(150)
+                .attr('fill', (barData) => this.colorFunction(barData.serie));
+            select(this.legendDiv)
+                .selectAll('.legendChip')
+                .transition('colorLegend')
+                .duration(150)
+                .style('opacity', 1);
             if (this.chartData.data.averageLine) {
-                this.barChartContainer.selectAll('.averageLine').transition('avgLine').style('mix-blend-mode', 'plus-lighter')
+                this.barChartContainer
+                    .selectAll('.averageLine')
+                    .transition('avgLine')
+                    .style('mix-blend-mode', 'plus-lighter')
                     .style('filter', 'contrast(0.5)');
                 /*       this.barChartContainer.selectAll('.averageLineText').transition('avgLine').style('mix-blend-mode', 'plus-lighter')
                         .style('filter', 'contrast(0.5)'); */
             }
         };
         this.highlightAverageLine = (serie) => {
-            this.barChartContainer.selectAll('.bar')
+            this.barChartContainer
+                .selectAll('.bar')
                 .transition('color')
                 .duration(150)
                 .attr('fill', (barData) => {
                 var _a;
-                if (((_a = this.chartData.meta) === null || _a === void 0 ? void 0 : _a.prognosisPattern) && this.series.indexOf(barData.serie) > 0) {
+                if (((_a = this.chartData.meta) === null || _a === void 0 ? void 0 : _a.prognosisPattern) &&
+                    this.series.indexOf(barData.serie) > 0) {
                     return 'url(#prognosisInactive)';
                 }
                 else
                     return this.evalColorVar('--digi--color--background--secondary-accent');
             });
-            this.barChartContainer.selectAll('.averageLine').transition('avgLine')
-                .duration(150).style('mix-blend-mode', null).style('filter', null);
+            this.barChartContainer
+                .selectAll('.averageLine')
+                .transition('avgLine')
+                .duration(150)
+                .style('mix-blend-mode', null)
+                .style('filter', null);
             /*     this.barChartContainer.selectAll('.averageLineText').transition('avgLineText')
                   .duration(150).style('mix-blend-mode', null).style('filter', null) */
-            select(this.legendDiv).selectAll('.legendChip').transition('colorLegend').duration(150).style('opacity', (title) => title === serie ? 1 : 0.25);
+            select(this.legendDiv)
+                .selectAll('.legendChip')
+                .transition('colorLegend')
+                .duration(150)
+                .style('opacity', (title) => (title === serie ? 1 : 0.25));
         };
         // Sets and resizespositions the average line
         this.averageLine = () => {
             if (!this.chartData.data.averageLine)
                 return;
-            const avLineGroup = this.barChartContainer.select('.interactiveElements').selectAll('.averageLineGroup').data([this.chartData.data.averageLine]).join('g').attr('class', 'averageLineGroup');
+            const avLineGroup = this.barChartContainer
+                .select('.interactiveElements')
+                .selectAll('.averageLineGroup')
+                .data([this.chartData.data.averageLine])
+                .join('g')
+                .attr('class', 'averageLineGroup');
             /*     avLineGroup.selectAll('.averageLineText')
                   .data(d => [d])
                   .join('text')
@@ -36025,8 +36065,9 @@ class barChart {
                   .attr('fill', 'var(--digi--color--infographic--lineart)')
                   .style('mix-blend-mode', 'plus-lighter')
                   .style('filter', 'contrast(0.5)'); */
-            avLineGroup.selectAll('.averageLine')
-                .data(d => [d.value])
+            avLineGroup
+                .selectAll('.averageLine')
+                .data((d) => [d.value])
                 .join('line')
                 .attr('class', 'averageLine')
                 .attr('x1', this.xScale.range()[0])
@@ -36074,11 +36115,15 @@ class barChart {
         this.highlightBarGroup = (_event, datum) => {
             if (typeof datum === 'string') {
                 const barGroupID = '#' + this.barGroupID(datum);
-                this.barChartContainer.select(barGroupID).selectAll('.bar').transition('color')
+                this.barChartContainer
+                    .select(barGroupID)
+                    .selectAll('.bar')
+                    .transition('color')
                     .duration(20)
                     .attr('fill', (d) => {
                     var _a;
-                    if (((_a = this.chartData.meta) === null || _a === void 0 ? void 0 : _a.prognosisPattern) && this.series.indexOf(d.serie) > 0) {
+                    if (((_a = this.chartData.meta) === null || _a === void 0 ? void 0 : _a.prognosisPattern) &&
+                        this.series.indexOf(d.serie) > 0) {
                         return 'url(#prognosisHighlight)';
                     }
                     else
@@ -36087,7 +36132,9 @@ class barChart {
             }
         };
         this.unHighlightBarGroup = () => {
-            this.barSelection.selectAll('.bar').transition('color')
+            this.barSelection
+                .selectAll('.bar')
+                .transition('color')
                 .duration(100)
                 .attr('fill', (d) => {
                 return this.colorFunction(d.serie);
@@ -36180,13 +36227,15 @@ class barChart {
             return 'barGroup' + key.replace(/[^A-Z0-9]+/gi, '');
         };
         this.updateBars = () => {
-            this.barSelection = this.barChartContainer.select('.interactiveElements')
+            this.barSelection = this.barChartContainer
+                .select('.interactiveElements')
                 .selectAll('.barGroup')
                 .data(this.mappedData)
                 .join('g')
                 .attr('class', 'barGroup')
                 .attr('id', (d) => this.barGroupID(d.key));
-            this.barSelection.selectAll('.bar')
+            this.barSelection
+                .selectAll('.bar')
                 .data((d) => {
                 return d.series;
             })
@@ -36265,7 +36314,9 @@ class barChart {
                                     key: key,
                                     serie: serie.title,
                                     value: serie.yValues[index],
-                                    len: serie.yValues[index] ? this.getTextSize(serie.yValues[index].toLocaleString()) : 0
+                                    len: serie.yValues[index]
+                                        ? this.getTextSize(serie.yValues[index].toLocaleString())
+                                        : 0
                                 });
                             }
                         });
@@ -36281,7 +36332,9 @@ class barChart {
                                     key: key.toString(),
                                     serie: serie.title,
                                     value: serie.yValues[index],
-                                    len: serie.yValues[index] ? this.getTextSize(serie.yValues[index].toLocaleString()) : 0
+                                    len: serie.yValues[index]
+                                        ? this.getTextSize(serie.yValues[index].toLocaleString())
+                                        : 0
                                 });
                             }
                         });
@@ -36292,7 +36345,8 @@ class barChart {
             return toReturn;
         };
         this.adjustBarSize = () => {
-            this.barSelection.selectAll('.bar')
+            this.barSelection
+                .selectAll('.bar')
                 .attr('x', this.xFunction)
                 .attr('y', this.yFunction)
                 .attr('width', this.widthFunction)
@@ -36307,30 +36361,38 @@ class barChart {
         // Handling x positioning of bars
         this.xFunction = (d, i) => {
             return this.afVariation === BarChartVariation.Horizontal
-                ? (d.value > 0 ? this.xScale(0) : this.xScale(d.value))
-                : this.xScale(d.key) + ((this.xScale.bandwidth() / this.dataWidth) * i + (this.barGap * i));
+                ? d.value > 0
+                    ? this.xScale(0)
+                    : this.xScale(d.value)
+                : this.xScale(d.key) +
+                    ((this.xScale.bandwidth() / this.dataWidth) * i + this.barGap * i);
         };
         // Handling y positioning of bars
         this.yFunction = (d, i) => {
             if (!d.value)
                 return 0;
             return this.afVariation === BarChartVariation.Horizontal
-                ? this.yScale(d.key) + ((this.yScale.bandwidth() / this.dataWidth) * i + (this.barGap * i))
-                : (d.value < 0 ? this.yScale(0) : this.yScale(d.value));
+                ? this.yScale(d.key) +
+                    ((this.yScale.bandwidth() / this.dataWidth) * i + this.barGap * i)
+                : d.value < 0
+                    ? this.yScale(0)
+                    : this.yScale(d.value);
         };
         // Handling height for bars
         this.heightFunction = (d) => {
             if (!d.value)
                 return 0;
             return this.afVariation === BarChartVariation.Horizontal
-                ? this.yScale.bandwidth() / this.dataWidth - (this.barGap)
-                : (d.value < 0 ? this.yScale(d.value) - this.yScale(0) : this.yScale(0) - this.yScale(d.value));
+                ? this.yScale.bandwidth() / this.dataWidth - this.barGap
+                : d.value < 0
+                    ? this.yScale(d.value) - this.yScale(0)
+                    : this.yScale(0) - this.yScale(d.value);
         };
         // Handling width for bars
         this.widthFunction = (d) => {
             return this.afVariation === BarChartVariation.Horizontal
                 ? Math.abs(this.xScale(0) - this.xScale(d.value))
-                : this.xScale.bandwidth() / this.dataWidth - (this.barGap);
+                : this.xScale.bandwidth() / this.dataWidth - this.barGap;
         };
         // Setting dimension variable
         this.setDims = (onlyHeight = false) => {
@@ -36573,7 +36635,8 @@ class barChart {
                 .attr('fill', (d) => {
                 var _a;
                 if (event.target.tagName === 'rect') {
-                    if (((_a = this.chartData.meta) === null || _a === void 0 ? void 0 : _a.prognosisPattern) && this.series.indexOf(d.serie) > 0) {
+                    if (((_a = this.chartData.meta) === null || _a === void 0 ? void 0 : _a.prognosisPattern) &&
+                        this.series.indexOf(d.serie) > 0) {
                         return 'url(#prognosisHighlight)';
                     }
                     else
@@ -36589,7 +36652,9 @@ class barChart {
             select(event.target)
                 .transition('color')
                 .duration(this.defaultDuration)
-                .attr('fill', (d) => event.target.tagName === 'rect' ? this.colorFunction(d.serie) : '#333333');
+                .attr('fill', (d) => event.target.tagName === 'rect'
+                ? this.colorFunction(d.serie)
+                : '#333333');
         };
         this.openTooltip = (...[, d]) => {
             // If type is string, the user has clicked on a y-axis tick
@@ -36601,9 +36666,7 @@ class barChart {
             else
                 this.tooltipData = d;
             const tooltipBody = this.tooltip.select('.tooltipBody');
-            this.tooltip
-                .select('.tooltipHeading')
-                .html(this.tooltipData.key);
+            this.tooltip.select('.tooltipHeading').html(this.tooltipData.key);
             tooltipBody
                 .selectAll('div')
                 .data(this.tooltipData.series ? this.tooltipData.series : [this.tooltipData])
@@ -36642,15 +36705,25 @@ class barChart {
                         .style('transform', `translate(${diff > 0 ? width / 2 - 10 : this.xScale(data.value) / 2}px,0)`);
                 }
                 else {
-                    const index = (_a = this.mappedData.find(xPoint => xPoint.key === data.key)) === null || _a === void 0 ? void 0 : _a.series.findIndex(serie => serie.serie === data.serie);
-                    const barIndex = ((this.xScale.bandwidth() / this.dataWidth) * (index ? index + 1 : 1)) - (this.xScale.bandwidth() / this.dataWidth) / 2;
+                    const index = (_a = this.mappedData
+                        .find((xPoint) => xPoint.key === data.key)) === null || _a === void 0 ? void 0 : _a.series.findIndex((serie) => serie.serie === data.serie);
+                    const barIndex = (this.xScale.bandwidth() / this.dataWidth) * (index ? index + 1 : 1) -
+                        this.xScale.bandwidth() / this.dataWidth / 2;
                     // This should be where the x-axis starts
                     const xStart = this.margin.left + this.tickPadding + this.yTickSize;
                     // Creating adjustment for tooltip to not appear outside of chart
                     const spaceToSVGEdge = 5;
-                    const inlineAdjustment = (this.dims.width - spaceToSVGEdge) < (this.xScale(data.key) + xStart + barIndex + width / 2) ? (((this.xScale(data.key) + xStart + barIndex + width / 2) - (this.dims.width - spaceToSVGEdge)) / width) * 100 : 0;
-                    this.tooltip
-                        .style('transform', `translate( calc(${this.xScale(data.key) + xStart + barIndex}px - ${50 + inlineAdjustment}%), calc(-100% + ${(data.value > 0 ? this.yScale(data.value) : this.yScale(0)) - 2}px) )`);
+                    const inlineAdjustment = this.dims.width - spaceToSVGEdge <
+                        this.xScale(data.key) + xStart + barIndex + width / 2
+                        ? ((this.xScale(data.key) +
+                            xStart +
+                            barIndex +
+                            width / 2 -
+                            (this.dims.width - spaceToSVGEdge)) /
+                            width) *
+                            100
+                        : 0;
+                    this.tooltip.style('transform', `translate( calc(${this.xScale(data.key) + xStart + barIndex}px - ${50 + inlineAdjustment}%), calc(-100% + ${(data.value > 0 ? this.yScale(data.value) : this.yScale(0)) - 2}px) )`);
                     this.tooltip
                         .select('digi-icon-caret-down')
                         .style('position', 'absolute')
@@ -36660,8 +36733,7 @@ class barChart {
             }
             else {
                 if (this.afVariation === BarChartVariation.Horizontal) {
-                    this.tooltip
-                        .style('transform', `translate(${this.tickPadding}px, ${this.yScale(data.key) + this.series.length * this.yScale.bandwidth() + 5}px )` // 5 is for half caret size
+                    this.tooltip.style('transform', `translate(${this.tickPadding}px, ${this.yScale(data.key) + this.series.length * this.yScale.bandwidth() + 5}px )` // 5 is for half caret size
                     );
                     this.tooltip
                         .select('digi-icon-caret-up')
@@ -36674,12 +36746,17 @@ class barChart {
                 else {
                     const xStart = this.margin.left + this.tickPadding + this.yTickSize;
                     const translatePoint = this.xScale(data.key) + xStart + this.xScale.bandwidth() / 2;
-                    const yMax = max(data.series.map(elem => elem.value));
+                    const yMax = max(data.series.map((elem) => elem.value));
                     // Creating adjustment for tooltip to not appear outside of chart
                     const spaceToSVGEdge = 5;
-                    const inlineAdjustment = (this.dims.width - spaceToSVGEdge) < (translatePoint + width / 2) ? (((translatePoint + width / 2) - (this.dims.width - spaceToSVGEdge)) / width) * 100 : 0;
-                    this.tooltip
-                        .style('transform', `translate( calc(${this.xScale(data.key) + xStart + this.xScale.bandwidth() / 2}px - ${50 + inlineAdjustment}%), calc(-100% + ${this.yScale(yMax && yMax > 0 ? yMax : 0) - 1}px) )`);
+                    const inlineAdjustment = this.dims.width - spaceToSVGEdge < translatePoint + width / 2
+                        ? ((translatePoint +
+                            width / 2 -
+                            (this.dims.width - spaceToSVGEdge)) /
+                            width) *
+                            100
+                        : 0;
+                    this.tooltip.style('transform', `translate( calc(${this.xScale(data.key) + xStart + this.xScale.bandwidth() / 2}px - ${50 + inlineAdjustment}%), calc(-100% + ${this.yScale(yMax && yMax > 0 ? yMax : 0) - 1}px) )`);
                     this.tooltip
                         .select('digi-icon-caret-down')
                         .style('position', 'absolute')
@@ -36715,7 +36792,10 @@ class barChart {
                 .attr('opacity', 0)
                 .on('end', () => {
                 this.svg.remove();
-                select(this.legendDiv).select('.legend').selectAll('.legendChip').remove();
+                select(this.legendDiv)
+                    .select('.legend')
+                    .selectAll('.legendChip')
+                    .remove();
                 this.legendDiv.style['display'] = 'none';
                 this.tableDiv.style['display'] = 'block';
                 this.setTableContent();
@@ -36769,12 +36849,13 @@ class barChart {
         this.afChartData = undefined;
     }
     afChartDataUpdate(data) {
-        if (typeof data === 'string' && Object.keys(JSON.parse(data)).length > 0 || typeof data !== 'string' && Object.keys(data).length > 0) {
+        if ((typeof data === 'string' && Object.keys(JSON.parse(data)).length > 0) ||
+            (typeof data !== 'string' && Object.keys(data).length > 0)) {
             if (typeof data != 'string')
                 this.chartData = data;
             else
                 this.chartData = JSON.parse(data);
-            this.series = this.chartData.data.series.map(serie => serie.title);
+            this.series = this.chartData.data.series.map((serie) => serie.title);
         }
         this.mappedData = this.reshapeData();
         // checking for width of each tick
@@ -36817,10 +36898,11 @@ class barChart {
     }
     initLegend() {
         const rectSize = 18;
-        const legendData = this.chartData.data.series.map(serie => serie.title);
+        const legendData = this.chartData.data.series.map((serie) => serie.title);
         if (this.chartData.data.averageLine)
             legendData.push(this.chartData.data.averageLine.text);
-        const legendChips = select(this.legendDiv).select('.legend')
+        const legendChips = select(this.legendDiv)
+            .select('.legend')
             .style('margin-left', `${this.margin.left + this.tickPadding + this.yTickSize}px`)
             .style('margin-top', '0.5rem')
             .selectAll('.legendChip')
@@ -36834,7 +36916,8 @@ class barChart {
             .style('cursor', 'default')
             .on('mouseenter', (_event, serie) => this.highlightBars(serie))
             .on('mouseleave', this.resetBarColor);
-        legendChips.append('svg')
+        legendChips
+            .append('svg')
             .attr('width', rectSize + 1)
             .attr('height', rectSize + 1)
             .append('rect')
@@ -36845,15 +36928,19 @@ class barChart {
             .attr('rx', 4)
             .attr('ry', 4)
             .attr('fill', (title) => this.colorFunction(title));
-        legendChips.append('span').style('text-wrap', 'nowrap').style('font-size', '0.875rem').text((d) => d);
+        legendChips
+            .append('span')
+            .style('text-wrap', 'nowrap')
+            .style('font-size', '0.875rem')
+            .text((d) => d);
         if (this.chartData.data.averageLine) {
-            const averageLine = legendChips.filter(':last-child')
+            const averageLine = legendChips
+                .filter(':last-child')
                 .on('mouseenter', (_event, serie) => this.highlightAverageLine(serie));
-            const miniSVG = averageLine
-                .select('svg')
-                .attr('width', rectSize * 2);
+            const miniSVG = averageLine.select('svg').attr('width', rectSize * 2);
             miniSVG.select('rect').remove();
-            miniSVG.append('line')
+            miniSVG
+                .append('line')
                 .attr('x1', 1)
                 .attr('x2', rectSize * 2 - 1)
                 .attr('y1', rectSize / 2 + 1)
@@ -36896,7 +36983,8 @@ class barChart {
             .attr('role', 'img')
             .attr('aria-label', this.chartData && this.chartData.title
             ? 'Stapeldiagram om ' + this.chartData.title.toLowerCase()
-            : 'Stapeldiagram').attr('style', 'display: flex;min-width: 0;width: 100%;height: auto;');
+            : 'Stapeldiagram')
+            .attr('style', 'display: flex;min-width: 0;width: 100%;height: auto;');
         // Hide unusable components
         select(this.titleDiv)
             .select(this.afHeadingLevel)
@@ -36958,7 +37046,8 @@ class barChart {
                 .join('g')
                 .attr('class', 'barGroup')
                 .attr('id', (d) => this.barGroupID(d.key));
-            this.barSelection.selectAll('bar')
+            this.barSelection
+                .selectAll('bar')
                 .data((d) => {
                 return d.series;
             })
@@ -36973,13 +37062,15 @@ class barChart {
                 .attr('width', this.widthFunction)
                 .attr('height', () => 0)
                 .attr('fill', 'gray');
-            this.barChartContainer.selectAll('.bar')
+            this.barChartContainer
+                .selectAll('.bar')
                 .transition('animateBar')
                 .duration(400)
                 .delay((...[, i]) => i * 150)
                 .attr('y', this.yFunction)
                 .attr('height', this.heightFunction);
-            this.barChartContainer.selectAll('.bar')
+            this.barChartContainer
+                .selectAll('.bar')
                 .transition('animateBar')
                 .duration(400)
                 .ease(linear$1)
@@ -37089,7 +37180,8 @@ class barChart {
             .join('g')
             .attr('class', 'barGroup')
             .attr('id', (d) => this.barGroupID(d.key));
-        this.barSelection.selectAll('.barGroup')
+        this.barSelection
+            .selectAll('.barGroup')
             .data((d) => {
             return d.series;
         })
@@ -37116,7 +37208,9 @@ class barChart {
             .append('text');
         this.textSelection
             .text((d) => {
-            return d.value ? d.value.toLocaleString(undefined, this.numberFormat) : undefined;
+            return d.value
+                ? d.value.toLocaleString(undefined, this.numberFormat)
+                : undefined;
         })
             .attr('class', 'barText')
             .attr('font-size', this.fontSize)
@@ -37180,8 +37274,7 @@ class barChart {
             this.setMinMax();
             const newHeight = this.setDims();
             this.transitionTitle();
-            this.svg
-                .attr('aria-label', this.chartData && this.chartData.title
+            this.svg.attr('aria-label', this.chartData && this.chartData.title
                 ? 'Stapeldiagram om ' + this.chartData.title.toLowerCase()
                 : 'Stapeldiagram');
             this.setMargins();
@@ -37237,7 +37330,9 @@ class barChart {
                 select(this.titleDiv).select('.loadingHeader').remove();
                 this.loading = false;
                 this.barChartContainer.selectAll('.bar').interrupt('animateBar');
-                this.barChartContainer.selectAll('.bar').transition()
+                this.barChartContainer
+                    .selectAll('.bar')
+                    .transition()
                     .duration(this.defaultDuration)
                     .attr('y', (d) => this.afVariation === BarChartVariation.Horizontal
                     ? this.yScale(d.key)
@@ -37325,7 +37420,11 @@ class barChart {
         return width;
     }
     adjustColor(color, amount) {
-        return '#' + color.replace(/^#/, '').replace(/../g, color => ('0' + Math.min(255, Math.max(0, parseInt(color, 16) + amount)).toString(16)).substr(-2));
+        return ('#' +
+            color
+                .replace(/^#/, '')
+                .replace(/../g, (color) => ('0' +
+                Math.min(255, Math.max(0, parseInt(color, 16) + amount)).toString(16)).substr(-2)));
     }
     componentWillLoad() {
         this.afChartDataUpdate(this.afChartData);
@@ -37388,7 +37487,10 @@ class barChart {
     }
     setTableDimensions() {
         const table = select(this.tableDiv);
-        table.style('display', 'flex').style('height', '100%').style('width', '100%');
+        table
+            .style('display', 'flex')
+            .style('height', '100%')
+            .style('width', '100%');
     }
     // Extracting all headings from data and returning a string with <th>-elements with headings
     headings() {
@@ -37427,7 +37529,7 @@ class barChart {
             if (this.chartData.infoText)
                 heading = `${heading}<span style="display:block;margin-top:0.25rem;font-size:0.875rem;color:var(--digi--global--color--neutral--grayscale--darkest-3)">${this.chartData.infoText}</span>`;
         }
-        return (hAsync(Host, { key: 'd39019eecd4013769648a7cdb1e5dc48712de934', ref: (el) => (this.host = el) }, hAsync("svg", { key: '9e4dbfcd19038c6b9c8cfe26b4e8b3c5ef624896', xmlns: "http://www.w3.org/2000/svg", width: "0", height: "0" }, hAsync("defs", { key: '9ed2bc8b3064642d01e9028fa91c55577ed2da1c' }, hAsync("pattern", { key: 'ca867a03dac364d29de422bc074c7ff3a8bac858', id: "prognosis", patternUnits: "userSpaceOnUse", width: "8", height: "8", patternTransform: "rotate(45)" }, hAsync("rect", { key: '2f2169ba84fcbb198a8f109bc57971beb3c3ca09', width: "8", height: "8", fill: 'white' }), hAsync("line", { key: 'ad51412cb272233eb58a82a293643c4e865e34e9', x1: "0", y: "0", x2: "0", y2: "12", stroke: this.evalColorVar(this.colorPalettes[0]), "stroke-width": "8" })), hAsync("pattern", { key: 'ecc0ffeb0eda0d84102678c17163d0afc472cde5', id: "prognosisInactive", patternUnits: "userSpaceOnUse", width: "8", height: "8", patternTransform: "rotate(45)" }, hAsync("rect", { key: 'ca9a51785850ea8e26f4ca3b84dc28401325af63', width: "8", height: "8", fill: 'white' }), hAsync("line", { key: 'd7dd225c20b588f74bff91d44ff5abc8839bc445', x1: "0", y: "0", x2: "0", y2: "12", stroke: this.evalColorVar('--digi--color--background--secondary-accent'), "stroke-width": "8" })), hAsync("pattern", { key: '654a002d89f6ce33fc4958afe3997829511b867e', id: "prognosisHighlight", patternUnits: "userSpaceOnUse", width: "8", height: "8", patternTransform: "rotate(45)" }, hAsync("rect", { key: '6d0286f1d11de92c88083618d4acb3300f36857d', width: "8", height: "8", fill: 'white' }), hAsync("line", { key: '4acd94253dbdb1fc85090d677d246028a6e595d6', x1: "0", y: "0", x2: "0", y2: "12", stroke: this.adjustColor(this.colorFunction(0), 50), "stroke-width": "8" })))), hAsync("div", { key: '9022c75fa8077b2c025aac91b8c1a565b50ad8f0', class: "topWrapper", ref: (el) => (this.titleDiv = el) }, hAsync("digi-typography", { key: '4a28b8506806ca2418fd21512460baebe84614d5', class: "chartTitle", innerHTML: heading }), hAsync("digi-button", { key: '69f4603b0fde842906e17abee241c6e3b4de1059', class: "buttonWrapper tableButton", "af-size": "medium", "af-variation": "function", "af-full-width": "false", onAfOnClick: this.activateTable, afAriaLabel: `Visa tabell ${((_a = this.chartData) === null || _a === void 0 ? void 0 : _a.title) ? (_b = this.chartData) === null || _b === void 0 ? void 0 : _b.title.toLowerCase() : ''}` }, hAsync("digi-icon-table", { key: '803f63ac1912c5979c43e7c58d28591a1d6ce461', slot: "icon" }), "Visa tabell"), hAsync("digi-button", { key: '7d87badd6ae3df65127bdfe4c4308c0d38d5ccb7', style: { display: 'none' }, class: "buttonWrapper chartButton", "af-size": "medium", "af-variation": "function", "af-full-width": "false", onAfOnClick: this.reInitChart, afAriaLabel: `Visa diagram ${((_c = this.chartData) === null || _c === void 0 ? void 0 : _c.title) ? (_d = this.chartData) === null || _d === void 0 ? void 0 : _d.title.toLowerCase() : ''}` }, hAsync("digi-icon-chart", { key: 'f92c2eb9f08bf7f13a7eaea287b80a233efd95ef', slot: "icon" }), "Visa diagram"), hAsync("div", { key: 'ee5b3ad8cdcfcf00891f56f7a7e738adf76f36c1', class: "scChartStatus", role: "status", ref: (el) => (this.status = el) })), hAsync("div", { key: 'cbc0c8724ac73a07a4f2d01044d4928214e63f43', class: "svgWrap", ref: (el) => (this.chartDiv = el) }, hAsync("div", { key: '52cb24ae1a29f5381860031513b7b9e835044935', class: "chartTooltip", id: this.afId }, hAsync("div", { key: '17c4c08dcf63cd263db4f32fecae7ec5216e3014', class: "tooltipHead" }, hAsync("digi-icon-x", { key: 'f44a9a534ae02fe674fc0f9161e5c4b5a3eecb30', class: "tooltipClose" })), hAsync("div", { key: 'ffbe44f6a8db4dc67d6980bd69ca2209e4a75745', class: "tooltipBody" }), this.afVariation === BarChartVariation.Horizontal ? (hAsync("digi-icon-caret-up", { class: "caret" })) : (hAsync("digi-icon-caret-down", { class: "caret" })))), hAsync("div", { key: '5d9cce591ea02a7b8ebdb42af55f378ee064a48a', class: "legendWrap", ref: (el) => (this.legendDiv = el) }, hAsync("div", { key: '8b8b7cd614e5d6202bfce04e57c98ee040f15dab', class: "legend" })), hAsync("div", { key: '64a35d431e28638ffece4dd12bdf04678ed13768', class: "table", ref: (el) => (this.tableDiv = el) }, ' ')));
+        return (hAsync(Host, { key: 'cb70095467051cf1142891bc63694623e707d92f', ref: (el) => (this.host = el) }, hAsync("svg", { key: 'c040fe2f27d9a5e3de1471fe7e4d853757f6a754', xmlns: "http://www.w3.org/2000/svg", width: "0", height: "0" }, hAsync("defs", { key: '17fd52f2cac5a3225e097aee80e8dc1a99909840' }, hAsync("pattern", { key: '2940e729359dad1acc4635363cd5a8f3ee4d8ea1', id: "prognosis", patternUnits: "userSpaceOnUse", width: "8", height: "8", patternTransform: "rotate(45)" }, hAsync("rect", { key: '4b47d41ea9f4699a4bcc7b0f04d00b8bbd124946', width: "8", height: "8", fill: "white" }), hAsync("line", { key: 'd5c3a32fb715a5271a784771d9812ea599390fc3', x1: "0", y: "0", x2: "0", y2: "12", stroke: this.evalColorVar(this.colorPalettes[0]), "stroke-width": "8" })), hAsync("pattern", { key: '8038bb4d62fd87a118e0bcf4e750165eed48f789', id: "prognosisInactive", patternUnits: "userSpaceOnUse", width: "8", height: "8", patternTransform: "rotate(45)" }, hAsync("rect", { key: 'b1247b7d27e73836c7b5a05fb77a872e89853d3b', width: "8", height: "8", fill: "white" }), hAsync("line", { key: '14265bcba469f08b890654315a86d6278271d64d', x1: "0", y: "0", x2: "0", y2: "12", stroke: this.evalColorVar('--digi--color--background--secondary-accent'), "stroke-width": "8" })), hAsync("pattern", { key: '4069999fd742795379f093c83c00cca488b6139c', id: "prognosisHighlight", patternUnits: "userSpaceOnUse", width: "8", height: "8", patternTransform: "rotate(45)" }, hAsync("rect", { key: 'c525ae39e05acf3e7522f1b92feffdfe5221e528', width: "8", height: "8", fill: "white" }), hAsync("line", { key: 'fa183e0678f6f3794e094b97975fe96955b49e0a', x1: "0", y: "0", x2: "0", y2: "12", stroke: this.adjustColor(this.colorFunction(0), 50), "stroke-width": "8" })))), hAsync("div", { key: 'b6e46d7f4701775a177b02a98f46ca40308e9938', class: "topWrapper", ref: (el) => (this.titleDiv = el) }, hAsync("digi-typography", { key: '88d49833d43776a2bc23d7f73bb8cc9442350634', class: "chartTitle", innerHTML: heading }), hAsync("digi-button", { key: '75e2ef09c3f9f91a08b3596d02ad308b244586bb', class: "buttonWrapper tableButton", "af-size": "medium", "af-variation": "function", "af-full-width": "false", onAfOnClick: this.activateTable, afAriaLabel: `Visa tabell ${((_a = this.chartData) === null || _a === void 0 ? void 0 : _a.title) ? (_b = this.chartData) === null || _b === void 0 ? void 0 : _b.title.toLowerCase() : ''}` }, hAsync("digi-icon-table", { key: '7712b56f991bb5214aa3bebb9e380221156b6bbf', slot: "icon" }), "Visa tabell"), hAsync("digi-button", { key: 'b9d442ea0b62303c2bf1018651ce3206063f3b35', style: { display: 'none' }, class: "buttonWrapper chartButton", "af-size": "medium", "af-variation": "function", "af-full-width": "false", onAfOnClick: this.reInitChart, afAriaLabel: `Visa diagram ${((_c = this.chartData) === null || _c === void 0 ? void 0 : _c.title) ? (_d = this.chartData) === null || _d === void 0 ? void 0 : _d.title.toLowerCase() : ''}` }, hAsync("digi-icon-chart", { key: '260c432d04f8ea00216cd485b5ec3a29df4b4db1', slot: "icon" }), "Visa diagram"), hAsync("div", { key: 'a7fd6276b5738e9cf040f0e9b99e983b27ec25cf', class: "scChartStatus", role: "status", ref: (el) => (this.status = el) })), hAsync("div", { key: '705ec9e3931b91009ff565bbd8f4ba300bd8dbd7', class: "svgWrap", ref: (el) => (this.chartDiv = el) }, hAsync("div", { key: '242fd5b7afba36df00aa7fb256bd8578712d25e7', class: "chartTooltip", id: this.afId }, hAsync("div", { key: '6417cc30962396164fe4840ecfef62c4ef7591d6', class: "tooltipHead" }, hAsync("digi-icon-x", { key: 'dc4edb442bfb342fbdb64b06e70f1e19ccc5ffb1', class: "tooltipClose" })), hAsync("div", { key: 'da625c879d4c0eebffa02193dc36d794c755b768', class: "tooltipBody" }), this.afVariation === BarChartVariation.Horizontal ? (hAsync("digi-icon-caret-up", { class: "caret" })) : (hAsync("digi-icon-caret-down", { class: "caret" })))), hAsync("div", { key: 'a003a616c2ee8b848d402b38009261539ebf0c50', class: "legendWrap", ref: (el) => (this.legendDiv = el) }, hAsync("div", { key: '44a6db8daa836ccf910aafd6fd996f153c337bf4', class: "legend" })), hAsync("div", { key: 'a872281035f2799fe8aa9128a953d0c5d9f6b2cc', class: "table", ref: (el) => (this.tableDiv = el) }, ' ')));
     }
     get hostElement() { return getElement(this); }
     static get watchers() { return {