@designsystem-se/af 36.0.1-beta.0 → 36.0.2

package/dist/cjs/digi-form-select-filter.cjs.entry.js

@@ -7,15 +7,16 @@ const randomIdGenerator_util = require('./randomIdGenerator.util-e7f4b6de.js');
 const logger_util = require('./logger.util-fdafc086.js');
 const detectClickOutside_util = require('./detectClickOutside.util-3e764eb3.js');
 const detectFocusOutside_util = require('./detectFocusOutside.util-03c62976.js');
-const text = require('./text-3157012b.js');
+const text = require('./text-65b1b58c.js');
 require('./badge-notification-shape.enum-ff802554.js');
-const typographyVariation_enum = require('./typography-variation.enum-9f56fd50.js');
+const typographyVariation_enum = require('./typography-variation.enum-50512a4e.js');
 require('./badge-status-variation.enum-0a5adc21.js');
-require('./code-example-variation.enum-1611825e.js');
-require('./form-input-search-variation.enum-e0e025b1.js');
+require('./button-size.enum-1fd86b9e.js');
+require('./button-type.enum-406723db.js');
 require('./button-variation.enum-bc521499.js');
 require('./calendar-week-view-heading-level.enum-fd0c841b.js');
 require('./bar-chart-variation.enum-a4e866b6.js');
+require('./code-example-variation.enum-c6557727.js');
 require('./code-variation.enum-c4a4e6fd.js');
 require('./expandable-accordion-header-level.enum-45483252.js');
 require('./expandable-faq-item-variation.enum-89427195.js');
@@ -23,13 +24,16 @@ require('./expandable-faq-variation.enum-af923f49.js');
 require('./footer-card-variation.enum-99555edc.js');
 require('./form-checkbox-variation.enum-d2ca879e.js');
 require('./form-file-upload-variation.enum-634cfae8.js');
+require('./form-input-search-variation.enum-c50239bc.js');
 const formInputType_enum = require('./form-input-type.enum-9c8ee12a.js');
 const formInputVariation_enum = require('./form-input-variation.enum-c750520c.js');
+require('./form-radiogroup-validation.enum-03a17d4d.js');
 require('./form-select-variation.enum-528c1bf0.js');
 require('./form-textarea-variation.enum-9c90d40f.js');
 require('./form-validation-message-variation.enum-855ae0be.js');
 require('./info-card-multi-type.enum-14746572.js');
 require('./info-card-variation.enum-64cef637.js');
+require('./layout-container-max-width.enum-7e637f44.js');
 require('./layout-block-variation.enum-f6102119.js');
 require('./layout-columns-variation.enum-65675649.js');
 require('./link-button-variation.enum-137785e3.js');
@@ -39,6 +43,7 @@ require('./loader-spinner-size.enum-db2973f0.js');
 require('./logo-variation.enum-607fadb4.js');
 require('./media-figure-alignment.enum-3885aba5.js');
 require('./navigation-sidebar-variation.enum-1c0c3064.js');
+require('./navigation-vertical-menu-variation.enum-c237edd3.js');
 require('./progress-indicator-variation.enum-7cf8e0e4.js');
 require('./progress-list-item-variation.enum-90e4c874.js');
 require('./progress-list-variation.enum-06d5ce27.js');
@@ -50,6 +55,7 @@ require('./tag-size.enum-387c516c.js');
 require('./tools-feedback-banner-type.enum-de373ba0.js');
 require('./tools-feedback-rating-variation.enum-2f71e84d.js');
 require('./tools-theme-provider.brand.enum-bc855272.js');
+require('./typography-heading-jumbo-variation.enum-8677e099.js');
 require('./typography-meta-variation.enum-13ac3538.js');
 require('./typography-time-variation.enum-bce1d87e.js');
 require('./util-breakpoint-observer-breakpoints.enum-e96d3a84.js');
@@ -99,6 +105,7 @@ const FormSelectFilter = class {
         this.afName = undefined;
         this.afEmptySearchMessage = 'Inga sökträffar för';
         this.afFilterButtonAriaDescribedby = undefined;
+        this.afErrorMessageIsAlert = true;
     }
     onValueChanged(value) {
         const joinedArray = [...value, ...this._selectedItems];
@@ -143,6 +150,10 @@ const FormSelectFilter = class {
             }
         }
     }
+    get errorMessageIsAlert() {
+        return (this.afErrorMessageIsAlert !== false &&
+            this.afErrorMessageIsAlert !== 'false');
+    }
     /**
      * Funktion för att rensa valda värden från komponenten
      * @en Function for clearing selected values from component
@@ -175,6 +186,13 @@ const FormSelectFilter = class {
             this.focusInList = !detectFocusOutside_util.detectFocusOutside(target, `#${this.afId}-select-filter-list`);
         }
     }
+    /**
+     * Lyssnar på om fokus sätts på custom-elementet och propagerar ner det till toggle-knappen.
+     * @en Listens for when focus is set on the custom element and propagates it down to the toggle butto.
+     */
+    focusOnElement() {
+        this._toggleButton.focus();
+    }
     debounce(func, timeout = 300) {
         let timer;
         return (...args) => {
@@ -498,27 +516,28 @@ const FormSelectFilter = class {
             } }, index.h("slot", { name: "empty-search-result" })))));
     }
     render() {
-        return (index.h("div", { key: 'a973426bdba50ce86911d281a5e9c9fb7e285807', class: Object.assign({ 'digi-form-select-filter': true }, this.cssModifiers), role: "application", id: `${this.afId}-identifier` }, index.h("digi-form-label", { key: 'e4f5954c7c2d53232f9d11895b6fa5688302d163', afLabel: this.afFilterButtonTextLabel, afFor: `${this.afId}`, afId: `${this.afId}-label`, class: "digi-form-select-filter__label", afDescription: this.afDescription, afRequired: this.afRequired, afAnnounceIfOptional: this.afAnnounceIfOptional, afRequiredText: this.afRequiredText, afAnnounceIfOptionalText: this.afAnnounceIfOptionalText }), index.h("digi-util-keydown-handler", { key: '4dcef492e96fb96d6baea74e0b36b6fec14ad3d6', onAfOnEsc: () => this.escHandler() }, index.h("button", { key: '9e1bb4096c077df73139e8b4767e5cadc5f4d2ee', type: "button", id: `${this.afId}`, class: "digi-form-select-filter__toggle-button", onClick: () => this.toggleDropdown(), ref: (el) => (this._toggleButton = el), "aria-haspopup": "true", "aria-label": this.ariaLabel, "aria-labelledby": this.afFilterButtonAriaDescribedby, "aria-controls": `${this.afId}-dropdown-menu`, "aria-expanded": this.isOpen }, index.h("div", { key: '237419ff66314b63efca1fb02d73cb2d60fdaf3d', class: Object.assign({ 'digi-form-filter__toggle-button-wrapper': true }, this.cssModifiersToggleButtonWrapper) }, index.h("digi-icon-check", { key: '5a56d5b6d3d2c6d0f3d0df3ee63c451298b18851', class: Object.assign({ 'digi-form-select-filter__toggle-button-indicator': true }, this.cssModifiersToggleButtonIndicator), slot: "icon" }), index.h("span", { key: '9f3f6993ca24bb20fbebdb1739592fda24bd965b', class: "digi-form-select-filter__toggle-button-text" }, this.renderButtonLabel)), index.h("digi-icon-chevron-down", { key: 'fc3e71d79a44e8953609da9bbc4024a16cc92794', class: "digi-form-select-filter__toggle-icon" })), index.h("div", { key: '565c9af0e540f891f5f58b5f68fd1bdef789d439', id: `${this.afId}-dropdown-menu`, tabindex: this.isOpen ? '-1' : undefined, class: {
+        return (index.h(index.Host, { key: '232ad0fdb8164fb6ed04d1d2fdcdc778a197ae43', tabindex: -1 }, index.h("div", { key: 'bd384c56a99f54deef5cb2e325bae1e65c53696c', class: Object.assign({ 'digi-form-select-filter': true }, this.cssModifiers), role: "application", id: `${this.afId}-identifier` }, index.h("digi-form-label", { key: 'af3ad60e123ffe072af3590230975d6cb4b08db9', afLabel: this.afFilterButtonTextLabel, afFor: `${this.afId}`, afId: `${this.afId}-label`, class: "digi-form-select-filter__label", afDescription: this.afDescription, afRequired: this.afRequired, afAnnounceIfOptional: this.afAnnounceIfOptional, afRequiredText: this.afRequiredText, afAnnounceIfOptionalText: this.afAnnounceIfOptionalText }), index.h("digi-util-keydown-handler", { key: '06cb88227494648eb5e9861022830562b20fbbb2', onAfOnEsc: () => this.escHandler() }, index.h("button", { key: '8f829b158f487b9b671066f18b6948d24bd7724c', type: "button", id: `${this.afId}`, class: "digi-form-select-filter__toggle-button", onClick: () => this.toggleDropdown(), ref: (el) => (this._toggleButton = el), "aria-haspopup": "true", "aria-label": this.ariaLabel, "aria-describedby": `${this.afFilterButtonAriaDescribedby} ${this.afId}--validation-message`, "aria-controls": `${this.afId}-dropdown-menu`, "aria-expanded": this.isOpen }, index.h("div", { key: '6b28930875126efeea6e011d17567b2de4bf7635', class: Object.assign({ 'digi-form-filter__toggle-button-wrapper': true }, this.cssModifiersToggleButtonWrapper) }, index.h("digi-icon-check", { key: 'afde185a6027a96c0fd75a80bfbf9a462839cd32', class: Object.assign({ 'digi-form-select-filter__toggle-button-indicator': true }, this.cssModifiersToggleButtonIndicator), slot: "icon" }), index.h("span", { key: '8b846d513be35ffec07b6f1073b24c4fad8b09d0', class: "digi-form-select-filter__toggle-button-text" }, this.renderButtonLabel)), index.h("digi-icon-chevron-down", { key: '795ac4c5d2cf7e7ddff801cc8224215b8c0f4492', class: "digi-form-select-filter__toggle-icon" })), index.h("div", { key: '1952bcb6c880cc79263c348067c8e76ee4b2c54d', id: `${this.afId}-dropdown-menu`, tabindex: this.isOpen ? '-1' : undefined, class: {
                 'digi-form-select-filter__dropdown': true,
                 'digi-form-select-filter__dropdown--right': this.afAlignRight,
                 'digi-form-select-filter__dropdown--hidden': !this.isOpen
-            } }, index.h("fieldset", { key: 'dc8b60b9b9f0568967ef4e5ffddf464149e41b7b' }, index.h("div", { key: 'c14f0eaad909cebd41564028f2436269e96ab13a', class: "digi-form-select-filter__header" }, index.h("legend", { key: '92baa299ac9d085a650860bcfed4474f5265d526', class: "digi-form-select-filter__legend" }, this.afFilterButtonTextLabel), index.h("digi-form-input", { key: '776c9d498f33990b521ee04898d1ea739432c077', afLabel: this.afName, afId: `${this.afId}-search`, afVariation: formInputVariation_enum.FormInputVariation.MEDIUM, afType: formInputType_enum.FormInputType.SEARCH, afValidation: formInputVariation_enum.FormInputValidation.NEUTRAL, onAfOnFocus: () => {
+            } }, index.h("fieldset", { key: '67c787d57885455dc6018b14ee77c5cf8f889269' }, index.h("div", { key: 'f04990f47e0c842447503c0c669fad9f075e1800', class: "digi-form-select-filter__header" }, index.h("legend", { key: 'a555f7e77fd3fc35badec8261676746ad0d07a96', class: "digi-form-select-filter__legend" }, this.afFilterButtonTextLabel), index.h("digi-form-input", { key: 'dbbe1895e3f36e9103429510bdaa669839c1509b', afLabel: this.afName, afId: `${this.afId}-search`, afVariation: formInputVariation_enum.FormInputVariation.MEDIUM, afType: formInputType_enum.FormInputType.SEARCH, afValidation: formInputVariation_enum.FormInputValidation.NEUTRAL, onAfOnFocus: () => {
                 this.focusListItemIndex = 0;
             }, onAfOnKeyup: (e) => {
                 this.inputSearchKeyboardHandler(e.detail);
-            }, onAfOnInput: (e) => this.inputSearchInputHandler(e.detail), afValue: this._searchQuery, class: "digi-form-select-filter__search-input", afAriaControls: `${this.afId}-select-filter-list`, afAutocomplete: "off", afAriaAutocomplete: "none" }), this.renderEmptyStateBox()), index.h("div", { key: 'ac8da673afc1e2a6c0543a835b2627b957021f33', class: "digi-form-select-filter__scroll" }, index.h("digi-util-keydown-handler", { key: '08f0943b88567354588ae2b45111468698dd38ff', onAfOnDown: (e) => this.downHandler(e), onAfOnRight: (e) => this.downHandler(e), onAfOnUp: (e) => this.upHandler(e), onAfOnLeft: (e) => this.upHandler(e), onAfOnHome: (e) => this.homeHandler(e), onAfOnEnd: (e) => this.endHandler(e), onAfOnEnter: (e) => this.enterHandler(e), onAfOnSpace: (e) => this.spaceHandler(e), onAfOnTab: () => this.tabHandler(), onAfOnShiftTab: () => this.shiftHandler() }, index.h("ul", { key: 'd7b7f52a85bfebd96b14ef18b4ac1d6aaac9273e', class: "digi-form-select-filter__list", "aria-labelledby": `${this.afId}`, id: `${this.afId}-select-filter-list`, role: this.afMultipleItems ? '' : 'radiogroup', "aria-invalid": this.afMultipleItems
+            }, onAfOnInput: (e) => this.inputSearchInputHandler(e.detail), afValue: this._searchQuery, class: "digi-form-select-filter__search-input", afAriaControls: `${this.afId}-select-filter-list`, afAutocomplete: "off", afAriaAutocomplete: "none" }), this.renderEmptyStateBox()), index.h("div", { key: '7a1b963b624783f76d6b938aef4b54b5539a8b19', class: "digi-form-select-filter__scroll" }, index.h("digi-util-keydown-handler", { key: '210bdb0e2937132b68378a770edfb6c93e7b831e', onAfOnDown: (e) => this.downHandler(e), onAfOnRight: (e) => this.downHandler(e), onAfOnUp: (e) => this.upHandler(e), onAfOnLeft: (e) => this.upHandler(e), onAfOnHome: (e) => this.homeHandler(e), onAfOnEnd: (e) => this.endHandler(e), onAfOnEnter: (e) => this.enterHandler(e), onAfOnSpace: (e) => this.spaceHandler(e), onAfOnTab: () => this.tabHandler(), onAfOnShiftTab: () => this.shiftHandler() }, index.h("ul", { key: 'bdf8431ce2a39cdb9c23c8419eb12518ca20e3dd', class: "digi-form-select-filter__list", "aria-labelledby": `${this.afId}`, id: `${this.afId}-select-filter-list`, role: this.afMultipleItems ? '' : 'radiogroup', "aria-invalid": this.afMultipleItems
                 ? 'false'
-                : this.afValidation === typographyVariation_enum.FormSelectFilterValidation.ERROR
+                : this.afValidation ===
+                    typographyVariation_enum.FormSelectFilterValidation.ERROR
                     ? 'true'
                     : 'false', "aria-errormessage": `${this.afId}--validation-message`, "aria-required": this.afMultipleItems
                 ? false
                 : this.afRequired
                     ? 'true'
-                    : 'false' }, this.showNeutralValue && (index.h("li", { key: '3f3c8ee516a00099adb40779cf648046e3d79133', class: "digi-form-select-filter__item", role: "radio", "aria-required": this.afMultipleItems
+                    : 'false' }, this.showNeutralValue && (index.h("li", { key: '4d97c4be7a31dbe830181eefc37929b3bb2f9234', class: "digi-form-select-filter__item", role: "radio", "aria-required": this.afMultipleItems
                 ? 'false'
                 : this.afRequired
                     ? 'true'
-                    : 'false', "aria-checked": this._selectedItems.length === 0 ? 'true' : 'false', onClick: () => this.resetSelectItems(true), tabIndex: 0, "aria-label": this.afFilterButtonText }, this._selectedItems.length === 0 && (index.h("digi-icon-check", { key: '20bdf4fd24c13a9dc6ad12718847f6f4f78af2af', class: "digi-form-select-filter__item__icon", "aria-hidden": 'true' })), this.afFilterButtonText)), this._filteredResult &&
+                    : 'false', "aria-checked": this._selectedItems.length === 0 ? 'true' : 'false', onClick: () => this.resetSelectItems(true), tabIndex: 0, "aria-label": this.afFilterButtonText }, this._selectedItems.length === 0 && (index.h("digi-icon-check", { key: 'c1af26327f9bab4456a3770698cb08e8f0b0be95', class: "digi-form-select-filter__item__icon", "aria-hidden": 'true' })), this.afFilterButtonText)), this._filteredResult &&
             this._filteredResult.map((item, index$1) => {
                 return (index.h("li", { class: "digi-form-select-filter__item", key: index$1, dir: item.dir, lang: item.lang, "aria-checked": this.isSelected(item.value) ? 'true' : 'false', role: this.afMultipleItems ? 'checkbox' : 'radio', "aria-required": this.afMultipleItems
                         ? 'false'
@@ -529,10 +548,14 @@ const FormSelectFilter = class {
                             typographyVariation_enum.FormSelectFilterValidation.ERROR
                             ? 'true'
                             : 'false'
-                        : 'false', "aria-errormessage": `${this.afId}--validation-message`, onClick: () => this.selectItemHandler(item), tabIndex: this.showNeutralValue ? -1 : index$1 === 0 ? 0 : -1 }, this.isSelected(item.value) && (index.h("digi-icon-check", { class: "digi-form-select-filter__item__icon", "aria-hidden": 'true' })), item.label));
-            }))))), this.afMultipleItems && (index.h("div", { key: 'f3f670c396cc7dc01dcb3834042b2ca9af3faeb7', class: "digi-form-select-filter__footer" }, !this.afHideResetButton && (index.h("digi-button", { key: '508ea54b56002d2f4dfa6307d07242436edc8277', "af-variation": "secondary", "af-aria-label": this.afResetButtonTextAriaLabel, onClick: () => this.resetSelectItems(), class: "digi-form-select-filter__reset-button" }, this.afResetButtonText)), index.h("digi-util-keydown-handler", { key: '9dcba889f74484cc90e00c8873b314eab6508c06', onAfOnUp: () => this.setFocusItem() }, index.h("digi-button", { key: 'df2fe414579e01db151b20131068ce9c7e8f0a7b', ref: (el) => (this._submitButton = el), "af-variation": "primary", "af-aria-label": this.afSubmitButtonTextAriaLabel, onClick: () => {
+                        : 'false', "aria-errormessage": `${this.afId}--validation-message`, onClick: () => this.selectItemHandler(item), tabIndex: this.showNeutralValue
+                        ? -1
+                        : index$1 === 0
+                            ? 0
+                            : -1 }, this.isSelected(item.value) && (index.h("digi-icon-check", { class: "digi-form-select-filter__item__icon", "aria-hidden": 'true' })), item.label));
+            }))))), this.afMultipleItems && (index.h("div", { key: 'e9617bc3097f670582c1ad9fe9dcc3cdd5a56f5b', class: "digi-form-select-filter__footer" }, !this.afHideResetButton && (index.h("digi-button", { key: 'b4899966b541b5d67a32f07a01631509075a7106', "af-variation": "secondary", "af-aria-label": this.afResetButtonTextAriaLabel, onClick: () => this.resetSelectItems(), class: "digi-form-select-filter__reset-button" }, this.afResetButtonText)), index.h("digi-util-keydown-handler", { key: '5662e817b03fb9d04b5a01d726863dca84e23f88', onAfOnUp: () => this.setFocusItem() }, index.h("digi-button", { key: 'bc7cb5ef64aa7a5f0e3ce29f416fa9995ef2f7c8', ref: (el) => (this._submitButton = el), "af-variation": "primary", "af-aria-label": this.afSubmitButtonTextAriaLabel, onClick: () => {
                 this.setClosed(true);
-            }, class: "digi-form-select-filter__submit-button" }, this.afSubmitButtonText)))))), index.h("div", { key: 'e4856539556e2d5912e3a326bb697dc61b98efca', class: "digi-form-select__footer" }, index.h("div", { key: 'e9da92046fd4f2b0a93f3e7681243de5cae57b83', "aria-atomic": "true", role: "alert", id: `${this.afId}--validation-message` }, this.showValidation() && (index.h("digi-form-validation-message", { key: '8b2bd29203a6f722ae4507ea65c0600dbfe960c2', "af-variation": this.afValidation }, this.afValidationText))))));
+            }, class: "digi-form-select-filter__submit-button" }, this.afSubmitButtonText)))))), index.h("div", { key: '724a4171df75af688ddc34312db71d8c0ddc882e', class: "digi-form-select__footer" }, index.h("div", { key: 'e6e83f72fa04ff87cc30868dc7b125ad1289e6f2', "aria-atomic": "true", role: this.errorMessageIsAlert ? 'alert' : null, id: `${this.afId}--validation-message` }, this.showValidation() && (index.h("digi-form-validation-message", { key: 'ed8426f025854a09aa445734e239dae8574daec4', "af-variation": this.afValidation }, this.afValidationText)))))));
     }
     get hostElement() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/digi-form-textarea.cjs.entry.js

@@ -44,6 +44,7 @@ const FormTextarea = class {
         this.afAriaLabelledby = undefined;
         this.afAriaDescribedby = undefined;
         this.afAutofocus = undefined;
+        this.afErrorMessageIsAlert = true;
     }
     onValueChanged(value) {
         this.afValue = value;
@@ -51,6 +52,10 @@ const FormTextarea = class {
     onAfValueChanged(value) {
         this.value = value;
     }
+    get errorMessageIsAlert() {
+        return (this.afErrorMessageIsAlert !== false &&
+            this.afErrorMessageIsAlert !== 'false');
+    }
     afValidationTextWatch() {
         this.setActiveValidationMessage();
     }
@@ -61,6 +66,14 @@ const FormTextarea = class {
     async afMGetFormControlElement() {
         return this._textarea;
     }
+    /**
+     * Lyssnar på om fokus sätts på custom-elementet och propagerar ner det till själva textarea-elementet.
+     * @en Listens for when focus is set on the custom element and propagates it down to the actual textara element.
+     */
+    focusOnInput() {
+        var _a;
+        (_a = this._textarea) === null || _a === void 0 ? void 0 : _a.focus();
+    }
     componentWillLoad() {
         this.afValue ? (this.value = this.afValue) : (this.afValue = this.value);
         this.setActiveValidationMessage();
@@ -116,10 +129,10 @@ const FormTextarea = class {
         this.afOnInput.emit(e);
     }
     render() {
-        return (index.h("div", { key: 'c61b17dfadad1f4483aae5d1b84fae6a92ae8b1e', class: Object.assign({ 'digi-form-textarea': true }, this.cssModifiers) }, index.h("div", { key: '901725f331c7ee08e7e0ae8834907bed94f2eefc', class: "digi-form-textarea__label" }, index.h("digi-form-label", { key: '60fda4488f86ba586af8637b016b3f9d56de635f', afFor: this.afId, afLabel: this.afLabel, afDescription: this.afLabelDescription, afRequired: this.afRequired, afAnnounceIfOptional: this.afAnnounceIfOptional, afRequiredText: this.afRequiredText, afAnnounceIfOptionalText: this.afAnnounceIfOptionalText })), index.h("div", { key: '3624ace952fc8ddba0400344b5ecd162db97ad0f', class: "digi-form-textarea__content" }, index.h("textarea", { key: 'cc0f9212adfa7d39240a0cc02d7859761e16f019', class: "digi-form-textarea__textarea", ref: (el) => (this._textarea = 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, "aria-labelledby": this.afAriaLabelledby, "aria-invalid": this.afValidation === formTextareaVariation_enum.FormTextareaValidation.ERROR
+        return (index.h(index.Host, { key: '8fc80d345a10b05e22b3dcd5adb63449d50b07e1', tabindex: -1 }, index.h("div", { key: '049576151b60c94d55711e696af1262ac6701f34', class: Object.assign({ 'digi-form-textarea': true }, this.cssModifiers) }, index.h("div", { key: 'a18d782506a20eb687bd8792a3fb0da3db159d4f', class: "digi-form-textarea__label" }, index.h("digi-form-label", { key: '1574be92b63e16034a5690a9d217da8e63ca7470', afFor: this.afId, afLabel: this.afLabel, afDescription: this.afLabelDescription, afRequired: this.afRequired, afAnnounceIfOptional: this.afAnnounceIfOptional, afRequiredText: this.afRequiredText, afAnnounceIfOptionalText: this.afAnnounceIfOptionalText })), index.h("div", { key: 'c3258fb29058a14abae464e8e7f22074675e0115', class: "digi-form-textarea__content" }, index.h("textarea", { key: '5273fb0ea8d7c1345bfc37df0214f1ceb497f2ae', class: "digi-form-textarea__textarea", ref: (el) => (this._textarea = 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-invalid": this.afValidation === formTextareaVariation_enum.FormTextareaValidation.ERROR
                 ? 'true'
-                : 'false', maxLength: this.afMaxlength, minLength: this.afMinlength, role: this.afRole, required: this.afRequired, id: this.afId, name: this.afName, value: this.afValue, autofocus: this.afAutofocus ? this.afAutofocus : null })), index.h("div", { key: '0bfcc28ea5818c2ae68894d165bef6ff61155841', class: "digi-form-textarea__footer" }, index.h("div", { key: '77fb29eee9f8623c044472a41449dcb45b2d54ff', class: "digi-form-textarea__validation", "aria-atomic": "true", role: "alert", id: `${this.afId}--validation-message` }, this.hasActiveValidationMessage &&
-            this.afValidation != formTextareaVariation_enum.FormTextareaValidation.NEUTRAL && (index.h("digi-form-validation-message", { key: 'd5013d2e0f448038a8f13e9e824a091f5699c5dd', class: "digi-form-textarea__validation-message", "af-variation": this.afValidation }, this.afValidationText))))));
+                : 'false', maxLength: this.afMaxlength, minLength: this.afMinlength, role: this.afRole, required: this.afRequired, id: this.afId, name: this.afName, value: this.afValue, autofocus: this.afAutofocus ? this.afAutofocus : null })), index.h("div", { key: '38ade9720142b05d65248291749635e061681bad', class: "digi-form-textarea__footer" }, index.h("div", { key: 'fbe8041652cc9c1bc72bffc98582c5312b9c020b', class: "digi-form-textarea__validation", "aria-atomic": "true", role: this.errorMessageIsAlert ? 'alert' : null, id: `${this.afId}--validation-message` }, this.hasActiveValidationMessage &&
+            this.afValidation != formTextareaVariation_enum.FormTextareaValidation.NEUTRAL && (index.h("digi-form-validation-message", { key: 'baea13a3e9d6c7a762cce0f0296ee0dcb267ff9f', class: "digi-form-textarea__validation-message", "af-variation": this.afValidation }, this.afValidationText)))))));
     }
     get hostElement() { return index.getElement(this); }
     static get watchers() { return {

package/dist/cjs/digi-header-avatar.cjs.entry.js

@@ -0,0 +1,114 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-7a477838.js');
+
+/* eslint-disable max-len */
+const avatarPlaceholder = {
+    'avatar-logged-in': {
+        AvatarPlaceholderComponent({ afSvgAriaHidden, afSvgAriaLabelledby }, children) {
+            return (index.h("svg", { width: "32px", height: "32px", viewBox: "0 0 32 32", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": afSvgAriaHidden ? 'true' : 'false', "aria-labelledby": afSvgAriaLabelledby },
+                children,
+                index.h("defs", null,
+                    index.h("polygon", { id: "path-avatar-1", points: "0 0 32 0 32 32 0 32" }),
+                    index.h("polygon", { id: "path-avatar-3", points: "0 0 22.7664777 0 22.7664777 11.9523581 0 11.9523581" })),
+                index.h("g", { id: "Page-1", stroke: "none", "stroke-width": "1", fill: "none", "fill-rule": "evenodd" },
+                    index.h("g", { id: "Artboard", transform: "translate(-281, -653)" },
+                        index.h("g", { id: "Group-9", transform: "translate(281, 653)" },
+                            index.h("g", { id: "Group-3" },
+                                index.h("mask", { id: "mask-avatar-2", fill: "white" },
+                                    index.h("use", { xlinkHref: "#path-avatar-1" })),
+                                index.h("g", { id: "Clip-2" }),
+                                index.h("path", { d: "M32.0002117,15.9999294 C32.0002117,24.8361768 24.8366065,32.0002822 16.0001058,32.0002822 C7.16360517,32.0002822 0,24.8361768 0,15.9999294 C0,7.16368206 7.16360517,-0.000423327086 16.0001058,-0.000423327086 C24.8366065,-0.000423327086 32.0002117,7.16368206 32.0002117,15.9999294", id: "Fill-1", mask: "url(#mask-avatar-2)" })),
+                            index.h("path", { d: "M9.6578493,11.5102635 C9.6578493,15.2821078 12.5704231,18.3399405 16.1624564,18.3399405 C19.7551953,18.3399405 22.6677691,15.2821078 22.6677691,11.5102635 C22.6677691,7.73841914 19.7551953,4.68058648 16.1624564,4.68058648 C12.5704231,4.68058648 9.6578493,7.73841914 9.6578493,11.5102635", id: "Fill-4", fill: "currentColor" }),
+                            index.h("g", { id: "Group-8", transform: "translate(4.7794, 20.0476)" },
+                                index.h("mask", { id: "mask-avatar-4", fill: "white" },
+                                    index.h("use", { xlinkHref: "#path-avatar-3" })),
+                                index.h("g", { id: "Clip-7" }),
+                                index.h("path", { d: "M17.8881988,0 L15.1125046,0 C12.7911945,1.11758351 10.0641844,1.16062176 7.65467867,0 L4.87827895,0 C2.18372481,0 0,2.29372726 0,5.12225774 L0,7.35460258 C2.88787905,10.197244 6.84821746,11.9526403 11.220606,11.9526403 C15.7602136,11.9526403 19.8546094,10.0589571 22.7664777,7.02229082 L22.7664777,5.12225774 C22.7664777,2.29372726 20.5827529,0 17.8881988,0", id: "Fill-6", fill: "currentColor", mask: "url(#mask-avatar-4)" })))))));
+        }
+    },
+    'avatar-logged-out': {
+        AvatarPlaceholderComponent({ afSvgAriaHidden, afSvgAriaLabelledby }, children) {
+            return (index.h("svg", { width: "32px", height: "32px", viewBox: "0 0 32 32", xmlns: "http://www.w3.org/2000/svg", "aria-hidden": afSvgAriaHidden ? 'true' : 'false', "aria-labelledby": afSvgAriaLabelledby },
+                children,
+                index.h("defs", null,
+                    index.h("polygon", { id: "path-avatar-1", points: "0 0 32 0 32 32 0 32" }),
+                    index.h("polygon", { id: "path-avatar-3", points: "0 0 22.7664777 0 22.7664777 11.9523581 0 11.9523581" })),
+                index.h("g", { id: "Page-1", stroke: "none", "stroke-width": "1", fill: "none", "fill-rule": "evenodd" },
+                    index.h("g", { id: "Artboard", transform: "translate(-491, -742)" },
+                        index.h("g", { id: "Group-9", transform: "translate(491, 742)" },
+                            index.h("g", { id: "Group-3" },
+                                index.h("mask", { id: "mask-avatar-2", fill: "white" },
+                                    index.h("use", { xlinkHref: "#path-avatar-1" })),
+                                index.h("g", { id: "Clip-2" })),
+                            index.h("path", { d: "M9.6578493,11.5102635 C9.6578493,15.2821078 12.5704231,18.3399405 16.1624564,18.3399405 C19.7551953,18.3399405 22.6677691,15.2821078 22.6677691,11.5102635 C22.6677691,7.73841914 19.7551953,4.68058648 16.1624564,4.68058648 C12.5704231,4.68058648 9.6578493,7.73841914 9.6578493,11.5102635", id: "Fill-4", fill: "currentColor" }),
+                            index.h("g", { id: "Group-8", transform: "translate(4.7794, 20.0476)" },
+                                index.h("mask", { id: "mask-avatar-4", fill: "white" },
+                                    index.h("use", { xlinkHref: "#path-avatar-3" })),
+                                index.h("g", { id: "Clip-7" }),
+                                index.h("path", { d: "M17.8881988,0 L15.1125046,0 C12.7911945,1.11758351 10.0641844,1.16062176 7.65467867,0 L4.87827895,0 C2.18372481,0 0,2.29372726 0,5.12225774 L0,7.35460258 C2.88787905,10.197244 6.84821746,11.9526403 11.220606,11.9526403 C15.7602136,11.9526403 19.8546094,10.0589571 22.7664777,7.02229082 L22.7664777,5.12225774 C22.7664777,2.29372726 20.5827529,0 17.8881988,0", id: "Fill-6", fill: "currentColor", mask: "url(#mask-avatar-4)" })))))));
+        }
+    }
+};
+
+const headerAvatarCss = ".sc-digi-header-avatar:root{--digi--grayscale--0:#ffffff;--digi--grayscale--50:#fbfbfb;--digi--grayscale--100:#f4f4f4;--digi--grayscale--200:#ededed;--digi--grayscale--300:#e4e4e4;--digi--grayscale--400:#dddddd;--digi--grayscale--500:#cacaca;--digi--grayscale--600:#acacac;--digi--grayscale--700:#757575;--digi--grayscale--800:#5c5c5c;--digi--grayscale--900:#333333;--digi--grayscale--1000:#000000;--digi--sentiment--informative--200:#e9e9ff;--digi--sentiment--informative--500:#0A4DD1;--digi--sentiment--informative--700:#0058a3;--digi--sentiment--error--200:#fdeded;--digi--sentiment--error--500:#da0000;--digi--sentiment--error--700:#c7311a;--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--misc--transparent:#ffffff00;--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:.3s;--digi--global--animation--duration--short:.2s;--digi--global--animation--duration--shorter:.1s;--digi--global--animation--duration--shortest:.01s;--digi--global--animation--duration--long:.4s;--digi--global--animation--duration--longer:.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--logotype-color:var(--digi--color--logotype-color--light);--digi--color--infographic--lineart:var(--digi--color--infographic--lineart--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--secondary:var(--digi--color--infographic--brand--secondary--light);--digi--color--infographic--brand--tertiary:var(--digi--color--infographic--brand--tertiary--light);--digi--color--text--primary:var(--digi--color--text--primary--light);--digi--color--text--secondary:var(--digi--color--text--secondary--light);--digi--color--text--description:var(--digi--color--text--description--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--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--visited:var(--digi--color--text--interactive--visited--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-muted:var(--digi--color--background--secondary-muted--light);--digi--color--background--secondary-accent:var(--digi--color--background--secondary-accent--light);--digi--color--background--pop-out:var(--digi--color--background--pop-out--light);--digi--color--background--brand-primary:var(--digi--color--background--brand-primary--light);--digi--color--background--transparent:var(--digi--color--background--transparent--light);--digi--color--background--notification:var(--digi--color--background--notification--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--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--default--quaternary:var(--digi--color--background--interactive--default--quaternary--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--hover--primary:var(--digi--color--background--interactive--hover--primary--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--hover--quarternary:var(--digi--color--background--interactive--hover--quarternary--light);--digi--color--background--interactive--hover--inverted:var(--digi--color--background--interactive--hover--inverted--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--selected--on-menu-minus-button:var(--digi--color--background--interactive--selected--on-menu-minus-button--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--interactive--validation--error:var(--digi--color--background--interactive--validation--error--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--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--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--sentiment--warning--quarternary:var(--digi--color--background--sentiment--warning--quarternary--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--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--border--notification:var(--digi--color--border--notification--light);--digi--color--border--transparent:var(--digi--color--border--transparent--light);--digi--color--border--interactive--default--primary:var(--digi--color--border--interactive--default--primary--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--inverted:var(--digi--color--border--interactive--default--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--hover--inverted:var(--digi--color--border--interactive--hover--inverted--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--interactive--validation--error:var(--digi--color--border--interactive--validation--error--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--sentiment--error:var(--digi--color--border--sentiment--error--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--sentiment--info:var(--digi--color--border--sentiment--info--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--marking--navigation--selected:var(--digi--color--marking--navigation--selected--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--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--divider--primary:var(--digi--color--divider--primary--light);--digi--color--divider--secondary:var(--digi--color--divider--secondary--light);--digi--color--divider--on-brand-primary:var(--digi--color--divider--on-brand-primary--light);--digi--color--divider--cta:var(--digi--color--divider--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--cta:var(--digi--color--icon--cta--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--validation--success:var(--digi--color--icon--validation--success--light);--digi--color--icon--validation--warning:var(--digi--color--icon--validation--warning--light);--digi--color--icon--validation--error:var(--digi--color--icon--validation--error--light);--digi--color--misc--spinner-path:var(--digi--color--misc--spinner-path--light);--digi--color--misc--skeleton:var(--digi--color--misc--skeleton--light);--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--logotype-color--light:var(--digi--granskott--700);--digi--color--infographic--lineart--light:var(--digi--grayscale--900);--digi--color--infographic--background--light:var(--digi--grayscale--0);--digi--color--infographic--brand--primary--light:var(--digi--granskott--700);--digi--color--infographic--brand--secondary--light:var(--digi--granskott--250);--digi--color--infographic--brand--tertiary--light:var(--digi--rallarros--500);--digi--color--text--primary--light:var(--digi--grayscale--900);--digi--color--text--secondary--light:var(--digi--grayscale--0);--digi--color--text--description--light:var(--digi--grayscale--800);--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--brand-primary--light:var(--digi--natthimmel--800);--digi--color--text--interactive--brand-secondary--light:var(--digi--norrsken--500);--digi--color--text--interactive--visited--light:var(--digi--amethyst--500);--digi--color--background--primary--light:var(--digi--grayscale--0);--digi--color--background--secondary--light:var(--digi--grayscale--100);--digi--color--background--secondary-muted--light:var(--digi--grayscale--50);--digi--color--background--secondary-accent--light:var(--digi--grayscale--400);--digi--color--background--pop-out--light:var(--digi--granskott--200);--digi--color--background--brand-primary--light:var(--digi--natthimmel--800);--digi--color--background--transparent--light:var(--digi--misc--transparent);--digi--color--background--notification--light:var(--digi--sentiment--error--500);--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--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--default--quaternary--light:var(--digi--grayscale--100);--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--hover--primary--light:var(--digi--natthimmel--700);--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--hover--quarternary--light:var(--digi--grayscale--200);--digi--color--background--interactive--hover--inverted--light:var(--digi--norrsken--400);--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--selected--on-menu-minus-button--light:var(--digi--granskott--250);--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--interactive--validation--error--light:var(--digi--sentiment--error--200);--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--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--secondary--light:var(--digi--sentiment--warning--700);--digi--color--background--sentiment--warning--tertiary--light:var(--digi--sentiment--warning--200);--digi--color--background--sentiment--warning--quarternary--light:var(--digi--sentiment--warning--50);--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--beta--primary--light:var(--digi--rallarros--500);--digi--color--background--sentiment--beta--secondary--light:var(--digi--rallarros--300);--digi--color--border--notification--light:var(--digi--grayscale--0);--digi--color--border--transparent--light:var(--digi--misc--transparent);--digi--color--border--interactive--default--primary--light:var(--digi--natthimmel--800);--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--inverted--light:var(--digi--norrsken--500);--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--hover--inverted--light:var(--digi--norrsken--400);--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--interactive--validation--error--light:var(--digi--sentiment--error--500);--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--sentiment--error--light:var(--digi--sentiment--error--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--sentiment--info--light:var(--digi--sentiment--informative--500);--digi--color--border--accent--primary--light:var(--digi--natthimmel--800);--digi--color--border--accent--secondary--light:var(--digi--granskott--700);--digi--color--marking--navigation--selected--light:var(--digi--granskott--700);--digi--color--marking--navigation--level-active--light:var(--digi--granskott--250);--digi--color--marking--navigation--level-inactive--light:var(--digi--grayscale--100);--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--divider--primary--light:var(--digi--grayscale--400);--digi--color--divider--secondary--light:var(--digi--grayscale--200);--digi--color--divider--on-brand-primary--light:var(--digi--natthimmel--350);--digi--color--divider--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--cta--light:var(--digi--sapphire--500);--digi--color--icon--brand-primary--light:var(--digi--natthimmel--800);--digi--color--icon--brand-secondary--light:var(--digi--granskott--700);--digi--color--icon--validation--success--light:var(--digi--sentiment--success--500);--digi--color--icon--validation--warning--light:var(--digi--sentiment--warning--500);--digi--color--icon--validation--error--light:var(--digi--sentiment--error--500);--digi--color--misc--spinner-path--light:var(--digi--grayscale--400);--digi--color--misc--skeleton--light:var(--digi--grayscale--400);--digi--color--amber--200:#fff398;--digi--color--amber--50:#fffbdd;--digi--color--amber--500:#ffe200;--digi--color--amber--700:#ffc108;--digi--color--amber--900:#664d00;--digi--color--amethyst--500:#822998;--digi--color--forest--200:#e9f6ec;--digi--color--forest--500:#009322;--digi--color--forest--700:#02703c;--digi--color--indigo--200:#e9e9ff;--digi--color--indigo--500:#0000ff;--digi--color--indigo--700:#0058a3;--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--moon--0:#ffffff;--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--ruby--200:#fdeded;--digi--color--ruby--500:#da0000;--digi--color--ruby--700:#c7311a;--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--logotype-color--light--af18:var(--digi--color--leaf--500);--digi--color--infographic--lineart--light--af18:var(--digi--grayscale--900);--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--secondary--light--af18:var(--digi--color--leaf--200);--digi--color--infographic--brand--tertiary--light--af18:var(--digi--color--rose--500);--digi--color--text--primary--light--af18:var(--digi--grayscale--900);--digi--color--text--secondary--light--af18:var(--digi--grayscale--0);--digi--color--text--description--light--af18:var(--digi--grayscale--800);--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--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--visited--light--af18:var(--digi--color--amethyst--500);--digi--color--background--primary--light--af18:var(--digi--grayscale--0);--digi--color--background--secondary--light--af18:var(--digi--grayscale--100);--digi--color--background--secondary-muted--light--af18:var(--digi--grayscale--50);--digi--color--background--secondary-accent--light--af18:var(--digi--grayscale--400);--digi--color--background--pop-out--light--af18:var(--digi--color--leaf--100);--digi--color--background--brand-primary--light--af18:var(--digi--color--stratos--500);--digi--color--background--transparent--light--af18:var(--digi--misc--transparent);--digi--color--background--notification--light--af18:var(--digi--sentiment--error--500);--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--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--default--quaternary--light--af18:var(--digi--grayscale--100);--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--hover--primary--light--af18:var(--digi--color--water--700);--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--hover--quarternary--light--af18:var(--digi--grayscale--200);--digi--color--background--interactive--hover--inverted--light--af18:var(--digi--color--pear--500);--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--selected--on-menu-minus-button--light--af18:var(--digi--color--leaf--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--interactive--validation--error--light--af18:var(--digi--sentiment--error--200);--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--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--secondary--light--af18:var(--digi--sentiment--warning--700);--digi--color--background--sentiment--warning--tertiary--light--af18:var(--digi--sentiment--warning--200);--digi--color--background--sentiment--warning--quarternary--light--af18:var(--digi--sentiment--warning--50);--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--beta--primary--light--af18:var(--digi--color--rose--500);--digi--color--background--sentiment--beta--secondary--light--af18:var(--digi--color--rose--100);--digi--color--border--notification--light--af18:var(--digi--grayscale--0);--digi--color--border--transparent--light--af18:var(--digi--misc--transparent);--digi--color--border--interactive--default--primary--light--af18:var(--digi--color--stratos--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--inverted--light--af18:var(--digi--color--leaf--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--hover--inverted--light--af18:var(--digi--color--pear--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--interactive--validation--error--light--af18:var(--digi--sentiment--error--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--sentiment--error--light--af18:var(--digi--sentiment--error--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--sentiment--info--light--af18:var(--digi--sentiment--informative--500);--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--marking--navigation--selected--light--af18:var(--digi--color--leaf--500);--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--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--divider--primary--light--af18:var(--digi--grayscale--400);--digi--color--divider--secondary--light--af18:var(--digi--grayscale--200);--digi--color--divider--on-brand-primary--light--af18:var(--digi--color--stratos--400);--digi--color--divider--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--cta--light--af18:var(--digi--color--sapphire--500);--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--validation--success--light--af18:var(--digi--sentiment--success--500);--digi--color--icon--validation--warning--light--af18:var(--digi--sentiment--warning--500);--digi--color--icon--validation--error--light--af18:var(--digi--sentiment--error--500);--digi--color--misc--spinner-path--light--af18:var(--digi--grayscale--400);--digi--color--misc--skeleton--light--af18:var(--digi--grayscale--400)}body.sc-digi-header-avatar{font-size:1rem;font-family:\"Open Sans\", Arial, sans-serif}.sc-digi-header-avatar-h{--digi--header-avatar--margin:var(--digi--gutter--medium);--digi--header-avatar--font-family:var(--digi--global--typography--font-family--default);--digi--header-avatar--font-size:var(--digi--typography--label--font-size--desktop);--digi--header-avatar--line-height:var(--digi--typography--label--line-height--desktop);--digi--header-avatar--color:var(--digi--color--icon--primary);--digi--header-avatar-icon--color:var(--digi--color--icon--primary);--digi--header-avatar-icon--background-color:var(--digi--color--background--interactive--default--tertiary);--digi--header-avatar-icon-active--color:var(--digi--color--icon--brand-primary);display:block}.sc-digi-header-avatar-h .digi-header-avatar.sc-digi-header-avatar{display:flex;align-items:center;font-family:var(--digi--header-avatar--font-family);color:var(--digi--header-avatar--color);font-weight:var(--digi--typography--title-logo--font-weight--desktop);font-size:var(--digi--header--font-size)}.sc-digi-header-avatar-h .digi-header-avatar__icon.sc-digi-header-avatar{height:2rem;width:2rem;display:flex;align-items:center;flex-grow:1;background:var(--digi--header-avatar-icon--background-color);border-radius:50%}.sc-digi-header-avatar-h .digi-header-avatar__icon-logged-in.sc-digi-header-avatar{color:var(--digi--header-avatar-icon-active--color)}.sc-digi-header-avatar-h .digi-header-avatar__icon-logged-out.sc-digi-header-avatar{color:var(--digi--header-avatar-icon--color)}.sc-digi-header-avatar-h .digi-header-avatar__image.sc-digi-header-avatar{display:block;height:32px}.sc-digi-header-avatar-h .digi-header-avatar__image.sc-digi-header-avatar *.sc-digi-header-avatar img.sc-digi-header-avatar{border-radius:100%}.sc-digi-header-avatar-h .digi-header-avatar__placeholder.sc-digi-header-avatar{background:#ddd;border-radius:100%;height:32px;width:32px;display:flex;justify-content:center;margin-left:var(--digi--header-avatar--margin)}.sc-digi-header-avatar-h .digi-header-avatar__name.sc-digi-header-avatar,.sc-digi-header-avatar-h .digi-header-avatar__signature.sc-digi-header-avatar{margin-left:var(--digi--header-avatar--margin)}.sc-digi-header-avatar-h.sc-digi-header-avatar-s>*,.sc-digi-header-avatar-h .sc-digi-header-avatar-s>*{margin-left:var(--digi--header-avatar--margin)}.sc-digi-header-avatar-s img{border-radius:100%}";
+const DigiHeaderAvatarStyle0 = headerAvatarCss;
+
+const NavigationAvatar = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.currentAvatar = undefined;
+        this.afIsLoggedIn = true;
+        this.afSrc = undefined;
+        this.afAlt = undefined;
+        this.afShowPlaceholderImage = undefined;
+        this.afHideImage = false;
+        this.afName = undefined;
+        this.afHideName = false;
+        this.afSignature = undefined;
+        this.afHideSignature = false;
+        this.afUserPlacerholder = 'Inloggad';
+        this.afPlacerholderTitle = '';
+        this.afHideUser = false;
+    }
+    setCurrentLoginName() {
+        if (!this.afHideName && !this.afHideSignature) {
+            return this.afName + ' (' + this.afSignature + ')';
+        }
+        if (!this.afHideSignature) {
+            return this.afSignature;
+        }
+        if (!this.afHideName) {
+            return this.afName;
+        }
+        if (this.afHideUser) {
+            return this.afUserPlacerholder;
+        }
+    }
+    setAvatarPlaceholder(name) {
+        const { AvatarPlaceholderComponent } = avatarPlaceholder[name];
+        this.currentAvatar = AvatarPlaceholderComponent;
+    }
+    componentWillLoad() {
+        this.getAvatar();
+    }
+    getAvatar() {
+        if (this.afIsLoggedIn) {
+            return this.setAvatarPlaceholder('avatar-logged-in');
+        }
+        else {
+            return this.setAvatarPlaceholder('avatar-logged-out');
+        }
+    }
+    render() {
+        if (this.afShowPlaceholderImage) {
+            this.afHideImage = true;
+        }
+        return (index.h("div", { key: 'e785008079cbd298ffda407e3b599366d0f83378', class: "digi-header-avatar" }, !this.afHideImage && this.afIsLoggedIn && (index.h("digi-media-image", { key: '939c020a8088dda91b48ea6f89d7d198f5a4a04c', class: 'digi-header-avatar__image', "af-height": "32", "af-width": "32", afUnlazy: true, "af-src": this.afSrc, afAlt: this.afAlt })), this.afShowPlaceholderImage && this.afIsLoggedIn && (index.h("span", { key: '2a7125b788f0dd37e68a7890f1c085a9a1281e61', class: "digi-header-avatar__icon digi-header-avatar__icon-logged-in" }, index.h(this.currentAvatar, { key: '59c71e72afca5ad20e92f227954a73f4f85b1654' }, index.h("title", { key: '4b72ca4da3763f0caaeb540167a2083803ab566e' }, this.afPlacerholderTitle)))), this.afIsLoggedIn && (index.h("span", { key: 'fd4bf4fc6255ddcdf979817cf3d525677f713dff', class: "digi-header-avatar__name" }, this.setCurrentLoginName())), !this.afIsLoggedIn && (index.h("span", { key: '6df19381bdd1a4427b8cd9eda2c20dd53cf3fbad', class: "digi-header-avatar__icon digi-header-avatar__icon-logged-out" }, index.h(this.currentAvatar, { key: '72ae8043ae5a24ee2ba067ed614fcbc330fc1fc8' }, index.h("title", { key: '8a879f424b9d7094987b95830a286a4c1423b04b' }, this.afPlacerholderTitle)))), !this.afIsLoggedIn && index.h("slot", { key: 'c51939b2285596e2efde303540a1ce9ade57c201' })));
+    }
+};
+NavigationAvatar.style = DigiHeaderAvatarStyle0;
+
+exports.digi_header_avatar = NavigationAvatar;

package/dist/cjs/digi-header-navigation-item.cjs.entry.js

@@ -0,0 +1,27 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const index = require('./index-7a477838.js');
+
+const headerNavigationItemCss = ".sc-digi-header-navigation-item-h{--digi--header-navigation-item--font-family:var(--digi--global--typography--font-family--default);--digi--header-navigation-item--font-size:var(--digi--typography--body--font-size--desktop);--digi--header-navigation-item--color:var(--digi--color--text--interactive--tertiary);--digi--header-navigation-item--color-hover:var(--digi--color--text--interactive--primary);--digi--header-navigation-item--color-active:var(--digi--color--text--interactive--primary);--digi--header-navigation-item-indicator--inactive--color:var(--digi--color--background--secondary-muted);--digi--header-navigation-item-indicator--inactive-hover--color:var(--digi--color--background--interactive--hover--quarternary);--digi--header-navigation-item-indicator--active--color:var(--digi--color--marking--navigation--selected);display:block;--INDICATOR-COLOR:var(--digi--header-navigation-item-indicator--inactive--color)}.sc-digi-header-navigation-item-h.sc-digi-header-navigation-item-s>a,.sc-digi-header-navigation-item-h .sc-digi-header-navigation-item-s>a{display:block;text-decoration:none;padding:var(--digi--padding--medium);color:var(--digi--header-navigation-item--color);font-family:var(--digi--header-navigation-item--font-family);font-size:var(--digi--header-navigation-item--font-size)}.sc-digi-header-navigation-item-h.sc-digi-header-navigation-item-s>a,.sc-digi-header-navigation-item-h.sc-digi-header-navigation-item-s>a:hover,.sc-digi-header-navigation-item-h .sc-digi-header-navigation-item-s>a:hover,.sc-digi-header-navigation-item-h.sc-digi-header-navigation-item-s>a:active,.sc-digi-header-navigation-item-h .sc-digi-header-navigation-item-s>a:active,.sc-digi-header-navigation-item-h.sc-digi-header-navigation-item-s>a:focus-visible,.sc-digi-header-navigation-item-h .sc-digi-header-navigation-item-s>a:focus-visible{background-color:var(--digi--header-navigation-item-indicator--inactive-hover--color);color:var(--digi--header-navigation-item--color-hover);text-decoration:underline}.sc-digi-header-navigation-item-h.sc-digi-header-navigation-item-s>a,.sc-digi-header-navigation-item-h.sc-digi-header-navigation-item-s>a:hover,.sc-digi-header-navigation-item-h.sc-digi-header-navigation-item-s>a:hover+.digi-header-navigation-item-indicator,.sc-digi-header-navigation-item-h .sc-digi-header-navigation-item-s>a:hover+.digi-header-navigation-item-indicator{--INDICATOR-COLOR:var(--digi--header-navigation-item-indicator--inactive-hover--color)}.sc-digi-header-navigation-item-h.sc-digi-header-navigation-item-s>a,.sc-digi-header-navigation-item-h.sc-digi-header-navigation-item-s>a:hover,.sc-digi-header-navigation-item-h.sc-digi-header-navigation-item-s>a:hover+.digi-header-navigation-item-indicator,.sc-digi-header-navigation-item-h.sc-digi-header-navigation-item-s>a:hover+.digi-header-navigation-item-indicator--active,.sc-digi-header-navigation-item-h .sc-digi-header-navigation-item-s>a:hover+.digi-header-navigation-item-indicator--active{--INDICATOR-COLOR:var(--digi--header-navigation-item-indicator--active--color)}.sc-digi-header-navigation-item-h.sc-digi-header-navigation-item-s>a,.sc-digi-header-navigation-item-h.sc-digi-header-navigation-item-s>a:focus-visible,.sc-digi-header-navigation-item-h .sc-digi-header-navigation-item-s>a:focus-visible{outline:2px solid black;outline-offset:-3px;box-shadow:0px 0px 0px 5px inset white}.digi-header-navigation-item-indicator.sc-digi-header-navigation-item{height:0.25rem;width:100%;background-color:var(--INDICATOR-COLOR)}.digi-header-navigation-item-indicator--active.sc-digi-header-navigation-item{--INDICATOR-COLOR:var(--digi--header-navigation-item-indicator--active--color)}.digi-header-navigation-item--active.sc-digi-header-navigation-item-s>a,.digi-header-navigation-item--active .sc-digi-header-navigation-item-s>a{font-weight:bold}";
+const DigiHeaderNavigationItemStyle0 = headerNavigationItemCss;
+
+const HeaderNavigationItem = class {
+    constructor(hostRef) {
+        index.registerInstance(this, hostRef);
+        this.afCurrentPage = undefined;
+    }
+    get cssModifiers() {
+        return {
+            'digi-header-navigation-item--active': this.afCurrentPage,
+            'digi-header-navigation-item-indicator--active': this.afCurrentPage
+        };
+    }
+    render() {
+        return (index.h("div", { key: 'a9b07c72415ec9c8e046dddcd62c4f1ad97ef31e', role: "listitem", class: Object.assign({ 'digi-header-navigation-item': true }, this.cssModifiers) }, index.h("slot", { key: '4d9a0d5fb5c9f572a736e0588e86aa96bf5708a4' }), index.h("div", { key: '796c3fe0b1cd55e9ee49b4ae2c4034ce8c58f791', class: Object.assign({ 'digi-header-navigation-item-indicator': true }, this.cssModifiers) })));
+    }
+};
+HeaderNavigationItem.style = DigiHeaderNavigationItemStyle0;
+
+exports.digi_header_navigation_item = HeaderNavigationItem;