@designsystem-se/af 39.2.2 → 39.2.3

package/dist/esm/{digi-calendar-datepicker.entry.js → digi-calendar_19.entry.js}

@@ -1,26 +1,27 @@
 import { r as registerInstance, c as createEvent, h, a as Host, d as getElement } from './index-BnKuq1L7.js';
+import { r as randomIdGenerator } from './randomIdGenerator.util-BGaIliX6.js';
+import { d as detectClickOutside } from './detectClickOutside.util-ROzp1Ej2.js';
+import { d as detectFocusOutside } from './detectFocusOutside.util-aFLLVVle.js';
+import { l as logger } from './logger.util-DdB9j8uV.js';
 import { _ as _t } from './text-DsO1BTml.js';
-import './calendar-week-view-heading-level.enum-BBOpiDGx.js';
-import { C as CalendarDatepickerValidation } from './typography-variation.enum-4smNltRI.js';
+import { r as requiredArgs, t as toDate, a as toInteger, g as getUTCISOWeek, b as getUTCWeek, s as startOfUTCISOWeek, c as startOfUTCWeek, d as getUTCWeekYear, l as locale, e as longFormatters, i as isProtectedWeekYearToken, f as throwProtectedError, h as isProtectedDayOfYearToken, j as subMilliseconds, k as getTimezoneOffsetInMilliseconds, m as isValid } from './index-Cnyfh_8_.js';
+import './badge-notification-shape.enum-CKoZU0-H.js';
+import { C as CalendarDatepickerValidation, h as FormInputValidation, E as ExpandableAccordionHeaderLevel, d as ExpandableFaqItemHeadingLevel, e as ExpandableFaqItemVariation, g as FormInputMode, i as FormInputVariation, s as FormSelectVariation, r as FormSelectValidation, J as TypographyHeadingJumboLevel, K as TypographyHeadingJumboVariation } from './typography-variation.enum-Zivp2NJB.js';
 import './badge-status-variation.enum-C0A-p3cU.js';
-import './button-variation.enum-BMQm4N5I.js';
+import './button-size.enum-C7xgnp99.js';
 import './button-type.enum-DShzaNrQ.js';
+import './button-variation.enum-y5Nm4oWF.js';
+import './calendar-week-view-heading-level.enum-DH_-wpLB.js';
 import './bar-chart-variation.enum-DPeoHh1J.js';
 import './code-example-variation.enum-DGI7Jkg2.js';
 import './code-variation.enum-qc6KRZue.js';
-import './expandable-accordion-header-level.enum-DwNlf6Sh.js';
-import './expandable-faq-item-variation.enum-C6B2KRZo.js';
 import './expandable-faq-variation.enum-CES5gUEo.js';
 import './footer-card-variation.enum-DzSu1-K0.js';
 import './form-checkbox-variation.enum-6-MpaVf8.js';
-import './form-file-upload-variation.enum-BfyJgcLA.js';
-import './form-input-search-variation.enum-BvWKyXb_.js';
-import './form-input-type.enum-BSJH8Lpg.js';
-import { a as FormInputValidation } from './form-input-variation.enum-DfWZa2Wv.js';
+import { c as FormValidationMessageVariation } from './form-validation-message-variation.enum-9n7Okhf1.js';
+import { b as FormInputType, a as FormInputButtonVariation } from './form-input-type.enum-C6S1HfeA.js';
 import './form-radiogroup-validation.enum-DcnvI7UR.js';
-import './form-select-variation.enum-DCS1KcvC.js';
 import './form-textarea-variation.enum-DogB9kfH.js';
-import './form-validation-message-variation.enum-B8hpiXmh.js';
 import './info-card-multi-type.enum-CkIb3cUS.js';
 import './info-card-variation.enum-_ycZeBN4.js';
 import './layout-container-max-width.enum-CuhrrYGE.js';
@@ -46,15 +47,10 @@ import './tag-size.enum-bQJ38En_.js';
 import './tools-feedback-banner-type.enum-DrVSK7Ws.js';
 import './tools-feedback-rating-variation.enum-CAmn5qzb.js';
 import './tools-theme-provider.brand.enum-DpDyNuVC.js';
-import './typography-heading-jumbo-variation.enum-DNjGvZvz.js';
 import './typography-meta-variation.enum-CHxBAbI8.js';
 import './typography-time-variation.enum-rhVqmQwC.js';
 import './util-breakpoint-observer-breakpoints.enum-DPq588Q4.js';
-import { r as randomIdGenerator } from './randomIdGenerator.util-BGaIliX6.js';
-import { d as detectClickOutside } from './detectClickOutside.util-ROzp1Ej2.js';
-import { r as requiredArgs, t as toDate, i as isValid } from './index-BixPaBHw.js';
-import { t as toInteger, g as getUTCISOWeek, a as getUTCWeek, o as startOfUTCISOWeek, p as startOfUTCWeek, c as getUTCWeekYear, l as locale, e as longFormatters, i as isProtectedWeekYearToken, f as throwProtectedError, h as isProtectedDayOfYearToken, s as subMilliseconds, d as getTimezoneOffsetInMilliseconds } from './index-B1Je6g2n.js';
-import { i as isBefore, a as isAfter } from './index-BsIL3T_0.js';
+import { K as KEY_CODE, k as keyboardHandler } from './keyboardHandler.util-CflatMTG.js';
 import './detectClosest.util-DwBvm-Nc.js';
 
 function assign(target, dirtyObject) {
@@ -73,6 +69,66 @@ function assign(target, dirtyObject) {
   return target;
 }
 
+/**
+ * @name isAfter
+ * @category Common Helpers
+ * @summary Is the first date after the second one?
+ *
+ * @description
+ * Is the first date after the second one?
+ *
+ * ### v2.0.0 breaking changes:
+ *
+ * - [Changes that are common for the whole library](https://github.com/date-fns/date-fns/blob/master/docs/upgradeGuide.md#Common-Changes).
+ *
+ * @param {Date|Number} date - the date that should be after the other one to return true
+ * @param {Date|Number} dateToCompare - the date to compare with
+ * @returns {Boolean} the first date is after the second date
+ * @throws {TypeError} 2 arguments required
+ *
+ * @example
+ * // Is 10 July 1989 after 11 February 1987?
+ * var result = isAfter(new Date(1989, 6, 10), new Date(1987, 1, 11))
+ * //=> true
+ */
+
+function isAfter(dirtyDate, dirtyDateToCompare) {
+  requiredArgs(2, arguments);
+  var date = toDate(dirtyDate);
+  var dateToCompare = toDate(dirtyDateToCompare);
+  return date.getTime() > dateToCompare.getTime();
+}
+
+/**
+ * @name isBefore
+ * @category Common Helpers
+ * @summary Is the first date before the second one?
+ *
+ * @description
+ * Is the first date before the second one?
+ *
+ * ### v2.0.0 breaking changes:
+ *
+ * - [Changes that are common for the whole library](https://github.com/date-fns/date-fns/blob/master/docs/upgradeGuide.md#Common-Changes).
+ *
+ * @param {Date|Number} date - the date that should be before the other one to return true
+ * @param {Date|Number} dateToCompare - the date to compare with
+ * @returns {Boolean} the first date is before the second date
+ * @throws {TypeError} 2 arguments required
+ *
+ * @example
+ * // Is 10 July 1989 before 11 February 1987?
+ * var result = isBefore(new Date(1989, 6, 10), new Date(1987, 1, 11))
+ * //=> false
+ */
+
+function isBefore(dirtyDate, dirtyDateToCompare) {
+  requiredArgs(2, arguments);
+  var date = toDate(dirtyDate);
+  var dateToCompare = toDate(dirtyDateToCompare);
+  return date.getTime() < dateToCompare.getTime();
+}
+
 // See issue: https://github.com/date-fns/date-fns/issues/376
 
 function setUTCDay(dirtyDate, dirtyDay, dirtyOptions) {
@@ -2177,6 +2233,460 @@ function cleanEscapedString(input) {
   return input.match(escapedStringRegExp)[1].replace(doubleQuoteRegExp, "'");
 }
 
+const calendarCss = () => `.sc-digi-calendar-h{--digi--calendar--display:inline-block;--digi--calendar--header--font-family:var(--digi--global--typography--font-family--default);--digi--calendar--header--font-weight:var(--digi--global--typography--font-weight--semibold);--digi--calendar--header--display:flex;--digi--calendar--header--align-items:center;--digi--calendar--header--justify-content:space-between;--digi--calendar--header--text-align:center;--digi--calendar--header--button--padding:var(--digi--gutter--medium) var(--digi--gutter--largest);--digi--calendar--header--button--background:transparent;--digi--calendar--header--button--box-shadow:none;--digi--calendar--header--button--background--hover:var(--digi--color--background--interactive--hover--secondary);--digi--calendar--table--border-spacing:0;--digi--calendar--table--border-collapse:collapse;--digi--calendar--table--font-family:var(--digi--global--typography--font-family--default);--digi--calendar--table--font-weight:var(--digi--global--typography--font-weight--semibold);--digi--calendar--table-header--padding:var(--digi--gutter--larger) 0;--digi--calendar--table-header--font-weight-normal:var(--digi--typography--body--font-weight--desktop);--digi--calendar--date--border-color:none;--digi--calendar--date--box-shadow:none;--digi--calendar--date--background-color:var(--digi--color--background--interactive--default--secondary);--digi--calendar--date--background-color--hover:var(--digi--color--background--interactive--hover--secondary);--digi--calendar--date--padding:var(--digi--gutter--large);--digi--calendar--date--color:var(--digi--color--text--primary);--digi--calendar--date--focused--background-color:var(--digi--color--background--interactive--hover--secondary);--digi--calendar--date--today--circle-border:2px solid var(--digi--color--marking--indication--secondary);--digi--calendar--date--today--circle-margin:10%;--digi--calendar--date--selected--color:var(--digi--color--text--interactive--secondary);--digi--calendar--date--selected--background-color:var(--digi--color--background--interactive--selected--primary);--digi--calendar--date--not-selectable-strike--color:var(--digi--color--marking--indication--tertiary);--digi--calendar--week--font-style:italic;--digi--calendar--week--font-size:var(--digi--global--typography--font-size--small);--digi--calendar--week--border-color:var(--digi--color--divider--primary);--digi--calendar--week--border-width:var(--digi--border-width--primary)}.sc-digi-calendar-h .digi-calendar.sc-digi-calendar{display:var(--digi--calendar--display);background:var(--digi--calendar--header--button--background);padding:0px 1px 3px 1px;overflow:hidden;max-width:23.4375rem}.sc-digi-calendar-h .digi-calendar--hide.sc-digi-calendar{--digi--calendar--display:none}.sc-digi-calendar-h .digi-calendar__header.sc-digi-calendar{display:var(--digi--calendar--header--display);align-items:var(--digi--calendar--header--align-items);justify-content:var(--digi--calendar--header--justify-content);text-align:var(--digi--calendar--header--text-align);font-size:var(--digi--global--typography--font-size--base);font-family:var(--digi--calendar--header--font-family);font-weight:var(--digi--calendar--header--font-weight)}.sc-digi-calendar-h .digi-calendar__header--year-select.sc-digi-calendar{display:inherit;justify-content:center;margin:0 auto}.sc-digi-calendar-h .digi-calendar__header--year-select.sc-digi-calendar digi-form-select.sc-digi-calendar:first-child{margin-right:var(--digi--padding--smaller)}.sc-digi-calendar-h .digi-calendar__header--year-select.sc-digi-calendar digi-form-select.sc-digi-calendar:last-child{width:5rem}.sc-digi-calendar-h .digi-calendar__header--year-select.sc-digi-calendar digi-form-select.sc-digi-calendar select.sc-digi-calendar{padding-inline-end:2rem}.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar{flex:auto;display:inherit;align-items:inherit;justify-content:inherit}.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar .digi-calendar__month-select-name.sc-digi-calendar{padding-inline:var(--digi--padding--smaller)}.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar .digi-calendar__month-select-button.sc-digi-calendar{font-family:inherit;font-size:inherit;font-weight:inherit;color:var(--digi--calendar--date--color);display:flex;align-items:center;background:var(--digi--calendar--header--button--background);border:var(--digi--calendar--date--box-shadow);padding:var(--digi--calendar--header--button--padding)}.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar .digi-calendar__month-select-button.sc-digi-calendar:last-child{border-radius:0 4px 0 0}.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar .digi-calendar__month-select-button.sc-digi-calendar:first-child{border-radius:4px 0 0 0}.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar .digi-calendar__month-select-button.sc-digi-calendar:focus-visible:not(.digi-calendar__date--not-selectable),.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar .digi-calendar__month-select-button.sc-digi-calendar:active:not(.digi-calendar__date--not-selectable){--digi--calendar--header--button--background:var(--digi--calendar--header--button--background--hover);text-decoration:underline;cursor:pointer}@media (any-hover: hover){.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar .digi-calendar__month-select-button.sc-digi-calendar:hover:not(.digi-calendar__date--not-selectable){--digi--calendar--header--button--background:var(--digi--calendar--header--button--background--hover);text-decoration:underline;cursor:pointer}}.sc-digi-calendar-h .digi-calendar__header--month-step.sc-digi-calendar .digi-calendar__month-select-button.sc-digi-calendar:focus-visible{outline:2px solid black;outline-offset:-3px;box-shadow:0px 0px 0px 5px inset white}.sc-digi-calendar-h .digi-calendar__table.sc-digi-calendar{border-collapse:var(--digi--calendar--table--border-collapse);border-spacing:var(--digi--calendar--table--border-spacing);font-family:var(--digi--calendar--table--font-family);table-layout:fixed;margin-bottom:var(--digi--margin--medium)}.sc-digi-calendar-h .digi-calendar__table.sc-digi-calendar th.sc-digi-calendar{text-align:center}.sc-digi-calendar-h .digi-calendar__table-header-week.sc-digi-calendar{font-style:italic;padding:var(--digi--calendar--table-header--padding);font-weight:var(--digi--calendar--table-header--font-weight-normal);width:50px}.sc-digi-calendar-h .digi-calendar__table-header.sc-digi-calendar{padding:var(--digi--calendar--table-header--padding);font-weight:var(--digi--calendar--table--font-weight);width:46px}.sc-digi-calendar-h .digi-calendar__td-week.sc-digi-calendar{border-right:var(--digi--calendar--week--border-width) solid var(--digi--calendar--week--border-color)}.sc-digi-calendar-h .digi-calendar__td.sc-digi-calendar{text-align:right}.sc-digi-calendar-h .digi-calendar__date--week-number.sc-digi-calendar{font-style:var(--digi--calendar--week--font-style);font-size:var(--digi--calendar--week--font-size);display:table-cell;text-align:center}.sc-digi-calendar-h .digi-calendar__date--week-number.sc-digi-calendar:hover{cursor:default}.sc-digi-calendar-h .digi-calendar__date.sc-digi-calendar{position:relative;padding:var(--digi--calendar--date--padding);color:var(--digi--calendar--date--color);background-color:var(--digi--calendar--date--background-color);border-color:var(--digi--calendar--date--border-color);border-radius:var(--digi--border-radius--secondary);font-family:inherit;font-size:inherit;font-weight:inherit;text-align:center;border:none;width:44px;height:44px}.sc-digi-calendar-h .digi-calendar__date--disabled.sc-digi-calendar{--digi--calendar--date--color:transparent;pointer-events:none}.sc-digi-calendar-h .digi-calendar__date--today.sc-digi-calendar{position:relative}.sc-digi-calendar-h .digi-calendar__date--today.sc-digi-calendar::after{display:block;content:" ";position:absolute;top:var(--digi--calendar--date--today--circle-margin);bottom:var(--digi--calendar--date--today--circle-margin);left:var(--digi--calendar--date--today--circle-margin);right:var(--digi--calendar--date--today--circle-margin);border:var(--digi--calendar--date--today--circle-border);border-radius:50%}.sc-digi-calendar-h .digi-calendar__date--today.digi-calendar__date--selected.sc-digi-calendar::after{border-color:var(--digi--color--icon--secondary)}@media (any-hover: hover){.sc-digi-calendar-h .digi-calendar__date.sc-digi-calendar:hover:not(.digi-calendar__date--not-selectable){cursor:pointer}.sc-digi-calendar-h .digi-calendar__date.sc-digi-calendar:hover:not(.digi-calendar__date--not-selectable):not(.digi-calendar__date--selected){--digi--calendar--date--box-shadow:var(--digi--calendar--date--box-shadow--hover);--digi--calendar--date--background-color:var(--digi--calendar--date--background-color--hover)}.sc-digi-calendar-h .digi-calendar__date.sc-digi-calendar:hover:not(.digi-calendar__date--not-selectable) span.sc-digi-calendar{text-decoration:underline}}.sc-digi-calendar-h .digi-calendar__date--selected.sc-digi-calendar{--digi--calendar--date--background-color:var(--digi--calendar--date--selected--background-color);--digi--calendar--date--color:var(--digi--calendar--date--selected--color)}.sc-digi-calendar-h .digi-calendar__date--selected.sc-digi-calendar:hover{--digi--calendar--date--background-color:var(--digi--calendar--date--selected--background-color)}.sc-digi-calendar-h .digi-calendar__date--selected.sc-digi-calendar:hover span.sc-digi-calendar{text-decoration:none}.sc-digi-calendar-h .digi-calendar__date--selected.sc-digi-calendar:focus-visible{outline:2px solid black;outline-offset:-3px;box-shadow:0px 0px 0px 5px inset white}.sc-digi-calendar-h .digi-calendar__date--not-selectable.sc-digi-calendar{cursor:not-allowed}.sc-digi-calendar-h .digi-calendar__date--not-selectable.sc-digi-calendar::after{display:block;content:" ";width:0px;height:100%;border:1px solid #757575;transform:rotate(-45deg);position:absolute;top:0%;left:50%}.sc-digi-calendar-h .digi-calendar__date--focused.sc-digi-calendar:focus-visible:not(.digi-calendar__date--selected):not(.digi-calendar__date--not-selectable){--digi--calendar--date--background-color:var(--digi--calendar--date--focused--background-color);outline:2px solid black;outline-offset:-3px;box-shadow:0px 0px 0px 5px inset white}.sc-digi-calendar-s digi-form-label{border:0;clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}`;
+
+const Calendar = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.afOnDateSelectedChange = createEvent(this, "afOnDateSelectedChange", 7);
+        this.afOnFocusOutside = createEvent(this, "afOnFocusOutside", 7);
+        this.afOnClickOutside = createEvent(this, "afOnClickOutside", 7);
+        this.afOnDirty = createEvent(this, "afOnDirty", 7);
+        this.selectedDates = [];
+        this.dirty = false;
+        /**
+         * Prefix för komponentens 'id'-attribut. Ex. 'my-cool-id' genererar 'my-cool-id-calendar'. Ges inget värde genereras ett slumpmässigt.
+         * @en Prefix for the component's 'id' attribute. Example: 'my-cool-id' generates 'my-cool-id-calendar'. Defaults to random string.
+         */
+        this.afId = randomIdGenerator('digi-calendar');
+        /**
+         * Visa veckonummer i kalender
+         * @en Show week number in the calendar
+         */
+        this.afShowWeekNumber = false;
+        /**
+         * Valda datum i kalendern
+         * @en Selected dates in calendar
+         */
+        this.afSelectedDates = [];
+        /**
+         * Visar eller döljer kalendern.
+         * @en Toggle calendar hide/show.
+         */
+        this.afActive = true;
+        /**
+         * Sätt denna till true för att tillåta val av flera datum
+         * @en Set this to true to be able to allow selection of multiple dates
+         */
+        this.afMultipleDates = false;
+        /**
+         * Sätt denna till true för att visa väljare för år
+         * @en Set this to true to be show year selector
+         */
+        this.afYearSelect = false;
+        this.activeCalendar = [];
+    }
+    focusedDateChanged() {
+        this.drawCalendar(this.focusedDate);
+    }
+    afOpenCalendarToChangeHandler() {
+        this.determineFocusedDate();
+    }
+    afShowWeekNumberChangeHandler() {
+        this.drawCalendar(this.focusedDate);
+    }
+    afSelectedDateChangeHandler() {
+        this.afSelectedDates = isValid(this.afSelectedDate)
+            ? [this.afSelectedDate]
+            : [];
+    }
+    afSelectedDatesChangeHandler() {
+        if (this.afSelectedDates.length > 0) {
+            if (this.afMultipleDates) {
+                const invalidDate = this.afSelectedDates.find((date) => !isValid(date));
+                if (invalidDate === undefined) {
+                    this.selectedDates = this.afSelectedDates;
+                    this.determineFocusedDate();
+                }
+            }
+            else if (isValid(this.afSelectedDates[0])) {
+                this.selectedDates = [this.afSelectedDates[0]];
+                this.determineFocusedDate();
+            }
+        }
+        else {
+            this.selectedDates = [];
+        }
+    }
+    focusoutHandler(e) {
+        const target = e.target;
+        const selector = `#${this.afId}-calendar`;
+        if (detectFocusOutside(target, selector)) {
+            this.afOnFocusOutside.emit(e);
+        }
+    }
+    clickHandler(e) {
+        const target = e.target;
+        const selector = `#${this.afId}-calendar`;
+        if (detectClickOutside(target, selector)) {
+            this.afOnClickOutside.emit(e);
+        }
+    }
+    determineFocusedDate() {
+        if (this.dirty) {
+            return; // Don't change focused date if user has already interacted with the calendar
+        }
+        else if (this.afOpenCalendarTo && isValid(this.afOpenCalendarTo)) {
+            this.focusedDate = this.afOpenCalendarTo;
+        }
+        else if (this.selectedDates.length > 0) {
+            this.focusedDate = this.selectedDates[0];
+        }
+        else {
+            this.focusedDate = new Date();
+        }
+    }
+    drawCalendar(focusedDate) {
+        const date = {
+            year: focusedDate.getFullYear(),
+            month: focusedDate.getMonth()
+        };
+        this.lastWeekOfPreviousMonth = this.getWeekDays(this.getLastDayOfPrevMonth(date));
+        this.firstWeekOfNextMonth = this.getWeekDays(this.getFirstDayOfNextMonth(date));
+        this.weeksBetween = this.getWeeksBetween(this.getLastDayOfPrevMonth(date), this.getFirstDayOfNextMonth(date));
+        this.weekDaysbetween = this.getWeekdaysOfMonth(this.weeksBetween);
+        this.activeCalendar = this.appendFirstWeekOfNextMonth()
+            ? [
+                this.lastWeekOfPreviousMonth,
+                ...this.weekDaysbetween,
+                this.appendFirstWeekOfNextMonth()
+            ]
+            : [this.lastWeekOfPreviousMonth, ...this.weekDaysbetween];
+        this.appendFirstWeekOfNextMonth();
+        if (this.afShowWeekNumber) {
+            this.activeCalendar.forEach((el, i) => {
+                this.activeCalendar[i].unshift(this.getWeekNumbers(el[0]));
+            });
+        }
+    }
+    appendFirstWeekOfNextMonth() {
+        const lastArray = JSON.stringify(this.weekDaysbetween.slice(-1)[0]);
+        const stringFirstweek = JSON.stringify(this.firstWeekOfNextMonth);
+        if (!this.firstWeekOfNextMonth.some((date) => this.isSameMonth(date, this.focusedDate))) {
+            return;
+        }
+        else if (lastArray !== stringFirstweek) {
+            return this.firstWeekOfNextMonth;
+        }
+    }
+    getLastDayOfPrevMonth(date) {
+        return new Date(date.year, date.month, 0);
+    }
+    getWeekDays(date) {
+        const today = date || new Date();
+        const week = [];
+        const dayOffset = today.getDay(); // 0=söndag
+        for (let i = 1; i <= 7; i++) {
+            week.push(new Date(today.getFullYear(), today.getMonth(), today.getDate() - dayOffset + i));
+        }
+        return week;
+    }
+    getFirstDayOfNextMonth(date) {
+        return new Date(date.year, date.month + 1, 1);
+    }
+    getWeeksBetween(lastDayOfPrevMonth, firstDayOnNextMonth) {
+        const week = 7 * 24 * 60 * 60 * 1000;
+        const d1ms = lastDayOfPrevMonth.getTime();
+        const d2ms = firstDayOnNextMonth.getTime();
+        const diff = Math.abs(d2ms - d1ms);
+        return Math.floor(diff / week);
+    }
+    getWeekdaysOfMonth(weeksBetween) {
+        let weeks = [];
+        for (let i = 1; i <= weeksBetween; i++) {
+            weeks = [...weeks, this.getWeekDays(this.getUpcoming(i))];
+        }
+        return weeks;
+    }
+    getUpcoming(weeks) {
+        return new Date(this.focusedDate.getFullYear(), this.focusedDate.getMonth(), 7 * weeks);
+    }
+    onDirty() {
+        if (!this.dirty) {
+            this.dirty = true;
+            this.afOnDirty.emit(this.dirty);
+        }
+    }
+    selectDateHandler(dateSelected) {
+        this.onDirty();
+        if (!this.isDateSelectable(dateSelected))
+            return;
+        if (this.isDateSelected(dateSelected)) {
+            this.selectedDates = this.afMultipleDates
+                ? this.selectedDates.filter((d) => {
+                    return !this.isSameDate(d, dateSelected);
+                })
+                : [];
+        }
+        else {
+            this.selectedDates = this.afMultipleDates
+                ? [...this.selectedDates, dateSelected]
+                : [dateSelected];
+        }
+        this.focusedDate = new Date(dateSelected);
+        this.afOnDateSelectedChange.emit(this.selectedDates);
+    }
+    getMonthName(monthNumber) {
+        return new Date(1992, monthNumber, 1)
+            .toLocaleDateString(_t.locale, {
+            month: 'short'
+        })
+            .replace('.', '');
+    }
+    getFullMonthName(monthNumber) {
+        return new Date(this.focusedDate.getFullYear(), monthNumber, 1).toLocaleDateString(_t.locale, {
+            month: 'long',
+            year: 'numeric'
+        });
+    }
+    // Get the week number of a specific date. Taken from https://weeknumber.com/how-to/javascript
+    getWeekNumbers(dateInput) {
+        const date = new Date(dateInput);
+        date.getTime();
+        date.setHours(0, 0, 0, 0);
+        date.setDate(date.getDate() + 3 - ((date.getDay() + 6) % 7));
+        const week1 = new Date(date.getFullYear(), 0, 4);
+        return (1 +
+            Math.round(((date.getTime() - week1.getTime()) / 86400000 -
+                3 +
+                ((week1.getDay() + 6) % 7)) /
+                7));
+    }
+    isSameMonth(date, currentDate) {
+        if (date instanceof Date && date instanceof Date) {
+            return (`${date.getFullYear()}${date.getMonth()}` ===
+                `${currentDate.getFullYear()}${currentDate.getMonth()}`);
+        }
+        return false;
+    }
+    isSameDate(date, newDate) {
+        return this.getDateString(date) === this.getDateString(newDate);
+    }
+    getDateString(date) {
+        return `${date.getDate()}${date.getMonth()}${date.getFullYear()}`;
+    }
+    isDateSelected(date) {
+        return !!this.selectedDates.find((d) => this.isSameDate(date, d));
+    }
+    isDateSelectable(date) {
+        if (this.afMinDate && this.isBefore(date, this.afMinDate))
+            return false;
+        if (this.afMaxDate && this.isAfter(date, this.afMaxDate))
+            return false;
+        return true;
+    }
+    isBefore(a, b) {
+        return isBefore(this.dateWithoutTime(a), this.dateWithoutTime(b));
+    }
+    isAfter(a, b) {
+        return isAfter(this.dateWithoutTime(a), this.dateWithoutTime(b));
+    }
+    dateWithoutTime(date) {
+        return new Date(date.getFullYear(), date.getMonth(), date.getDate());
+    }
+    isInAnotherMonth(date) {
+        return !this.isSameMonth(date, this.focusedDate);
+    }
+    subtractMonth() {
+        this.onDirty();
+        const month = new Date(this.focusedDate);
+        const currentDay = month.getDate();
+        month.setMonth(month.getMonth() - 1, 1);
+        const lastDayOfPrevMonth = new Date(month.getFullYear(), month.getMonth() + 1, 0).getDate();
+        month.setDate(Math.min(currentDay, lastDayOfPrevMonth));
+        this.focusedDate = month;
+    }
+    addMonth() {
+        this.onDirty();
+        const month = new Date(this.focusedDate);
+        const currentDay = month.getDate();
+        month.setMonth(month.getMonth() + 1, 1);
+        const lastDayOfNextMonth = new Date(month.getFullYear(), month.getMonth() + 1, 0).getDate();
+        month.setDate(Math.min(currentDay, lastDayOfNextMonth));
+        this.focusedDate = month;
+    }
+    getCurrent(date) {
+        return this.isSameDate(date, new Date()) ? 'date' : null;
+    }
+    setTabIndex(date) {
+        return this.isFocused(date) ? 0 : -1;
+    }
+    navigateHandler(e, daysToAdd) {
+        !!e.detail && e.detail.preventDefault();
+        if (e.detail.key === 'Tab') {
+            return;
+        }
+        this.onDirty();
+        const date = new Date(e.detail.target.dataset.date);
+        const newDate = new Date(date.setDate(date.getDate() + daysToAdd));
+        this.focusedDate = newDate;
+        this.resetFocus();
+    }
+    resetFocus() {
+        setTimeout(() => {
+            const dates = this._tbody.querySelectorAll('.digi-calendar__date');
+            if (dates.length <= 0) {
+                logger.warn(`Could not find an element with data-date attribute matching navigated date.`, this._tbody);
+                return;
+            }
+            Array.from(dates).map((date) => {
+                const d = date;
+                d.tabIndex = -1;
+                d.classList.remove('digi-calendar__date--focused');
+                if (d.dataset.date === this.getFullDate(this.focusedDate)) {
+                    d.focus();
+                    d.tabIndex = 0;
+                    d.classList.add('digi-calendar__date--focused');
+                }
+            });
+        }, 100);
+    }
+    getFullDate(date) {
+        return date.toLocaleString(_t.locale, {
+            day: 'numeric',
+            month: 'numeric',
+            year: 'numeric'
+        });
+    }
+    getDateName(date) {
+        return date.toLocaleString(_t.locale, {
+            year: 'numeric',
+            month: 'long',
+            day: 'numeric'
+        });
+    }
+    isFocused(date) {
+        if (this.dirty) {
+            return this.isSameDate(date, this.focusedDate);
+        }
+        if (this.afOpenCalendarTo) {
+            return this.isSameDate(date, this.afOpenCalendarTo);
+        }
+        return this.isSameMonth(date, new Date())
+            ? this.isSameDate(date, new Date())
+            : this.isSameMonth(date, this.focusedDate) && date.getDate() === 1;
+    }
+    ariaPressed(date) {
+        return this.selectedDates.length > 0 &&
+            !!this.selectedDates.find((d) => this.isSameDate(d, date))
+            ? 'true'
+            : 'false';
+    }
+    selectMonth(evt) {
+        this.onDirty();
+        const tempDate = new Date(this.focusedDate);
+        const selectedMonth = parseInt(evt.target.value, 10);
+        const currentDay = tempDate.getDate();
+        tempDate.setMonth(selectedMonth, 1);
+        const lastDayOfSelectedMonth = new Date(tempDate.getFullYear(), selectedMonth + 1, 0).getDate();
+        tempDate.setDate(Math.min(currentDay, lastDayOfSelectedMonth));
+        this.focusedDate = tempDate;
+    }
+    selectYear(evt) {
+        this.onDirty();
+        const selectedYear = parseInt(evt.target.value, 10);
+        // Skydda mot ogiltiga datum som 29 februari
+        const day = Math.min(this.focusedDate.getDate(), new Date(selectedYear, this.focusedDate.getMonth() + 1, 0).getDate());
+        const newDate = new Date(selectedYear, this.focusedDate.getMonth(), day);
+        this.focusedDate = newDate;
+    }
+    earliestSelectableYear() {
+        if (this.afMinDate)
+            return this.afMinDate.getFullYear();
+        return 1900;
+    }
+    latestSelectableYear() {
+        if (this.afMaxDate)
+            return this.afMaxDate.getFullYear();
+        return new Date(Date.now()).getFullYear() + 10;
+    }
+    allSelectableYears() {
+        const allYears = [];
+        let currentYear = this.earliestSelectableYear();
+        while (currentYear <= this.latestSelectableYear()) {
+            allYears.push(currentYear++);
+        }
+        return allYears;
+    }
+    componentWillLoad() {
+        var _a;
+        if (isValid(this.afSelectedDate)) {
+            this.selectedDates = [this.afSelectedDate];
+        }
+        else if (((_a = this.afSelectedDates) === null || _a === void 0 ? void 0 : _a.length) > 0) {
+            const valid = this.afSelectedDates.filter((d) => isValid(d));
+            if (valid.length > 0)
+                this.selectedDates = valid;
+        }
+        this.determineFocusedDate();
+        this.drawCalendar(this.focusedDate);
+    }
+    async componentDidLoad() {
+        if (isValid(this.afSelectedDate))
+            this.selectedDates = [this.afSelectedDate];
+        else
+            this.afSelectedDatesChangeHandler();
+        await customElements.whenDefined('digi-form-select');
+    }
+    cssDateModifiers(date) {
+        const shownMonth = this.focusedDate.getMonth();
+        return {
+            'digi-calendar__date--today': this.isSameDate(date, new Date()) && !this.isInAnotherMonth(date),
+            'digi-calendar__date--disabled': this.isInAnotherMonth(date),
+            'digi-calendar__date--focused': this.isFocused(date),
+            'digi-calendar__date--selected': this.isDateSelected(date) && date.getMonth() === shownMonth,
+            'digi-calendar__date--not-selectable': !this.isInAnotherMonth(date) && !this.isDateSelectable(date)
+        };
+    }
+    render() {
+        return (h("div", { key: '1077a770af823d9e0c0f59cdc6f1fef2a49d761a', class: {
+                'digi-calendar': true,
+                'digi-calendar--hide': !this.afActive
+            }, id: `${this.afId}-calendar` }, this.afYearSelect && (h("div", { key: 'cd7dfa8e20efd08afa590cd4e177ddb4c41455d8', class: "digi-calendar__header" }, h("div", { key: 'd1e6e956713de7fe417253be0fc1ec3aea9748b0', class: "digi-calendar__header--year-select" }, h("digi-form-select", { key: 'cf34feec9ed25e0251effe86b3ce393918a32eda', afLabel: _t.calendar.month, "af-variation": "small", afValue: this.focusedDate.getMonth().toString(), onAfOnSelect: (evt) => {
+                this.selectMonth(evt);
+            } }, _t.calendar.months.map((month, index) => {
+            return h("option", { value: index }, month);
+        })), h("digi-form-select", { key: 'ddcd90917d6dba315f8018c4311c852f3471d3c0', afLabel: _t.calendar.year, "af-variation": "small", afValue: this.focusedDate.getFullYear().toString(), onAfOnSelect: (evt) => {
+                this.selectYear(evt);
+            } }, this.allSelectableYears().map((year) => (h("option", { value: year.toString() }, year))))))), !this.afYearSelect && (h("div", { key: '814648caa21619240a5904a809c95024398e9741', class: "digi-calendar__header" }, h("div", { key: 'd3dc54a4d0172d503bff66e5171846f433755c4b', class: "digi-calendar__header--month-step" }, h("button", { key: '7725160aab267e5cdd70618613b2f485d5b7dd7f', class: "digi-calendar__month-select-button", type: "button", "aria-label": this.getFullMonthName(this.focusedDate.getMonth() - 1) +
+                ', ' + _t.calendar.previousMonth, onClick: () => this.subtractMonth() }, h("digi-icon-chevron-left", { key: 'e8d1dc80011cb7e79ce6af893df2fd4601d92c74', slot: "icon", "aria-hidden": "true" }), h("span", { key: 'ae56dadf565d819f8e89804596dbe38119fb592e', class: "digi-calendar__month-select-name" }, this.getMonthName(this.focusedDate.getMonth() - 1))), h("div", { key: '257ac7d346e084390aba658eb7329cab913e3463', class: "digi-calendar__month" }, this.getFullMonthName(this.focusedDate.getMonth())), h("button", { key: '0c483763c0420f1c172c78364d2ce931ffcd116d', class: "digi-calendar__month-select-button", type: "button", "aria-label": this.getFullMonthName(this.focusedDate.getMonth() + 1) +
+                ', ' + _t.calendar.nextMonth, onClick: () => this.addMonth() }, h("span", { key: 'de4617285a713bd9baa375a99f81bb027768c947', class: "digi-calendar__month-select-name" }, this.getMonthName(this.focusedDate.getMonth() + 1)), h("digi-icon-chevron-right", { key: '8d6252fcdd7a035ce8fe4e6f4cb468ce7935aeba', slot: "icon", "aria-hidden": "true" }))))), h("digi-util-keydown-handler", { key: '5080246278db71745444dcd40d0722a64e8c80b5', onAfOnDown: (e) => this.navigateHandler(e, 7), onAfOnUp: (e) => this.navigateHandler(e, -7), onAfOnLeft: (e) => this.navigateHandler(e, -1), onAfOnRight: (e) => this.navigateHandler(e, 1) }, h("table", { key: '9052f9c8135d95110f927c6a5a949fbd63daec7a', role: "grid", class: "digi-calendar__table" }, h("thead", { key: '428467866c49e65d348db796a006611542aabc02' }, h("tr", { key: '260024069438dadff553bc3391a37bbb533b5d11', role: "row" }, this.afShowWeekNumber && (h("th", { key: '2c22102011ade9125e61416ac78eaed16dec2e26', role: "columnheader", abbr: _t.calendar.week, class: "digi-calendar__table-header-week" }, _t.calendar.week.toLowerCase())), Object.keys(_t.calendar.weekdays).map((day) => (h("th", { role: "columnheader", "aria-label": _t.calendar.weekdays[day], abbr: _t.calendar.weekdays[day], class: "digi-calendar__table-header" }, _t.calendar.weekdays_short[day].toLowerCase()))))), h("tbody", { key: 'cbe3d290919c35ad27799c17e6b6236557dbe126', ref: (el) => (this._tbody = el) }, this.activeCalendar.map((week) => {
+            return (h("tr", null, week.map((day, i) => {
+                if (this.afShowWeekNumber && i === 0) {
+                    return (h("th", { role: "rowheader", "aria-label": _t.calendar.week + ' ' + day, class: "digi-calendar__td-week digi-calendar__date--week-number", id: 'digi-calendar__week-' + day }, day));
+                }
+                else {
+                    return this.isInAnotherMonth(day) ? (h("td", null)) : (h("td", { role: "gridcell", class: "digi-calendar__td" }, h("button", { key: this.getFullDate(day), type: "button", class: Object.assign(Object.assign({}, this.cssDateModifiers(day)), { 'digi-calendar__date': true }), onClick: () => this.selectDateHandler(day), "aria-current": this.isSameDate(day, new Date()) ? 'date' : null, "aria-label": `
+                                ${!this.isDateSelectable(day)
+                            ? _t.calendar.disabledDate
+                            : ''} ${this.getDateName(day)}
+                              `, "aria-disabled": !this.isDateSelectable(day) ? 'true' : null, tabindex: this.setTabIndex(day), "data-date": this.getFullDate(day), "aria-pressed": this.isDateSelectable(day)
+                            ? this.ariaPressed(day)
+                            : null }, h("span", { "aria-hidden": "true" }, day.getDate()))));
+                }
+            })));
+        })))), h("slot", { key: 'e97e8147fc91a3b401665eeeb8db6be7036f678b', name: "calendar-footer" })));
+    }
+    static get watchers() { return {
+        "focusedDate": [{
+                "focusedDateChanged": 0
+            }],
+        "afOpenCalendarTo": [{
+                "afOpenCalendarToChangeHandler": 0
+            }],
+        "afShowWeekNumber": [{
+                "afShowWeekNumberChangeHandler": 0
+            }],
+        "afSelectedDate": [{
+                "afSelectedDateChangeHandler": 0
+            }],
+        "afSelectedDates": [{
+                "afSelectedDatesChangeHandler": 0
+            }]
+    }; }
+};
+Calendar.style = calendarCss();
+
 const calendarDatepickerCss = () => `.sc-digi-calendar-datepicker:root{--digi--grayscale--0:#ffffff;--digi--grayscale--100:#f4f4f4;--digi--grayscale--1000:#000000;--digi--grayscale--200:#ededed;--digi--grayscale--300:#e4e4e4;--digi--grayscale--400:#dddddd;--digi--grayscale--50:#fbfbfb;--digi--grayscale--500:#cacaca;--digi--grayscale--600:#acacac;--digi--grayscale--700:#757575;--digi--grayscale--800:#5c5c5c;--digi--grayscale--900:#333333;--digi--misc--transparent:#ffffff00;--digi--sentiment--error--200:#fdeded;--digi--sentiment--error--500:#da0000;--digi--sentiment--error--700:#c7311a;--digi--sentiment--informative--200:#e9e9ff;--digi--sentiment--informative--500:#0a4dd1;--digi--sentiment--informative--700:#0058a3;--digi--sentiment--success--200:#e9f6ec;--digi--sentiment--success--500:#008a20;--digi--sentiment--success--700:#02703c;--digi--sentiment--warning--200:#fff398;--digi--sentiment--warning--50:#fffbdd;--digi--sentiment--warning--500:#ffe200;--digi--sentiment--warning--700:#ffc108;--digi--sentiment--warning--900:#664d00;--digi--animation--duration--base:var(--digi--global--animation--duration--base);--digi--animation--duration--small:var(--digi--global--animation--duration--short);--digi--animation--duration--large:var(--digi--global--animation--duration--longer);--digi--animation--duration--reduced:var(--digi--global--animation--duration--shortest);--digi--animation--duration--sweep:var(--digi--global--animation--duration--longest);--digi--animation--rotation--45:var(--digi--global--animation--rotation--smallest-2);--digi--animation--rotation--90:var(--digi--global--animation--rotation--smallest);--digi--animation--rotation--135:var(--digi--global--animation--rotation--smaller);--digi--animation--rotation--180:var(--digi--global--animation--rotation--small);--digi--animation--rotation--225:var(--digi--global--animation--rotation--base);--digi--animation--rotation--270:var(--digi--global--animation--rotation--large);--digi--animation--rotation--315:var(--digi--global--animation--rotation--larger);--digi--animation--rotation--360:var(--digi--global--animation--rotation--largest);--digi--global--animation--duration--base:0.3s;--digi--global--animation--duration--short:0.2s;--digi--global--animation--duration--shorter:0.1s;--digi--global--animation--duration--shortest:0.01s;--digi--global--animation--duration--long:0.4s;--digi--global--animation--duration--longer:0.5s;--digi--global--animation--duration--longest:4s;--digi--global--animation--rotation--smallest-2:0deg;--digi--global--animation--rotation--smallest:45deg;--digi--global--animation--rotation--smaller:90deg;--digi--global--animation--rotation--small:135deg;--digi--global--animation--rotation--base:180deg;--digi--global--animation--rotation--large:225deg;--digi--global--animation--rotation--larger:270deg;--digi--global--animation--rotation--largest:315deg;--digi--global--animation--rotation--largest-2:360deg;--digi--global--border-radius--base:6px;--digi--global--border-radius--small:4px;--digi--global--border-radius--smaller:3px;--digi--global--border-radius--smallest:2px;--digi--global--border-radius--smallest-2:1px;--digi--global--border-radius--smallest-3:0px;--digi--global--border-radius--large:8px;--digi--global--border-radius--larger:16px;--digi--global--border-radius--largest:32px;--digi--global--border-radius--largest-2:64px;--digi--global--border-width--base:2px;--digi--global--border-width--small:1px;--digi--global--border-width--smaller:0px;--digi--global--border-width--large:4px;--digi--global--border-width--larger:6px;--digi--global--border-width--largest:8px;--digi--global--border-width--largest-2:10px;--digi--global--border-style--solid:solid;--digi--global--border-style--none:none;--digi--global--border-style--dashed:dashed;--digi--global--spacing--base:16px;--digi--global--spacing--small:14px;--digi--global--spacing--smaller:12px;--digi--global--spacing--smallest:10px;--digi--global--spacing--smallest-2:8px;--digi--global--spacing--smallest-3:6px;--digi--global--spacing--smallest-4:4px;--digi--global--spacing--smallest-5:3px;--digi--global--spacing--smallest-6:2px;--digi--global--spacing--smallest-7:1px;--digi--global--spacing--large:18px;--digi--global--spacing--larger:20px;--digi--global--spacing---:22px;--digi--global--spacing--largest-2:24px;--digi--global--spacing--largest-3:28px;--digi--global--spacing--largest-4:32px;--digi--global--spacing--largest-5:40px;--digi--global--spacing--largest-6:48px;--digi--global--spacing--largest-7:56px;--digi--global--spacing--largest-8:64px;--digi--global--spacing--largest:22px;--digi--global--spacing--largest-3-5:30px;--digi--global--spacing--largest-9:72px;--digi--global--spacing--largest-10:80px;--digi--global--breakpoint--smallest-3:374px;--digi--global--breakpoint--smallest-2:375px;--digi--global--breakpoint--smallest:575px;--digi--global--breakpoint--smaller:576px;--digi--global--breakpoint--small:767px;--digi--global--breakpoint--medium:768px;--digi--global--breakpoint--large:991px;--digi--global--breakpoint--larger:992px;--digi--global--breakpoint--largest:1199px;--digi--global--breakpoint--largest-2:1200px;--digi--global--breakpoint--largest-3:1399px;--digi--global--breakpoint--largest-4:1400px;--digi--global--size--smaller:auto;--digi--global--size--small:36rem;--digi--global--size--base:48rem;--digi--global--size--large:62rem;--digi--global--size--larger:75rem;--digi--global--size--largest:87.5rem;--digi--global--text-width--small:31rem;--digi--global--text-width--base:35rem;--digi--global--text-width--large:40rem;--digi--global--text-width--larger:44rem;--digi--global--text-width--largest:48rem;--digi--global--text-width--largest-2:53rem;--digi--global--text-width--largest-3:61rem;--digi--global--text-width--largest-4:70rem;--digi--global--typography--line-height--base:1.5;--digi--global--typography--line-height--small:1;--digi--global--typography--line-height--large:2;--digi--global--typography--font-size--base:1rem;--digi--global--typography--font-size--small:0.875rem;--digi--global--typography--font-size--smaller:0.75rem;--digi--global--typography--font-size--large:1.125rem;--digi--global--typography--font-size--larger:1.25rem;--digi--global--typography--font-size--largest:1.375rem;--digi--global--typography--font-size--largest-2:1.5rem;--digi--global--typography--font-size--largest-3:1.75rem;--digi--global--typography--font-size--largest-4:2rem;--digi--global--typography--font-size--largest-5:2.25rem;--digi--global--typography--font-size--interaction-small:0.875rem;--digi--global--typography--font-size--interaction-medium:1rem;--digi--global--typography--font-size--interaction-large:1.125rem;--digi--global--typography--font-size--largest-6:2.5rem;--digi--global--typography--font-weight--regular:400;--digi--global--typography--font-weight--light:300;--digi--global--typography--font-weight--semibold:600;--digi--global--typography--font-weight--bold:700;--digi--global--typography--font-family--default:'Open Sans';--digi--global--typography--font-family--mono:Consolas, Monaco, 'Andale Mono', 'Ubuntu Mono', monospace;--digi--global--typography--text-decoration--default:none;--digi--global--typography--text-decoration--link:underline;--digi--border-radius--primary:var(--digi--global--border-radius--smallest-3);--digi--border-radius--secondary:var(--digi--global--border-radius--base);--digi--border-radius--tertiary:var(--digi--global--border-radius--smaller);--digi--border-radius--complementary-1:var(--digi--global--border-radius--largest);--digi--border-radius--complementary-2:var(--digi--global--border-radius--largest-2);--digi--border-radius--button:var(--digi--global--border-radius--base);--digi--border-radius--input:var(--digi--global--border-radius--smallest-3);--digi--border-radius--input-search:var(--digi--global--border-radius--base);--digi--border-radius--complementary-3:var(--digi--global--border-radius--larger);--digi--border-width--primary:var(--digi--global--border-width--small);--digi--border-width--secondary:var(--digi--global--border-width--base);--digi--border-width--complementary-1:var(--digi--global--border-width--largest);--digi--border-width--complementary-2:var(--digi--global--border-width--largest-2);--digi--border-width--input-regular:var(--digi--global--border-width--small);--digi--border-width--input-validation:var(--digi--global--border-width--base);--digi--border-width--button:var(--digi--global--border-width--small);--digi--border-style--primary:var(--digi--global--border-style--solid);--digi--border-style--secondary:var(--digi--global--border-style--none);--digi--padding--medium:var(--digi--global--spacing--base);--digi--padding--smaller:var(--digi--global--spacing--smallest-2);--digi--padding--small:var(--digi--global--spacing--smaller);--digi--padding--large:var(--digi--global--spacing--largest-2);--digi--padding--larger:var(--digi--global--spacing--largest-3);--digi--padding--largest:var(--digi--global--spacing--largest-4);--digi--padding--largest-2:var(--digi--global--spacing--largest-5);--digi--padding--largest-3:var(--digi--global--spacing--largest-6);--digi--margin--smaller:var(--digi--global--spacing--smallest-2);--digi--margin--small:var(--digi--global--spacing--smallest);--digi--margin--medium:var(--digi--global--spacing--base);--digi--margin--large:var(--digi--global--spacing--largest-2);--digi--margin--larger:var(--digi--global--spacing--largest-3);--digi--margin--largest:var(--digi--global--spacing--largest-4);--digi--margin--h1-small:var(--digi--global--spacing--base);--digi--margin--h1-medium:var(--digi--global--spacing--largest-2);--digi--margin--h1-large:var(--digi--global--spacing--largest-4);--digi--margin--h2-small:var(--digi--global--spacing--base);--digi--margin--h2-large:var(--digi--global--spacing--base);--digi--margin--h3-small:var(--digi--global--spacing--smallest-2);--digi--margin--h3-large:var(--digi--global--spacing--smallest-2);--digi--margin--h4-h6-small:var(--digi--global--spacing--smallest-2);--digi--margin--h4-h6-large:var(--digi--global--spacing--smallest-2);--digi--margin--text-small:var(--digi--global--spacing--largest-2);--digi--margin--text-large:var(--digi--global--spacing--largest-2);--digi--gutter--largest-3:var(--digi--global--spacing--largest-2);--digi--gutter--largest-2:var(--digi--global--spacing--larger);--digi--gutter--largest:var(--digi--global--spacing--base);--digi--gutter--larger:var(--digi--global--spacing--smaller);--digi--gutter--large:var(--digi--global--spacing--smallest);--digi--gutter--medium:var(--digi--global--spacing--smallest-2);--digi--gutter--small:var(--digi--global--spacing--smallest-3);--digi--gutter--smaller:var(--digi--global--spacing--smallest-4);--digi--gutter--smallest:var(--digi--global--spacing--smallest-5);--digi--gutter--smallest-2:var(--digi--global--spacing--smallest-6);--digi--gutter--smallest-3:var(--digi--global--spacing--smallest-7);--digi--gutter--button-block-small:var(--digi--global--spacing--smallest-3);--digi--gutter--button-block-medium:var(--digi--global--spacing--smallest-2);--digi--gutter--button-block-large:var(--digi--global--spacing--smallest);--digi--gutter--button-inline-small:var(--digi--global--spacing--smallest-2);--digi--gutter--button-inline-medium:var(--digi--global--spacing--base);--digi--gutter--button-inline-large:var(--digi--global--spacing--largest-2);--digi--gutter--icon:var(--digi--global--spacing--smallest);--digi--breakpoint--small-below:var(--digi--global--breakpoint--smallest);--digi--breakpoint--small:var(--digi--global--breakpoint--smaller);--digi--breakpoint--medium-below:var(--digi--global--breakpoint--small);--digi--breakpoint--medium:var(--digi--global--breakpoint--medium);--digi--breakpoint--large-below:var(--digi--global--breakpoint--large);--digi--breakpoint--large:var(--digi--global--breakpoint--larger);--digi--breakpoint--x-large-below:var(--digi--global--breakpoint--largest);--digi--breakpoint--x-large:var(--digi--global--breakpoint--largest-2);--digi--breakpoint--xx-large-below:var(--digi--global--breakpoint--largest-3);--digi--breakpoint--xx-large:var(--digi--global--breakpoint--largest-4);--digi--container-width--smaller:var(--digi--global--size--smaller);--digi--container-width--small:var(--digi--global--size--small);--digi--container-width--base:var(--digi--global--size--base);--digi--container-width--medium:var(--digi--global--size--base);--digi--container-width--large:var(--digi--global--size--large);--digi--container-width--larger:var(--digi--global--size--larger);--digi--container-width--largest:var(--digi--global--size--largest);--digi--container-gutter--smaller:var(--digi--global--spacing--base);--digi--container-gutter--small:var(--digi--global--spacing--large);--digi--container-gutter--base:var(--digi--global--spacing--base);--digi--container-gutter--medium:var(--digi--global--spacing--largest-2);--digi--container-gutter--large:var(--digi--global--spacing--base);--digi--container-gutter--larger:var(--digi--global--spacing--largest-3-5);--digi--container-gutter--largest:var(--digi--global--spacing--largest-5);--digi--paragraph-width--medium:var(--digi--global--text-width--base);--digi--paragraph-width--large:var(--digi--global--text-width--large);--digi--input-height--small:var(--digi--global--spacing--largest-4);--digi--input-height--medium:var(--digi--global--spacing--largest-5);--digi--input-height--large:var(--digi--global--spacing--largest-6);--digi--typography--body--font-size--desktop:var(--digi--global--typography--font-size--base);--digi--typography--body--font-size--desktop-large:var(--digi--global--typography--font-size--large);--digi--typography--body--font-size--mobile:var(--digi--global--typography--font-size--base);--digi--typography--body--font-weight--desktop:var(--digi--global--typography--font-weight--regular);--digi--typography--body--font-weight--desktop-large:var(--digi--global--typography--font-weight--regular);--digi--typography--body--font-weight--mobile:var(--digi--global--typography--font-weight--regular);--digi--typography--body--line-height--desktop:var(--digi--global--typography--line-height--base);--digi--typography--body--line-height--desktop-large:var(--digi--global--typography--line-height--base);--digi--typography--body--line-height--mobile:var(--digi--global--typography--line-height--base);--digi--typography--body--text-decoration--desktop:var(--digi--global--typography--text-decoration--default);--digi--typography--body--text-decoration--desktop-large:var(--digi--global--typography--text-decoration--default);--digi--typography--body--text-decoration--mobile:var(--digi--global--typography--text-decoration--default);--digi--typography--description--font-size--desktop:var(--digi--global--typography--font-size--base);--digi--typography--description--font-size--desktop-large:var(--digi--global--typography--font-size--large);--digi--typography--description--font-weight--desktop:var(--digi--global--typography--font-weight--semibold);--digi--typography--heading-1--font-size--desktop:var(--digi--global--typography--font-size--largest-4);--digi--typography--heading-1--font-size--desktop-large:var(--digi--global--typography--font-size--largest-6);--digi--typography--heading-1--font-size--mobile:var(--digi--global--typography--font-size--largest-3);--digi--typography--heading-1--font-weight--desktop:var(--digi--global--typography--font-weight--semibold);--digi--typography--heading-1--font-weight--desktop-large:var(--digi--global--typography--font-weight--semibold);--digi--typography--heading-1--font-weight--mobile:var(--digi--global--typography--font-weight--semibold);--digi--typography--heading-1--line-height--desktop:var(--digi--global--typography--line-height--base);--digi--typography--heading-1--line-height--desktop-large:var(--digi--global--typography--line-height--base);--digi--typography--heading-1--line-height--mobile:var(--digi--global--typography--line-height--base);--digi--typography--heading-1--text-decoration--desktop:var(--digi--global--typography--text-decoration--default);--digi--typography--heading-1--text-decoration--desktop-large:var(--digi--global--typography--text-decoration--default);--digi--typography--heading-1--text-decoration--mobile:var(--digi--global--typography--text-decoration--default);--digi--typography--heading-2--font-size--desktop:var(--digi--global--typography--font-size--largest-2);--digi--typography--heading-2--font-size--desktop-large:var(--digi--global--typography--font-size--largest-3);--digi--typography--heading-2--font-size--mobile:var(--digi--global--typography--font-size--largest);--digi--typography--heading-2--font-weight--desktop:var(--digi--global--typography--font-weight--semibold);--digi--typography--heading-2--font-weight--desktop-large:var(--digi--global--typography--font-weight--semibold);--digi--typography--heading-2--font-weight--mobile:var(--digi--global--typography--font-weight--semibold);--digi--typography--heading-2--line-height--desktop:var(--digi--global--typography--line-height--base);--digi--typography--heading-2--line-height--desktop-large:var(--digi--global--typography--line-height--base);--digi--typography--heading-2--line-height--mobile:var(--digi--global--typography--line-height--base);--digi--typography--heading-2--text-decoration--desktop:var(--digi--global--typography--text-decoration--default);--digi--typography--heading-2--text-decoration--desktop-large:var(--digi--global--typography--text-decoration--default);--digi--typography--heading-2--text-decoration--mobile:var(--digi--global--typography--text-decoration--default);--digi--typography--heading-3--font-size--desktop:var(--digi--global--typography--font-size--larger);--digi--typography--heading-3--font-size--desktop-large:var(--digi--global--typography--font-size--largest);--digi--typography--heading-3--font-size--mobile:var(--digi--global--typography--font-size--large);--digi--typography--heading-3--font-weight--desktop:var(--digi--global--typography--font-weight--semibold);--digi--typography--heading-3--font-weight--desktop-large:var(--digi--global--typography--font-weight--semibold);--digi--typography--heading-3--font-weight--mobile:var(--digi--global--typography--font-weight--semibold);--digi--typography--heading-3--line-height--desktop:var(--digi--global--typography--line-height--base);--digi--typography--heading-3--line-height--desktop-large:var(--digi--global--typography--line-height--base);--digi--typography--heading-3--line-height--mobile:var(--digi--global--typography--line-height--base);--digi--typography--heading-3--text-decoration--desktop:var(--digi--global--typography--text-decoration--default);--digi--typography--heading-3--text-decoration--desktop-large:var(--digi--global--typography--text-decoration--default);--digi--typography--heading-3--text-decoration--mobile:var(--digi--global--typography--text-decoration--default);--digi--typography--heading-4--font-size--desktop:var(--digi--global--typography--font-size--base);--digi--typography--heading-4--font-size--desktop-large:var(--digi--global--typography--font-size--large);--digi--typography--heading-4--font-size--mobile:var(--digi--global--typography--font-size--base);--digi--typography--heading-4--font-weight--desktop:var(--digi--global--typography--font-weight--semibold);--digi--typography--heading-4--font-weight--desktop-large:var(--digi--global--typography--font-weight--semibold);--digi--typography--heading-4--font-weight--mobile:var(--digi--global--typography--font-weight--semibold);--digi--typography--heading-4--line-height--desktop:var(--digi--global--typography--line-height--base);--digi--typography--heading-4--line-height--desktop-large:var(--digi--global--typography--line-height--base);--digi--typography--heading-4--line-height--mobile:var(--digi--global--typography--line-height--base);--digi--typography--heading-4--text-decoration--desktop:var(--digi--global--typography--text-decoration--default);--digi--typography--heading-4--text-decoration--desktop-large:var(--digi--global--typography--text-decoration--default);--digi--typography--heading-4--text-decoration--mobile:var(--digi--global--typography--text-decoration--default);--digi--typography--heading-jumbo--font-size--desktop:var(--digi--global--typography--font-size--largest-4);--digi--typography--heading-jumbo--font-size--desktop-large:var(--digi--global--typography--font-size--largest-6);--digi--typography--heading-jumbo--font-weight--desktop:var(--digi--global--typography--font-weight--semibold);--digi--typography--input--font-size--desktop-large:var(--digi--global--typography--font-size--large);--digi--typography--label--font-size--desktop:var(--digi--global--typography--font-size--base);--digi--typography--label--font-weight--desktop:var(--digi--global--typography--font-weight--semibold);--digi--typography--label--font-weight--mobile:var(--digi--global--typography--font-weight--semibold);--digi--typography--label--line-height--desktop:var(--digi--global--typography--line-height--base);--digi--typography--label-description--font-size--desktop:var(--digi--global--typography--font-size--base);--digi--typography--label-description--line-height--desktop:var(--digi--global--typography--line-height--base);--digi--typography--link--font-size--desktop:var(--digi--global--typography--font-size--base);--digi--typography--link--font-size--desktop-large:var(--digi--global--typography--font-size--large);--digi--typography--link--font-size--mobile:var(--digi--global--typography--font-size--base);--digi--typography--link--font-weight--desktop:var(--digi--global--typography--font-weight--regular);--digi--typography--link--font-weight--desktop-large:var(--digi--global--typography--font-weight--regular);--digi--typography--link--font-weight--mobile:var(--digi--global--typography--font-weight--regular);--digi--typography--link--line-height--desktop:var(--digi--global--typography--line-height--base);--digi--typography--link--line-height--desktop-large:var(--digi--global--typography--line-height--base);--digi--typography--link--line-height--mobile:var(--digi--global--typography--line-height--base);--digi--typography--link--text-decoration--desktop:var(--digi--global--typography--text-decoration--link);--digi--typography--link--text-decoration--desktop-large:var(--digi--global--typography--text-decoration--link);--digi--typography--link--text-decoration--mobile:var(--digi--global--typography--text-decoration--link);--digi--typography--link-bold--font-weight--desktop:var(--digi--global--typography--font-weight--semibold);--digi--typography--preamble--font-size--desktop:var(--digi--global--typography--font-size--base);--digi--typography--preamble--font-size--mobile:var(--digi--global--typography--font-size--base);--digi--typography--preamble--font-weight--desktop:var(--digi--global--typography--font-weight--semibold);--digi--typography--preamble--line-height--mobile:var(--digi--global--typography--line-height--base);--digi--typography--preamble--line-height--desktop:var(--digi--global--typography--line-height--base);--digi--typography--accordion--font-size--desktop:var(--digi--global--typography--font-size--base);--digi--typography--accordion--font-size--mobile:var(--digi--global--typography--font-size--base);--digi--typography--accordion--font-weight--desktop:var(--digi--global--typography--font-weight--semibold);--digi--typography--tag--font-size--desktop:var(--digi--global--typography--font-size--small);--digi--typography--tag--font-size--mobile:var(--digi--global--typography--font-size--small);--digi--typography--tag--font-weight--desktop:var(--digi--global--typography--font-weight--regular);--digi--typography--breadcrumbs--font-size--desktop:var(--digi--global--typography--font-size--small);--digi--typography--breadcrumbs--text-decoration--desktop:var(--digi--global--typography--text-decoration--default);--digi--typography--title-logo--font-size--desktop:var(--digi--global--typography--font-size--largest-5);--digi--typography--title-logo--font-size--desktop-large:var(--digi--global--typography--font-size--largest-5);--digi--typography--title-logo--font-size--mobile:var(--digi--global--typography--font-size--largest-3);--digi--typography--title-logo--font-weight--desktop:var(--digi--global--typography--font-weight--bold);--digi--typography--button--font-size--desktop:var(--digi--global--typography--font-size--base);--digi--typography--button--font-size--desktop-large:var(--digi--global--typography--font-size--large);--digi--typography--button--font-weight--desktop:var(--digi--global--typography--font-weight--semibold);--digi--color--amethyst--500:#822998;--digi--color--jade--100:#bddfda;--digi--color--jade--200:#7fc1b6;--digi--color--jade--400:#379d8d;--digi--color--jade--50:#ddeeec;--digi--color--jade--500:#058470;--digi--color--jade--600:#046a5a;--digi--color--jade--700:#035548;--digi--color--jade--900:#02372f;--digi--color--leaf--100:#f1f7e5;--digi--color--leaf--200:#ddebc1;--digi--color--leaf--400:#aace65;--digi--color--leaf--500:#95c23e;--digi--color--leaf--600:#779b32;--digi--color--pear--500:#b7ee4a;--digi--color--pear--600:#a7d943;--digi--color--rose--100:#f4cada;--digi--color--rose--200:#e997b7;--digi--color--rose--400:#dd5c8e;--digi--color--rose--50:#f9e4ec;--digi--color--rose--500:#d43372;--digi--color--rose--600:#bd2e65;--digi--color--rose--700:#882149;--digi--color--rose--900:#54172e;--digi--color--sapphire--500:#1616b2;--digi--color--stratos--100:#dddde9;--digi--color--stratos--400:#33337b;--digi--color--stratos--500:#00005a;--digi--color--stratos--600:#000048;--digi--color--water--200:#f1f8fe;--digi--color--water--500:#bdd3e7;--digi--color--water--700:#0058a3;--digi--color--background--brand-primary--light--af18:var(--digi--color--stratos--500);--digi--color--background--interactive--default--input-elements--light--af18:var(--digi--grayscale--0);--digi--color--background--interactive--default--pop-out--light--af18:var(--digi--color--leaf--100);--digi--color--background--interactive--default--primary--light--af18:var(--digi--color--stratos--500);--digi--color--background--interactive--default--primary-inverted--light--af18:var(--digi--color--leaf--500);--digi--color--background--interactive--default--quaternary--light--af18:var(--digi--grayscale--100);--digi--color--background--interactive--default--secondary--light--af18:var(--digi--grayscale--0);--digi--color--background--interactive--default--secondary-inverted--light--af18:var(--digi--misc--transparent);--digi--color--background--interactive--default--tertiary--light--af18:var(--digi--grayscale--200);--digi--color--background--interactive--hover--inverted--light--af18:var(--digi--color--pear--500);--digi--color--background--interactive--hover--primary--light--af18:var(--digi--color--water--700);--digi--color--background--interactive--hover--quarternary--light--af18:var(--digi--grayscale--200);--digi--color--background--interactive--hover--secondary--light--af18:var(--digi--color--water--500);--digi--color--background--interactive--hover--tertiary--light--af18:var(--digi--color--sapphire--500);--digi--color--background--interactive--selected--on-menu-minus-button--light--af18:var(--digi--color--leaf--200);--digi--color--background--interactive--selected--primary--light--af18:var(--digi--sentiment--success--500);--digi--color--background--interactive--selected--secondary--light--af18:var(--digi--color--stratos--500);--digi--color--background--interactive--selected--tertiary--light--af18:var(--digi--grayscale--200);--digi--color--background--interactive--validation--error--light--af18:var(--digi--sentiment--error--200);--digi--color--background--interactive--validation--success--light--af18:var(--digi--sentiment--success--200);--digi--color--background--interactive--validation--warning--light--af18:var(--digi--sentiment--warning--50);--digi--color--background--notification--light--af18:var(--digi--sentiment--error--500);--digi--color--background--pop-out--light--af18:var(--digi--color--leaf--100);--digi--color--background--primary--light--af18:var(--digi--grayscale--0);--digi--color--background--secondary--light--af18:var(--digi--grayscale--100);--digi--color--background--secondary-accent--light--af18:var(--digi--grayscale--400);--digi--color--background--secondary-muted--light--af18:var(--digi--grayscale--50);--digi--color--background--sentiment--beta--primary--light--af18:var(--digi--color--rose--500);--digi--color--background--sentiment--beta--secondary--light--af18:var(--digi--color--rose--100);--digi--color--background--sentiment--error--primary--light--af18:var(--digi--sentiment--error--500);--digi--color--background--sentiment--error--secondary--light--af18:var(--digi--sentiment--error--700);--digi--color--background--sentiment--error--tertiary--light--af18:var(--digi--sentiment--error--200);--digi--color--background--sentiment--info--primary--light--af18:var(--digi--sentiment--informative--500);--digi--color--background--sentiment--info--secondary--light--af18:var(--digi--sentiment--informative--700);--digi--color--background--sentiment--info--tertiary--light--af18:var(--digi--sentiment--informative--200);--digi--color--background--sentiment--neutral--primary--light--af18:var(--digi--grayscale--700);--digi--color--background--sentiment--neutral--secondary--light--af18:var(--digi--grayscale--400);--digi--color--background--sentiment--neutral--tertiary--light--af18:var(--digi--grayscale--900);--digi--color--background--sentiment--success--primary--light--af18:var(--digi--sentiment--success--500);--digi--color--background--sentiment--success--secondary--light--af18:var(--digi--sentiment--success--700);--digi--color--background--sentiment--success--tertiary--light--af18:var(--digi--sentiment--success--200);--digi--color--background--sentiment--warning--primary--light--af18:var(--digi--sentiment--warning--500);--digi--color--background--sentiment--warning--quarternary--light--af18:var(--digi--sentiment--warning--50);--digi--color--background--sentiment--warning--secondary--light--af18:var(--digi--sentiment--warning--700);--digi--color--background--sentiment--warning--tertiary--light--af18:var(--digi--sentiment--warning--200);--digi--color--background--transparent--light--af18:var(--digi--misc--transparent);--digi--color--border--accent--primary--light--af18:var(--digi--color--stratos--500);--digi--color--border--accent--secondary--light--af18:var(--digi--color--leaf--500);--digi--color--border--interactive--default--inverted--light--af18:var(--digi--color--leaf--500);--digi--color--border--interactive--default--on-input--light--af18:var(--digi--grayscale--900);--digi--color--border--interactive--default--on-input-nuance--light--af18:var(--digi--grayscale--800);--digi--color--border--interactive--default--primary--light--af18:var(--digi--color--stratos--500);--digi--color--border--interactive--hover--inverted--light--af18:var(--digi--color--pear--500);--digi--color--border--interactive--hover--primary--light--af18:var(--digi--color--water--700);--digi--color--border--interactive--hover--secondary--light--af18:var(--digi--color--stratos--500);--digi--color--border--interactive--selected--primary--light--af18:var(--digi--sentiment--success--500);--digi--color--border--interactive--selected--secondary--light--af18:var(--digi--color--stratos--500);--digi--color--border--interactive--validation--error--light--af18:var(--digi--sentiment--error--500);--digi--color--border--interactive--validation--success--light--af18:var(--digi--sentiment--success--500);--digi--color--border--interactive--validation--warning--light--af18:var(--digi--sentiment--warning--900);--digi--color--border--notification--light--af18:var(--digi--grayscale--0);--digi--color--border--sentiment--error--light--af18:var(--digi--sentiment--error--500);--digi--color--border--sentiment--info--light--af18:var(--digi--sentiment--informative--500);--digi--color--border--sentiment--success--light--af18:var(--digi--sentiment--success--500);--digi--color--border--sentiment--warning--light--af18:var(--digi--sentiment--warning--500);--digi--color--border--transparent--light--af18:var(--digi--misc--transparent);--digi--color--divider--cta--light--af18:var(--digi--color--sapphire--500);--digi--color--divider--on-brand-primary--light--af18:var(--digi--color--stratos--400);--digi--color--divider--primary--light--af18:var(--digi--grayscale--400);--digi--color--divider--secondary--light--af18:var(--digi--grayscale--200);--digi--color--icon--brand-primary--light--af18:var(--digi--color--stratos--500);--digi--color--icon--brand-secondary--light--af18:var(--digi--color--leaf--500);--digi--color--icon--cta--light--af18:var(--digi--color--sapphire--500);--digi--color--icon--primary--light--af18:var(--digi--grayscale--900);--digi--color--icon--secondary--light--af18:var(--digi--grayscale--0);--digi--color--icon--validation--error--light--af18:var(--digi--sentiment--error--500);--digi--color--icon--validation--success--light--af18:var(--digi--sentiment--success--500);--digi--color--icon--validation--warning--light--af18:var(--digi--sentiment--warning--500);--digi--color--infographic--background--light--af18:var(--digi--grayscale--0);--digi--color--infographic--brand--primary--light--af18:var(--digi--color--leaf--500);--digi--color--infographic--brand--primary-alt--light--af18:var(--digi--color--leaf--500);--digi--color--infographic--brand--secondary--light--af18:var(--digi--color--leaf--200);--digi--color--infographic--brand--secondary-alt--light--af18:var(--digi--color--leaf--200);--digi--color--infographic--lineart--light--af18:var(--digi--grayscale--900);--digi--color--logotype--primary--symbol--light--af18:var(--digi--color--leaf--500);--digi--color--logotype--primary--text--light--af18:var(--digi--color--stratos--500);--digi--color--logotype--secondary--symbol--light--af18:#1db920;--digi--color--logotype--secondary--text--light--af18:var(--digi--grayscale--0);--digi--color--marking--indication--primary--light--af18:var(--digi--sentiment--success--500);--digi--color--marking--indication--secondary--light--af18:var(--digi--color--stratos--500);--digi--color--marking--indication--tertiary--light--af18:var(--digi--grayscale--700);--digi--color--marking--navigation--level-active--light--af18:var(--digi--color--leaf--200);--digi--color--marking--navigation--level-inactive--light--af18:var(--digi--grayscale--100);--digi--color--marking--navigation--selected--light--af18:var(--digi--color--leaf--500);--digi--color--misc--skeleton--light--af18:var(--digi--grayscale--400);--digi--color--misc--spinner-path--light--af18:var(--digi--grayscale--400);--digi--color--text--description--light--af18:var(--digi--grayscale--800);--digi--color--text--interactive--brand-primary--light--af18:var(--digi--color--stratos--500);--digi--color--text--interactive--brand-secondary--light--af18:var(--digi--color--leaf--500);--digi--color--text--interactive--primary--light--af18:var(--digi--color--sapphire--500);--digi--color--text--interactive--secondary--light--af18:var(--digi--grayscale--0);--digi--color--text--interactive--tertiary--light--af18:var(--digi--grayscale--900);--digi--color--text--interactive--visited--light--af18:var(--digi--color--amethyst--500);--digi--color--text--primary--light--af18:var(--digi--grayscale--900);--digi--color--text--secondary--light--af18:var(--digi--grayscale--0);--digi--amethyst--500:#822998;--digi--granskott--150:#f2faf2;--digi--granskott--200:#ebf8eb;--digi--granskott--250:#ddf4dd;--digi--granskott--300:#cbecc9;--digi--granskott--350:#ace4ad;--digi--granskott--650:#1db920;--digi--granskott--700:#02a704;--digi--granskott--750:#018903;--digi--granskott--800:#016503;--digi--natthimmel--200:#e9f6fd;--digi--natthimmel--250:#ddf1fc;--digi--natthimmel--300:#c9e9fa;--digi--natthimmel--350:#abdef7;--digi--natthimmel--700:#043982;--digi--natthimmel--800:#091d54;--digi--natthimmel--900:#071744;--digi--norrsken--400:#aaf5ab;--digi--norrsken--500:#67ee6a;--digi--rallarros--300:#f8ddf5;--digi--rallarros--500:#ce1cbd;--digi--sapphire--500:#1616b2;--digi--color--background--brand-primary--light:var(--digi--natthimmel--800);--digi--color--background--interactive--default--input-elements--light:var(--digi--grayscale--0);--digi--color--background--interactive--default--pop-out--light:var(--digi--granskott--150);--digi--color--background--interactive--default--primary--light:var(--digi--natthimmel--800);--digi--color--background--interactive--default--primary-inverted--light:var(--digi--norrsken--500);--digi--color--background--interactive--default--quaternary--light:var(--digi--grayscale--100);--digi--color--background--interactive--default--secondary--light:var(--digi--grayscale--0);--digi--color--background--interactive--default--secondary-inverted--light:var(--digi--misc--transparent);--digi--color--background--interactive--default--tertiary--light:var(--digi--grayscale--200);--digi--color--background--interactive--hover--inverted--light:var(--digi--norrsken--400);--digi--color--background--interactive--hover--primary--light:var(--digi--natthimmel--700);--digi--color--background--interactive--hover--quarternary--light:var(--digi--grayscale--200);--digi--color--background--interactive--hover--secondary--light:var(--digi--natthimmel--250);--digi--color--background--interactive--hover--tertiary--light:var(--digi--sapphire--500);--digi--color--background--interactive--selected--on-menu-minus-button--light:var(--digi--granskott--350);--digi--color--background--interactive--selected--primary--light:var(--digi--sentiment--success--500);--digi--color--background--interactive--selected--secondary--light:var(--digi--natthimmel--800);--digi--color--background--interactive--selected--tertiary--light:var(--digi--grayscale--200);--digi--color--background--interactive--validation--error--light:var(--digi--sentiment--error--200);--digi--color--background--interactive--validation--success--light:var(--digi--sentiment--success--200);--digi--color--background--interactive--validation--warning--light:var(--digi--sentiment--warning--50);--digi--color--background--notification--light:var(--digi--sentiment--error--500);--digi--color--background--pop-out--light:var(--digi--granskott--200);--digi--color--background--primary--light:var(--digi--grayscale--0);--digi--color--background--secondary--light:var(--digi--grayscale--100);--digi--color--background--secondary-accent--light:var(--digi--grayscale--400);--digi--color--background--secondary-muted--light:var(--digi--grayscale--50);--digi--color--background--sentiment--beta--primary--light:var(--digi--rallarros--500);--digi--color--background--sentiment--beta--secondary--light:var(--digi--rallarros--300);--digi--color--background--sentiment--error--primary--light:var(--digi--sentiment--error--500);--digi--color--background--sentiment--error--secondary--light:var(--digi--sentiment--error--700);--digi--color--background--sentiment--error--tertiary--light:var(--digi--sentiment--error--200);--digi--color--background--sentiment--info--primary--light:var(--digi--sentiment--informative--500);--digi--color--background--sentiment--info--secondary--light:var(--digi--sentiment--informative--700);--digi--color--background--sentiment--info--tertiary--light:var(--digi--sentiment--informative--200);--digi--color--background--sentiment--neutral--primary--light:var(--digi--grayscale--700);--digi--color--background--sentiment--neutral--secondary--light:var(--digi--grayscale--400);--digi--color--background--sentiment--neutral--tertiary--light:var(--digi--grayscale--900);--digi--color--background--sentiment--success--primary--light:var(--digi--sentiment--success--500);--digi--color--background--sentiment--success--secondary--light:var(--digi--sentiment--success--700);--digi--color--background--sentiment--success--tertiary--light:var(--digi--sentiment--success--200);--digi--color--background--sentiment--warning--primary--light:var(--digi--sentiment--warning--500);--digi--color--background--sentiment--warning--quarternary--light:var(--digi--sentiment--warning--50);--digi--color--background--sentiment--warning--secondary--light:var(--digi--sentiment--warning--700);--digi--color--background--sentiment--warning--tertiary--light:var(--digi--sentiment--warning--200);--digi--color--background--transparent--light:var(--digi--misc--transparent);--digi--color--border--accent--primary--light:var(--digi--natthimmel--800);--digi--color--border--accent--secondary--light:var(--digi--granskott--700);--digi--color--border--interactive--default--inverted--light:var(--digi--norrsken--500);--digi--color--border--interactive--default--on-input--light:var(--digi--grayscale--900);--digi--color--border--interactive--default--on-input-nuance--light:var(--digi--grayscale--800);--digi--color--border--interactive--default--primary--light:var(--digi--natthimmel--800);--digi--color--border--interactive--hover--inverted--light:var(--digi--norrsken--400);--digi--color--border--interactive--hover--primary--light:var(--digi--natthimmel--700);--digi--color--border--interactive--hover--secondary--light:var(--digi--natthimmel--800);--digi--color--border--interactive--selected--primary--light:var(--digi--sentiment--success--500);--digi--color--border--interactive--selected--secondary--light:var(--digi--natthimmel--800);--digi--color--border--interactive--validation--error--light:var(--digi--sentiment--error--500);--digi--color--border--interactive--validation--success--light:var(--digi--sentiment--success--500);--digi--color--border--interactive--validation--warning--light:var(--digi--sentiment--warning--900);--digi--color--border--notification--light:var(--digi--grayscale--0);--digi--color--border--sentiment--error--light:var(--digi--sentiment--error--500);--digi--color--border--sentiment--info--light:var(--digi--sentiment--informative--500);--digi--color--border--sentiment--success--light:var(--digi--sentiment--success--500);--digi--color--border--sentiment--warning--light:var(--digi--sentiment--warning--500);--digi--color--border--transparent--light:var(--digi--misc--transparent);--digi--color--divider--cta--light:var(--digi--sapphire--500);--digi--color--divider--on-brand-primary--light:var(--digi--natthimmel--350);--digi--color--divider--primary--light:var(--digi--grayscale--400);--digi--color--divider--secondary--light:var(--digi--grayscale--200);--digi--color--icon--brand-primary--light:var(--digi--natthimmel--800);--digi--color--icon--brand-secondary--light:var(--digi--norrsken--500);--digi--color--icon--cta--light:var(--digi--sapphire--500);--digi--color--icon--primary--light:var(--digi--grayscale--900);--digi--color--icon--secondary--light:var(--digi--grayscale--0);--digi--color--icon--validation--error--light:var(--digi--sentiment--error--500);--digi--color--icon--validation--success--light:var(--digi--sentiment--success--500);--digi--color--icon--validation--warning--light:var(--digi--sentiment--warning--500);--digi--color--infographic--background--light:var(--digi--grayscale--0);--digi--color--infographic--brand--primary--light:var(--digi--granskott--700);--digi--color--infographic--brand--primary-alt--light:var(--digi--granskott--700);--digi--color--infographic--brand--secondary--light:var(--digi--granskott--300);--digi--color--infographic--brand--secondary-alt--light:var(--digi--granskott--300);--digi--color--infographic--lineart--light:var(--digi--grayscale--900);--digi--color--logotype--primary--symbol--light:var(--digi--granskott--700);--digi--color--logotype--primary--text--light:var(--digi--natthimmel--800);--digi--color--logotype--secondary--symbol--light:#1db920;--digi--color--logotype--secondary--text--light:var(--digi--grayscale--0);--digi--color--marking--indication--primary--light:var(--digi--sentiment--success--500);--digi--color--marking--indication--secondary--light:var(--digi--natthimmel--800);--digi--color--marking--indication--tertiary--light:var(--digi--grayscale--700);--digi--color--marking--navigation--level-active--light:var(--digi--granskott--350);--digi--color--marking--navigation--level-inactive--light:var(--digi--grayscale--100);--digi--color--marking--navigation--selected--light:var(--digi--granskott--700);--digi--color--misc--skeleton--light:var(--digi--grayscale--400);--digi--color--misc--spinner-path--light:var(--digi--grayscale--400);--digi--color--text--description--light:var(--digi--grayscale--800);--digi--color--text--interactive--brand-primary--light:var(--digi--natthimmel--800);--digi--color--text--interactive--brand-secondary--light:var(--digi--norrsken--500);--digi--color--text--interactive--primary--light:var(--digi--sapphire--500);--digi--color--text--interactive--secondary--light:var(--digi--grayscale--0);--digi--color--text--interactive--tertiary--light:var(--digi--grayscale--900);--digi--color--text--interactive--visited--light:var(--digi--amethyst--500);--digi--color--text--primary--light:var(--digi--grayscale--900);--digi--color--text--secondary--light:var(--digi--grayscale--0);--digi--color--background--brand-primary:var(--digi--color--background--brand-primary--light);--digi--color--background--interactive--default--input-elements:var(--digi--color--background--interactive--default--input-elements--light);--digi--color--background--interactive--default--pop-out:var(--digi--color--background--interactive--default--pop-out--light);--digi--color--background--interactive--default--primary:var(--digi--color--background--interactive--default--primary--light);--digi--color--background--interactive--default--primary-inverted:var(--digi--color--background--interactive--default--primary-inverted--light);--digi--color--background--interactive--default--quaternary:var(--digi--color--background--interactive--default--quaternary--light);--digi--color--background--interactive--default--secondary:var(--digi--color--background--interactive--default--secondary--light);--digi--color--background--interactive--default--secondary-inverted:var(--digi--color--background--interactive--default--secondary-inverted--light);--digi--color--background--interactive--default--tertiary:var(--digi--color--background--interactive--default--tertiary--light);--digi--color--background--interactive--hover--inverted:var(--digi--color--background--interactive--hover--inverted--light);--digi--color--background--interactive--hover--primary:var(--digi--color--background--interactive--hover--primary--light);--digi--color--background--interactive--hover--quarternary:var(--digi--color--background--interactive--hover--quarternary--light);--digi--color--background--interactive--hover--secondary:var(--digi--color--background--interactive--hover--secondary--light);--digi--color--background--interactive--hover--tertiary:var(--digi--color--background--interactive--hover--tertiary--light);--digi--color--background--interactive--selected--on-menu-minus-button:var(--digi--color--background--interactive--selected--on-menu-minus-button--light);--digi--color--background--interactive--selected--primary:var(--digi--color--background--interactive--selected--primary--light);--digi--color--background--interactive--selected--secondary:var(--digi--color--background--interactive--selected--secondary--light);--digi--color--background--interactive--selected--tertiary:var(--digi--color--background--interactive--selected--tertiary--light);--digi--color--background--interactive--validation--error:var(--digi--color--background--interactive--validation--error--light);--digi--color--background--interactive--validation--success:var(--digi--color--background--interactive--validation--success--light);--digi--color--background--interactive--validation--warning:var(--digi--color--background--interactive--validation--warning--light);--digi--color--background--notification:var(--digi--color--background--notification--light);--digi--color--background--pop-out:var(--digi--color--background--pop-out--light);--digi--color--background--primary:var(--digi--color--background--primary--light);--digi--color--background--secondary:var(--digi--color--background--secondary--light);--digi--color--background--secondary-accent:var(--digi--color--background--secondary-accent--light);--digi--color--background--secondary-muted:var(--digi--color--background--secondary-muted--light);--digi--color--background--sentiment--beta--primary:var(--digi--color--background--sentiment--beta--primary--light);--digi--color--background--sentiment--beta--secondary:var(--digi--color--background--sentiment--beta--secondary--light);--digi--color--background--sentiment--error--primary:var(--digi--color--background--sentiment--error--primary--light);--digi--color--background--sentiment--error--secondary:var(--digi--color--background--sentiment--error--secondary--light);--digi--color--background--sentiment--error--tertiary:var(--digi--color--background--sentiment--error--tertiary--light);--digi--color--background--sentiment--info--primary:var(--digi--color--background--sentiment--info--primary--light);--digi--color--background--sentiment--info--secondary:var(--digi--color--background--sentiment--info--secondary--light);--digi--color--background--sentiment--info--tertiary:var(--digi--color--background--sentiment--info--tertiary--light);--digi--color--background--sentiment--neutral--primary:var(--digi--color--background--sentiment--neutral--primary--light);--digi--color--background--sentiment--neutral--secondary:var(--digi--color--background--sentiment--neutral--secondary--light);--digi--color--background--sentiment--neutral--tertiary:var(--digi--color--background--sentiment--neutral--tertiary--light);--digi--color--background--sentiment--success--primary:var(--digi--color--background--sentiment--success--primary--light);--digi--color--background--sentiment--success--secondary:var(--digi--color--background--sentiment--success--secondary--light);--digi--color--background--sentiment--success--tertiary:var(--digi--color--background--sentiment--success--tertiary--light);--digi--color--background--sentiment--warning--primary:var(--digi--color--background--sentiment--warning--primary--light);--digi--color--background--sentiment--warning--quarternary:var(--digi--color--background--sentiment--warning--quarternary--light);--digi--color--background--sentiment--warning--secondary:var(--digi--color--background--sentiment--warning--secondary--light);--digi--color--background--sentiment--warning--tertiary:var(--digi--color--background--sentiment--warning--tertiary--light);--digi--color--background--transparent:var(--digi--color--background--transparent--light);--digi--color--border--accent--primary:var(--digi--color--border--accent--primary--light);--digi--color--border--accent--secondary:var(--digi--color--border--accent--secondary--light);--digi--color--border--interactive--default--inverted:var(--digi--color--border--interactive--default--inverted--light);--digi--color--border--interactive--default--on-input:var(--digi--color--border--interactive--default--on-input--light);--digi--color--border--interactive--default--on-input-nuance:var(--digi--color--border--interactive--default--on-input-nuance--light);--digi--color--border--interactive--default--primary:var(--digi--color--border--interactive--default--primary--light);--digi--color--border--interactive--hover--inverted:var(--digi--color--border--interactive--hover--inverted--light);--digi--color--border--interactive--hover--primary:var(--digi--color--border--interactive--hover--primary--light);--digi--color--border--interactive--hover--secondary:var(--digi--color--border--interactive--hover--secondary--light);--digi--color--border--interactive--selected--primary:var(--digi--color--border--interactive--selected--primary--light);--digi--color--border--interactive--selected--secondary:var(--digi--color--border--interactive--selected--secondary--light);--digi--color--border--interactive--validation--error:var(--digi--color--border--interactive--validation--error--light);--digi--color--border--interactive--validation--success:var(--digi--color--border--interactive--validation--success--light);--digi--color--border--interactive--validation--warning:var(--digi--color--border--interactive--validation--warning--light);--digi--color--border--notification:var(--digi--color--border--notification--light);--digi--color--border--sentiment--error:var(--digi--color--border--sentiment--error--light);--digi--color--border--sentiment--info:var(--digi--color--border--sentiment--info--light);--digi--color--border--sentiment--success:var(--digi--color--border--sentiment--success--light);--digi--color--border--sentiment--warning:var(--digi--color--border--sentiment--warning--light);--digi--color--border--transparent:var(--digi--color--border--transparent--light);--digi--color--divider--cta:var(--digi--color--divider--cta--light);--digi--color--divider--on-brand-primary:var(--digi--color--divider--on-brand-primary--light);--digi--color--divider--primary:var(--digi--color--divider--primary--light);--digi--color--divider--secondary:var(--digi--color--divider--secondary--light);--digi--color--icon--brand-primary:var(--digi--color--icon--brand-primary--light);--digi--color--icon--brand-secondary:var(--digi--color--icon--brand-secondary--light);--digi--color--icon--cta:var(--digi--color--icon--cta--light);--digi--color--icon--primary:var(--digi--color--icon--primary--light);--digi--color--icon--secondary:var(--digi--color--icon--secondary--light);--digi--color--icon--validation--error:var(--digi--color--icon--validation--error--light);--digi--color--icon--validation--success:var(--digi--color--icon--validation--success--light);--digi--color--icon--validation--warning:var(--digi--color--icon--validation--warning--light);--digi--color--infographic--background:var(--digi--color--infographic--background--light);--digi--color--infographic--brand--primary:var(--digi--color--infographic--brand--primary--light);--digi--color--infographic--brand--primary-alt:var(--digi--color--infographic--brand--primary-alt--light);--digi--color--infographic--brand--secondary:var(--digi--color--infographic--brand--secondary--light);--digi--color--infographic--brand--secondary-alt:var(--digi--color--infographic--brand--secondary-alt--light);--digi--color--infographic--lineart:var(--digi--color--infographic--lineart--light);--digi--color--logotype--primary--symbol:var(--digi--color--logotype--primary--symbol--light);--digi--color--logotype--primary--text:var(--digi--color--logotype--primary--text--light);--digi--color--logotype--secondary--symbol:var(--digi--color--logotype--secondary--symbol--light);--digi--color--logotype--secondary--text:var(--digi--color--logotype--secondary--text--light);--digi--color--marking--indication--primary:var(--digi--color--marking--indication--primary--light);--digi--color--marking--indication--secondary:var(--digi--color--marking--indication--secondary--light);--digi--color--marking--indication--tertiary:var(--digi--color--marking--indication--tertiary--light);--digi--color--marking--navigation--level-active:var(--digi--color--marking--navigation--level-active--light);--digi--color--marking--navigation--level-inactive:var(--digi--color--marking--navigation--level-inactive--light);--digi--color--marking--navigation--selected:var(--digi--color--marking--navigation--selected--light);--digi--color--misc--skeleton:var(--digi--color--misc--skeleton--light);--digi--color--misc--spinner-path:var(--digi--color--misc--spinner-path--light);--digi--color--text--description:var(--digi--color--text--description--light);--digi--color--text--interactive--brand-primary:var(--digi--color--text--interactive--brand-primary--light);--digi--color--text--interactive--brand-secondary:var(--digi--color--text--interactive--brand-secondary--light);--digi--color--text--interactive--primary:var(--digi--color--text--interactive--primary--light);--digi--color--text--interactive--secondary:var(--digi--color--text--interactive--secondary--light);--digi--color--text--interactive--tertiary:var(--digi--color--text--interactive--tertiary--light);--digi--color--text--interactive--visited:var(--digi--color--text--interactive--visited--light);--digi--color--text--primary:var(--digi--color--text--primary--light);--digi--color--text--secondary:var(--digi--color--text--secondary--light)}body.sc-digi-calendar-datepicker{font-size:1rem;font-family:"Open Sans", Arial, sans-serif}.sc-digi-calendar-datepicker-h{--digi--datepicker--max-width:18.75rem;--digi--datepicker--border-radius:0.25rem;--digi--datepicker--calendar--max-width:20.25rem;--digi--datepicker--calendar--show-week--max-width:23.375rem;--digi--datepicker--calendar-shadow:0 0.125rem 0.375rem 0 rgba(0, 0, 0, 0.7);--digi--datepicker--calendar--background-color:var(--digi--color--background--interactive--default--secondary);--digi--datepicker--input-icon--width:0.875rem;--digi--datepicker--input-icon--horizontal-padding:0.75rem;--digi--datepicker--input-icon--vertical-padding:var(--digi--global--spacing--smallest-2);--digi--datepicker--input--inline-start:var(--digi--gutter--medium);--digi--datepicker--input--inline-end:calc(var(--digi--datepicker--input-icon--width) + var(--digi--datepicker--input-icon--horizontal-padding) * 2);box-sizing:content-box}.sc-digi-calendar-datepicker-h .digi-calendar-datepicker.sc-digi-calendar-datepicker{position:relative;pointer-events:none}.sc-digi-calendar-datepicker-h .digi-calendar-datepicker__input-field.sc-digi-calendar-datepicker{position:relative;max-width:var(--digi--datepicker--max-width);pointer-events:auto}.sc-digi-calendar-datepicker-h .digi-calendar-datepicker__input-field.sc-digi-calendar-datepicker .digi-calendar-datepicker__inactive.sc-digi-calendar-datepicker{--digi--form-input--background--empty:var(--digi--datepicker--input--inactive-background)}.sc-digi-calendar-datepicker-h .digi-calendar-datepicker__input-field.sc-digi-calendar-datepicker .digi-calendar-datepicker__input-button.sc-digi-calendar-datepicker{background:var(--digi--color--background--primary);height:var(--digi--form-input--height--medium);color:inherit;border:1px solid var(--digi--color--border--interactive--default--on-input);border-left:none;padding:0;font:inherit;outline:inherit;cursor:pointer}.sc-digi-calendar-datepicker-h .digi-calendar-datepicker__input-field.sc-digi-calendar-datepicker .digi-calendar-datepicker__input-button.sc-digi-calendar-datepicker .digi-calendar-datepicker__button-icon.sc-digi-calendar-datepicker{box-sizing:content-box;width:var(--digi--datepicker--input-icon--width);padding:var(--digi--datepicker--input-icon--vertical-padding) var(--digi--datepicker--input-icon--horizontal-padding)}.sc-digi-calendar-datepicker-h .digi-calendar-datepicker__input-field.sc-digi-calendar-datepicker .digi-calendar-datepicker__input-button.sc-digi-calendar-datepicker svg.sc-digi-calendar-datepicker{color:var(--digi--color--icon--brand-primary)}.sc-digi-calendar-datepicker-h .digi-calendar-datepicker__input-field.sc-digi-calendar-datepicker .digi-calendar-datepicker__input-button.sc-digi-calendar-datepicker:focus-visible{outline:2px solid black;outline-offset:2px;box-shadow:0px 0px 0px 5px white}.sc-digi-calendar-datepicker-h .digi-calendar-datepicker__input-field.sc-digi-calendar-datepicker .digi-calendar-datepicker__input-button.sc-digi-calendar-datepicker:hover,.sc-digi-calendar-datepicker-h .digi-calendar-datepicker__input-field.sc-digi-calendar-datepicker .digi-calendar-datepicker__input-button.sc-digi-calendar-datepicker:focus{background:var(--digi--color--background--interactive--hover--secondary)}.sc-digi-calendar-datepicker-h .digi-calendar-datepicker__calendar.sc-digi-calendar-datepicker{max-width:var(--digi--datepicker--calendar--max-width);height:0px;border-radius:var(--digi--datepicker--border-radius);overflow:hidden;z-index:1}.sc-digi-calendar-datepicker-h .digi-calendar-datepicker__show-week-numbers.sc-digi-calendar-datepicker .digi-calendar-datepicker__calendar.sc-digi-calendar-datepicker{max-width:var(--digi--datepicker--calendar--show-week--max-width)}.sc-digi-calendar-datepicker-h .digi-calendar-datepicker__show-calendar.sc-digi-calendar-datepicker .digi-calendar-datepicker__calendar.sc-digi-calendar-datepicker{height:auto;background-color:var(--digi--datepicker--calendar--background-color);box-shadow:var(--digi--datepicker--calendar-shadow);position:absolute;top:var(--digi--datepicker--calendar--popup-top);left:0;pointer-events:auto}.sc-digi-calendar-datepicker-h .digi-calendar-datepicker__input-component.sc-digi-calendar-datepicker{--digi--form-input--padding:0 var(--digi--datepicker--input--inline-end) 0 var(--digi--datepicker--input--inline-start)}.sc-digi-calendar-datepicker-h .digi-calendar-datepicker__selected-date-alert.sc-digi-calendar-datepicker{border:0;clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}.sc-digi-calendar-datepicker-h .digi-calendar-datepicker__sr-instructions.sc-digi-calendar-datepicker{border:0;clip:rect(1px, 1px, 1px, 1px);-webkit-clip-path:inset(50%);clip-path:inset(50%);height:1px;margin:-1px;overflow:hidden;padding:0;position:absolute;width:1px;white-space:nowrap}`;
 
 const CalendarDatepicker = class {
@@ -2665,4 +3175,1033 @@ const CalendarDatepicker = class {
 };
 CalendarDatepicker.style = calendarDatepickerCss();
 
-export { CalendarDatepicker as digi_calendar_datepicker };
+const expandableAccordionCss = () => `.sc-digi-expandable-accordion-h{--digi--expandable-accordion--header--toggle-icon--transition:ease-in-out var(--digi--animation--duration--base) all;--digi--expandable-accordion--header--font-size:var(--digi--typography--accordion--font-size--desktop);--digi--expandable-accordion--header--font-size--small:var(--digi--typography--accordion--font-size--mobile);--digi--expandable-accordion--header--font-weight:var(--digi--typography--accordion--font-weight--desktop);--digi--expandable-accordion--icon--size:0.875rem;--digi--expandable-accordion--icon--margin-right:var(--digi--margin--medium);--digi--expandable-accordion--border-bottom-width:var(--digi--border-width--secondary);--digi--expandable-accordion--border-bottom-color:var(--digi--color--divider--cta);--digi--expandable-accordion--content--padding:var(--digi--padding--medium) 0;--digi--expandable-accordion--content--transition:ease-in-out var(--digi--animation--duration--base) height;display:block}.sc-digi-expandable-accordion-h .digi-expandable-accordion.sc-digi-expandable-accordion::after{content:"";display:block;max-width:var(--digi--paragraph-width--medium);border-bottom-width:var(--digi--expandable-accordion--border-bottom-width);border-bottom-color:var(--digi--expandable-accordion--border-bottom-color);border-bottom-style:solid;margin-top:calc(var(--digi--expandable-accordion--border-bottom-width) * -1)}.sc-digi-expandable-accordion-h .digi-expandable-accordion--fullwidth.sc-digi-expandable-accordion::after{content:"";display:block;max-width:none;border-bottom-width:var(--digi--expandable-accordion--border-bottom-width);border-bottom-style:solid;margin-top:calc(var(--digi--expandable-accordion--border-bottom-width) * -1)}.digi-expandable-accordion__header.sc-digi-expandable-accordion{display:flex;align-items:center}.digi-expandable-accordion--variation-primary.sc-digi-expandable-accordion .digi-expandable-accordion__header.sc-digi-expandable-accordion{max-width:var(--digi--paragraph-width--medium);border-bottom-width:var(--digi--expandable-accordion--border-bottom-width);border-bottom-color:var(--digi--expandable-accordion--border-bottom-color);border-bottom-style:solid}.digi-expandable-accordion--fullwidth.sc-digi-expandable-accordion .digi-expandable-accordion__header.sc-digi-expandable-accordion{max-width:none}.digi-expandable-accordion__toggle-icon.sc-digi-expandable-accordion{transition:var(--digi--expandable-accordion--header--toggle-icon--transition)}.digi-expandable-accordion--expanded-true.sc-digi-expandable-accordion .digi-expandable-accordion__toggle-icon.sc-digi-expandable-accordion{transform:rotate(-180deg)}.digi-expandable-accordion__heading.sc-digi-expandable-accordion{margin:0;flex:1}.digi-expandable-accordion__heading-text.sc-digi-expandable-accordion{max-width:var(--digi--paragraph-width--medium)}.digi-expandable-accordion__button.sc-digi-expandable-accordion{font-family:var(--digi--global--typography--font-family--default);font-size:var(--digi--expandable-accordion--header--font-size--small);font-weight:var(--digi--expandable-accordion--header--font-weight);width:100%;display:flex;gap:var(--digi--expandable-accordion--icon--margin-right);align-items:center;text-align:start;cursor:pointer;border:none}@media (min-width: 48rem){.digi-expandable-accordion__button.sc-digi-expandable-accordion{font-size:var(--digi--expandable-accordion--header--font-size)}}.digi-expandable-accordion--variation-primary.sc-digi-expandable-accordion .digi-expandable-accordion__button.sc-digi-expandable-accordion{color:var(--digi--color--text--primary);background-color:transparent;padding:var(--digi--expandable-accordion--content--padding)}.digi-expandable-accordion--variation-primary.sc-digi-expandable-accordion .digi-expandable-accordion__button.sc-digi-expandable-accordion:focus-visible{outline:2px solid black;outline-offset:2px;box-shadow:0px 0px 0px 5px white}.digi-expandable-accordion--variation-primary.sc-digi-expandable-accordion .digi-expandable-accordion__button.sc-digi-expandable-accordion:hover{text-decoration:underline}.digi-expandable-accordion--fullwidth.sc-digi-expandable-accordion .digi-expandable-accordion__button.sc-digi-expandable-accordion{max-width:none}.digi-expandable-accordion__content.sc-digi-expandable-accordion{overflow-y:hidden}.digi-expandable-accordion--expanded-false.sc-digi-expandable-accordion .digi-expandable-accordion__content.sc-digi-expandable-accordion{height:0}.digi-expandable-accordion--variation-primary.sc-digi-expandable-accordion .digi-expandable-accordion__content.sc-digi-expandable-accordion>div.sc-digi-expandable-accordion{padding:var(--digi--expandable-accordion--content--padding)}.digi-expandable-accordion--variation-primary.digi-expandable-accordion--animation-true.sc-digi-expandable-accordion .digi-expandable-accordion__content.sc-digi-expandable-accordion{transition:var(--digi--expandable-accordion--content--transition)}.digi-expandable-accordion__toggle-inside.sc-digi-expandable-accordion{text-align:center;--digi--button--color--background--function--hover:var(--digi--color--background--primary)}@keyframes heightAnim{from{height:0%}to{height:100%}}`;
+
+const ExpandableAccordion = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.afOnClick = createEvent(this, "afOnClick", 7);
+        /**
+         * Sätter utfällbar rubrik. 'h2' är förvalt.
+         * @en Set heading level. Default is 'h2'
+         */
+        this.afHeadingLevel = ExpandableAccordionHeaderLevel.H2;
+        /**
+         * Gör så att komponenten tar upp 100% i bredd av ytan den befinner sig i.
+         * @en Makes the component take up 100% of the width of the surface it is in.
+         */
+        this.afFullWidth = false;
+        /**
+         * Sätter läge på rubriken om den ska vara expanderad eller ej.
+         * @en Sets the state of the accordion to expanded or not.
+         */
+        this.afExpanded = false;
+        /**
+         * Ställer in ifall komponenten ska ha en animation vid utfällning. Animation är påslagen som standard.
+         * @en Sets the state of the animation for the accordion's expanded area. Animation is on as default.
+         */
+        this.afAnimation = true;
+        /**
+         * Sätter attributet 'id'. Om inget väljs så skapas ett slumpmässigt id.
+         * @en Set id attribute. Defaults to random string.
+         */
+        this.afId = randomIdGenerator('digi-expandable-accordion');
+        /**
+         * Sätter texten som visas på knappen som expanderar komponenten. Om inget väljs så används "Visa"
+         * @en Sets the text on the button that expands the component. Defaults to "Visa".
+         */
+        this.afExpandText = _t.show;
+        /**
+         * Sätter texten som visas på knappen som kollapsar komponenten. Om inget väljs så används "Dölj"
+         * @en Sets the text on the button that collapses the component. Defaults to "Dölj".
+         */
+        this.afCollapseText = _t.hide;
+    }
+    get cssModifiers() {
+        return {
+            [`digi-expandable-accordion--expanded-${!!this.afExpanded}`]: true,
+            [`digi-expandable-accordion--animation-${!!this.afAnimation}`]: true,
+            [`digi-expandable-accordion--variation-primary`]: true,
+            [`digi-expandable-accordion--fullwidth`]: this.afFullWidth
+        };
+    }
+    /**
+     * Hämtar en höjden till innehållet i Utfällbar yta och animera innehållet.
+     * @en Gets a height to the content for expandable and animate the content.
+     */
+    componentDidLoad() {
+        const content = this.hostElement.querySelector(`#${this.afId}-content`);
+        if (!this.afExpanded) {
+            content.style.visibility = 'hidden';
+        }
+        else {
+            content.style.overflowY = 'inherit';
+            content.style.height = 'auto';
+        }
+        content.addEventListener('transitionend', () => {
+            if (!this.afExpanded) {
+                content.style.visibility = 'hidden';
+                content.style.height = '0px';
+            }
+            else {
+                content.style.height = 'auto';
+                content.style.overflowY = 'inherit';
+            }
+        });
+    }
+    animateContentHeight() {
+        const content = this.hostElement.querySelector(`#${this.afId}-content`);
+        const sectionHeight = content.firstElementChild
+            .offsetHeight;
+        if (!this.afExpanded && content.style.height === 'auto') {
+            content.style.height = sectionHeight + 'px';
+            setTimeout(() => {
+                content.style.height = '0';
+                content.style.overflowY = 'hidden';
+            });
+            return;
+        }
+        if (this.afExpanded) {
+            content.style.height = sectionHeight + 'px';
+            content.style.visibility = 'visible';
+            if (!this.afAnimation) {
+                setTimeout(() => {
+                    content.style.height = 'auto';
+                    content.style.overflowY = 'inherit';
+                });
+            }
+        }
+        else {
+            content.style.height = '0px';
+        }
+    }
+    clickToggleHandler(e, resetFocus = false) {
+        e.preventDefault();
+        this.afExpanded = !this.afExpanded;
+        if (resetFocus) {
+            this._button.focus();
+        }
+        this.afOnClick.emit(e);
+    }
+    render() {
+        return (h("article", { key: '2616819e45750577fb23f430d41b2787ca2210a5', "aria-expanded": this.afExpanded ? 'true' : 'false', class: Object.assign({ 'digi-expandable-accordion': true }, this.cssModifiers) }, h("header", { key: 'c77c15183eb4bba670ea2299d5dc3c19e243ea42', class: "digi-expandable-accordion__header" }, h(this.afHeadingLevel, { key: '20dc16774240b6d258eec3d94d4b5d9b9d0a735c', class: "digi-expandable-accordion__heading" }, h("button", { key: '23c45158f203517166cd4c5efe8801b849ea04e0', 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: 'bd48367111a6aac92061bda052ffb6708d4f3967', class: "digi-expandable-accordion__toggle-icon" }), h("div", { key: '2e419d3fd48aa8fd31f33012b541a0fd86e60d78', class: "digi-expandable-accordion__heading-text" }, this.afHeading)))), h("section", { key: 'a28657a14024836c9bb1c7e825c573ed6c598eca', class: "digi-expandable-accordion__content", id: `${this.afId}-content` }, h("div", { key: 'e13b9e653c1714adefd5401300789ed89d4cc1b3' }, h("digi-typography", { key: '335442cf9f97ec3f821ab2ca296e1539b24354cf' }, h("slot", { key: '05da2edf48d9259187bb72bf73a6c60ec9077bc0' }))))));
+    }
+    get hostElement() { return getElement(this); }
+    static get watchers() { return {
+        "afExpanded": [{
+                "animateContentHeight": 0
+            }]
+    }; }
+};
+ExpandableAccordion.style = expandableAccordionCss();
+
+const expandableFaqItemCss = () => `.sc-digi-expandable-faq-item-h{--digi--expandable-faq-item--header--background-color--primary:var(--digi--color--background--pop-out);--digi--expandable-faq-item--header--background-color--secondary:var(--digi--color--background--secondary);--digi--expandable-faq-item--header--background-color--tertiary:var(--digi--color--background--primary);--digi--expandable-faq-item--header--toggle-icon--transition:ease-in-out var(--digi--animation--duration--base) all;--digi--expandable-faq-item--content--transition:ease-in-out var(--digi--animation--duration--base) height;--digi--expandable-faq-item--icon--size:0.875rem;--digi--expandable-faq-item--icon--margin-right:var(--digi--margin--medium);--digi--expandable-faq-item--header--font-size:var(--digi--typography--preamble--font-size--desktop);--digi--expandable-faq-item--header--font-weight:var(--digi--typography--preamble--font-weight--desktop);--digi--expandable-faq-item--border-width:var(--digi--border-width--secondary);--digi--expandable-faq-item--border-bottom-width:var(--digi--border-width--secondary);--digi--expandable-faq-item--content--padding:var(--digi--gutter--largest-2);display:block}.sc-digi-expandable-faq-item-h .digi-expandable-faq-item--primary.sc-digi-expandable-faq-item{--BACKGROUND:var(--digi--expandable-faq-item--header--background-color--primary)}.sc-digi-expandable-faq-item-h .digi-expandable-faq-item--secondary.sc-digi-expandable-faq-item{--BACKGROUND:var(--digi--expandable-faq-item--header--background-color--secondary)}.sc-digi-expandable-faq-item-h .digi-expandable-faq-item--tertiary.sc-digi-expandable-faq-item{--BACKGROUND:var(--digi--expandable-faq-item--header--background-color--tertiary)}.sc-digi-expandable-faq-item-h .digi-expandable-faq-item.sc-digi-expandable-faq-item{margin-bottom:var(--digi--global--spacing--smallest-4);font-family:var(--digi--global--typography--font-family--default)}.sc-digi-expandable-faq-item-h .digi-expandable-faq-item--expanded.sc-digi-expandable-faq-item{border-bottom-color:var(--BACKGROUND)}.sc-digi-expandable-faq-item-h .digi-expandable-faq-item__header.sc-digi-expandable-faq-item{background-color:var(--BACKGROUND);width:100%;max-width:calc(var(--digi--paragraph-width--medium) + var(--digi--padding--largest-2))}.sc-digi-expandable-faq-item-h .digi-expandable-faq-item__header.sc-digi-expandable-faq-item .digi-expandable-faq-item--fullwidth.sc-digi-expandable-faq-item{max-width:none}.sc-digi-expandable-faq-item-h .digi-expandable-faq-item__header-text.sc-digi-expandable-faq-item{max-width:var(--digi--paragraph-width--medium)}.sc-digi-expandable-faq-item-h .digi-expandable-faq-item__header.sc-digi-expandable-faq-item h1.sc-digi-expandable-faq-item,.sc-digi-expandable-faq-item-h .digi-expandable-faq-item__header.sc-digi-expandable-faq-item h2.sc-digi-expandable-faq-item,.sc-digi-expandable-faq-item-h .digi-expandable-faq-item__header.sc-digi-expandable-faq-item h3.sc-digi-expandable-faq-item,.sc-digi-expandable-faq-item-h .digi-expandable-faq-item__header.sc-digi-expandable-faq-item h4.sc-digi-expandable-faq-item,.sc-digi-expandable-faq-item-h .digi-expandable-faq-item__header.sc-digi-expandable-faq-item h5.sc-digi-expandable-faq-item,.sc-digi-expandable-faq-item-h .digi-expandable-faq-item__header.sc-digi-expandable-faq-item h6.sc-digi-expandable-faq-item{margin:0}.sc-digi-expandable-faq-item-h .digi-expandable-faq-item__header--toggle-icon.sc-digi-expandable-faq-item{margin-right:var(--digi--expandable-faq-item--icon--margin-right);transition:var(--digi--expandable-faq-item--header--toggle-icon--transition)}.sc-digi-expandable-faq-item-h .digi-expandable-faq-item__header--toggle-icon--expanded.sc-digi-expandable-faq-item{transform:rotate(-180deg)}.sc-digi-expandable-faq-item-h .digi-expandable-faq-item__header--toggle-icon.sc-digi-expandable-faq-item-s>[slot^=icon],.sc-digi-expandable-faq-item-h .digi-expandable-faq-item__header--toggle-icon .sc-digi-expandable-faq-item-s>[slot^=icon]{--digi--icon--width:var(--digi--expandable-faq-item--icon--size);--digi--icon--height:var(--digi--expandable-faq-item--icon--size)}.sc-digi-expandable-faq-item-h .digi-expandable-faq-item--fullwidth.sc-digi-expandable-faq-item .digi-expandable-faq-item__header.sc-digi-expandable-faq-item{max-width:none}.sc-digi-expandable-faq-item-h .digi-expandable-faq-item__button.sc-digi-expandable-faq-item{color:var(--digi--color--text--primary);background-color:var(--BACKGROUND);border:none;border-radius:0;padding:var(--digi--expandable-faq-item--content--padding);font-size:var(--digi--expandable-faq-item--header--font-size);font-weight:var(--digi--expandable-faq-item--header--font-weight);width:100%;display:flex;align-items:center;text-align:left;cursor:pointer;font-family:var(--digi--global--typography--font-family--default)}.sc-digi-expandable-faq-item-h .digi-expandable-faq-item__button.sc-digi-expandable-faq-item:hover{text-decoration:underline}.sc-digi-expandable-faq-item-h .digi-expandable-faq-item__button.sc-digi-expandable-faq-item:focus-visible{outline:2px solid black;outline-offset:2px;box-shadow:0px 0px 0px 5px white}.sc-digi-expandable-faq-item-h .digi-expandable-faq-item__content.sc-digi-expandable-faq-item{overflow-y:hidden}.sc-digi-expandable-faq-item-h .digi-expandable-faq-item__content.sc-digi-expandable-faq-item>div.sc-digi-expandable-faq-item{padding:var(--digi--expandable-faq-item--content--padding);box-sizing:border-box;max-width:var(--digi--paragraph-width--medium)}.sc-digi-expandable-faq-item-h .digi-expandable-faq-item__content--animation.sc-digi-expandable-faq-item{transition:var(--digi--expandable-faq-item--content--transition)}.sc-digi-expandable-faq-item-h .digi-expandable-faq-item__content--hidden.sc-digi-expandable-faq-item{height:0}`;
+
+const ExpandableFaqItem = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.afOnClick = createEvent(this, "afOnClick", 7);
+        /**
+         * Sätter rubriknivå. 'h3' är förvalt.
+         * @en Set heading level. Default is 'h3'
+         */
+        this.afHeadingLevel = ExpandableFaqItemHeadingLevel.H3;
+        /**
+         * Gör så att komponenten tar upp 100% i bredd av ytan den befinner sig i.
+         * @en Makes the component take up 100% of the width of the surface it is in.
+         */
+        this.afFullWidth = false;
+        /**
+         * Sätter läge på FAQ-frågan om den ska vara expanderad eller ej.
+         * @en Sets the state of the FAQ item to expanded or not.
+         */
+        this.afExpanded = false;
+        /**
+         * Sätter variant. Kan vara 'Primary' eller 'Secondary'
+         * @en Set variation. Can be 'Primary' or 'Secondary'
+         */
+        this.afVariation = ExpandableFaqItemVariation.PRIMARY;
+        /**
+         * Ställer in ifall komponenten ska ha en animation vid utfällning. Animation är påslagen som standard.
+         * @en Sets the state of the animation for the accordion's expanded area. Animation is on as default.
+         */
+        this.afAnimation = true;
+        /**
+         * Sätter attributet 'id'. Om inget väljs så skapas ett slumpmässigt id.
+         * @en Set id attribute. Defaults to random string.
+         */
+        this.afId = randomIdGenerator('digi-expandable-faq-item');
+    }
+    get cssModifiers() {
+        return {
+            'digi-expandable-faq-item--expanded': this.afExpanded,
+            'digi-expandable-faq-item--fullwidth': this.afFullWidth,
+            'digi-expandable-faq-item--primary': this.afVariation === ExpandableFaqItemVariation.PRIMARY,
+            'digi-expandable-faq-item--secondary': this.afVariation === ExpandableFaqItemVariation.SECONDARY,
+            'digi-expandable-faq-item--tertiary': this.afVariation === ExpandableFaqItemVariation.TERTIARY
+        };
+    }
+    /**
+     * Hämtar en höjden till innehållet i vanliga frågor och svar och animera innehållet.
+     * @en Gets a height to the content for FAQ and animate the content.
+     */
+    componentDidLoad() {
+        const content = this.hostElement.querySelector(`#${this.afId}-content`);
+        if (!this.afExpanded) {
+            content.style.visibility = 'hidden';
+        }
+        else {
+            content.style.height = 'auto';
+            content.style.overflowY = 'inherit';
+        }
+        content.addEventListener('transitionend', () => {
+            if (!this.afExpanded) {
+                content.style.visibility = 'hidden';
+                content.style.height = '0px';
+            }
+            else {
+                content.style.height = 'auto';
+                content.style.overflowY = 'inherit';
+            }
+        });
+    }
+    animateContentHeight() {
+        const content = this.hostElement.querySelector(`#${this.afId}-content`);
+        const sectionHeight = content.firstElementChild
+            .offsetHeight;
+        if (!this.afExpanded && content.style.height === 'auto') {
+            content.style.height = sectionHeight + 'px';
+            setTimeout(() => {
+                content.style.height = '0';
+                content.style.overflowY = 'hidden';
+            });
+            return;
+        }
+        if (this.afExpanded) {
+            content.style.height = sectionHeight + 'px';
+            content.style.visibility = 'visible';
+            if (!this.afAnimation) {
+                setTimeout(() => {
+                    content.style.height = 'auto';
+                    content.style.overflowY = 'inherit';
+                });
+            }
+        }
+        else {
+            content.style.height = '0px';
+        }
+    }
+    render() {
+        return (h("article", { key: 'e0931c4256d2c4162911fe232132b6179968425f', "aria-expanded": this.afExpanded ? 'true' : 'false', class: Object.assign({ 'digi-expandable-faq-item': true }, this.cssModifiers) }, h("header", { key: '8f6befff5c82c63d5d1f10755f444791f17dafb7', class: "digi-expandable-faq-item__header" }, h(this.afHeadingLevel, { key: 'b9d58dcd28eb430d7b84365ba1bba99d3e86ebc9' }, h("button", { key: 'b2c20566cc84a2b4cbcbe2dcc2a35e44e8f0fcc9', type: "button", class: "digi-expandable-faq-item__button", onClick: (e) => {
+                e.preventDefault();
+                this.afExpanded = !this.afExpanded;
+                this.afOnClick.emit(e);
+            }, "aria-expanded": this.afExpanded ? 'true' : 'false', "aria-controls": `${this.afId}-content` }, h("digi-icon-chevron-down", { key: '40e0a896b3d7d44bf282e8462a24c43060a29eff', class: {
+                'digi-expandable-faq-item__header--toggle-icon': true,
+                'digi-expandable-faq-item__header--toggle-icon--expanded': this.afExpanded
+            } }), h("div", { key: 'f58aa361553f3063bf1e5171f8d320e6cb8189c6', class: "digi-expandable-faq-item__header-text" }, this.afHeading)))), h("section", { key: 'b4d0dd00a3e6fe9e8367ef5a6f197696de55f4fd', class: {
+                'digi-expandable-faq-item__content': true,
+                'digi-expandable-faq-item__content--animation': this.afAnimation,
+                'digi-expandable-faq-item__content--hidden': !this.afExpanded
+            }, id: `${this.afId}-content` }, h("div", { key: 'e9a9147164d3934584cd5da5cfc8080ba9374c76' }, h("digi-typography", { key: '398a0c4e0aa1092db5f4a2e3182218ebbe0c3624' }, h("slot", { key: 'be924dc541b7c41b19b4392d3a988b492144d585' }))))));
+    }
+    get hostElement() { return getElement(this); }
+    static get watchers() { return {
+        "afExpanded": [{
+                "animateContentHeight": 0
+            }]
+    }; }
+};
+ExpandableFaqItem.style = expandableFaqItemCss();
+
+const formInputCss = () => `.sc-digi-form-input-h{--digi--form-input--height--small:var(--digi--input-height--small);--digi--form-input--height--medium:var(--digi--input-height--medium);--digi--form-input--height--large:var(--digi--input-height--large);--digi--form-input--border-radius:var(--digi--border-radius--input);--digi--form-input--padding:0 var(--digi--gutter--medium);--digi--form-input--background--empty:var(--digi--color--background--interactive--default--input-elements);--digi--form-input--background--neutral:var(--digi--color--background--interactive--default--input-elements);--digi--form-input--background--success:var(--digi--color--background--interactive--validation--success);--digi--form-input--background--warning:var(--digi--color--background--interactive--validation--warning);--digi--form-input--background--error:var(--digi--color--background--interactive--validation--error);--digi--form-input--border--neutral:var(--digi--border-width--input-regular) solid;--digi--form-input--border--error:var(--digi--border-width--input-validation) solid;--digi--form-input--border--success:var(--digi--border-width--input-validation) solid;--digi--form-input--border--warning:var(--digi--border-width--input-validation) solid;--digi--form-input--border-color--neutral:var(--digi--color--border--interactive--default--on-input);--digi--form-input--border-color--success:var(--digi--color--border--interactive--validation--success);--digi--form-input--border-color--warning:var(--digi--color--border--interactive--validation--warning);--digi--form-input--border-color--error:var(--digi--color--border--interactive--validation--error)}.sc-digi-form-input-h .digi-form-input.sc-digi-form-input{display:flex;flex-direction:column;gap:0.4em}.sc-digi-form-input-h .digi-form-input--small.sc-digi-form-input{--HEIGHT:var(--digi--form-input--height--small)}.sc-digi-form-input-h .digi-form-input--medium.sc-digi-form-input{--HEIGHT:var(--digi--form-input--height--medium)}.sc-digi-form-input-h .digi-form-input--large.sc-digi-form-input{--HEIGHT:var(--digi--form-input--height--large)}.sc-digi-form-input-h .digi-form-input--neutral.sc-digi-form-input{--BORDER:var(--digi--form-input--border--neutral);--BORDER-COLOR:var(--digi--form-input--border-color--neutral);--BACKGROUND:var(--digi--form-input--background--neutral)}.sc-digi-form-input-h .digi-form-input--empty.sc-digi-form-input:not(:focus-within){--BACKGROUND:var(--digi--form-input--background--empty)}.sc-digi-form-input-h .digi-form-input--success.sc-digi-form-input{--BORDER:var(--digi--form-input--border--success);--BORDER-COLOR:var(--digi--form-input--border-color--success);--BACKGROUND:var(--digi--form-input--background--success)}.sc-digi-form-input-h .digi-form-input--warning.sc-digi-form-input{--BORDER:var(--digi--form-input--border--warning);--BORDER-COLOR:var(--digi--form-input--border-color--warning);--BACKGROUND:var(--digi--form-input--background--warning)}.sc-digi-form-input-h .digi-form-input--error.sc-digi-form-input{--BORDER:var(--digi--form-input--border--error);--BORDER-COLOR:var(--digi--form-input--border-color--error);--BACKGROUND:var(--digi--form-input--background--error)}.digi-form-input__input-wrapper.sc-digi-form-input{position:relative;display:flex}.digi-form-input__input-wrapper.sc-digi-form-input-s>[slot^=button] button,.digi-form-input__input-wrapper .sc-digi-form-input-s>[slot^=button] button{--MIN-HEIGHT:100%}.digi-form-input--button-variation-primary .digi-form-input__input-wrapper.sc-digi-form-input-s>[slot^=button] button,.digi-form-input__input-wrapper .sc-digi-form-input-s>[slot^=button] button{border-start-start-radius:0;border-end-start-radius:0}.digi-form-input--button-variation-secondary.digi-form-input--has-button-true.sc-digi-form-input .digi-form-input__input-wrapper.sc-digi-form-input{gap:var(--digi--gutter--medium);flex-wrap:wrap}.digi-form-input__input.sc-digi-form-input{flex:1;height:var(--HEIGHT);font-family:var(--digi--global--typography--font-family--default);font-size:var(--digi--typography--body--font-size--desktop);padding:var(--digi--form-input--padding);color:var(--digi--color--text--primary);background:var(--BACKGROUND);border:var(--BORDER);border-color:var(--BORDER-COLOR);border-radius:var(--digi--form-input--border-radius);box-sizing:border-box}.digi-form-input__input.sc-digi-form-input:focus-visible{outline:2px solid black;outline-offset:2px;box-shadow:0px 0px 0px 5px white}.digi-form-input--button-variation-primary.digi-form-input--has-button-true.sc-digi-form-input .digi-form-input__input.sc-digi-form-input{border-end-end-radius:0;border-start-end-radius:0}`;
+
+const FormInput = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.afOnChange = createEvent(this, "afOnChange", 7);
+        this.afOnBlur = createEvent(this, "afOnBlur", 7);
+        this.afOnKeyup = createEvent(this, "afOnKeyup", 7);
+        this.afOnFocus = createEvent(this, "afOnFocus", 7);
+        this.afOnFocusout = createEvent(this, "afOnFocusout", 7);
+        this.afOnInput = createEvent(this, "afOnInput", 7);
+        this.afOnDirty = createEvent(this, "afOnDirty", 7);
+        this.afOnTouched = createEvent(this, "afOnTouched", 7);
+        this.afOnReady = createEvent(this, "afOnReady", 3);
+        this.hasActiveValidationMessage = false;
+        this.dirty = false;
+        this.touched = false;
+        /**
+         * Sätter attributet 'type'.
+         * @en Input type attribute
+         */
+        this.afType = FormInputType.TEXT;
+        /**
+         * Sätter attributet 'inputmode'.
+         * @en Inputmode  type attribute
+         */
+        this.afInputmode = FormInputMode.DEFAULT;
+        /**
+         * Layout för hur inmatningsfältet ska visas då det finns en knapp
+         * @en Input layout when there is a button
+         */
+        this.afButtonVariation = FormInputButtonVariation.PRIMARY;
+        /**
+         * Sätter variant. Kan vara 'small', 'medium' eller 'large'
+         * @en Set input variation.
+         */
+        this.afVariation = FormInputVariation.MEDIUM;
+        /**
+         * Sätter attributet 'id'. Om inget väljs så skapas ett slumpmässigt id.
+         * @en Input id attribute. Defaults to random string.
+         */
+        this.afId = randomIdGenerator('digi-form-input');
+        /**
+         * Sätt denna till true om formuläret innehåller fler obligatoriska fält än valfria.
+         * @en Set this to true if the form contains more required fields than optional fields.
+         */
+        this.afAnnounceIfOptional = false;
+        /**
+         * Sätter valideringsstatus. Kan vara 'success', 'error', 'warning', 'neutral' eller ingenting.
+         * @en Set input validation status
+         */
+        this.afValidation = FormInputValidation.NEUTRAL;
+        /**
+         * Om värdet är true får felmeddelandet attributet role="alert".
+         * Om felet visas tillsammans med flera andra fel (till exempel efter servervalidering) ska värdet sättas till false.
+         * @en If the value is true, the error message gets the attribute role="alert".
+         * If the error is shown together with multiple errors (for example after server-side validation), the value should be set to false.
+         */
+        this.afErrorMessageIsAlert = true;
+    }
+    onValueChanged(value) {
+        this.afValue = value;
+    }
+    onAfValueChanged(value) {
+        this.value = value;
+        if (this._input && this._input.value !== String(value !== null && value !== void 0 ? value : '')) {
+            this._input.value = String(value !== null && value !== void 0 ? value : '');
+        }
+    }
+    get errorMessageIsAlert() {
+        return (this.afErrorMessageIsAlert !== false &&
+            this.afErrorMessageIsAlert !== 'false');
+    }
+    afValidationTextWatch() {
+        this.setActiveValidationMessage();
+    }
+    /**
+     * Hämtar en referens till inputelementet. Bra för att t.ex. sätta fokus programmatiskt.
+     * @en Returns a reference to the input element. Handy for setting focus programmatically.
+     */
+    async afMGetFormControlElement() {
+        return this._input;
+    }
+    /**
+     * Lyssnar på om fokus sätts på custom-elementet och propagerar ner det till själva input-elementet.
+     * @en Listens for when focus is set on the custom element and propagates it down to the actual input element.
+     */
+    focusOnInput() {
+        this._input.focus();
+    }
+    componentWillLoad() {
+        this.afValue ? (this.value = this.afValue) : (this.afValue = this.value);
+        this.setActiveValidationMessage();
+        this.setHasButton();
+    }
+    componentWillUpdate() {
+        this.setHasButton();
+    }
+    componentDidLoad() {
+        this.afOnReady.emit();
+    }
+    setActiveValidationMessage() {
+        this.hasActiveValidationMessage = !!this.afValidationText;
+    }
+    get cssModifiers() {
+        return {
+            'digi-form-input--small': this.afVariation === FormInputVariation.SMALL,
+            'digi-form-input--medium': this.afVariation === FormInputVariation.MEDIUM,
+            'digi-form-input--large': this.afVariation === FormInputVariation.LARGE,
+            'digi-form-input--neutral': this.afValidation === FormInputValidation.NEUTRAL,
+            'digi-form-input--success': this.afValidation === FormInputValidation.SUCCESS,
+            'digi-form-input--error': this.afValidation === FormInputValidation.ERROR,
+            'digi-form-input--warning': this.afValidation === FormInputValidation.WARNING,
+            [`digi-form-input--button-variation-${this.afButtonVariation}`]: !!this.afButtonVariation,
+            [`digi-form-input--has-button-${this.hasButton}`]: true,
+            'digi-form-input--empty': !this.afValue &&
+                (!this.afValidation ||
+                    this.afValidation === FormInputValidation.NEUTRAL)
+        };
+    }
+    blurHandler(e) {
+        const trimableTypes = [
+            FormInputType.TEXT,
+            FormInputType.EMAIL,
+            FormInputType.SEARCH,
+            FormInputType.TEL,
+            FormInputType.URL
+        ];
+        const shouldTrim = this.afTrimValue && trimableTypes.includes(this.afType);
+        if (shouldTrim && typeof e.target.value === 'string') {
+            const trimmedValue = e.target.value.trim();
+            if (trimmedValue !== e.target.value) {
+                this.afValue = this.value = trimmedValue;
+                if (this._input) {
+                    this._input.value = trimmedValue;
+                }
+                // Emittar afOnInput så Angulars value accessor får det trimmade värdet
+                this.afOnInput.emit(e);
+            }
+        }
+        if (!this.touched) {
+            this.afOnTouched.emit(e);
+            this.touched = true;
+        }
+        this.afOnBlur.emit(e);
+    }
+    changeHandler(e) {
+        this.setActiveValidationMessage();
+        this.afOnChange.emit(e);
+    }
+    focusHandler(e) {
+        this.afOnFocus.emit(e);
+    }
+    focusoutHandler(e) {
+        this.afOnFocusout.emit(e);
+    }
+    keyupHandler(e) {
+        this.afOnKeyup.emit(e);
+    }
+    inputHandler(e) {
+        this.afValue = this.value =
+            this.afType === FormInputType.NUMBER
+                ? parseFloat(e.target.value)
+                : e.target.value;
+        if (!this.dirty) {
+            this.afOnDirty.emit(e);
+            this.dirty = true;
+        }
+        this.setActiveValidationMessage();
+        this.afOnInput.emit(e);
+    }
+    setHasButton() {
+        this.hasButton = !!this.hostElement.querySelector('[slot="button"]');
+    }
+    render() {
+        return (h(Host, { key: '2739bdd7385125581d7ea9c25a3610f5950c6a74', tabindex: -1 }, h("div", { key: '7e261c1e2fc4f37f4ddda861872a470c89181e16', class: Object.assign({ 'digi-form-input': true }, this.cssModifiers) }, h("digi-form-label", { key: '7e8fd283dedf0a851c714331ae640f7c74176bde', class: "digi-form-input__label", afFor: this.afId, afLabel: this.afLabel, afDescription: this.afLabelDescription, afRequired: this.afRequired, afAnnounceIfOptional: this.afAnnounceIfOptional, afRequiredText: this.afRequiredText, afAnnounceIfOptionalText: this.afAnnounceIfOptionalText }), h("div", { key: '68d715181c180ebaf957dfb46afb63b19b8a8188', class: "digi-form-input__input-wrapper" }, h("input", Object.assign({ key: 'e25ab871e988f9e8bd0837f75403e85f7423805f', class: "digi-form-input__input", ref: (el) => (this._input = el), onBlur: (e) => this.blurHandler(e), onChange: (e) => this.changeHandler(e), onFocus: (e) => this.focusHandler(e), onFocusout: (e) => this.focusoutHandler(e), onKeyUp: (e) => this.keyupHandler(e), onInput: (e) => this.inputHandler(e), "aria-activedescendant": this.afAriaActivedescendant, "aria-describedby": `${this.afAriaDescribedby} ${this.afId}--validation-message`, "aria-labelledby": this.afAriaLabelledby, "aria-autocomplete": this.afAriaAutocomplete, "aria-invalid": this.afValidation === FormInputValidation.ERROR
+                ? 'true'
+                : 'false', "aria-controls": this.afAriaControls, autocomplete: this.afAutocomplete, autofocus: this.afAutofocus ? this.afAutofocus : null, maxLength: this.afMaxlength, minLength: this.afMinlength, max: this.afMax, min: this.afMin, step: this.afStep, list: this.afList, role: this.afRole, dirName: this.afDirname, required: this.afRequired, id: this.afId, name: this.afName, type: this.afType, value: this.afValue }, (this.afInputmode == FormInputMode.DEFAULT
+            ? {}
+            : { inputmode: this.afInputmode }))), h("slot", { key: 'c14ae079a53099fc3928bcf3ac7f5517c20b0f36', name: "button" })), h("div", { key: '75d6afa176cd8620e31c384e169b3c84a3bb584d', class: "digi-form-input__footer" }, h("div", { key: '81029d425aae06e3c72c08afe982f2ff1a7bb81d', class: "digi-form-input__validation", "aria-atomic": "true", role: this.errorMessageIsAlert ? 'alert' : null, id: `${this.afId}--validation-message` }, this.hasActiveValidationMessage &&
+            this.afValidation != FormInputValidation.NEUTRAL && (h("digi-form-validation-message", { key: '9a8fec12db8c78a037a9b70194b32814d7641dad', class: "digi-form-input__validation-message", "af-variation": this.afValidation }, this.afValidationText)))))));
+    }
+    get hostElement() { return getElement(this); }
+    static get watchers() { return {
+        "value": [{
+                "onValueChanged": 0
+            }],
+        "afValue": [{
+                "onAfValueChanged": 0
+            }],
+        "afValidationText": [{
+                "afValidationTextWatch": 0
+            }]
+    }; }
+};
+FormInput.style = formInputCss();
+
+const formLabelCss = () => `.sc-digi-form-label-h .digi-form-label.sc-digi-form-label{font-family:var(--digi--global--typography--font-family--default);font-size:var(--digi--typography--label--font-size--desktop);color:var(--digi--color--text--primary);display:flex;flex-direction:column}.sc-digi-form-label-h .digi-form-label__label--label.sc-digi-form-label{font-weight:var(--digi--typography--label--font-weight--desktop)}.sc-digi-form-label-h .digi-form-label__label--label.sc-digi-form-label,.sc-digi-form-label-h .digi-form-label__label--description.sc-digi-form-label{line-height:var(--digi--typography--label--line-height--desktop);cursor:pointer;display:block}.sc-digi-form-label-h .digi-form-label__label-group.sc-digi-form-label{display:inline-flex;align-items:center;gap:var(--digi--gutter--icon)}.sc-digi-form-label-h .digi-form-label__description.sc-digi-form-label{max-width:var(--digi--paragraph-width--medium);line-height:var(--digi--typography--label-description--line-height--desktop);font-size:var(--digi--typography--label-description--font-size--desktop)}`;
+
+const FormLabel = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        /**
+         * Sätter attributet 'id'. Om inget väljs så skapas ett slumpmässigt id.
+         * @en Set id attribute. Defaults to random string.
+         */
+        this.afId = randomIdGenerator('digi-form-label');
+        /**
+         * Sätt denna till true om formuläret innehåller fler obligatoriska fält än valfria.
+         * @en Set this to true if the form contains more required fields than optional fields.
+         */
+        this.afAnnounceIfOptional = false;
+        /**
+         * Sätter text för afRequired.
+         * @en Set text for afRequired.
+         */
+        this.afRequiredText = _t.required.toLowerCase();
+        /**
+         * Sätter text för afAnnounceIfOptional.
+         * @en Set text for afAnnounceIfOptional.
+         */
+        this.afAnnounceIfOptionalText = _t.optional.toLowerCase();
+    }
+    componentWillLoad() {
+        this.setLabelText();
+        this.validateFor();
+        this.handleSlotVisibility();
+    }
+    validateFor() {
+        if (this.afFor == null) {
+            logger.warn(`digi-form-label must have a for attribute. Please add a for attribute using af-for`, this.hostElement);
+        }
+    }
+    setLabelText() {
+        this.labelText = `${this.afLabel} ${this.requiredText}`;
+        if (!this.afLabel) {
+            logger.warn(`digi-form-label must have a label. Please add a label using af-label`, this.hostElement);
+        }
+    }
+    handleSlotVisibility() {
+        this.hasActionSlot = !!this.hostElement.querySelector('[slot="actions"]');
+    }
+    get requiredText() {
+        if (this.afRequired && !this.afAnnounceIfOptional) {
+            return this.afRequiredText ? ` (${this.afRequiredText})` : '';
+        }
+        else if (!this.afRequired && this.afAnnounceIfOptional) {
+            return this.afAnnounceIfOptionalText
+                ? ` (${this.afAnnounceIfOptionalText})`
+                : '';
+        }
+        else {
+            return '';
+        }
+    }
+    render() {
+        return (h("div", { key: 'ac9aec4d1d20cc37694af578a97a16a17291c9f3', class: "digi-form-label" }, h("div", { key: 'bf27c3012d1973798095e6b832572fc20863c5f1', class: "digi-form-label__label-group" }, this.afFor && this.afLabel && (h("label", { key: '75435e49548e4fa27330a35b033689a0ed9e99a7', class: "digi-form-label__label", htmlFor: this.afFor, id: this.afId }, h("span", { key: '0527ddcebbd2a1b215f42eaed06ba7fc28633d43', class: "digi-form-label__label--label" }, this.labelText), this.afDescription && (h("span", { key: '8a3b3e6a0ec0a97adb0760b390f0ddb34b3e0b87', class: "digi-form-label__label--description" }, this.afDescription)))), this.hasActionSlot && (h("div", { key: 'f2e6ad691a5cbc57b990416097454a393da35c01', class: "digi-form-label__actions" }, h("slot", { key: '1fab5cca94da7ad0f2b617db7f713d3b4d17c52d', name: "actions" }))))));
+    }
+    get hostElement() { return getElement(this); }
+    static get watchers() { return {
+        "afFor": [{
+                "validateFor": 0
+            }],
+        "afLabel": [{
+                "setLabelText": 0
+            }],
+        "afRequired": [{
+                "setLabelText": 0
+            }],
+        "afAnnounceIfOptional": [{
+                "setLabelText": 0
+            }]
+    }; }
+};
+FormLabel.style = formLabelCss();
+
+const formSelectCss = () => `.sc-digi-form-select-h{--digi--form-select--background--empty:var(--digi--color--background--interactive--default--secondary);--digi--form-select--background--neutral:var(--digi--color--background--interactive--default--secondary);--digi--form-select--background--success:var(--digi--color--background--interactive--validation--success);--digi--form-select--background--warning:var(--digi--color--background--interactive--validation--warning);--digi--form-select--background--error:var(--digi--color--background--interactive--validation--error);--digi--form-select--border-color--neutral:var(--digi--color--border--interactive--default--on-input);--digi--form-select--border-color--success:var(--digi--color--border--interactive--validation--success);--digi--form-select--border-color--warning:var(--digi--color--border--interactive--validation--warning);--digi--form-select--border-color--error:var(--digi--color--border--interactive--validation--error);--digi--form-select--select-wrapper--position:relative;--digi--form-select--select--height--small:var(--digi--input-height--small);--digi--form-select--select--height--medium:var(--digi--input-height--medium);--digi--form-select--select--height--large:var(--digi--input-height--large);--digi--form-select--select--border-radius:var(--digi--border-radius--input);--digi--form-select--select--padding:0 var(--digi--gutter--medium);--digi--form-select--select--padding--inline-end:var(--digi--padding--large);--digi--form-select--select--border-width--neutral:var(--digi--border-width--input-regular);--digi--form-select--select--border-width--success:var(--digi--border-width--input-validation);--digi--form-select--select--border-width--error:var(--digi--border-width--input-validation);--digi--form-select--select--border-width--warning:var(--digi--border-width--input-validation);--digi--form-select--select--width:100%;--digi--form-select--select--font-size:var(--digi--typography--body--font-size--desktop);--digi--form-select--select-option--font-size:var(--digi--typography--body--font-size--desktop);--digi--form-select--label--margin-bottom:var(--digi--gutter--medium);--digi--form-select--icon--inline-end:0.75rem;--digi--form-select--icon--top:50%;--digi--form-select--icon--transform:translateY(-50%);--digi--form-select--icon--color:var(--digi--color--icon--primary);--digi--form-select--footer--margin-top:var(--digi--gutter--medium)}.sc-digi-form-select-h .digi-form-select.sc-digi-form-select{display:flex;flex-direction:column;gap:0.4em}.sc-digi-form-select-h .digi-form-select--neutral.sc-digi-form-select{--BORDER-WIDTH:var(--digi--form-select--select--border-width--neutral);--BORDER-COLOR:var(--digi--form-select--border-color--neutral);--BACKGROUND:var(--digi--form-select--background--neutral)}.sc-digi-form-select-h .digi-form-select--success.sc-digi-form-select{--BORDER-WIDTH:var(--digi--form-select--select--border-width--success);--BORDER-COLOR:var(--digi--form-select--border-color--success);--BACKGROUND:var(--digi--form-select--background--success)}.sc-digi-form-select-h .digi-form-select--warning.sc-digi-form-select{--BORDER-WIDTH:var(--digi--form-select--select--border-width--warning);--BORDER-COLOR:var(--digi--form-select--border-color--warning);--BACKGROUND:var(--digi--form-select--background--warning)}.sc-digi-form-select-h .digi-form-select--error.sc-digi-form-select{--BORDER-WIDTH:var(--digi--form-select--select--border-width--error);--BORDER-COLOR:var(--digi--form-select--border-color--error);--BACKGROUND:var(--digi--form-select--background--error)}.sc-digi-form-select-h .digi-form-select--small.sc-digi-form-select{--HEIGHT:var(--digi--form-select--select--height--small)}.sc-digi-form-select-h .digi-form-select--medium.sc-digi-form-select{--HEIGHT:var(--digi--form-select--select--height--medium)}.sc-digi-form-select-h .digi-form-select--large.sc-digi-form-select{--HEIGHT:var(--digi--form-select--select--height--large)}.sc-digi-form-select-h .digi-form-select--empty.sc-digi-form-select:not(:focus-within){--BACKGROUND:var(--digi--form-select--background--empty)}.sc-digi-form-select-h .digi-form-select__select.sc-digi-form-select{appearance:none;width:var(--digi--form-select--select--width);padding:var(--digi--form-select--select--padding);padding-inline-end:var(--digi--form-select--select--padding--inline-end);height:var(--HEIGHT);border:var(--BORDER-WIDTH) solid;border-radius:var(--digi--form-select--select--border-radius);border-color:var(--BORDER-COLOR);cursor:pointer;font-size:var(--digi--form-select--select--font-size);color:var(--digi--color--text--primary);background:var(--BACKGROUND);font-family:var(--digi--global--typography--font-family--default)}.sc-digi-form-select-h .digi-form-select__select-wrapper.sc-digi-form-select{position:var(--digi--form-select--select-wrapper--position)}.sc-digi-form-select-h .digi-form-select__select-option.sc-digi-form-select{font-size:var(--digi--form-select--select-option--font-size)}@media (min-width: 48rem){.sc-digi-form-select-h .digi-form-select__select-option.sc-digi-form-select{--digi--form-select--select-option--font-size:var(--digi--typography--font-size--l)}}.sc-digi-form-select-h .digi-form-select__select.sc-digi-form-select::-ms-expand{display:none}.sc-digi-form-select-h .digi-form-select__select.sc-digi-form-select:focus-visible{outline:2px solid black;outline-offset:2px;box-shadow:0px 0px 0px 5px white}.sc-digi-form-select-h .digi-form-select__icon.sc-digi-form-select{position:absolute;inset-inline-end:var(--digi--form-select--icon--inline-end);inset-block-start:var(--digi--form-select--icon--top);transform:var(--digi--form-select--icon--transform);pointer-events:none;color:var(--digi--form-select--icon--color)}.digi-form-select--neutral.sc-digi-form-select .digi-form-select__footer.sc-digi-form-select{position:absolute}`;
+
+const FormSelect = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.afOnChange = createEvent(this, "afOnChange", 7);
+        this.afOnSelect = createEvent(this, "afOnSelect", 7);
+        this.afOnFocus = createEvent(this, "afOnFocus", 7);
+        this.afOnFocusout = createEvent(this, "afOnFocusout", 7);
+        this.afOnBlur = createEvent(this, "afOnBlur", 7);
+        this.afOnDirty = createEvent(this, "afOnDirty", 7);
+        this.afOnReady = createEvent(this, "afOnReady", 3);
+        this.optionItems = [];
+        this.dirty = false;
+        this.touched = false;
+        this.hasPlaceholder = false;
+        /**
+         * Normalt betonas ett obligatoriskt fält visuellt och semantiskt.
+         * Detta vänder på det och betonar fältet om det inte krävs.
+         * Ställ in detta till sant om ditt formulär innehåller fler obligatoriska fält än inte.
+         * @en Normally a required field is visually and semantically emphasized.
+         * This flips that and emphasizes the field if it is not required.
+         * Set this to true if your form contains more required fields than not.
+         */
+        this.afAnnounceIfOptional = false;
+        /**
+         * Sätter ett id attribut.
+         * @en Sets an id attribute. Standard är slumpmässig sträng.
+         */
+        this.afId = randomIdGenerator('digi-form-select');
+        /**
+         * Sätter väljarens storlek.
+         * @en Set select input size.
+         */
+        this.afVariation = FormSelectVariation.MEDIUM;
+        /**
+         * Sätter väljarens validering
+         * @en Set select validation
+         */
+        this.afValidation = FormSelectValidation.NEUTRAL;
+        /**
+         * Om värdet är true får felmeddelandet attributet role="alert".
+         * Om felet visas tillsammans med flera andra fel (till exempel efter servervalidering) ska värdet sättas till false.
+         * @en If the value is true, the error message gets the attribute role="alert".
+         * If the error is shown together with multiple errors (for example after server-side validation), the value should be set to false.
+         */
+        this.afErrorMessageIsAlert = true;
+    }
+    onValueChanged(value) {
+        this.afValue = value;
+    }
+    onAfValueChanged(value) {
+        this.value = value;
+    }
+    get errorMessageIsAlert() {
+        return (this.afErrorMessageIsAlert !== false &&
+            this.afErrorMessageIsAlert !== 'false');
+    }
+    getOptions() {
+        this.checkIfPlaceholder();
+        const options = Array.from(this.hostElement.querySelectorAll('option')).filter((el) => { var _a; return !((_a = this._select) === null || _a === void 0 ? void 0 : _a.contains(el)); });
+        const updatedOptionItems = options.map((el) => ({
+            value: el.value,
+            text: el.text
+        }));
+        if (JSON.stringify(updatedOptionItems) === JSON.stringify(this.optionItems)) {
+            return;
+        }
+        this.optionItems = updatedOptionItems;
+    }
+    checkIfPlaceholder() {
+        this.hasPlaceholder = !!this.afPlaceholder;
+    }
+    componentWillLoad() {
+        this.afValue ? (this.value = this.afValue) : (this.afValue = this.value);
+    }
+    componentDidLoad() {
+        this.optionsObserver = new MutationObserver(() => this.getOptions());
+        this.optionsObserver.observe(this.hostElement, {
+            childList: true,
+            subtree: true
+        });
+        this.getOptions();
+        this.afOnReady.emit();
+    }
+    disconnectedCallback() {
+        var _a;
+        (_a = this.optionsObserver) === null || _a === void 0 ? void 0 : _a.disconnect();
+    }
+    /**
+     * Returnerar en referens till formulärkontrollelementet.
+     * @en Returns a reference to the form control element.
+     */
+    async afMGetFormControlElement() {
+        return this._select;
+    }
+    /**
+     * Lyssnar på om fokus sätts på custom-elementet och propagerar ner det till själva select-elementet.
+     * @en Listens for when focus is set on the custom element and propagates it down to the actual select element.
+     */
+    focusOnInput() {
+        var _a;
+        (_a = this._select) === null || _a === void 0 ? void 0 : _a.focus();
+    }
+    get cssModifiers() {
+        return {
+            'digi-form-select--small': this.afVariation === FormSelectVariation.SMALL,
+            'digi-form-select--medium': this.afVariation === FormSelectVariation.MEDIUM,
+            'digi-form-select--large': this.afVariation === FormSelectVariation.LARGE,
+            'digi-form-select--neutral': this.afValidation === FormSelectValidation.NEUTRAL,
+            'digi-form-select--success': this.afValidation === FormSelectValidation.SUCCESS,
+            'digi-form-select--warning': this.afValidation === FormSelectValidation.WARNING,
+            'digi-form-select--error': this.afValidation === FormSelectValidation.ERROR,
+            'digi-form-select--empty': !this.afValue &&
+                (!this.afValidation ||
+                    this.afValidation === FormSelectValidation.NEUTRAL)
+        };
+    }
+    changeHandler(e) {
+        if (!this.dirty) {
+            this.afOnDirty.emit(e);
+            this.dirty = true;
+        }
+        this.value = this.afValue = e.target.value;
+        this.afOnChange.emit(e);
+    }
+    selectHandler(e) {
+        this.value = this.afValue = e.target.value;
+        this.afOnSelect.emit(e);
+    }
+    focusHandler(e) {
+        this.afOnFocus.emit(e);
+    }
+    focusoutHandler(e) {
+        this.afOnFocusout.emit(e);
+    }
+    blurHandler(e) {
+        this.afOnBlur.emit(e);
+    }
+    getSelectedItem(option) {
+        return this.afValue == option.value;
+    }
+    showValidation() {
+        return !this.afDisableValidation &&
+            this.afValidation !== FormSelectValidation.NEUTRAL &&
+            this.afValidationText
+            ? true
+            : false;
+    }
+    render() {
+        return (h(Host, { key: 'b40fb54f41ae0b739a943d600624889b604865b2', tabindex: -1 }, h("div", { key: 'e753b10a46503f6711b35dd1d30b8be59296cc0b', class: Object.assign({ 'digi-form-select': true }, this.cssModifiers) }, h("div", { key: 'a820eb5ffec3ac101febd080add2ddf9aa537c21', class: "digi-form-select__label-group" }, h("digi-form-label", { key: 'ad8616ae6b48a6e10c2827a7d00d51daa44129ec', afFor: this.afId, afLabel: this.afLabel, afId: `${this.afId}-label`, afDescription: this.afDescription, afRequired: this.afRequired, afAnnounceIfOptional: this.afAnnounceIfOptional, afRequiredText: this.afRequiredText, afAnnounceIfOptionalText: this.afAnnounceIfOptionalText })), h("div", { key: 'ffe072a753cfe6a7f6afd300e34f8aff9ec4fc2a', class: "digi-form-select__select-wrapper" }, h("select", { key: '204dbc6361c6fb0a0ae0265cdd05db1888380c6d', class: "digi-form-select__select", name: this.afName, id: this.afId, "aria-label": this.afAriaLabel, "aria-invalid": this.afValidation === FormSelectValidation.ERROR
+                ? 'true'
+                : 'false', "aria-describedby": `${this.afId}--validation-message`, ref: (el) => (this._select = el), required: this.afRequired ? this.afRequired : null, onFocus: (e) => this.focusHandler(e), onFocusout: (e) => this.focusoutHandler(e), onBlur: (e) => this.blurHandler(e), onChange: (e) => this.changeHandler(e), onInput: (e) => this.selectHandler(e), autoFocus: this.afAutofocus ? this.afAutofocus : null }, this.hasPlaceholder && (h("option", { key: '0f4675533c05c4e6a2f3dd7b502676aa6354c001', class: {
+                'digi-form-select__select-option': true,
+                'digi-form-select__select-option--initial-value': true
+            }, disabled: true, selected: !this.afValue, value: "" }, this.afPlaceholder)), this.optionItems.map((option, index) => {
+            return (h("option", { key: index, class: "digi-form-select__select-option", value: option.value, selected: this.getSelectedItem(option) }, option.text));
+        })), h("digi-icon-input-select-marker", { key: '13c14346d06dbf9d67bedfcb45300ee0cd7921e4', class: "digi-form-select__icon", slot: "icon" })), h("div", { key: '9a88dda5d1d981016bb17a053d913eadd89e5e07', hidden: true }, h("slot", { key: '9b6cc012b2c0fead2a1e70441abebbb28364b450' })), h("div", { key: '1f13d6ddaf2a9d78a7c66c242bfe5ac35cf2c961', class: "digi-form-select__footer" }, h("div", { key: '6ba7c2aea4196e0e1b646e22ca9d14be65540ccb', "aria-atomic": "true", role: this.errorMessageIsAlert ? 'alert' : null, id: `${this.afId}--validation-message` }, this.showValidation() && (h("digi-form-validation-message", { key: 'eee53a1c30af8d43e8f60d3c85764f65d335e9ec', "af-variation": this.afValidation }, this.afValidationText)))))));
+    }
+    get hostElement() { return getElement(this); }
+    static get watchers() { return {
+        "value": [{
+                "onValueChanged": 0
+            }],
+        "afValue": [{
+                "onAfValueChanged": 0
+            }]
+    }; }
+};
+FormSelect.style = formSelectCss();
+
+const formValidationMessageCss = () => `.sc-digi-form-validation-message-h{--digi--form-validation-message--icon-color--success:var(--digi--color--icon--validation--success);--digi--form-validation-message--icon-color--warning:var(--digi--color--icon--validation--warning);--digi--form-validation-message--icon-color--error:var(--digi--color--icon--validation--error)}.sc-digi-form-validation-message-h .digi-form-validation-message.sc-digi-form-validation-message{display:flex;flex-wrap:wrap;align-items:center}.sc-digi-form-validation-message-h .digi-form-validation-message--success.sc-digi-form-validation-message{--ICON-COLOR:var(--digi--form-validation-message--icon-color--success)}.sc-digi-form-validation-message-h .digi-form-validation-message--warning.sc-digi-form-validation-message{--ICON-COLOR:var(--digi--form-validation-message--icon-color--warning)}.sc-digi-form-validation-message-h .digi-form-validation-message--error.sc-digi-form-validation-message{--ICON-COLOR:var(--digi--form-validation-message--icon-color--error)}.sc-digi-form-validation-message-h .digi-form-validation-message__icon.sc-digi-form-validation-message{color:var(--ICON-COLOR);margin-inline-end:var(--digi--gutter--icon)}.sc-digi-form-validation-message-h .digi-form-validation-message__icon.sc-digi-form-validation-message>*.sc-digi-form-validation-message{--digi--icon--width:1.25em;--digi--icon--height:1.25em;--digi--icon--color:var(--ICON-COLOR);display:flex}.sc-digi-form-validation-message-h .digi-form-validation-message__icon.sc-digi-form-validation-message .warning.sc-digi-form-validation-message{top:3px;position:relative}.sc-digi-form-validation-message-h .digi-form-validation-message__text.sc-digi-form-validation-message{flex:1;font-family:var(--digi--global--typography--font-family--default);font-size:var(--digi--typography--tag--font-size--desktop);color:var(--digi--color--text--primary)}`;
+
+const FormValidationMessage = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        /**
+         * Sätter valideringsstatus. Kan vara 'success', 'error' eller 'warning'.
+         * @en Set validation status
+         */
+        this.afVariation = FormValidationMessageVariation.SUCCESS;
+    }
+    get cssModifiers() {
+        return {
+            'digi-form-validation-message--success': this.afVariation === FormValidationMessageVariation.SUCCESS,
+            'digi-form-validation-message--error': this.afVariation === FormValidationMessageVariation.ERROR,
+            'digi-form-validation-message--warning': this.afVariation === FormValidationMessageVariation.WARNING
+        };
+    }
+    get icon() {
+        switch (this.afVariation) {
+            case FormValidationMessageVariation.SUCCESS:
+                return h("digi-icon-validation-success", null);
+            case FormValidationMessageVariation.ERROR:
+                return h("digi-icon-validation-error", null);
+            case FormValidationMessageVariation.WARNING:
+                return h("digi-icon-validation-warning", { class: "warning" });
+        }
+    }
+    render() {
+        return (h("div", { key: '5c89cb2cfe7085ec0203814f2c7a43c9fe518db4', class: Object.assign({ 'digi-form-validation-message': true }, this.cssModifiers) }, h("div", { key: 'cb85b6a6e02b081710f80ad7bbbe96e182d8c353', class: "digi-form-validation-message__icon", "aria-hidden": "true" }, this.icon), h("span", { key: '9b1689dcad19fd3f033c679f496a1c94348f393b', class: "digi-form-validation-message__text" }, h("slot", { key: '794c1b1c0771cae8c0b19bd7123f7f5bc28e99b7' }))));
+    }
+    get hostElement() { return getElement(this); }
+};
+FormValidationMessage.style = formValidationMessageCss();
+
+const iconCalendarAltCss = () => `.sc-digi-icon-calendar-alt-h{--digi--icon--color:var(--digi--color--icon--primary);--digi--icon--width:initial;--digi--icon--height:auto;display:flex;min-height:1.4em;align-items:center}.sc-digi-icon-calendar-alt-h svg.sc-digi-icon-calendar-alt{color:var(--digi--icon--color);max-width:var(--digi--icon--width);max-height:var(--digi--icon--height);width:var(--digi--icon--width, auto);height:var(--digi--icon--height, auto)}`;
+
+const IconCalendarAlt = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        /**
+         * För att dölja ikonen för skärmläsare. Default är satt till true.
+         * @en Hides the icon for screen readers. Default is set to true.
+         */
+        this.afSvgAriaHidden = true;
+        this.titleId = randomIdGenerator('icontitle');
+    }
+    render() {
+        return (h("svg", { key: '51b9d922462d3ad108545dbe7df4bf805334b0ef', class: "digi-icon-calendar-alt", width: "22", height: "26", viewBox: "0 0 22 26", "aria-hidden": this.afSvgAriaHidden ? 'true' : 'false', "aria-labelledby": this.afSvgAriaLabelledby
+                ? this.afSvgAriaLabelledby
+                : this.afTitle
+                    ? this.titleId
+                    : undefined, xmlns: "http://www.w3.org/2000/svg" }, this.afTitle && h("title", { key: '0cf10651a3b238c59bc9f342cec98ff7c2a967e7', id: this.titleId }, this.afTitle), this.afDesc && h("desc", { key: 'a7826ce588a9bd9580c3f45a20834ff4e66a3620' }, this.afDesc), h("path", { key: '0854e6fc47b9a773f3d902e557535765d973252a', class: "digi-icon-calendar-alt__shape", d: "M21.41 8.125H.59a.601.601 0 01-.59-.61V5.689C0 4.341 1.056 3.25 2.357 3.25h2.357V.61c0-.336.265-.61.59-.61h1.964c.324 0 .59.274.59.61v2.64h6.285V.61c0-.336.265-.61.59-.61h1.963c.325 0 .59.274.59.61v2.64h2.357C20.944 3.25 22 4.342 22 5.688v1.828c0 .335-.265.609-.59.609zM.59 9.75h20.82c.325 0 .59.274.59.61v13.203C22 24.907 20.944 26 19.643 26H2.357C1.056 26 0 24.908 0 23.562V10.36c0-.335.265-.609.59-.609zm5.696 10.36a.601.601 0 00-.59-.61H3.732a.601.601 0 00-.59.61v2.03c0 .336.266.61.59.61h1.964c.325 0 .59-.274.59-.61v-2.03zm0-6.5a.601.601 0 00-.59-.61H3.732a.601.601 0 00-.59.61v2.03c0 .336.266.61.59.61h1.964c.325 0 .59-.274.59-.61v-2.03zm6.285 6.5a.601.601 0 00-.589-.61h-1.964a.601.601 0 00-.59.61v2.03c0 .336.266.61.59.61h1.964c.324 0 .59-.274.59-.61v-2.03zm0-6.5a.601.601 0 00-.589-.61h-1.964a.601.601 0 00-.59.61v2.03c0 .336.266.61.59.61h1.964c.324 0 .59-.274.59-.61v-2.03zm6.286 6.5a.601.601 0 00-.59-.61h-1.963a.601.601 0 00-.59.61v2.03c0 .336.265.61.59.61h1.964c.324 0 .59-.274.59-.61v-2.03zm0-6.5a.601.601 0 00-.59-.61h-1.963a.601.601 0 00-.59.61v2.03c0 .336.265.61.59.61h1.964c.324 0 .59-.274.59-.61v-2.03z", fill: "currentColor", "fill-rule": "nonzero" })));
+    }
+};
+IconCalendarAlt.style = iconCalendarAltCss();
+
+const iconChevronDownCss = () => `.sc-digi-icon-chevron-down-h{--digi--icon--color:var(--digi--color--icon--primary);--digi--icon--width:initial;--digi--icon--height:auto;display:flex;min-height:1.4em;align-items:center}.sc-digi-icon-chevron-down-h svg.sc-digi-icon-chevron-down{color:var(--digi--icon--color);max-width:var(--digi--icon--width);max-height:var(--digi--icon--height);width:var(--digi--icon--width, auto);height:var(--digi--icon--height, auto)}`;
+
+const IconChevronDown = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        /**
+         * För att dölja ikonen för skärmläsare. Default är satt till true.
+         * @en Hides the icon for screen readers. Default is set to true.
+         */
+        this.afSvgAriaHidden = true;
+        this.titleId = randomIdGenerator('icontitle');
+    }
+    render() {
+        return (h("svg", { key: '14c50bb9ce94f2ae7e6b89e99417668515a0e1fa', class: "digi-icon-chevron-down", width: "14", height: "8", viewBox: "0 0 14 8", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": this.afSvgAriaHidden ? 'true' : 'false', "aria-labelledby": this.afSvgAriaLabelledby
+                ? this.afSvgAriaLabelledby
+                : this.afTitle
+                    ? this.titleId
+                    : undefined }, this.afTitle && h("title", { key: '4692fea634337c2e89e5eeac67c707c84f919563', id: this.titleId }, this.afTitle), this.afDesc && h("desc", { key: '3948943affb34ebc1967aeb54389b0c3230e6daf' }, this.afDesc), h("path", { key: '252f72d574b43e0d794341fa05f5a2cf39cedb4d', class: "digi-icon-chevron-down__shape", d: "M1 1l6.074 6L13 1.147", stroke: "currentColor", "stroke-width": "2", fill: "none", "fill-rule": "evenodd" })));
+    }
+};
+IconChevronDown.style = iconChevronDownCss();
+
+const iconChevronLeftCss = () => `.sc-digi-icon-chevron-left-h{--digi--icon--color:var(--digi--color--icon--primary);--digi--icon--width:initial;--digi--icon--height:auto;display:flex;min-height:1.4em;align-items:center}.sc-digi-icon-chevron-left-h svg.sc-digi-icon-chevron-left{color:var(--digi--icon--color);max-width:var(--digi--icon--width);max-height:var(--digi--icon--height);width:var(--digi--icon--width, auto);height:var(--digi--icon--height, auto)}`;
+
+const IconChevronLeft = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        /**
+         * För att dölja ikonen för skärmläsare. Default är satt till true.
+         * @en Hides the icon for screen readers. Default is set to true.
+         */
+        this.afSvgAriaHidden = true;
+        this.titleId = randomIdGenerator('icontitle');
+    }
+    render() {
+        return (h("svg", { key: 'def846a254699c1487c6650595a307d69570b03b', class: "digi-icon-chevron-left", width: "9", height: "14", viewBox: "0 0 9 14", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": this.afSvgAriaHidden ? 'true' : 'false', "aria-labelledby": this.afSvgAriaLabelledby
+                ? this.afSvgAriaLabelledby
+                : this.afTitle
+                    ? this.titleId
+                    : undefined }, this.afTitle && h("title", { key: '07e54926302b1524b1040b2a807060670448c0f8', id: this.titleId }, this.afTitle), this.afDesc && h("desc", { key: 'af3cae8cfe1b8451e4698e1ec43aeb52122d0f81' }, this.afDesc), h("path", { key: 'd98281b3481fbbc3853c5a34d1fdd35f58b0056c', class: "digi-icon-chevron-left__shape", d: "M8 13L2 6.926 7.853 1", stroke: "currentColor", "stroke-width": "2", fill: "none", "fill-rule": "evenodd" })));
+    }
+};
+IconChevronLeft.style = iconChevronLeftCss();
+
+const iconChevronRightCss = () => `.sc-digi-icon-chevron-right-h{--digi--icon--color:var(--digi--color--icon--primary);--digi--icon--width:initial;--digi--icon--height:auto;display:flex;min-height:1.4em;align-items:center}.sc-digi-icon-chevron-right-h svg.sc-digi-icon-chevron-right{color:var(--digi--icon--color);max-width:var(--digi--icon--width);max-height:var(--digi--icon--height);width:var(--digi--icon--width, auto);height:var(--digi--icon--height, auto)}`;
+
+const IconChevronRight = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        /**
+         * För att dölja ikonen för skärmläsare. Default är satt till true.
+         * @en Hides the icon for screen readers. Default is set to true.
+         */
+        this.afSvgAriaHidden = true;
+        this.titleId = randomIdGenerator('icontitle');
+    }
+    render() {
+        return (h("svg", { key: '8a7349c8865c737830b6af0e3ea9aa7c6bd50f6f', class: "digi-icon-chevron-right", width: "9", height: "14", viewBox: "0 0 9 14", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": this.afSvgAriaHidden ? 'true' : 'false', "aria-labelledby": this.afSvgAriaLabelledby
+                ? this.afSvgAriaLabelledby
+                : this.afTitle
+                    ? this.titleId
+                    : undefined }, this.afTitle && h("title", { key: '83176271f8248b1ad42e1e5baf2f31ddc244cb0a', id: this.titleId }, this.afTitle), this.afDesc && h("desc", { key: 'c22c051704141e87412e98ab3733afab36bf0bf3' }, this.afDesc), h("path", { key: '5f3f04a5512ca21c49e25797401bf68ac726c9d7', class: "digi-icon-chevron-right__shape", d: "M1 13l6-6.074L1.147 1", stroke: "currentColor", "stroke-width": "2", fill: "none", "fill-rule": "evenodd" })));
+    }
+};
+IconChevronRight.style = iconChevronRightCss();
+
+const iconInputSelectMarkerCss = () => `.sc-digi-icon-input-select-marker-h{--digi--icon--color:var(--digi--color--icon--primary);--digi--icon--width:initial;--digi--icon--height:auto;display:flex;min-height:1.4em;align-items:center}.sc-digi-icon-input-select-marker-h svg.sc-digi-icon-input-select-marker{color:var(--digi--icon--color);max-width:var(--digi--icon--width);max-height:var(--digi--icon--height);width:var(--digi--icon--width, auto);height:var(--digi--icon--height, auto)}`;
+
+const IconInputSelectMarker = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        /**
+         * För att dölja ikonen för skärmläsare. Default är satt till true.
+         * @en Hides the icon for screen readers. Default is set to true.
+         */
+        this.afSvgAriaHidden = true;
+        this.titleId = randomIdGenerator('icon-input-select-marker');
+    }
+    render() {
+        return (h("svg", { key: '3a27d862f015acdf222435b2abcf67f1a6c312f7', class: "digi-icon-input-select-marker", width: "14", height: "8", viewBox: "0 0 14 8", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": this.afSvgAriaHidden ? 'true' : 'false', "aria-labelledby": this.afSvgAriaLabelledby
+                ? this.afSvgAriaLabelledby
+                : this.afTitle
+                    ? this.titleId
+                    : undefined }, this.afTitle && h("title", { key: '88b3c6625077baef962e3851804f50700191b43a', id: this.titleId }, this.afTitle), this.afDesc && h("desc", { key: 'fd1b1225f6bfbc57e34126608b3fd91143253758' }, this.afDesc), h("path", { key: 'e83bfd8eef85f4e2f5c5171dd1d08a44d611fdea', d: "M1 1l6.074 6L13 1.147", stroke: "currentColor", "stroke-width": "2", fill: "none", "fill-rule": "evenodd" })));
+    }
+};
+IconInputSelectMarker.style = iconInputSelectMarkerCss();
+
+const iconValidationErrorCss = () => `.sc-digi-icon-validation-error-h{--digi--icon--color:var(--digi--color--icon--primary);--digi--icon--width:initial;--digi--icon--height:auto;display:flex;min-height:1.4em;align-items:center}.sc-digi-icon-validation-error-h svg.sc-digi-icon-validation-error{color:var(--digi--icon--color);max-width:var(--digi--icon--width);max-height:var(--digi--icon--height);width:var(--digi--icon--width, auto);height:var(--digi--icon--height, auto)}`;
+
+const IconValidationError = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        /**
+         * För att dölja ikonen för skärmläsare. Default är satt till true.
+         * @en Hides the icon for screen readers. Default is set to true.
+         */
+        this.afSvgAriaHidden = true;
+        this.titleId = randomIdGenerator('icontitle');
+    }
+    render() {
+        return (h("svg", { key: 'b20fb61395f90adad2b9e5be72d3e2ea3c5a3feb', class: "digi-icon-validation-error", width: "48", height: "48", viewBox: "0 0 48 48", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": this.afSvgAriaHidden ? 'true' : 'false', "aria-labelledby": this.afSvgAriaLabelledby
+                ? this.afSvgAriaLabelledby
+                : this.afTitle
+                    ? this.titleId
+                    : undefined }, this.afTitle && h("title", { key: '5e08a1b947d534b913fff06e02109b53c607a0be', id: this.titleId }, this.afTitle), this.afDesc && h("desc", { key: 'f016b92eb4957943a5308d12db1ce2f1b73fae3f' }, this.afDesc), h("path", { key: 'f5ba662eeb6689959a6990ae2e880edc42670490', class: "digi-icon-validation-error__shape", d: "M34.4328058,0 C35.5494848,0 36.5900526,0.609146757 37.1483921,1.58958113 L47.5812454,19.9104189 C48.1395849,20.8909496 48.1395849,22.1090504 47.5812454,23.0895811 L37.1483921,41.4104189 C36.5900526,42.3908532 35.5494848,43 34.4328058,43 L13.5671942,43 C12.4505152,43 11.4099474,42.3908532 10.8516079,41.4104189 L0.41875464,23.0895811 C-0.13958488,22.1090504 -0.13958488,20.8909496 0.41875464,19.9104189 L10.8516079,1.58958113 C11.4099474,0.609146757 12.4505152,0 13.5671942,0 Z M18.6736823,12.3728178 C18.2711762,11.964729 17.6203819,11.964729 17.2178757,12.3728178 L15.2825964,14.334939 C14.8800903,14.7430278 14.8800903,15.4028485 15.2825964,15.8109373 L20.6089616,21.2111779 L15.2825964,26.6114185 C14.8800903,27.0195074 14.8800903,27.6793281 15.2825964,28.0874169 L17.2178757,30.049538 C17.6203819,30.4576269 18.2711762,30.4576269 18.6736823,30.049538 L24.0000475,24.6492974 L29.3264127,30.049538 C29.7289188,30.4576269 30.3797132,30.4576269 30.7822193,30.049538 L32.7174986,28.0874169 C33.1200048,27.6793281 33.1200048,27.0195074 32.7174986,26.6114185 L27.3911334,21.2111779 L32.7174986,15.8109373 C33.1200048,15.4028485 33.1200048,14.7430278 32.7174986,14.334939 L30.7822193,12.3728178 C30.3797132,11.964729 29.7289188,11.964729 29.3264127,12.3728178 L24.0000475,17.7730584 Z", fill: "currentColor", "fill-rule": "nonzero" })));
+    }
+};
+IconValidationError.style = iconValidationErrorCss();
+
+const iconValidationSuccessCss = () => `.sc-digi-icon-validation-success-h{--digi--icon--color:var(--digi--color--icon--primary);--digi--icon--width:initial;--digi--icon--height:auto;display:flex;min-height:1.4em;align-items:center}.sc-digi-icon-validation-success-h svg.sc-digi-icon-validation-success{color:var(--digi--icon--color);max-width:var(--digi--icon--width);max-height:var(--digi--icon--height);width:var(--digi--icon--width, auto);height:var(--digi--icon--height, auto)}`;
+
+const IconCheckCircle = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        /**
+         * För att dölja ikonen för skärmläsare. Default är satt till true.
+         * @en Hides the icon for screen readers. Default is set to true.
+         */
+        this.afSvgAriaHidden = true;
+        this.titleId = randomIdGenerator('icontitle');
+    }
+    render() {
+        return (h("svg", { key: '1c9dcaf014e400504cbce24f69c67bdbb1dc0361', class: "digi-icon-validation-success", width: "25", height: "25", viewBox: "0 0 25 25", "aria-hidden": this.afSvgAriaHidden ? 'true' : 'false', "aria-labelledby": this.afSvgAriaLabelledby
+                ? this.afSvgAriaLabelledby
+                : this.afTitle
+                    ? this.titleId
+                    : undefined, xmlns: "http://www.w3.org/2000/svg" }, this.afTitle && h("title", { key: 'ed5b4d39b987b025d99ef2ce2153a8de749f587e', id: this.titleId }, this.afTitle), this.afDesc && h("desc", { key: '7c5175b745577dd9076170ba83fa00f8cc03c4a2' }, this.afDesc), h("path", { key: 'f9cb601de2dfbf7959b2b43023692e111f1fbf91', class: "digi-icon-validation-success__shape", d: "M25 12.5C25 19.404 19.404 25 12.5 25S0 19.404 0 12.5 5.596 0 12.5 0 25 5.596 25 12.5zm-13.946 6.619l9.274-9.275a.806.806 0 000-1.14l-1.14-1.14a.806.806 0 00-1.14 0l-7.564 7.563-3.531-3.531a.807.807 0 00-1.14 0l-1.141 1.14a.806.806 0 000 1.14l5.242 5.243a.806.806 0 001.14 0z", fill: "currentColor", "fill-rule": "nonzero" })));
+    }
+};
+IconCheckCircle.style = iconValidationSuccessCss();
+
+const iconValidationWarningCss = () => `.sc-digi-icon-validation-warning-h{--digi--icon--color:var(--digi--color--icon--primary);--digi--icon--width:initial;--digi--icon--height:auto;display:flex;min-height:1.4em;align-items:center}.sc-digi-icon-validation-warning-h svg.sc-digi-icon-validation-warning{color:var(--digi--icon--color);max-width:var(--digi--icon--width);max-height:var(--digi--icon--height);width:var(--digi--icon--width, auto);height:var(--digi--icon--height, auto)}`;
+
+const IconValidationWarning = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        /**
+         * För att dölja ikonen för skärmläsare. Default är satt till true.
+         * @en Hides the icon for screen readers. Default is set to true.
+         */
+        this.afSvgAriaHidden = true;
+        this.titleId = randomIdGenerator('icontitle');
+    }
+    render() {
+        return (h("div", { key: '7017a09730cca2dafe42548b11d18e34a693f81b' }, h("svg", { key: 'd56b196f88aaf6dd87bb416e422d399667e80202', class: "digi-icon-validation-warning", width: "18", height: "18", viewBox: "0 0 18 18", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": this.afSvgAriaHidden ? 'true' : 'false', "aria-labelledby": this.afSvgAriaLabelledby
+                ? this.afSvgAriaLabelledby
+                : this.afTitle
+                    ? this.titleId
+                    : undefined }, this.afTitle && h("title", { key: '25751b0fd552d8dcabc3402345ba8528126dd973', id: this.titleId }, this.afTitle), this.afDesc && h("desc", { key: '41476cbdf1b92dd9b7c44d8791481a5cf00186ca' }, this.afDesc), h("g", { key: '6607df5c4713e5680fcaa2e9ea29b7cab5064e3d', fill: "none", "fill-rule": "evenodd" }, h("circle", { key: 'c87e6472093671bc2f1f6b3d7eb0b34f512468c1', cx: "9", cy: "9", r: "6.75", fill: "#333" }), h("path", { key: '17b79d3e780ecbb2394b38586388ea457c65a2f7', d: "m18 9c0 4.9717-4.0298 9-9 9-4.9702 0-9-4.0283-9-9 0-4.9688 4.0298-9 9-9 4.9702 0 9 4.0312 9 9zm-9 1.8145c-0.92196 0-1.6694 0.7474-1.6694 1.6694 0 0.92196 0.7474 1.6694 1.6694 1.6694s1.6694-0.7474 1.6694-1.6694c0-0.92196-0.7474-1.6694-1.6694-1.6694zm-1.3157-1.065c0.012593 0.23095 0.20355 0.41175 0.43483 0.41175h1.7618c0.23128 0 0.42224-0.1808 0.43483-0.41175l0.2692-4.9355c0.013609-0.24946-0.18501-0.45922-0.43483-0.45922h-2.3002c-0.24982 0-0.4484 0.20976-0.43479 0.45922l0.2692 4.9355z", fill: "#FFE200" })))));
+    }
+};
+IconValidationWarning.style = iconValidationWarningCss();
+
+const typographyCss = () => `digi-typography{--digi--typography--h1--margin--small:var(--digi--margin--h1-small);--digi--typography--h1--margin--medium:var(--digi--margin--h1-medium);--digi--typography--h1--margin--large:var(--digi--margin--h1-large);--digi--typography--h2--margin--small:var(--digi--margin--h2-small);--digi--typography--h2--margin--large:var(--digi--margin--h2-large);--digi--typography--h3--margin--small:var(--digi--margin--h3-small);--digi--typography--h3--margin--large:var(--digi--margin--h3-large);--digi--typography--h4--margin--small:var(--digi--margin--h4-h6-small);--digi--typography--h4--margin--large:var(--digi--margin--h4-h6-large);--digi--typography--h5--margin--small:var(--digi--margin--h4-h6-small);--digi--typography--h6--margin--large:var(--digi--margin--h4-h6-large);--digi--typography--paragraph--margin--small:var(--digi--margin--text-small);--digi--typography--paragraph--margin--large:var(--digi--margin--text-large);--digi--typography--paragraph--margin-top:initial;--digi--typography--color--text:var(--digi--color--text--primary);--digi--typography--text-decoration-thickness--hover:0.156em;--digi--typography--text-decoration-thickness--default:0.05em;--digi--typography--text-underline-offset:3px;font-family:var(--digi--global--typography--font-family--default);color:var(--digi--typography--color--text);font-size:var(--FONT-SIZE--BODY);line-height:var(--LINE-HEIGHT--BODY);font-weight:var(--FONT-WEIGHT--BODY);text-decoration:var(--TEXT-DECORATION--BODY);--FONT-SIZE--BODY:var(--digi--typography--body--font-size--mobile);--LINE-HEIGHT--BODY:var(--digi--typography--body--line-height--mobile);--FONT-WEIGHT--BODY:var(--digi--typography--body--font-weight--mobile);--TEXT-DECORATION--BODY:var(     --digi--typography--body--text-decoration--mobile   );--MARGIN--BODY:var(--digi--typography--paragraph--margin--small);--FONT-SIZE--LINK:var(--digi--typography--link--font-size--mobile);--LINE-HEIGHT--LINK:var(--digi--typography--link--line-height--mobile);--FONT-WEIGHT--LINK:var(--digi--typography--link--font-weight--mobile);--TEXT-DECORATION--LINK:var(     --digi--typography--link--text-decoration--mobile   );--FONT-SIZE--HEADING-1:var(--digi--typography--heading-1--font-size--mobile);--LINE-HEIGHT--HEADING-1:var(     --digi--typography--heading-1--line-height--mobile   );--FONT-WEIGHT--HEADING-1:var(     --digi--typography--heading-1--font-weight--mobile   );--TEXT-DECORATION--HEADING-1:var(     --digi--typography--heading-1--text-decoration--mobile   );--MARGIN--HEADING-1:var(--digi--typography--h1--margin--small);--FONT-SIZE--HEADING-2:var(--digi--typography--heading-2--font-size--mobile);--LINE-HEIGHT--HEADING-2:var(     --digi--typography--heading-2--line-height--mobile   );--FONT-WEIGHT--HEADING-2:var(     --digi--typography--heading-2--font-weight--mobile   );--TEXT-DECORATION--HEADING-2:var(     --digi--typography--heading-2--text-decoration--mobile   );--MARGIN--HEADING-2:var(--digi--typography--h2--margin--small);--FONT-SIZE--HEADING-3:var(--digi--typography--heading-3--font-size--mobile);--LINE-HEIGHT--HEADING-3:var(     --digi--typography--heading-3--line-height--mobile   );--FONT-WEIGHT--HEADING-3:var(     --digi--typography--heading-3--font-weight--mobile   );--TEXT-DECORATION--HEADING-3:var(     --digi--typography--heading-3--text-decoration--mobile   );--MARGIN--HEADING-3:var(--digi--typography--h3--margin--small);--FONT-SIZE--HEADING-4:var(--digi--typography--heading-4--font-size--mobile);--LINE-HEIGHT--HEADING-4:var(     --digi--typography--heading-4--line-height--mobile   );--FONT-WEIGHT--HEADING-4:var(     --digi--typography--heading-4--font-weight--mobile   );--TEXT-DECORATION--HEADING-4:var(     --digi--typography--heading-4--text-decoration--mobile   );--MARGIN--HEADING-4:var(--digi--typography--h4--margin--small);--FONT-SIZE--HEADING-5:var(--digi--typography--heading-4--font-size--mobile);--LINE-HEIGHT--HEADING-5:var(     --digi--typography--heading-4--line-height--mobile   );--FONT-WEIGHT--HEADING-5:var(     --digi--typography--heading-4--font-weight--mobile   );--TEXT-DECORATION--HEADING-5:var(     --digi--typography--heading-4--text-decoration--mobile   );--MARGIN--HEADING-5:var(--digi--typography--h4--margin--small);--FONT-SIZE--HEADING-6:var(--digi--typography--heading-4--font-size--mobile);--LINE-HEIGHT--HEADING-6:var(     --digi--typography--heading-4--line-height--mobile   );--FONT-WEIGHT--HEADING-6:var(     --digi--typography--heading-4--font-weight--mobile   );--TEXT-DECORATION--HEADING-6:var(     --digi--typography--heading-4--text-decoration--mobile   );--MARGIN--HEADING-6:var(--digi--typography--h4--margin--small)}@media (min-width: 61.9375rem){digi-typography{--FONT-SIZE--BODY:var(--digi--typography--body--font-size--desktop);--LINE-HEIGHT--BODY:var(--digi--typography--body--line-height--desktop);--FONT-WEIGHT--BODY:var(--digi--typography--body--font-weight--desktop);--TEXT-DECORATION--BODY:var(       --digi--typography--body--text-decoration--desktop     );--MARGIN--BODY:var(--digi--typography--paragraph--margin--small);--FONT-SIZE--LINK:var(--digi--typography--link--font-size--desktop);--LINE-HEIGHT--LINK:var(--digi--typography--link--line-height--desktop);--FONT-WEIGHT--LINK:var(--digi--typography--link--font-weight--desktop);--TEXT-DECORATION--LINK:var(       --digi--typography--link--text-decoration--desktop     );--FONT-SIZE--HEADING-1:var(       --digi--typography--heading-1--font-size--desktop     );--LINE-HEIGHT--HEADING-1:var(       --digi--typography--heading-1--line-height--desktop     );--FONT-WEIGHT--HEADING-1:var(       --digi--typography--heading-1--font-weight--desktop     );--TEXT-DECORATION--HEADING-1:var(       --digi--typography--heading-1--text-decoration--desktop     );--MARGIN--HEADING-1:var(--digi--typography--h1--margin--medium);--FONT-SIZE--HEADING-2:var(       --digi--typography--heading-2--font-size--desktop     );--LINE-HEIGHT--HEADING-2:var(       --digi--typography--heading-2--line-height--desktop     );--FONT-WEIGHT--HEADING-2:var(       --digi--typography--heading-2--font-weight--desktop     );--TEXT-DECORATION--HEADING-2:var(       --digi--typography--heading-2--text-decoration--desktop     );--MARGIN--HEADING-2:var(--digi--typography--h2--margin--small);--FONT-SIZE--HEADING-3:var(       --digi--typography--heading-3--font-size--desktop     );--LINE-HEIGHT--HEADING-3:var(       --digi--typography--heading-3--line-height--desktop     );--FONT-WEIGHT--HEADING-3:var(       --digi--typography--heading-3--font-weight--desktop     );--TEXT-DECORATION--HEADING-3:var(       --digi--typography--heading-3--text-decoration--desktop     );--MARGIN--HEADING-3:var(--digi--typography--h3--margin--small);--FONT-SIZE--HEADING-4:var(       --digi--typography--heading-4--font-size--desktop     );--LINE-HEIGHT--HEADING-4:var(       --digi--typography--heading-4--line-height--desktop     );--FONT-WEIGHT--HEADING-4:var(       --digi--typography--heading-4--font-weight--desktop     );--TEXT-DECORATION--HEADING-4:var(       --digi--typography--heading-4--text-decoration--desktop     );--MARGIN--HEADING-4:var(--digi--typography--h4--margin--small);--FONT-SIZE--HEADING-5:var(       --digi--typography--heading-4--font-size--desktop     );--LINE-HEIGHT--HEADING-5:var(       --digi--typography--heading-4--line-height--desktop     );--FONT-WEIGHT--HEADING-5:var(       --digi--typography--heading-4--font-weight--desktop     );--TEXT-DECORATION--HEADING-5:var(       --digi--typography--heading-4--text-decoration--desktop     );--MARGIN--HEADING-5:var(--digi--typography--h5--margin--small);--FONT-SIZE--HEADING-6:var(       --digi--typography--heading-4--font-size--desktop     );--LINE-HEIGHT--HEADING-6:var(       --digi--typography--heading-4--line-height--desktop     );--FONT-WEIGHT--HEADING-6:var(       --digi--typography--heading-4--font-weight--desktop     );--TEXT-DECORATION--HEADING-6:var(       --digi--typography--heading-4--text-decoration--desktop     );--MARGIN--HEADING-6:var(--digi--typography--h6--margin--small)}}digi-typography h1,digi-typography h2,digi-typography h3,digi-typography h4,digi-typography h5,digi-typography h6{margin-top:0;}digi-typography h1,digi-typography .digi-h1{font-size:var(--FONT-SIZE--HEADING-1);line-height:var(--LINE-HEIGHT--HEADING-1);font-weight:var(--FONT-WEIGHT--HEADING-1);text-decoration:var(--TEXT-DECORATION--HEADING-1);margin-bottom:var(--MARGIN--HEADING-1)}digi-typography h2,digi-typography .digi-h2{font-size:var(--FONT-SIZE--HEADING-2);line-height:var(--LINE-HEIGHT--HEADING-2);font-weight:var(--FONT-WEIGHT--HEADING-2);text-decoration:var(--TEXT-DECORATION--HEADING-2);margin-bottom:var(--MARGIN--HEADING-2)}digi-typography h3,digi-typography .digi-h3{font-size:var(--FONT-SIZE--HEADING-3);line-height:var(--LINE-HEIGHT--HEADING-3);font-weight:var(--FONT-WEIGHT--HEADING-3);text-decoration:var(--TEXT-DECORATION--HEADING-3);margin-bottom:var(--MARGIN--HEADING-3)}digi-typography h4,digi-typography .digi-h4{font-size:var(--FONT-SIZE--HEADING-4);line-height:var(--LINE-HEIGHT--HEADING-4);font-weight:var(--FONT-WEIGHT--HEADING-4);text-decoration:var(--TEXT-DECORATION--HEADING-4);margin-bottom:var(--MARGIN--HEADING-4)}digi-typography h5,digi-typography .digi-h5{font-size:var(--FONT-SIZE--HEADING-5);line-height:var(--LINE-HEIGHT--HEADING-5);font-weight:var(--FONT-WEIGHT--HEADING-5);text-decoration:var(--TEXT-DECORATION--HEADING-5);margin-bottom:var(--MARGIN--HEADING-5)}digi-typography h6,digi-typography .digi-h6{font-size:var(--FONT-SIZE--HEADING-6);line-height:var(--LINE-HEIGHT--HEADING-6);font-weight:var(--FONT-WEIGHT--HEADING-6);text-decoration:var(--TEXT-DECORATION--HEADING-6);margin-bottom:var(--MARGIN--HEADING-6)}digi-typography p,digi-typography blockquote{font-size:var(--FONT-SIZE--BODY);line-height:var(--LINE-HEIGHT--BODY);font-weight:var(--FONT-WEIGHT--BODY);text-decoration:var(--TEXT-DECORATION--BODY);margin-top:initial;margin-bottom:var(--MARGIN--BODY);max-width:var(--digi--paragraph-width--medium)}digi-typography p:last-child,digi-typography blockquote:last-child{margin-bottom:0}digi-typography blockquote{margin-inline:0}digi-typography digi-typography-preamble{display:block;margin-bottom:var(--MARGIN--BODY)}digi-typography digi-typography-preamble:last-child{margin-bottom:0}digi-typography ul,digi-typography ol,digi-typography dl{font-size:var(--FONT-SIZE--BODY);line-height:var(--LINE-HEIGHT--BODY);font-weight:var(--FONT-WEIGHT--BODY);text-decoration:var(--TEXT-DECORATION--BODY);max-width:var(--digi--paragraph-width--medium);margin-bottom:var(--MARGIN--BODY)}digi-typography ul,digi-typography ol{margin:0 0 var(--MARGIN--BODY) 0;padding-inline-start:1.5rem}digi-typography ul li,digi-typography ol li{margin-top:initial;margin-bottom:0.5rem;box-sizing:border-box;width:100%;padding-left:0}digi-typography ul li:last-child,digi-typography ol li:last-child{margin-bottom:0}digi-typography a{font-size:1em;line-height:var(--LINE-HEIGHT--LINK);font-weight:inherit;text-decoration:var(--TEXT-DECORATION--LINK);color:var(--digi--color--text--interactive--primary);text-decoration-thickness:var(--digi--typography--text-decoration-thickness--default);text-underline-offset:var(--digi--typography--text-underline-offset)}digi-typography a:hover{text-decoration:var(--TEXT-DECORATION--LINK);text-decoration-thickness:var(--digi--typography--text-decoration-thickness--hover)}digi-typography a:focus-visible{outline:2px solid black;outline-offset:2px;box-shadow:0px 0px 0px 5px white}digi-typography a:visited{color:var(--digi--color--text--interactive--visited)}digi-typography .digi-typography--hide-visited a:visited{color:var(--digi--color--text--interactive--primary)}digi-typography strong{font-weight:var(--digi--typography--label--font-weight--desktop)}`;
+
+const Typography = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+    }
+    get cssModifiers() {
+        return {
+            'digi-typography--hide-visited': this.hideVisitedColor
+        };
+    }
+    render() {
+        return (h("div", { key: '2b78d2c69b94e258feb4c99d5835cc58507d7886', class: Object.assign({ 'digi-typography': true }, this.cssModifiers) }, h("slot", { key: '1f952d99d2331fb09a1b6d549a6ea97440302346' })));
+    }
+};
+Typography.style = typographyCss();
+
+const typographyHeadingJumboCss = () => `.sc-digi-typography-heading-jumbo-h{display:block}.sc-digi-typography-heading-jumbo-h .digi-typography-heading-jumbo.sc-digi-typography-heading-jumbo{font-size:var(--digi--typography--heading-jumbo--font-size--desktop);font-family:var(--digi--global--typography--font-family--default);color:var(--digi--color--text--primary);font-weight:var(--digi--typography--heading-jumbo--font-weight--desktop)}@media (min-width: 61.9375rem){.sc-digi-typography-heading-jumbo-h .digi-typography-heading-jumbo.sc-digi-typography-heading-jumbo{font-size:var(--digi--typography--heading-jumbo--font-size--desktop-large)}}.sc-digi-typography-heading-jumbo-h .digi-typography-heading-jumbo--secondary.sc-digi-typography-heading-jumbo{color:var(--digi--grayscale--0)}.sc-digi-typography-heading-jumbo-h .digi-typography-heading-jumbo.sc-digi-typography-heading-jumbo::after{content:"";width:11.875rem;height:0.4375rem;background:var(--digi--color--border--accent--primary);display:block;margin-top:var(--digi--padding--small)}@media (min-width: 61.9375rem){.sc-digi-typography-heading-jumbo-h .digi-typography-heading-jumbo.sc-digi-typography-heading-jumbo::after{width:13.75rem;margin-top:var(--digi--margin--h2-large);height:0.625rem}}.sc-digi-typography-heading-jumbo-h .digi-typography-heading-jumbo--secondary.sc-digi-typography-heading-jumbo::after{background:var(--digi--color--border--accent--secondary)}digi-typography .sc-digi-typography-heading-jumbo-h .digi-typography-heading-jumbo.sc-digi-typography-heading-jumbo{margin-bottom:var(--digi--margin--medium)}`;
+
+const TypographyHeadingJumbo = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        /**
+         * Rubrikens text
+         * @en The heading text
+         */
+        this.afText = '';
+        /**
+         * Sätt rubrikens vikt. 'h1' är förvalt.
+         * @en Set heading level. Default is 'h1'
+         */
+        this.afLevel = TypographyHeadingJumboLevel.H1;
+        /**
+         * Sätt språk inuti rubrik-elementet. 'sv' (svenska) är förvalt.
+         * @en Set language inside of title element. Defaults to 'sv' (swedish).
+         */
+        this.afLang = 'sv';
+    }
+    /**
+     * Lyssnar på om fokus sätts på custom-elementet och propagerar ner det till själva rubrik-elementet.
+     * @en Listens for when focus is set on the custom element and propagates it down to the actual heading element.
+     */
+    focusOnHeading() {
+        this.headingElement.focus();
+    }
+    get cssModifiers() {
+        return {
+            'digi-typography-heading-jumbo--primary': this.afVariation === TypographyHeadingJumboVariation.PRIMARY,
+            'digi-typography-heading-jumbo--secondary': this.afVariation === TypographyHeadingJumboVariation.SECONDARY
+        };
+    }
+    render() {
+        return (h(this.afLevel, { key: 'b63f9447d1ccefc73fcd3ac26562ed4d9f106f3c', ref: (el) => (this.headingElement = el), class: Object.assign({ 'digi-typography-heading-jumbo': true }, this.cssModifiers), lang: this.afLang, tabindex: -1 }, this.afText));
+    }
+};
+TypographyHeadingJumbo.style = typographyHeadingJumboCss();
+
+const UtilKeydownHandler = class {
+    constructor(hostRef) {
+        registerInstance(this, hostRef);
+        this.afOnEsc = createEvent(this, "afOnEsc", 7);
+        this.afOnEnter = createEvent(this, "afOnEnter", 7);
+        this.afOnTab = createEvent(this, "afOnTab", 7);
+        this.afOnSpace = createEvent(this, "afOnSpace", 7);
+        this.afOnShiftTab = createEvent(this, "afOnShiftTab", 7);
+        this.afOnUp = createEvent(this, "afOnUp", 7);
+        this.afOnDown = createEvent(this, "afOnDown", 7);
+        this.afOnLeft = createEvent(this, "afOnLeft", 7);
+        this.afOnRight = createEvent(this, "afOnRight", 7);
+        this.afOnHome = createEvent(this, "afOnHome", 7);
+        this.afOnEnd = createEvent(this, "afOnEnd", 7);
+        this.afOnKeyDown = createEvent(this, "afOnKeyDown", 7);
+    }
+    keydownHandler(e) {
+        const key = keyboardHandler(e);
+        switch (key) {
+            case KEY_CODE.SHIFT_TAB:
+                this.afOnShiftTab.emit(e);
+                break;
+            case KEY_CODE.DOWN_ARROW:
+                this.afOnDown.emit(e);
+                this.afOnKeyDown.emit(e);
+                break;
+            case KEY_CODE.UP_ARROW:
+                this.afOnUp.emit(e);
+                this.afOnKeyDown.emit(e);
+                break;
+            case KEY_CODE.LEFT_ARROW:
+                this.afOnLeft.emit(e);
+                this.afOnKeyDown.emit(e);
+                break;
+            case KEY_CODE.RIGHT_ARROW:
+                this.afOnRight.emit(e);
+                this.afOnKeyDown.emit(e);
+                break;
+            case KEY_CODE.ENTER:
+                this.afOnEnter.emit(e);
+                this.afOnKeyDown.emit(e);
+                break;
+            case KEY_CODE.ESCAPE:
+                this.afOnEsc.emit(e);
+                this.afOnKeyDown.emit(e);
+                break;
+            case KEY_CODE.TAB:
+                this.afOnTab.emit(e);
+                this.afOnKeyDown.emit(e);
+                break;
+            case KEY_CODE.SPACE:
+                this.afOnSpace.emit(e);
+                this.afOnKeyDown.emit(e);
+                break;
+            case KEY_CODE.HOME:
+                this.afOnHome.emit(e);
+                this.afOnKeyDown.emit(e);
+                break;
+            case KEY_CODE.END:
+                this.afOnEnd.emit(e);
+                this.afOnKeyDown.emit(e);
+                break;
+            case KEY_CODE.ANY:
+                this.afOnKeyDown.emit(e);
+                break;
+            default:
+                this.afOnKeyDown.emit(e);
+                return;
+        }
+    }
+    render() {
+        return h("slot", { key: 'c0a9e056eb5e48ce215370d38ee65a62ca2e33d9' });
+    }
+};
+
+export { Calendar as digi_calendar, CalendarDatepicker as digi_calendar_datepicker, ExpandableAccordion as digi_expandable_accordion, ExpandableFaqItem as digi_expandable_faq_item, FormInput as digi_form_input, FormLabel as digi_form_label, FormSelect as digi_form_select, FormValidationMessage as digi_form_validation_message, IconCalendarAlt as digi_icon_calendar_alt, IconChevronDown as digi_icon_chevron_down, IconChevronLeft as digi_icon_chevron_left, IconChevronRight as digi_icon_chevron_right, IconInputSelectMarker as digi_icon_input_select_marker, IconValidationError as digi_icon_validation_error, IconCheckCircle as digi_icon_validation_success, IconValidationWarning as digi_icon_validation_warning, Typography as digi_typography, TypographyHeadingJumbo as digi_typography_heading_jumbo, UtilKeydownHandler as digi_util_keydown_handler };