@designsystem-se/af 35.2.1-beta.1 → 35.2.1-beta.3

package/dist/collection/components/_calendar/calendar-datepicker/calendar-datepicker.js

@@ -16,10 +16,9 @@ export class CalendarDatepicker {
         this.showDisabledDateError = false;
         this.showCalendar = false;
         this.userInput = '';
-        this.isEditing = false;
         this.afId = randomIdGenerator('digi-calendar-datepicker');
         this.afLabel = _t.calendar.datepicker.label;
-        this.afLabelDescription = _t.calendar.datepicker.description;
+        this.afLabelDescription = undefined;
         this.afName = undefined;
         this.afOpenCalendarAriaLabel = _t.calendar.datepicker.openCalendarAriaLabel;
         this.afCloseCalendarAriaLabel = _t.calendar.datepicker.closeCalendarAriaLabel;
@@ -28,7 +27,7 @@ export class CalendarDatepicker {
         this.afValidationWrongFormat = _t.calendar.datepicker.validationWrongFormat;
         this.afValidationDisabledDate = _t.calendar.datepicker.validationDisabledDate;
         this.afRequired = undefined;
-        this.afDisableValidation = undefined;
+        this.afDisableValidation = false;
         this.afRequiredText = undefined;
         this.afSelectedDates = [];
         this.afYearSelect = false;
@@ -38,6 +37,7 @@ export class CalendarDatepicker {
         this.afShowWeekNumber = false;
         this.afMultipleDates = false;
         this.afCloseOnSelect = false;
+        this.afOpenCalendarTo = undefined;
     }
     afDisableValidationChangeHandler(newVal) {
         if (!newVal) {
@@ -124,6 +124,10 @@ export class CalendarDatepicker {
             e.stopPropagation();
         }
     }
+    focusOnCalendarInput() {
+        const input = this.hostElement.querySelector(`#${this.afId}-datepicker input`);
+        input === null || input === void 0 ? void 0 : input.focus();
+    }
     focusOnCalendarButton() {
         const calendarButton = this.hostElement.querySelector(`#${this.afId}-button`);
         calendarButton.focus();
@@ -148,7 +152,7 @@ export class CalendarDatepicker {
     }
     parseInputString(value) {
         return value
-            .split(/[&,]|och/g)
+            .split(new RegExp(`[&,]|${_t.and}`, 'g'))
             .map((text) => this.parseDateString(text.trim()));
     }
     resetValueAndState() {
@@ -175,8 +179,14 @@ export class CalendarDatepicker {
     validateInputAndShowErrors(dates) {
         this.showWrongFormatError = !!dates.find((date) => !isValid(date));
         this.showDisabledDateError = !!dates.find((date) => !this.isDateSelectable(date));
+        const inputIsValid = !this.showWrongFormatError && !this.showDisabledDateError;
         this.afOnValidationChange.emit({
-            valid: !this.showWrongFormatError && !this.showDisabledDateError
+            isValid: inputIsValid,
+            validationText: inputIsValid
+                ? undefined
+                : this.showWrongFormatError
+                    ? this.afValidationWrongFormat
+                    : this.afValidationDisabledDate
         });
     }
     setValue(value) {
@@ -197,10 +207,22 @@ export class CalendarDatepicker {
             return;
         }
         let dates = this.parseInputString(newValue);
-        if (this.afMultipleDates) {
+        // Single dates - acceptera inte flera datum inskrivna
+        if (!this.afDisableValidation &&
+            !this.afMultipleDates &&
+            dates.length > 1) {
+            this.showWrongFormatError = true;
+            this.afOnValidationChange.emit({
+                isValid: false,
+                validationText: this.afValidationWrongFormat
+            });
+            return;
+        }
+        // Multiple dates - filtrera bort dubbletter
+        if (!this.afDisableValidation && this.afMultipleDates) {
             const uniqueDates = this.removeDuplicateDates(dates);
             if (uniqueDates.length !== dates.length) {
-                dates = this.removeDuplicateDates(uniqueDates);
+                dates = uniqueDates;
                 this.userInput = this.datesToInputString(dates);
             }
         }
@@ -219,7 +241,7 @@ export class CalendarDatepicker {
         }
         this.userInput = '';
         this.setValue(evt.detail);
-        this.afOnDisplayChange.emit(this.inputValue);
+        this.afOnDateChangeRawText.emit(this.inputValue);
         if (this.afCloseOnSelect) {
             this.toggleCalendar();
             this.focusOnCalendarButton();
@@ -312,7 +334,7 @@ export class CalendarDatepicker {
     datesToInputString(dates) {
         return dates.every((date) => date instanceof Date && !isNaN(date.getTime()))
             ? dates
-                .map((date) => date.toLocaleDateString('sv-SE'))
+                .map((date) => date.toLocaleDateString(_t.locale))
                 .flatMap((date, index, all) => {
                 const isLast = index == all.length - 1;
                 const isFirst = index === 0;
@@ -320,7 +342,7 @@ export class CalendarDatepicker {
                     return date;
                 }
                 else if (isLast) {
-                    return [' och ', date];
+                    return [` ${_t.and} `, date];
                 }
                 else {
                     return [', ', date];
@@ -336,44 +358,37 @@ export class CalendarDatepicker {
         return this.afSelectedDates;
     }
     render() {
-        return (h(Host, { key: '7498df7cd58780209c33cadaa0e65d8a935aa253' }, h("div", { key: 'edcf1672bb743fae4e802a8f73e30401139d89a1', class: Object.assign({ 'digi-calendar-datepicker': true }, this.cssModifiers), id: `${this.afId}-datepicker` }, h("div", { key: '8df4d331ce09fa8df6b333cd3a56f3dfd1b57af7', class: "digi-calendar-datepicker__input-field" }, h("digi-form-input", { key: 'cc59e5a03540fe01340f7ce46817f160868234e0', class: 'digi-calendar-datepicker__input-component', afLabel: this.afLabel, afLabelDescription: this.afLabelDescription, afName: this.afName, afValue: this.inputValue, afValidation: this.isEditing
-                ? FormInputValidation.NEUTRAL
-                : 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) => {
+        return (h(Host, { key: 'f827e4dbd2058dc0b2ae780bab810a4904c80e32' }, h("div", { key: '48fc7ed95e144d2011d0e9a96c898a2eecc81b6c', class: Object.assign({ 'digi-calendar-datepicker': true }, this.cssModifiers), id: `${this.afId}-datepicker` }, h("div", { key: '6b99bec92c6114eb3790317220bd3b2d871fd57a', class: "digi-calendar-datepicker__input-field" }, h("digi-form-input", { key: 'c095c5d036b22934b1a548cf7e53d3bb42e2c9ad', 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();
-                this.isEditing = true;
                 this.parseInput(evt);
             }, onAfOnBlur: (evt) => {
                 evt.stopImmediatePropagation();
-                this.isEditing = false;
-                this.afOnDisplayChange.emit(this.inputValue);
-            }, onKeyDown: () => {
-                this.isEditing = true;
-            } }, h("button", { key: '4a1200715cc96e9cf53a0fb07db6038031cf35cd', id: this.afId + '-button', class: "digi-calendar-datepicker__input-button", slot: "button", "aria-label": this.showCalendar
+                this.afOnDateChangeRawText.emit(this.inputValue);
+            }, onKeyDown: (e) => {
+                if (!this.showCalendar || e.key !== 'Tab' || !e.shiftKey)
+                    return;
+                if (e.target.tagName !== 'INPUT')
+                    return;
+                e.preventDefault();
+                const focusableDateButton = this.hostElement.querySelector('.digi-calendar__date[tabindex="0"]');
+                focusableDateButton === null || focusableDateButton === void 0 ? void 0 : focusableDateButton.focus();
+            } }, h("button", { key: 'e0e24bd46c40f38fe9ebdcbe6b4235a994edbba7', 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" }, this.showCalendar ? (h("digi-icon-x", { class: "digi-calendar-datepicker__button-icon", slot: "icon" })) : (h("digi-icon-calendar-alt", { class: "digi-calendar-datepicker__button-icon", slot: "icon" }))))), h("div", { key: '5db4a77bf061632b589721796236f802f6d9b479', class: "digi-calendar-datepicker__calendar", id: "calendar-popup" }, h("p", { key: '830aa34e80ddd1c73bfc8c8592f3903b925703e5', 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" }, h("digi-icon-calendar-alt", { key: 'c32da1f075986bd27af49b180634736b316f9e21', class: "digi-calendar-datepicker__button-icon", slot: "icon" })))), h("div", { key: '6f2f3214b2205de2b5554d1b207a633f18e32dee', class: "digi-calendar-datepicker__calendar", id: "calendar-popup" }, h("p", { key: 'ca4b3f022c74f980341e8f3a06092c0ff3a4814e', role: "alert", class: "digi-calendar-datepicker__sr-instructions" }, this.showCalendar
             ? `${_t.calendar.screenReaderInstructions}${this.screenReaderUpdateTrigger ? '\u200B' : ''}`
-            : ''), h("digi-calendar", { key: '12a2735b8811e53b618087004e9288fe2e9b8af2', 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, onAfOnDateSelectedChange: (evt) => {
+            : ''), h("digi-calendar", { key: '4a7b3e14f5955d56c4d031c470eafbbc305b06da', 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);
-            }, onAfOnFocusOutside: (evt) => {
-                if (this.showCalendar) {
-                    const relatedTarget = evt.detail.relatedTarget;
-                    if (!relatedTarget)
-                        return;
-                    evt.preventDefault();
-                    const isDateButton = relatedTarget.classList.contains('digi-calendar__date');
-                    const isToggleButton = relatedTarget.id === `${this.afId}-button`;
-                    if (isDateButton) {
-                        this.focusOnCalendarButton();
-                    }
-                    else if (isToggleButton) {
-                        const focusableDateButton = this.hostElement.querySelector('.digi-calendar__date[tabindex="0"]');
-                        focusableDateButton === null || focusableDateButton === void 0 ? void 0 : focusableDateButton.focus();
-                    }
-                }
-            } })), this.afCloseOnSelect && !this.afMultipleDates && (h("div", { key: 'e05fb1b11b44ad4c4f5c7ad452aa7f7e548f8db5', class: "digi-calendar-datepicker__selected-date-alert", role: "alert" }, this.afSelectedDates.length > 0
+            }, onKeyDown: (e) => {
+                if (!this.showCalendar || e.key !== 'Tab' || e.shiftKey)
+                    return;
+                if (!e.target.classList.contains('digi-calendar__date'))
+                    return;
+                e.preventDefault();
+                this.focusOnCalendarInput();
+            } })), this.afCloseOnSelect && !this.afMultipleDates && (h("div", { key: 'c2bf479b2006ac39de70ee222c40c0b1ca0d83ca', class: "digi-calendar-datepicker__selected-date-alert", role: "alert" }, this.afSelectedDates.length > 0
             ? `${_t.calendar.datepicker.selectedDate}: ${this.datesToInputString(this.afSelectedDates)}`
             : '')))));
     }
@@ -404,9 +419,9 @@ export class CalendarDatepicker {
                 "docs": {
                     "tags": [{
                             "name": "en",
-                            "text": "Sets an id attribute. Standard \u00E4r slumpm\u00E4ssig str\u00E4ng."
+                            "text": "Sets an id attribute for the input field, and serves as the base for other ids in the component"
                         }],
-                    "text": "S\u00E4tter ett id attribut."
+                    "text": "S\u00E4tter attributet id f\u00F6r inputf\u00E4ltet, och utg\u00F6r basen f\u00F6r andra id:n i komponenten"
                 },
                 "getter": false,
                 "setter": false,
@@ -429,7 +444,7 @@ export class CalendarDatepicker {
                             "name": "en",
                             "text": "The label text"
                         }],
-                    "text": "Texten till labelelementet"
+                    "text": "Texten till etiketten"
                 },
                 "getter": false,
                 "setter": false,
@@ -452,13 +467,12 @@ export class CalendarDatepicker {
                             "name": "en",
                             "text": "Optional description text"
                         }],
-                    "text": "Valfri beskrivande text"
+                    "text": "Beskrivande text som b\u00F6r ange det f\u00F6rv\u00E4ntade formatet och/eller andra krav"
                 },
                 "getter": false,
                 "setter": false,
                 "attribute": "af-label-description",
-                "reflect": false,
-                "defaultValue": "_t.calendar.datepicker.description"
+                "reflect": false
             },
             "afName": {
                 "type": "string",
@@ -473,9 +487,9 @@ export class CalendarDatepicker {
                 "docs": {
                     "tags": [{
                             "name": "en",
-                            "text": "Sets the 'name' attribute on the inner input element."
+                            "text": "Sets the 'name' attribute on the inner input element"
                         }],
-                    "text": "S\u00E4tter attributet 'name' p\u00E5 det inre input-elementet."
+                    "text": "S\u00E4tter attributet 'name' p\u00E5 det inre input-elementet"
                 },
                 "getter": false,
                 "setter": false,
@@ -570,9 +584,9 @@ export class CalendarDatepicker {
                 "docs": {
                     "tags": [{
                             "name": "en",
-                            "text": "Set input validation message"
+                            "text": "Set input validation message for custom validation"
                         }],
-                    "text": "S\u00E4tter valideringsmeddelandet"
+                    "text": "S\u00E4tter valideringsmeddelandet f\u00F6r egen validering"
                 },
                 "getter": false,
                 "setter": false,
@@ -592,9 +606,9 @@ export class CalendarDatepicker {
                 "docs": {
                     "tags": [{
                             "name": "en",
-                            "text": "Set input validation message"
+                            "text": "Set input validation message for the built-in format validation"
                         }],
-                    "text": "S\u00E4tter valideringsmeddelandet"
+                    "text": "S\u00E4tter valideringsmeddelandet f\u00F6r den inbyggda formatvalideringen"
                 },
                 "getter": false,
                 "setter": false,
@@ -615,9 +629,9 @@ export class CalendarDatepicker {
                 "docs": {
                     "tags": [{
                             "name": "en",
-                            "text": "Set input validation message"
+                            "text": "Set input validation message for the built-in min/max date validation"
                         }],
-                    "text": "S\u00E4tter valideringsmeddelandet"
+                    "text": "S\u00E4tter valideringsmeddelandet f\u00F6r den inbyggda valideringen av min/max-datum"
                 },
                 "getter": false,
                 "setter": false,
@@ -640,7 +654,7 @@ export class CalendarDatepicker {
                             "name": "en",
                             "text": "Input required attribute"
                         }],
-                    "text": "S\u00E4tter attributet 'required'."
+                    "text": "S\u00E4tter attributet 'required'"
                 },
                 "getter": false,
                 "setter": false,
@@ -660,14 +674,15 @@ export class CalendarDatepicker {
                 "docs": {
                     "tags": [{
                             "name": "en",
-                            "text": "Set this to true to disable internal validation."
+                            "text": "Set this to true to disable internal validation"
                         }],
-                    "text": "S\u00E4tt denna till true f\u00F6r att st\u00E4nga av komponentens egna validering."
+                    "text": "S\u00E4tt denna till true f\u00F6r att st\u00E4nga av komponentens egna validering"
                 },
                 "getter": false,
                 "setter": false,
                 "attribute": "af-disable-validation",
-                "reflect": false
+                "reflect": false,
+                "defaultValue": "false"
             },
             "afRequiredText": {
                 "type": "string",
@@ -682,9 +697,9 @@ export class CalendarDatepicker {
                 "docs": {
                     "tags": [{
                             "name": "en",
-                            "text": "Set text for afRequired."
+                            "text": "Set text for afRequired"
                         }],
-                    "text": "S\u00E4tter text f\u00F6r afRequired."
+                    "text": "S\u00E4tter text f\u00F6r afRequired"
                 },
                 "getter": false,
                 "setter": false,
@@ -840,9 +855,9 @@ export class CalendarDatepicker {
                 "docs": {
                     "tags": [{
                             "name": "en",
-                            "text": "Show week number in the calander. Default is false"
+                            "text": "Show week number in the calander."
                         }],
-                    "text": "Visa veckonummer i kalender. F\u00F6rvalt \u00E4r false"
+                    "text": "Visa veckonummer i kalender"
                 },
                 "getter": false,
                 "setter": false,
@@ -863,9 +878,9 @@ export class CalendarDatepicker {
                 "docs": {
                     "tags": [{
                             "name": "en",
-                            "text": "Set this to true to be able to select multiple dates in the calander. Default is false"
+                            "text": "Set this to true to be able to select multiple dates in the calander"
                         }],
-                    "text": "S\u00E4tt denna till true f\u00F6r att kunna markera mer en ett datum i kalendern. F\u00F6rvalt \u00E4r false"
+                    "text": "S\u00E4tt denna till true f\u00F6r att kunna markera mer en ett datum i kalendern"
                 },
                 "getter": false,
                 "setter": false,
@@ -886,15 +901,40 @@ export class CalendarDatepicker {
                 "docs": {
                     "tags": [{
                             "name": "en",
-                            "text": "Set this to true if the calendar should close when a date is selected. Default is false"
+                            "text": "Set this to true if the calendar should close when a date is selected"
                         }],
-                    "text": "S\u00E4tt denna till true om kalendern ska st\u00E4ngas n\u00E4r anv\u00E4ndaren v\u00E4ljer ett datum. F\u00F6rvalt \u00E4r false"
+                    "text": "S\u00E4tt denna till true om kalendern ska st\u00E4ngas n\u00E4r anv\u00E4ndaren v\u00E4ljer ett datum"
                 },
                 "getter": false,
                 "setter": false,
                 "attribute": "af-close-on-select",
                 "reflect": false,
                 "defaultValue": "false"
+            },
+            "afOpenCalendarTo": {
+                "type": "unknown",
+                "mutable": false,
+                "complexType": {
+                    "original": "Date",
+                    "resolved": "Date",
+                    "references": {
+                        "Date": {
+                            "location": "global",
+                            "id": "global::Date"
+                        }
+                    }
+                },
+                "required": false,
+                "optional": false,
+                "docs": {
+                    "tags": [{
+                            "name": "en",
+                            "text": "Controls which month is shown from start, and which date button is the entry point for keyboard navigation. If not provided, selected date or today's date is used."
+                        }],
+                    "text": "Styr vilken m\u00E5nad som visas fr\u00E5n start, samt vilken datumknapp som \u00E4r ing\u00E5ngspunkt f\u00F6r tangentbordsnavigering. Om inte angiven anv\u00E4nds valt datum eller dagens datum."
+                },
+                "getter": false,
+                "setter": false
             }
         };
     }
@@ -903,8 +943,7 @@ export class CalendarDatepicker {
             "showWrongFormatError": {},
             "showDisabledDateError": {},
             "showCalendar": {},
-            "userInput": {},
-            "isEditing": {}
+            "userInput": {}
         };
     }
     static get events() {
@@ -917,9 +956,9 @@ export class CalendarDatepicker {
                 "docs": {
                     "tags": [{
                             "name": "en",
-                            "text": "Sends the value as an array of Date objects when the date is updated."
+                            "text": "Sends the value as an array of Date objects when the date is updated"
                         }],
-                    "text": "Skickar v\u00E4rdet som en array av Date-objekt n\u00E4r datumet uppdateras."
+                    "text": "Skickar v\u00E4rdet som en array av Date-objekt n\u00E4r datumet uppdateras"
                 },
                 "complexType": {
                     "original": "Date[]",
@@ -932,17 +971,17 @@ export class CalendarDatepicker {
                     }
                 }
             }, {
-                "method": "afOnDisplayChange",
-                "name": "afOnDisplayChange",
+                "method": "afOnDateChangeRawText",
+                "name": "afOnDateChangeRawText",
                 "bubbles": true,
                 "cancelable": true,
                 "composed": true,
                 "docs": {
                     "tags": [{
                             "name": "en",
-                            "text": "Sends the string displayed in the input field when the date is updated."
+                            "text": "Sends the string displayed in the input field when the date is updated"
                         }],
-                    "text": "Skickar str\u00E4ngen som visas i inputf\u00E4ltet n\u00E4r datumet uppdateras."
+                    "text": "Skickar str\u00E4ngen som visas i inputf\u00E4ltet n\u00E4r datumet uppdateras"
                 },
                 "complexType": {
                     "original": "string",
@@ -958,13 +997,13 @@ export class CalendarDatepicker {
                 "docs": {
                     "tags": [{
                             "name": "en",
-                            "text": "Emits validation status as a boolean when validation occurs."
+                            "text": "Emits the validation result"
                         }],
-                    "text": "Skickar valideringsstatus som en boolean n\u00E4r validering sker."
+                    "text": "Skickar resultatet n\u00E4r validering sker"
                 },
                 "complexType": {
-                    "original": "{ valid: boolean }",
-                    "resolved": "{ valid: boolean; }",
+                    "original": "{\n    isValid: boolean;\n    validationText?: string;\n  }",
+                    "resolved": "{ isValid: boolean; validationText?: string; }",
                     "references": {}
                 }
             }];

package/dist/collection/components/_calendar/week-view/calendar-week-view.js

@@ -110,7 +110,7 @@ export class CalendarWeekView {
                 format(new Date(lastDate), 'MMMM yyyy', { locale: svlocale });
     }
     render() {
-        return (h("div", { key: 'cf671623b23a03523dfd3ec0db0eec3df6f2dd76', class: "digi-calendar-week-view" }, h("nav", { key: '6aa79f9093a643a04a5b142dd64bc4647b69f6df', class: "digi-calendar-week-view__timepicker" }, h("div", { key: 'a264a62fc6ef4f5c07a4618480a96792bd3827df', class: "digi-calendar-week-view__dates" }, h("div", { key: '8d7341cee9dcb0282273f3404c6885938de7f01d', class: "digi-calendar-week-view__flex" }, h("digi-typography", { key: 'ee209d98aa8899b55d912a0d26cd598c702f222e' }, h(this.afHeadingLevel, { key: 'eb23f5e42e562c2d0a880f0d70d09e662321f4e9', role: "status", class: "digi-calendar-week-view__heading" }, h("span", { key: '5ea2d7a5d2e87ac3cb9393a36954b2d85ae9db35', class: "digi-calendar-week-view__month" }, this.currentMonth), h("span", { key: 'f534204d77350b0bade6d081d221d68e3555ea88', class: "digi-calendar-week-view__week" }, ' ', "v.", this.currentWeek))), h("ul", { key: '816553435601ca5a4d7197c35ff46af328cdf62e', class: "digi-calendar-week-view__date-list" }, this.weekDays.map((dateItem) => {
+        return (h("div", { key: '967ccb9710018973a960ae36d52157ba85dacfed', class: "digi-calendar-week-view" }, h("nav", { key: '6a9137d8f8a8e652d26d099ae652cb76e5665b51', class: "digi-calendar-week-view__timepicker" }, h("div", { key: 'a2b8aaeaa93e391e65847b2ea8f9b455e86474f1', class: "digi-calendar-week-view__dates" }, h("div", { key: '0cc675c0cd67d042e5e27a38a6665ab30e516cea', class: "digi-calendar-week-view__flex" }, h("digi-typography", { key: 'd47f59955354cb435dc80895059c6e4fd6eefa8a' }, h(this.afHeadingLevel, { key: 'f01725e82afff23b8ae357b30af909b325d85279', role: "status", class: "digi-calendar-week-view__heading" }, h("span", { key: 'bbfab19eec8776e640ed235654c0fd960faf5722', class: "digi-calendar-week-view__month" }, this.currentMonth), h("span", { key: 'a3a52801083cd83351056d474e01df926d8b0117', class: "digi-calendar-week-view__week" }, ' ', "v.", this.currentWeek))), h("ul", { key: 'a3f3703318fa5400cd32ee5d3af896900a032acd', class: "digi-calendar-week-view__date-list" }, this.weekDays.map((dateItem) => {
             const date = format(new Date(dateItem), 'd', {
                 locale: svlocale
             });
@@ -130,15 +130,15 @@ export class CalendarWeekView {
                 } }, day), h("span", { class: "digi-calendar-week-view__date-button-date" }, date), h("span", { "aria-hidden": "true", class: {
                     'digi-calendar-week-view__date-button-circle': dateItem === this.todaysDate
                 } })))));
-        })))), h("digi-button", { key: 'b3e13206cde9240aff492b1875f68f372779c53a', onClick: () => this.prevWeek(), class: {
+        })))), h("digi-button", { key: '2edb685459c4cbf8a0120ab340672b17d0ea3f9f', onClick: () => this.prevWeek(), class: {
                 'digi-calendar-week-view__week-button digi-calendar-week-view__week-button--previous': true,
                 'digi-calendar-week-view__week-button--keep-left': this.currentWeek == getISOWeek(this.maxDate),
                 'digi-calendar-week-view__week-button--hidden': !(this.currentWeek > getISOWeek(this.minDate))
-            }, "af-variation": "secondary" }, h("digi-icon-chevron-left", { key: '4c2913caad1960fac926fd167601229e6e4b6864', slot: "icon" }), this.prevWeekText), h("digi-button", { key: '32f46f7f0752a8b26d273075f16763f2cf725171', onClick: () => this.nextWeek(), class: {
+            }, "af-variation": "secondary" }, h("digi-icon-chevron-left", { key: '8948b12a1654f9ef46728ea8de3b1df5f40addcd', slot: "icon" }), this.prevWeekText), h("digi-button", { key: '729ed8eebce68168b66c5365588a52b1279eec3f', onClick: () => this.nextWeek(), class: {
                 'digi-calendar-week-view__week-button digi-calendar-week-view__week-button--next': true,
                 'digi-calendar-week-view__week-button--keep-right': this.currentWeek == getISOWeek(this.minDate),
                 'digi-calendar-week-view__week-button--hidden': !(this.currentWeek < getISOWeek(this.maxDate))
-            }, "af-variation": "secondary" }, h("digi-icon-chevron-right", { key: '7d5f0845dc359264849d55327ef7b1fdc195dd9a', slot: "icon-secondary" }), this.nextWeekText)), h("div", { key: 'f2b405ff5781a66353b718de8ed4043e8c499401', role: "status", "aria-live": "assertive", class: "digi-calendar-week-view__result", id: `${this.afId}-result` }, h("digi-typography", { key: 'a11e26bab95f41515c948d69ea54f3a89fc37a60' }, h("slot", { key: 'acfe0aadbd1b7607d1d78b1be9d607b9b5ba74c2' })))));
+            }, "af-variation": "secondary" }, h("digi-icon-chevron-right", { key: '75bf1669a5d9dd3f618661c79202dc8e69f6c8ea', slot: "icon-secondary" }), this.nextWeekText)), h("div", { key: 'c7379a321936f28783d2f7a4e1e94d0b119de471', role: "status", "aria-live": "assertive", class: "digi-calendar-week-view__result", id: `${this.afId}-result` }, h("digi-typography", { key: 'f7e55435a94c5bff18a3b4b7bfa5d397291f7e8c' }, h("slot", { key: '7c59e144a47c721f5f4a454b9776c708f6d2f15c' })))));
     }
     static get is() { return "digi-calendar-week-view"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/_chart/bar-chart/bar-chart.js

@@ -1425,7 +1425,7 @@ export class barChart {
 				<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></p>`;
             }
         }
-        return (h(Host, { key: '2d4b4d87fda1641635042c67028b7c84549f96cd', ref: (el) => (this._host = el) }, h("div", { key: '67ab0146d75868e264ab3634d2d0238948d6b0c1', class: "topWrapper", ref: (el) => (this._titleDiv = el) }, h("digi-typography", { key: 'fecc4f007b31d84d881df69a1b872e12baff0f41', class: "chartTitle", innerHTML: heading }), h("digi-button", { key: '5984634338df29ed910c918419d754f55cd9b58f', class: "buttonWrapper tableButton", "af-size": "medium", "af-variation": "function", "af-full-width": "false", onAfOnClick: this.activateTable, afAriaLabel: `Visa tabell ${((_b = this._chartData) === null || _b === void 0 ? void 0 : _b.title) ? (_c = this._chartData) === null || _c === void 0 ? void 0 : _c.title.toLowerCase() : ''}` }, h("digi-icon-table", { key: '96a9908153fccece462b14d8d9d9d44ecf2e6087', slot: "icon" }), "Visa tabell"), h("digi-button", { key: '5e74950e7740943936dbd0aa53fe6d7806d2664a', style: { display: 'none' }, class: "buttonWrapper chartButton", "af-size": "medium", "af-variation": "function", "af-full-width": "false", onAfOnClick: this.reInitChart, afAriaLabel: `Visa diagram ${((_d = this._chartData) === null || _d === void 0 ? void 0 : _d.title) ? (_e = this._chartData) === null || _e === void 0 ? void 0 : _e.title.toLowerCase() : ''}` }, h("digi-icon-chart", { key: 'f46f6a52186bbdf22942bf81372648489a90b870', slot: "icon" }), "Visa diagram"), h("div", { key: '628f26fd9c13494c179e3392a5aa2a8775d98773', class: "scChartStatus", role: "status", ref: (el) => (this._status = el) })), h("div", { key: '5b510ad07b70def68a7c5bceae26814b867a326b', class: "chartTooltip", id: this.afId }, h("div", { key: '1c95d989c252c724682e180c9095370b1363a4d9', class: "tooltipBody" }), h("digi-icon-x", { key: '8911b337cd7420b6dccb4c2e749881aaac979f7c', class: "close" }), this.afVariation === BarChartVariation.Horizontal ? (h("digi-icon-caret-up", null)) : (h("digi-icon-caret-down", null))), h("div", { key: '80e03627039492a5b9d64e0089cb830720301fee', ref: (el) => (this._chartDiv = el) }, " "), h("div", { key: '9e7d0772a59a50a8143de51ff59fa07ea56776d1', class: "legend", ref: (el) => (this._legendDiv = el) }), h("div", { key: '00b5b278015f6ec6fed1170f9b693a2b9150dc25', class: "table", ref: (el) => (this._tableDiv = el) }, ' ')));
+        return (h(Host, { key: '7659fcc4817cdfb3f19f2bd11a41464c13b5e19e', ref: (el) => (this._host = el) }, h("div", { key: '063611cf8dbb2554904d972ed3fc1f89d714772e', class: "topWrapper", ref: (el) => (this._titleDiv = el) }, h("digi-typography", { key: 'ad58c43c2629e7b2b97e3ad1658646e5171b1531', class: "chartTitle", innerHTML: heading }), h("digi-button", { key: '2234460c0ffab8e7d251f099f4f2d38e1e5ebede', class: "buttonWrapper tableButton", "af-size": "medium", "af-variation": "function", "af-full-width": "false", onAfOnClick: this.activateTable, afAriaLabel: `Visa tabell ${((_b = this._chartData) === null || _b === void 0 ? void 0 : _b.title) ? (_c = this._chartData) === null || _c === void 0 ? void 0 : _c.title.toLowerCase() : ''}` }, h("digi-icon-table", { key: 'b82a89d578d997ab878d44a2928e5e31773bd34f', slot: "icon" }), "Visa tabell"), h("digi-button", { key: 'b5dc532f7655bd383d0dcf42f8851edbc81b448c', style: { display: 'none' }, class: "buttonWrapper chartButton", "af-size": "medium", "af-variation": "function", "af-full-width": "false", onAfOnClick: this.reInitChart, afAriaLabel: `Visa diagram ${((_d = this._chartData) === null || _d === void 0 ? void 0 : _d.title) ? (_e = this._chartData) === null || _e === void 0 ? void 0 : _e.title.toLowerCase() : ''}` }, h("digi-icon-chart", { key: 'f868d9fd2c37c247e8abdd59cf2b9342ad120fef', slot: "icon" }), "Visa diagram"), h("div", { key: '6a0f7838d86a43b46d9a036ad935f50ebb2b523f', class: "scChartStatus", role: "status", ref: (el) => (this._status = el) })), h("div", { key: '5f37b9eaf1030cd1d5b1b0360cdaaa61f953b624', class: "chartTooltip", id: this.afId }, h("div", { key: 'a89608cb64620456a165ba4fb57db823870d2231', class: "tooltipBody" }), h("digi-icon-x", { key: 'e842c2b42f6bc7d6dfdad1d1b8a7acb9f8df5a1a', class: "close" }), this.afVariation === BarChartVariation.Horizontal ? (h("digi-icon-caret-up", null)) : (h("digi-icon-caret-down", null))), h("div", { key: 'f07154ab370a948016aa30a2547c4c9b25fae03b', ref: (el) => (this._chartDiv = el) }, " "), h("div", { key: '385151df18d373779257040d298bf8c108184500', class: "legend", ref: (el) => (this._legendDiv = el) }), h("div", { key: 'd5f07fc01a628aa2035a96d86621b6bab1e73f01', class: "table", ref: (el) => (this._tableDiv = el) }, ' ')));
     }
     static get is() { return "digi-bar-chart"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/_chart/chart-line/chart-line.js

@@ -1616,7 +1616,7 @@ export 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 (h("host", { key: '3fd0ff05a416b160b504118a59440c3cd45540e1', ref: (el) => (this._host = el) }, h("div", { key: '72f480c3f41004e8892ecc758efb5f17f19975d6', class: "topWrapper", ref: (el) => (this._titleDiv = el) }, h("digi-typography", { key: '14e57f41d3bdddc8d4dbf4a427d49c8f8efe4042', class: "chartTitle", innerHTML: heading }), h("digi-button", { key: '1d7f6264bc92f59cb3435e52f2c9c6d543b1f1ff', 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() : ''}` }, h("digi-icon-table", { key: 'e30a5c70a165006be7d26ae7d2dce0194f7ef1db', slot: "icon" }), "Visa tabell"), h("digi-button", { key: '736bc6dca71ac63039af38291b83954319823f86', 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() : ''}` }, h("digi-icon-chart", { key: '785c60026da5b10357c576536fc961b4de240bc8', slot: "icon" }), "Visa diagram"), h("div", { key: '80c1446c2d0ed934240c76594b4d57c473ebe287', class: "scChartStatus", role: "status", ref: (el) => (this._status = el) })), h("div", { key: 'c1967d458dff110cac2c38ad5c6c7b1c0a9349ff', class: "chartTooltip", id: this.afId }, h("div", { key: '18c1ac0babb851fd86f8ebc82587179142cf427c', class: "tooltipHead" }, h("digi-icon-x", { key: '7eec9f8fc3c154e3e26c998d618d02da66d7e380', class: "close" }), ' '), h("div", { key: '358497a7f175754f43fb106d3a9d26e310923653', class: "tooltipBody" })), h("div", { key: '0013f988af31ddc540efe0d29ea1760eab60b34d', class: "chart", ref: (el) => (this._chartDiv = el) }), h("div", { key: '222ca9c2fe1acaef91fed817f5a885fb9bf89565', class: "legend", ref: (el) => (this._legendDiv = el) }), h("div", { key: 'f6990353582af550e483ed78f06b5776c55811da', class: "table", ref: (el) => (this._tableDiv = el) }, ' ')));
+        return (h("host", { key: '0aab34e11f412e3fea690e806cd2d9067bcafe09', ref: (el) => (this._host = el) }, h("div", { key: '941eef6b6e130641acec11ec4ee893611a811d75', class: "topWrapper", ref: (el) => (this._titleDiv = el) }, h("digi-typography", { key: '2f4a69e973def39e52ef01bea01d2c6fe9accc47', class: "chartTitle", innerHTML: heading }), h("digi-button", { key: 'e7b8e1e0a202b33b1a3a32af43d642fd925dff90', 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() : ''}` }, h("digi-icon-table", { key: '5dbedd2ceed7ef62100f610c57496675a2b2254b', slot: "icon" }), "Visa tabell"), h("digi-button", { key: '9a0d402143c1087582f88ec8b8a12152fe665a3d', 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() : ''}` }, h("digi-icon-chart", { key: '082bd94e92917727ed627cce01daf437f71fcf39', slot: "icon" }), "Visa diagram"), h("div", { key: 'e0c445ff5e9c6832831d45ee1e8bd1c37c8c6ecc', class: "scChartStatus", role: "status", ref: (el) => (this._status = el) })), h("div", { key: 'f012774817ee966de745cc20dd2410a44c7562d7', class: "chartTooltip", id: this.afId }, h("div", { key: 'da2b1f257ff3fb7b6b141af96fd85ebf3442accd', class: "tooltipHead" }, h("digi-icon-x", { key: 'a50f73e003c912a4123a83f4c64cd5cc03bf6c68', class: "close" }), ' '), h("div", { key: '25013c3bd2d261beed1bafce41d599b7625b5bbe', class: "tooltipBody" })), h("div", { key: '7d8ee22026572d3c6cdce7200c98c3b665ba948b', class: "chart", ref: (el) => (this._chartDiv = el) }), h("div", { key: 'bf0d27d67c1c86d701401828ec59bd6f873a96f7', class: "legend", ref: (el) => (this._legendDiv = el) }), h("div", { key: 'b3539e60f97683d40b50e91be789eb78ab6d7061', class: "table", ref: (el) => (this._tableDiv = el) }, ' ')));
     }
     static get is() { return "digi-chart-line"; }
     static get encapsulation() { return "scoped"; }

package/dist/collection/components/_code/code/code.js

@@ -36,7 +36,7 @@ export class Code {
         };
     }
     render() {
-        return (h("span", { key: 'fe5bd7c4e18d5038c0edb7d3be15451069a86388', class: Object.assign({ 'digi-code': true }, this.cssModifiers) }, h("code", { key: 'f5a186e1fd1c8021216c26bb2220460b4cd47921', class: `digi-code__code language-${this.afLanguage}`, lang: this.afLang, innerHTML: this.highlightedCode })));
+        return (h("span", { key: '8b58df902f5d794e1874e6b0f6f7790b5a10985d', class: Object.assign({ 'digi-code': true }, this.cssModifiers) }, h("code", { key: '3e26521ae19d2c7e08ab30a24e1c328ee709fa94', class: `digi-code__code language-${this.afLanguage}`, lang: this.afLang, innerHTML: this.highlightedCode })));
     }
     static get is() { return "digi-code"; }
     static get originalStyleUrls() {

package/dist/collection/components/_code/code-block/code-block.js

@@ -46,7 +46,7 @@ export class CodeBlock {
         };
     }
     render() {
-        return (h("div", { key: '7da7c24753c591cf5d4cbaae14a8216656845fe1', class: Object.assign({ 'digi-code-block': true }, this.cssModifiers) }, h("pre", { key: 'ed0d821a7de52b976c43f400f3d18133748daf66', class: `digi-code-block__pre language-${this.afLanguage}` }, h("code", { key: 'aec25bc79623ab7228a49c06ca94085966c0703e', class: "digi-code-block__code", lang: this.afLang, innerHTML: this.highlightedCode })), !this.afHideToolbar && (h("div", { key: '96613b6086dfddf05e3c750940166a3a47dd669b', class: "digi-code-block__toolbar" }, h("digi-button", { key: 'e24b2810009f096b615b600aefde8f9f5b2938f4', class: "digi-code-block__button", onAfOnClick: () => this.copyButtonClickHandler(), afVariation: ButtonVariation.FUNCTION, afSize: ButtonSize.SMALL }, h("digi-icon-copy", { key: '78df6930d661b8fbeca5e0d9d28ea40039efe904', class: "digi-code-block__icon", "aria-hidden": "true", slot: "icon" }), _t.code.copy)))));
+        return (h("div", { key: 'efc4eab4b814bc5ec01559f89d951d694ed695e1', class: Object.assign({ 'digi-code-block': true }, this.cssModifiers) }, h("pre", { key: '85b42423a9f62a227739e3107972251f9a825a97', class: `digi-code-block__pre language-${this.afLanguage}` }, h("code", { key: '266c28f90184f60eab0fc1febf743a53f46aab3b', class: "digi-code-block__code", lang: this.afLang, innerHTML: this.highlightedCode })), !this.afHideToolbar && (h("div", { key: '6230d33b96b03f7ea584d3b93efff81f636bad18', class: "digi-code-block__toolbar" }, h("digi-button", { key: 'b54ad1cc57faafeb0f82cc0de0865cf3e585fddf', class: "digi-code-block__button", onAfOnClick: () => this.copyButtonClickHandler(), afVariation: ButtonVariation.FUNCTION, afSize: ButtonSize.SMALL }, h("digi-icon-copy", { key: 'f223bd2e83be5d853c78c0322d69c7fe34cd257a', class: "digi-code-block__icon", "aria-hidden": "true", slot: "icon" }), _t.code.copy)))));
     }
     static get is() { return "digi-code-block"; }
     static get originalStyleUrls() {

package/dist/collection/components/_code/code-example/code-example.js

@@ -137,17 +137,17 @@ export class CodeExample {
             .replace(/\w/, (firstLetter) => firstLetter.toUpperCase());
     }
     render() {
-        return (h("div", { key: '92832626f4ab9639e40dcd035b19cda093241fa8', class: Object.assign({ 'digi-code-example': true }, this.cssModifiers), ref: (el) => (this.containerElement = el) }, h("div", { key: '34065a2b928886bcdafee852c8bbde3cbcaa0fcb', class: {
+        return (h("div", { key: '2504eb214d681d53d5db5f7ee4bbf070da4ac6bd', class: Object.assign({ 'digi-code-example': true }, this.cssModifiers), ref: (el) => (this.containerElement = el) }, h("div", { key: 'a0ceb68001efe0e88fa477ad8c2d01c9b1dd8644', class: {
                 'digi-code-example__container': true
-            } }, h("div", { key: '35d295b3357c3cbd52a1355b1bf4bde93a1adc47', class: "digi-code-example__example" }, h("slot", { key: '1f6be5b28348188541226eb3c9a34442003ab634' })), !this.afHideCode && (h("div", { key: '297c430dbb2ae80a9b189477a04b399bbdae573b', class: "digi-code-example__code" }, this.showMoreButton && (h("button", { key: '5021875d50836b270b8cedbe27e0811d6c7b12d3', class: "digi-code-example__code-expand", "aria-label": this.isActive ? _t.code.show_less : _t.code.show_more, "aria-expanded": this.isActive ? `true` : `false`, onClick: () => this.toggleButtonClickHandler() }, this.isActive ? _t.code.show_less : _t.code.show_more, ' ', h("digi-icon-chevron-down", { key: '750c97bbebe294c414c77a644e2f9f37f678b448', class: {
+            } }, h("div", { key: '175257f48da6faf68791e79cca21b7ac32fcc7bf', class: "digi-code-example__example" }, h("slot", { key: '9f4c44dcc64eb3b3b8a471218052a59c2fd415e5' })), !this.afHideCode && (h("div", { key: '438208775e65656d25cccae3870a5efb892d176e', class: "digi-code-example__code" }, this.showMoreButton && (h("button", { key: '8fcbeaa3373450f5811d27bae2a2e7920f7949ea', class: "digi-code-example__code-expand", "aria-label": this.isActive ? _t.code.show_less : _t.code.show_more, "aria-expanded": this.isActive ? `true` : `false`, onClick: () => this.toggleButtonClickHandler() }, this.isActive ? _t.code.show_less : _t.code.show_more, ' ', h("digi-icon-chevron-down", { key: 'df424b79ffa72a86c9af76c5445d8ba6af01c0bc', class: {
                 'digi-code-example__code-expand-icon': true,
                 'digi-code-example__code-expand-icon--open': this.isActive
-            }, "aria-hidden": "true" }))), h("div", { key: 'b7179ceec32acda3f2e6f2f9baec813ce791e72d', class: {
+            }, "aria-hidden": "true" }))), h("div", { key: 'bda1ff7309767aafa1feef42769b197d16c4484b', class: {
                 'digi-code-example__codeblock': true,
                 'digi-code-example__codeblock--light': this.afCodeBlockVariation === 'light',
                 'digi-code-example__codeblock--dark': this.afCodeBlockVariation === 'dark',
                 'digi-code-example__codeblock--fade': !this.isActive && this.showMoreButton
-            } }, h("digi-code-block", { key: '83dc582d0daffeeef6722bd7bfe5db78e465dd58', afCode: this.codeExample || '', afLanguage: this.afLanguage.toLowerCase(), afVariation: this.afCodeBlockVariation, "af-hide-toolbar": true }), !this.isActive ? (h("div", { class: {
+            } }, h("digi-code-block", { key: 'e9a3ac82bbe4a6aca0ce15aa697efdb5ec5ec9f5', afCode: this.codeExample || '', afLanguage: this.afLanguage.toLowerCase(), afVariation: this.afCodeBlockVariation, "af-hide-toolbar": true }), !this.isActive ? (h("div", { class: {
                 'digi-code-example__fade': true,
                 'digi-code-example__fade--dark': this.afCodeBlockVariation === 'dark',
                 'digi-code-example__fade--light': this.afCodeBlockVariation === 'light'

package/dist/collection/components/_dialog/dialog/dialog.js

@@ -234,11 +234,11 @@ export class Dialog {
         };
     }
     render() {
-        return (h(Host, { key: '1042565e08a72c9512c65764bbfe543f12ab9930', ref: (el) => {
+        return (h(Host, { key: 'b6fa143b71709908623eda3f8fda037f523a4f90', ref: (el) => {
                 this._host = el;
-            } }, this.afShowDialog && (h("div", { key: '19cd13160ff92c02c838a6e6418aa0f41eb382d9', class: Object.assign({ 'digi-dialog': true }, this.cssModifiers) }, h("digi-util-keydown-handler", { key: '197bc7df564a9510bd4c3723e0cf7c0dcd518467', onAfOnEsc: (e) => this.escHandler(e), onAfOnTab: (e) => this.tabHandler(e), onAfOnShiftTab: (e) => this.shiftHandler(e), class: "digi-dialog__keydown-handler" }, h("div", { key: '8dee3b4c1df6bbb3760f4b764e8a0833a34fa538', ref: (el) => {
+            } }, this.afShowDialog && (h("div", { key: '46ae05735ed8f54c75a82b5cc5e23effae77e745', class: Object.assign({ 'digi-dialog': true }, this.cssModifiers) }, h("digi-util-keydown-handler", { key: '0740b3466fc4a3ac52bfe0a3d5d58fe2399c4474', onAfOnEsc: (e) => this.escHandler(e), onAfOnTab: (e) => this.tabHandler(e), onAfOnShiftTab: (e) => this.shiftHandler(e), class: "digi-dialog__keydown-handler" }, h("div", { key: 'd6da8ca0633774200dff4ade8fb170f2fd19b6b9', ref: (el) => {
                 this._wrapper = el;
-            }, role: "dialog", "aria-modal": "true", class: "digi-dialog__content" }, h("digi-typography", { key: '9f91050295a0af97898292c5bd088004160e022d' }, this.afCloseButtonText && (h("digi-button", { key: '404f184d925acda67f90220589847fc25541b165', ref: (el) => (this._closeButton = el), class: "digi-dialog__close-button", afAriaLabel: this.afCloseButtonText, afSize: ButtonSize.MEDIUM, "af-variation": "function", onAfOnClick: (e) => this.closeDialog(e) }, this.afCloseButtonText, h("digi-icon-x", { key: 'c997126d5b43ee4243f3232bd1197f83e714f6c9', class: "digi-dialog__close-icon", slot: "icon-secondary" }))), h("slot", { key: '55ae410a6893d354ed827ee29cd056740132f599', name: "over-heading" }), this.afHeadingLevel && this.afHeading && (h(this.afHeadingLevel, { key: '416e7678abc6be26ab0e0571c0b73c91eb04b65f', tabindex: "-1", ref: (el) => (this._dialogHeading = el) }, this.afHeading)), h("slot", { key: '1e27a7c8709f8b8374c221ef4e47b19202e2068c' }), h("div", { key: '6446138b88ab4e38193208d346c9a21300033f09', ref: (el) => (this._buttonContainer = el), class: "digi-dialog__button-container" }, this.afSecondaryButtonText && (h("digi-button", { key: 'ad5045a4a6949a9f9bb7d6ab199a34aea12b7950', ref: (el) => (this._secondaryButton = el), afVariation: ButtonVariation.SECONDARY, onAfOnClick: (e) => this.secondaryClickHandler(e) }, this.afSecondaryButtonText)), this.afPrimaryButtonText && (h("digi-button", { key: 'c03997ae763eeaa8f7047d909dcf668394618e83', ref: (el) => (this._primaryButton = el), afVariation: ButtonVariation.PRIMARY, onAfOnClick: (e) => this.primaryClickHandler(e) }, this.afPrimaryButtonText))))))))));
+            }, role: "dialog", "aria-modal": "true", class: "digi-dialog__content" }, h("digi-typography", { key: 'e5532e07a112ba5cadc4f4ee012c7c0b1ebc7eac' }, this.afCloseButtonText && (h("digi-button", { key: 'e52c53a254adfca3c0e7d22500f381877feb798d', ref: (el) => (this._closeButton = el), class: "digi-dialog__close-button", afAriaLabel: this.afCloseButtonText, afSize: ButtonSize.MEDIUM, "af-variation": "function", onAfOnClick: (e) => this.closeDialog(e) }, this.afCloseButtonText, h("digi-icon-x", { key: '78b867c769a5f170a7b09270f0a466358febd0df', class: "digi-dialog__close-icon", slot: "icon-secondary" }))), h("slot", { key: '20b204bea4212367ed6202e73185ee0f63ab85f3', name: "over-heading" }), this.afHeadingLevel && this.afHeading && (h(this.afHeadingLevel, { key: '20b227dc35ebe307589e097cb64bcd7c47913729', tabindex: "-1", ref: (el) => (this._dialogHeading = el) }, this.afHeading)), h("slot", { key: '2c5f707d8a5db9957a252e1a6a454824521b6541' }), h("div", { key: '167c44e5b9827f66b9355180d6af6a9fc8f783ad', ref: (el) => (this._buttonContainer = el), class: "digi-dialog__button-container" }, this.afSecondaryButtonText && (h("digi-button", { key: 'bca5ce02a71c2c4b43ec7eaebcc70016c5ea1d98', ref: (el) => (this._secondaryButton = el), afVariation: ButtonVariation.SECONDARY, onAfOnClick: (e) => this.secondaryClickHandler(e) }, this.afSecondaryButtonText)), this.afPrimaryButtonText && (h("digi-button", { key: '1208655a175f323aa4bff70b0cf8daa28e2f3e86', ref: (el) => (this._primaryButton = el), afVariation: ButtonVariation.PRIMARY, onAfOnClick: (e) => this.primaryClickHandler(e) }, this.afPrimaryButtonText))))))))));
     }
     static get is() { return "digi-dialog"; }
     static get encapsulation() { return "shadow"; }

package/dist/collection/components/_expandable/expandable-accordion/expandable-accordion.js

@@ -78,7 +78,7 @@ export class ExpandableAccordion {
         this.afOnClick.emit(e);
     }
     render() {
-        return (h("article", { key: '336241503377b02740b45d89667bbc54b1b35ed0', "aria-expanded": this.afExpanded ? 'true' : 'false', class: Object.assign({ 'digi-expandable-accordion': true }, this.cssModifiers) }, h("header", { key: '7c6bed5fec11cb270498e60b9f8ae5590224f1d0', class: "digi-expandable-accordion__header" }, h(this.afHeadingLevel, { key: '3987d2afeed73945dcbcaa7e7dead17d18c88aa1', class: "digi-expandable-accordion__heading" }, h("button", { key: '82e91f6e4ca556f0de5dbd4916c9bc3d4c3e1a42', type: "button", class: "digi-expandable-accordion__button", onClick: (e) => this.clickToggleHandler(e), "aria-expanded": this.afExpanded ? 'true' : 'false', "aria-controls": `${this.afId}-content`, ref: (el) => (this._button = el) }, h("digi-icon-chevron-down", { key: 'd3100e528c4f93c03ae693c45f5a885d415e8f07', class: "digi-expandable-accordion__toggle-icon" }), h("div", { key: '1743582efce077cfedca361a3aa7c0b11e637c48', class: "digi-expandable-accordion__heading-text" }, this.afHeading)))), h("section", { key: '95fa885be60518b90364f9416074746fc9d5dfaa', class: "digi-expandable-accordion__content", id: `${this.afId}-content` }, h("div", { key: 'dd1bfbdc18dfbc0418747883ab5fda8235f91ddc' }, h("digi-typography", { key: 'd4fa43c03b777bf0734a7dab2457716e201e160c' }, h("slot", { key: '37e15ae8fbdb33bff41b4e37729f1d3efdf769c6' }))))));
+        return (h("article", { key: 'b08e4bbb4a2956b84516f66657d6325e734d48c2', "aria-expanded": this.afExpanded ? 'true' : 'false', class: Object.assign({ 'digi-expandable-accordion': true }, this.cssModifiers) }, h("header", { key: 'e41faee765bdd4102afeafdb4bc8d16968a68f32', class: "digi-expandable-accordion__header" }, h(this.afHeadingLevel, { key: 'f4d7007ac8251c13c4e04b57ac94bbe469bc7078', class: "digi-expandable-accordion__heading" }, h("button", { key: 'a2b7fb9290a255deaa4cf540f009f89f3718037c', type: "button", class: "digi-expandable-accordion__button", onClick: (e) => this.clickToggleHandler(e), "aria-expanded": this.afExpanded ? 'true' : 'false', "aria-controls": `${this.afId}-content`, ref: (el) => (this._button = el) }, h("digi-icon-chevron-down", { key: 'efb0e571d1e6df737155c9b1ae981cc30454eb0e', class: "digi-expandable-accordion__toggle-icon" }), h("div", { key: 'c4af3ba7d8b96c9873e47efef07d008b3ae4f502', class: "digi-expandable-accordion__heading-text" }, this.afHeading)))), h("section", { key: '3d82589e8eb52b9bd7af94962f7c957b91523186', class: "digi-expandable-accordion__content", id: `${this.afId}-content` }, h("div", { key: '724a0623fbfc5ec5b8649c793cf3847616325930' }, h("digi-typography", { key: '25eb5ec621cf75bcbd3822e323092e101119dbbf' }, h("slot", { key: '29a9704d5e443f391483333be1b11822109dca44' }))))));
     }
     static get is() { return "digi-expandable-accordion"; }
     static get encapsulation() { return "scoped"; }