@designsystem-se/af 39.1.0-beta.2 → 39.2.0

package/dist/collection/components/_progress/progress-list/progress-list.js

@@ -13,44 +13,14 @@ import { logger } from "../../../global/utils/logger";
  */
 export class ProgressList {
     constructor() {
-        /**
-         * Sätter rubriknivå på varje förloppsteg. 'h2' är förvalt.
-         * @en Set heading level. Default is 'h2'
-         */
+        this.afHeading = undefined;
+        this.afAriaLabel = undefined;
         this.afHeadingLevel = ProgressListHeadingLevel.H2;
-        /**
-         * Sätter variant. Kan vara 'Primary', 'Secondary' eller 'Tertiary'
-         * @en Set variation. Can be 'Primary', 'Secondary' or 'Tertiary'
-         */
         this.afVariation = ProgressListVariation.PRIMARY;
-        /**
-         * Sätter typ. Kan vara 'Circle' eller 'Icon'
-         * @en Set type. Can be 'Circle' or 'Icon'
-         */
         this.afType = ProgressListType.CIRCLE;
-        /**
-         * Sätter läge på Rubriken om den ska vara expanderad eller ej. Förvalt är false.
-         * @en Sets the state of the Header item to expanded or not. Default is false.
-         */
         this.afExpandable = false;
-        /**
-         * Sätter texten som visas på knappen som expanderar komponenten, t.ex: 'Visa mer'.
-         * Förvalt är endast ikon och detta fält är tomt.
-         * @en Sets the text displayed on the button that expands the component, eg. 'Show more'.
-         * Default is icon only and this field is empty.
-         */
         this.afExpandText = '';
-        /**
-         * Sätter texten som visas på knappen som minimerar komponenten, t.ex: 'Visa mindre'.
-         * Förvalt är endast ikon och detta fält är tomt.
-         * @en Sets the text displayed on the button that expands the component, eg: 'Show less'.
-         * Default is icon only and this field is empty.
-         */
         this.afCollapseText = '';
-        /**
-         * Sätter nuvarande steg
-         * @en Set current steps
-         */
         this.afCurrentStep = 1;
         this.steps = [];
     }
@@ -136,7 +106,7 @@ export class ProgressList {
         return null;
     }
     render() {
-        return (h("div", { key: '406686fee46095e3dfded5708663645520cbe6b6', class: "digi-progress-list" }, h("digi-typography", { key: 'c7bccebe73101cebb67e63bc3a395956826e1121' }, this.renderHeading(), h("ol", { key: 'e220571ae4caa2a88915f97fcf85316eed0f428c', class: "digi-progress-list__content" }, h("slot", { key: 'a0332f44b8f5cf00f5ac74d321e3bb18902f70fd' })))));
+        return (h("div", { key: '0db50446c5044f0cd9cb2dec3d5d0ba38ed084c9', class: "digi-progress-list" }, h("digi-typography", { key: '62ed9eb55a6d07c176fc563b3446ca9451a6e40d' }, this.renderHeading(), h("ol", { key: '641f26a87b06196d6f08769be3a6e6bd6a530fa1', class: "digi-progress-list__content" }, h("slot", { key: 'f41cb5b7a6172ea48641c2c176b1b487e5ccc57b' })))));
     }
     static get is() { return "digi-progress-list"; }
     static get encapsulation() { return "scoped"; }
@@ -171,8 +141,8 @@ export class ProgressList {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
-                "attribute": "af-heading"
+                "attribute": "af-heading",
+                "reflect": false
             },
             "afAriaLabel": {
                 "type": "string",
@@ -193,8 +163,8 @@ export class ProgressList {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
-                "attribute": "af-aria-label"
+                "attribute": "af-aria-label",
+                "reflect": false
             },
             "afHeadingLevel": {
                 "type": "string",
@@ -206,8 +176,7 @@ export class ProgressList {
                         "ProgressListHeadingLevel": {
                             "location": "import",
                             "path": "./progress-list-heading-level.enum",
-                            "id": "src/components/_progress/progress-list/progress-list-heading-level.enum.ts::ProgressListHeadingLevel",
-                            "referenceLocation": "ProgressListHeadingLevel"
+                            "id": "src/components/_progress/progress-list/progress-list-heading-level.enum.ts::ProgressListHeadingLevel"
                         }
                     }
                 },
@@ -222,8 +191,8 @@ export class ProgressList {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
                 "attribute": "af-heading-level",
+                "reflect": false,
                 "defaultValue": "ProgressListHeadingLevel.H2"
             },
             "afVariation": {
@@ -236,8 +205,7 @@ export class ProgressList {
                         "ProgressListVariation": {
                             "location": "import",
                             "path": "./progress-list-variation.enum",
-                            "id": "src/components/_progress/progress-list/progress-list-variation.enum.ts::ProgressListVariation",
-                            "referenceLocation": "ProgressListVariation"
+                            "id": "src/components/_progress/progress-list/progress-list-variation.enum.ts::ProgressListVariation"
                         }
                     }
                 },
@@ -252,8 +220,8 @@ export class ProgressList {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
                 "attribute": "af-variation",
+                "reflect": false,
                 "defaultValue": "ProgressListVariation.PRIMARY"
             },
             "afType": {
@@ -266,8 +234,7 @@ export class ProgressList {
                         "ProgressListType": {
                             "location": "import",
                             "path": "./progress-list-type.enum",
-                            "id": "src/components/_progress/progress-list/progress-list-type.enum.ts::ProgressListType",
-                            "referenceLocation": "ProgressListType"
+                            "id": "src/components/_progress/progress-list/progress-list-type.enum.ts::ProgressListType"
                         }
                     }
                 },
@@ -282,8 +249,8 @@ export class ProgressList {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
                 "attribute": "af-type",
+                "reflect": false,
                 "defaultValue": "ProgressListType.CIRCLE"
             },
             "afExpandable": {
@@ -305,8 +272,8 @@ export class ProgressList {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
                 "attribute": "af-expandable",
+                "reflect": false,
                 "defaultValue": "false"
             },
             "afExpandText": {
@@ -328,8 +295,8 @@ export class ProgressList {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
                 "attribute": "af-expand-text",
+                "reflect": false,
                 "defaultValue": "''"
             },
             "afCollapseText": {
@@ -351,8 +318,8 @@ export class ProgressList {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
                 "attribute": "af-collapse-text",
+                "reflect": false,
                 "defaultValue": "''"
             },
             "afCurrentStep": {
@@ -374,8 +341,8 @@ export class ProgressList {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
                 "attribute": "af-current-step",
+                "reflect": false,
                 "defaultValue": "1"
             }
         };

package/dist/collection/components/_progress/progress-list-item/progress-list-item.js

@@ -13,55 +13,18 @@ import { ProgressListItemType } from "./progress-list-item-type.enum";
  */
 export class ProgressListItem {
     constructor() {
-        /**
-         * Sätter rubriknivå. 'h2' är förvalt.
-         * @en Set heading level. Default is 'h2'
-         */
+        this.afHeading = undefined;
         this.afHeadingLevel = ProgressListItemHeadingLevel.H2;
-        /**
-         * Sätter attributet 'afStepStatus'. Förvalt är 'upcoming'.
-         * @en Set afStepStatus attribute. Defaults to 'upcoming'.
-         */
         this.afStepStatus = ProgressListItemStatus.DONE;
-        /**
-         * Sätter variant. Kan vara 'Primary', 'Secondary' eller 'Tertiary'
-         * @en Set variation. Can be 'Primary', 'Secondary' or 'Tertiary'
-         */
+        this.afStepStatusAriaLabel = undefined;
         this.afVariation = ProgressListItemVariation.PRIMARY;
-        /**
-         * Sätter typ. Kan vara 'Circle' eller 'Icon'
-         * @en Set type. Can be 'Circle' or 'Icon'
-         */
+        this.afAriaLabel = undefined;
         this.afType = ProgressListItemType.CIRCLE;
-        /**
-         * Sätter läge på Rubriken om den tillåts vara expanderad eller ej. Förvalt är false.
-         * @en Sets the state of the Header item to expanded or not. Default is false.
-         */
         this.afExpandable = false;
-        /**
-         * Om Rubriken tillåts att vara expanderarbar så sätts läge på Rubriken om den är expanderad eller ej. Förvalt är false.
-         * @en If the Header is allowed to be expandable, the mode is set to the Header whether it is expanded or not. Default is false.
-         */
         this.afExpanded = false;
-        /**
-         * Sätter texten som visas på knappen som expanderar komponenten. Förvalt är endast ikon och detta fält tomt.
-         * @en Sets text on the expand button. Default is icon only and this field is empty.
-         */
         this.afExpandText = '';
-        /**
-         * Sätter texten som visas på knappen som kollapsar komponenten. Förvalt är endast ikon och detta fält tomt.
-         * @en Sets the text on the button that collapses the component. Default is icon only and this field is empty.
-         */
         this.afCollapseText = '';
-        /**
-         * Sätter attributet 'id'. Om inget väljs så skapas ett slumpmässigt id.
-         * @en Input id attribute. Defaults to random string.
-         */
         this.afId = randomIdGenerator('digi-progress-list-item');
-        /**
-         * Kollar om det är sista steget
-         * @en checks if it is the last step
-         */
         this.afIsLast = false;
     }
     renderExpandAndCollapseText() {
@@ -115,7 +78,7 @@ export class ProgressListItem {
     }
     render() {
         const ariaCurrent = this.afStepStatus == ProgressListItemStatus.CURRENT ? 'step' : 'false';
-        return (h(Host, { key: 'aa239eafab2cc26a1425041e9bdeaf102c0abd48', role: "listitem", "aria-current": ariaCurrent }, h("div", { key: 'd20eb2c04be711843b15ffd291e19db570b0515a', class: {
+        return (h(Host, { key: 'dad1c85bbde1111481f538c8794a77e77c99a28c', role: "listitem", "aria-current": ariaCurrent }, h("div", { key: 'e5c92271ee0514ecf2a7cfe8f31ddc87988e6c75', class: {
                 'digi-progress-list-item': true,
                 'digi-progress-list-item--expanded': this.afExpandable && this.afExpanded,
                 [`digi-progress-list-item--${this.afStepStatus}`]: true,
@@ -123,18 +86,18 @@ export class ProgressListItem {
                 'digi-progress-list-item--primary': this.afVariation == ProgressListItemVariation.PRIMARY,
                 'digi-progress-list-item--secondary': this.afVariation == ProgressListItemVariation.SECONDARY,
                 'digi-progress-list-item--tertiary': this.afVariation == ProgressListItemVariation.TERTIARY
-            } }, h("span", { key: '6c3ff9deb396337d9469ea6b25a9ea5066950a6c', class: "digi-progress-list-item__indicator" }, h("span", { key: '748ea935b68202ef23bb459156309cf5beeb70a3', class: {
+            } }, h("span", { key: '3429bd1b7a48ede98a871105193da301ba9411ff', class: "digi-progress-list-item__indicator" }, h("span", { key: '3078765505309ab62b926fc459c5595964d1b460', class: {
                 'digi-progress-list-item__indicator--circle': this.afType == ProgressListItemType.CIRCLE,
                 'digi-progress-list-item__indicator--icon': this.afType == ProgressListItemType.ICON
-            } }, this.renderStatusIcon()), h("span", { key: 'dc2fd6a585577eac22414d1c616dfca5dfb36b70', class: "digi-progress-list-item__indicator--line" })), h("div", { key: '8507441cdeeed52f7421d476efcf71ba86b6a0b7', class: {
+            } }, this.renderStatusIcon()), h("span", { key: 'aed449cbee77e5d66f4f0dfd3adce45a66d4db19', class: "digi-progress-list-item__indicator--line" })), h("div", { key: 'fdaf63aba491485a777950f9d022350c29873247', class: {
                 'digi-progress-list-item__wrapper': true,
                 'digi-progress-list-item__wrapper--last': this.afIsLast
-            } }, h("div", { key: '03f30cde1ffe67b75f508abc276d1081938a84a6', class: "digi-progress-list-item__header" }, h(this.afHeadingLevel, { key: '5ace432aca3ba5775b73eb0b0123125d818f3c7b', class: "digi-progress-list-item__header--heading", id: `${this.afId}--heading` }, this.renderHeading())), h("div", { key: '38b9a828ae3e5191020e7e1b627e1d7b6092f7cf', class: {
+            } }, h("div", { key: '1156ce5725dcb8cf8d1ae968ae69dfa019bd076b', class: "digi-progress-list-item__header" }, h(this.afHeadingLevel, { key: '544fab1a62041f0c7bbabfd688c4626bc16dea27', class: "digi-progress-list-item__header--heading", id: `${this.afId}--heading` }, this.renderHeading())), h("div", { key: '350efd1958402c564a151199182d12e9931f932e', class: {
                 'digi-progress-list-item__content': true,
                 'digi-progress-list-item__content--expandable': this.afExpandable,
                 'digi-progress-list-item__content--hidden': this.afExpandable && !this.afExpanded,
                 'digi-progress-list-item__content--visible': !this.afExpandable || (this.afExpandable && this.afExpanded)
-            }, id: `${this.afId}-content` }, h("div", { key: 'e1fcc32c794744d5ae75af5be322e08ce3aa99e2' }, h("slot", { key: '180bd0e8eec0461748670acddfc1dad2367c20e3' })))))));
+            }, id: `${this.afId}-content` }, h("div", { key: '90a8a8c4f5c17be2df1657e381d71210f3078ab6' }, h("slot", { key: 'b25be0ea55c84fd9e7615f9b9a08b3702edce91d' })))))));
     }
     static get is() { return "digi-progress-list-item"; }
     static get encapsulation() { return "scoped"; }
@@ -169,8 +132,8 @@ export class ProgressListItem {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
-                "attribute": "af-heading"
+                "attribute": "af-heading",
+                "reflect": false
             },
             "afHeadingLevel": {
                 "type": "string",
@@ -182,8 +145,7 @@ export class ProgressListItem {
                         "ProgressListItemHeadingLevel": {
                             "location": "import",
                             "path": "./progress-list-item-heading-level.enum",
-                            "id": "src/components/_progress/progress-list-item/progress-list-item-heading-level.enum.ts::ProgressListItemHeadingLevel",
-                            "referenceLocation": "ProgressListItemHeadingLevel"
+                            "id": "src/components/_progress/progress-list-item/progress-list-item-heading-level.enum.ts::ProgressListItemHeadingLevel"
                         }
                     }
                 },
@@ -198,8 +160,8 @@ export class ProgressListItem {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
                 "attribute": "af-heading-level",
+                "reflect": false,
                 "defaultValue": "ProgressListItemHeadingLevel.H2"
             },
             "afStepStatus": {
@@ -212,8 +174,7 @@ export class ProgressListItem {
                         "ProgressListItemStatus": {
                             "location": "import",
                             "path": "./progress-list-item-status.enum",
-                            "id": "src/components/_progress/progress-list-item/progress-list-item-status.enum.ts::ProgressListItemStatus",
-                            "referenceLocation": "ProgressListItemStatus"
+                            "id": "src/components/_progress/progress-list-item/progress-list-item-status.enum.ts::ProgressListItemStatus"
                         }
                     }
                 },
@@ -228,8 +189,8 @@ export class ProgressListItem {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
                 "attribute": "af-step-status",
+                "reflect": false,
                 "defaultValue": "ProgressListItemStatus.DONE"
             },
             "afStepStatusAriaLabel": {
@@ -251,8 +212,8 @@ export class ProgressListItem {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
-                "attribute": "af-step-status-aria-label"
+                "attribute": "af-step-status-aria-label",
+                "reflect": false
             },
             "afVariation": {
                 "type": "string",
@@ -264,8 +225,7 @@ export class ProgressListItem {
                         "ProgressListItemVariation": {
                             "location": "import",
                             "path": "./progress-list-item-variation.enum",
-                            "id": "src/components/_progress/progress-list-item/progress-list-item-variation.enum.ts::ProgressListItemVariation",
-                            "referenceLocation": "ProgressListItemVariation"
+                            "id": "src/components/_progress/progress-list-item/progress-list-item-variation.enum.ts::ProgressListItemVariation"
                         }
                     }
                 },
@@ -280,8 +240,8 @@ export class ProgressListItem {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
                 "attribute": "af-variation",
+                "reflect": false,
                 "defaultValue": "ProgressListItemVariation.PRIMARY"
             },
             "afAriaLabel": {
@@ -303,8 +263,8 @@ export class ProgressListItem {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
-                "attribute": "af-aria-label"
+                "attribute": "af-aria-label",
+                "reflect": false
             },
             "afType": {
                 "type": "string",
@@ -316,8 +276,7 @@ export class ProgressListItem {
                         "ProgressListItemType": {
                             "location": "import",
                             "path": "./progress-list-item-type.enum",
-                            "id": "src/components/_progress/progress-list-item/progress-list-item-type.enum.ts::ProgressListItemType",
-                            "referenceLocation": "ProgressListItemType"
+                            "id": "src/components/_progress/progress-list-item/progress-list-item-type.enum.ts::ProgressListItemType"
                         }
                     }
                 },
@@ -332,8 +291,8 @@ export class ProgressListItem {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
                 "attribute": "af-type",
+                "reflect": false,
                 "defaultValue": "ProgressListItemType.CIRCLE"
             },
             "afExpandable": {
@@ -355,8 +314,8 @@ export class ProgressListItem {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
                 "attribute": "af-expandable",
+                "reflect": false,
                 "defaultValue": "false"
             },
             "afExpanded": {
@@ -378,8 +337,8 @@ export class ProgressListItem {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
                 "attribute": "af-expanded",
+                "reflect": false,
                 "defaultValue": "false"
             },
             "afExpandText": {
@@ -401,8 +360,8 @@ export class ProgressListItem {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
                 "attribute": "af-expand-text",
+                "reflect": false,
                 "defaultValue": "''"
             },
             "afCollapseText": {
@@ -424,8 +383,8 @@ export class ProgressListItem {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
                 "attribute": "af-collapse-text",
+                "reflect": false,
                 "defaultValue": "''"
             },
             "afId": {
@@ -447,8 +406,8 @@ export class ProgressListItem {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
                 "attribute": "af-id",
+                "reflect": false,
                 "defaultValue": "randomIdGenerator('digi-progress-list-item')"
             },
             "afIsLast": {
@@ -470,8 +429,8 @@ export class ProgressListItem {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
                 "attribute": "af-is-last",
+                "reflect": false,
                 "defaultValue": "false"
             }
         };

package/dist/collection/components/_progress/progressbar/progressbar.js

@@ -13,37 +13,16 @@ import { ProgressbarVariation } from "./progressbar-variation.enum";
  */
 export class Progressbar {
     constructor() {
+        this.completedSteps = undefined;
         this.totalSteps = [];
-        /**
-         * Text emellan antal färdiga och totala antalet steg.
-         * Som standard används "av", men kan ändras för exempelvis annat språk.
-         * @en Separator text between current steps and total steps.
-         * Default is "av", but can be changed e.g. for different language.
-         */
+        this.listItems = undefined;
+        this.hasSlottedItems = undefined;
+        this.afCompletedSteps = undefined;
+        this.afTotalSteps = undefined;
         this.afStepsSeparator = _t.of;
-        /**
-         * Beskrivande text efter siffrorna.
-         * @en Descriptive text after step numbers.
-         */
         this.afStepsLabel = _t.progress.questions_answered.toLowerCase();
-        /**
-         * Sätter attributet 'role'. Förvalt är 'status'.
-         * Använder du komponenten både före och efter ett formulär så
-         * ange bara den ena som 'status' för att undvika att skärmläsare läser upp texten två gånger
-         * @en Set role attribute. Defaults to 'status'.
-         * If you apply the progressbar both before and after a form,
-         * set only role 'status' on one of them to avoid screen readers to read the text twice
-         */
         this.afRole = ProgressbarRole.STATUS;
-        /**
-         * Sätter variant. Kan vara 'primary' och 'secondary'.
-         * @en Set variation of progressbar. Can be 'primary' and 'secondary'.
-         */
         this.afVariation = ProgressbarVariation.PRIMARY;
-        /**
-         * Sätter attributet 'id'. Om inget väljs så skapas ett slumpmässigt id.
-         * @en Input id attribute. Defaults to random string.
-         */
         this.afId = randomIdGenerator('digi-progressbar');
     }
     componentWillLoad() {
@@ -69,14 +48,26 @@ export class Progressbar {
     changeCompletedStepsHandler(value) {
         this.completedSteps = value;
     }
-    getItems() {
-        const items = Array.from(this.hostElement.children).filter((el) => el.tagName.toLowerCase() === 'li');
+    getItems(update) {
+        let items;
+        if (update) {
+            items = this._observer.children;
+        }
+        else {
+            items = this.hostElement.querySelectorAll('.digi-progressbar__slot li');
+        }
         if (items.length > 0) {
             this.hasSlottedItems = true;
-            this.listItems = items.map((element) => ({
-                text: element.textContent,
-                checked: element.matches('.completed')
-            }));
+            this.listItems = [...items]
+                .filter((element) => element.tagName.toLowerCase() === 'li')
+                .map((element) => {
+                const el = element;
+                const checked = el.matches('.completed');
+                return {
+                    text: element.textContent,
+                    checked: checked
+                };
+            });
         }
     }
     get cssModifiers() {
@@ -91,7 +82,7 @@ export class Progressbar {
         return;
     }
     render() {
-        return (h("div", { key: 'a1f3b7ce5d82ac1526466208a6cee21f478a6862', class: this.cssModifiers, role: this.afRole === ProgressbarRole.STATUS ? ProgressbarRole.STATUS : null }, h("p", { key: '349c031dd48ef65aafa72b6503881812223dd979', class: "digi-progressbar__label" }, this.afCompletedSteps, " ", this.afStepsSeparator, " ", this.afTotalSteps, ' ', this.afStepsLabel), !this.hasSlottedItems ? (h("ol", { class: "digi-progressbar__list", "aria-hidden": "true" }, this.totalSteps.map((item, i) => {
+        return (h("div", { key: 'a419e09c4d67c59bfde87377906d635c23b19336', class: this.cssModifiers, role: this.afRole === ProgressbarRole.STATUS ? ProgressbarRole.STATUS : null }, h("p", { key: '2cacb0b2a2dc6cb0fa2e9c28b98bfdfd68011c61', class: "digi-progressbar__label" }, this.afCompletedSteps, " ", this.afStepsSeparator, " ", this.afTotalSteps, ' ', this.afStepsLabel), !this.hasSlottedItems ? (h("ol", { class: "digi-progressbar__list", "aria-hidden": "true" }, this.totalSteps.map((item, i) => {
             return (h("li", { class: {
                     'digi-progressbar__step': true,
                     'digi-progressbar__step--active': this.afCompletedSteps > i,
@@ -102,7 +93,7 @@ export class Progressbar {
                     'digi-progressbar__step': true,
                     'digi-progressbar__step--active': item.checked
                 } }, h("span", { class: "digi-progressbar__step-indicator" }, h("span", { class: "digi-progressbar__step-number" }, index + 1))));
-        }))), h("div", { key: 'f604634ae2cb23e54e9a7a68fc92b183af240847', hidden: true, class: "digi-progressbar__slot" }, h("slot", { key: '9f507fdf8584c5568f2eeec39aa05d8c89ac10fd', onSlotchange: () => this.getItems() }))));
+        }))), h("div", { key: '1c347133f7006bfebc9c2712d666b2bd367baf01', hidden: true, class: "digi-progressbar__slot" }, h("digi-util-mutation-observer", { key: '1e17bed1af9c2492656b2886f1f7bd672934081f', ref: (el) => (this._observer = el), onAfOnChange: () => this.getItems() }, h("slot", { key: 'a16e4b14e11d07e593180e7de6efd0737603a345' })))));
     }
     static get is() { return "digi-progressbar"; }
     static get encapsulation() { return "scoped"; }
@@ -137,8 +128,8 @@ export class Progressbar {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
-                "attribute": "af-completed-steps"
+                "attribute": "af-completed-steps",
+                "reflect": false
             },
             "afTotalSteps": {
                 "type": "number",
@@ -159,8 +150,8 @@ export class Progressbar {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
-                "attribute": "af-total-steps"
+                "attribute": "af-total-steps",
+                "reflect": false
             },
             "afStepsSeparator": {
                 "type": "string",
@@ -181,8 +172,8 @@ export class Progressbar {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
                 "attribute": "af-steps-separator",
+                "reflect": false,
                 "defaultValue": "_t.of"
             },
             "afStepsLabel": {
@@ -204,8 +195,8 @@ export class Progressbar {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
                 "attribute": "af-steps-label",
+                "reflect": false,
                 "defaultValue": "_t.progress.questions_answered.toLowerCase()"
             },
             "afRole": {
@@ -218,8 +209,7 @@ export class Progressbar {
                         "ProgressbarRole": {
                             "location": "import",
                             "path": "./progressbar-role.enum",
-                            "id": "src/components/_progress/progressbar/progressbar-role.enum.ts::ProgressbarRole",
-                            "referenceLocation": "ProgressbarRole"
+                            "id": "src/components/_progress/progressbar/progressbar-role.enum.ts::ProgressbarRole"
                         }
                     }
                 },
@@ -234,8 +224,8 @@ export class Progressbar {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
                 "attribute": "af-role",
+                "reflect": false,
                 "defaultValue": "ProgressbarRole.STATUS"
             },
             "afVariation": {
@@ -248,8 +238,7 @@ export class Progressbar {
                         "ProgressbarVariation": {
                             "location": "import",
                             "path": "./progressbar-variation.enum",
-                            "id": "src/components/_progress/progressbar/progressbar-variation.enum.ts::ProgressbarVariation",
-                            "referenceLocation": "ProgressbarVariation"
+                            "id": "src/components/_progress/progressbar/progressbar-variation.enum.ts::ProgressbarVariation"
                         }
                     }
                 },
@@ -264,8 +253,8 @@ export class Progressbar {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
                 "attribute": "af-variation",
+                "reflect": false,
                 "defaultValue": "ProgressbarVariation.PRIMARY"
             },
             "afId": {
@@ -287,8 +276,8 @@ export class Progressbar {
                 },
                 "getter": false,
                 "setter": false,
-                "reflect": false,
                 "attribute": "af-id",
+                "reflect": false,
                 "defaultValue": "randomIdGenerator('digi-progressbar')"
             }
         };