globuswebcomponents 2.1.8 → 2.2.0

package/dist/collection/components/gb-stepper-horizontal-line-with-text/gb-stepper-horizontal-line-with-text.js

@@ -3,26 +3,36 @@ export class GbStepperHorizontalLineWithText {
     constructor() {
         this.showContent = false;
         this.showSupportingText = false;
-        this.firstStepLabel = '';
-        this.secondStepLabel = '';
-        this.thirdStepLabel = '';
-        this.fourthStepLabel = '';
-        this.fifthStepLabel = '';
-        this.sixthStepLabel = '';
-        this.seventhStepLabel = '';
-        this.firstStepSupportingText = '';
-        this.secondStepSupportingText = '';
-        this.thirdStepSupportingText = '';
-        this.fourthStepSupportingText = '';
-        this.fifthStepSupportingText = '';
-        this.sixthStepSupportingText = '';
-        this.seventhStepSupportingText = '';
+        this.steps = [
+            {
+                state: 'default',
+                status: 'complete',
+                label: 'First Step',
+                supportingText: 'Hiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiii',
+            },
+            {
+                state: 'default',
+                status: 'current',
+                label: 'First Step',
+                supportingText: 'Hiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiii',
+            },
+        ];
+        this.internalSteps = [...this.steps];
         this.width = window.innerWidth;
         this.handleResize = () => {
             this.width = window.innerWidth;
             this.updatePropBasedOnSize();
         };
     }
+    onStepsChanged(newSteps) {
+        // Optional: validate or transform steps
+        this.internalSteps = [...newSteps];
+        const currentStep = newSteps.find(s => s.status === 'current');
+        if (currentStep) {
+            this.internalState = currentStep.state;
+            this.internalStatus = currentStep.status;
+        }
+    }
     componentWillLoad() {
         this.updatePropBasedOnSize();
         window.addEventListener('resize', this.handleResize);
@@ -31,7 +41,7 @@ export class GbStepperHorizontalLineWithText {
         this.showSupportingText = this.width < 768 ? false : true;
     }
     render() {
-        return (h("div", { key: '6c867cadfa6b5d77ae04cf60734cb15337546f0f', class: "text_with_line" }, h("gb-step-base", { key: '35fa9197e20955218eebbf2bcad87d53ce026c7e', size: this.size, type: "text_line", state: this.firstStepState, status: this.firstStepStatus, label: this.firstStepLabel, "supporting-text": this.firstStepSupportingText, "show-content": this.showContent, "show-supporting-text": this.showSupportingText }), h("gb-step-base", { key: '45edd2730f14294b40f4acfd77917b09cf8b765b', size: this.size, type: "text_line", state: this.secondStepState, status: this.secondStepStatus, label: this.secondStepLabel, "supporting-text": this.secondStepSupportingText, "show-content": this.showContent, "show-supporting-text": this.showSupportingText }), this.thirdStepLabel && (h("gb-step-base", { key: '075f47f42d8ee54f215057c3b0d6c21260b8b548', size: this.size, type: "text_line", state: this.thirdStepState, status: this.thirdStepStatus, label: this.thirdStepLabel, "supporting-text": this.thirdStepSupportingText, "show-content": this.showContent, "show-supporting-text": this.showSupportingText })), this.fourthStepLabel && (h("gb-step-base", { key: 'b8c2fccddfeed6c8aaa087c2b08dd22bc29c2cde', size: this.size, type: "text_line", state: this.fourthStepState, status: this.fourthStepStatus, label: this.fourthStepLabel, "supporting-text": this.fourthStepSupportingText, "show-content": this.showContent, "show-supporting-text": this.showSupportingText })), this.fifthStepLabel && (h("gb-step-base", { key: '4007654b8b8bc72098b3c288b88b397eec02e575', size: this.size, type: "text_line", state: this.fifthStepState, status: this.fifthStepStatus, label: this.fifthStepLabel, "supporting-text": this.fifthStepSupportingText, "show-content": this.showContent, "show-supporting-text": this.showSupportingText })), this.sixthStepLabel && (h("gb-step-base", { key: 'c689ef396cb9d9f50d2b6410fe3881b2467783b0', size: this.size, type: "text_line", state: this.sixthStepState, status: this.sixthStepStatus, label: this.sixthStepLabel, "supporting-text": this.sixthStepSupportingText, "show-content": this.showContent, "show-supporting-text": this.showSupportingText })), this.seventhStepLabel && (h("gb-step-base", { key: '91763e3db0daa01b2178e213d2b6409f82b469f2', size: this.size, type: "text_line", state: this.seventhStepState, status: this.seventhStepStatus, label: this.seventhStepLabel, "supporting-text": this.seventhStepSupportingText, "show-content": this.showContent, "show-supporting-text": this.showSupportingText }))));
+        return (h("div", { key: '41cbaefb507a778a1f2839251a9316a37eeb7835', class: "text_with_line" }, this.steps.map(step => (h("gb-step-base", { size: this.size, type: "text_line", state: step.state, status: step.status, label: step.label, "supporting-text": step.supportingText, "show-content": this.showContent, "show-supporting-text": this.showSupportingText })))));
     }
     static get is() { return "gb-stepper-horizontal-line-with-text"; }
     static get encapsulation() { return "shadow"; }
@@ -137,167 +147,17 @@ export class GbStepperHorizontalLineWithText {
                 "reflect": false,
                 "defaultValue": "false"
             },
-            "firstStepState": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "ProgressStepStates",
-                    "resolved": "\"default\" | \"destructive\"",
-                    "references": {
-                        "ProgressStepStates": {
-                            "location": "import",
-                            "path": "../../models/reusableModels",
-                            "id": "src/models/reusableModels.ts::ProgressStepStates"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "first-step-state",
-                "reflect": false
-            },
-            "secondStepState": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "ProgressStepStates",
-                    "resolved": "\"default\" | \"destructive\"",
-                    "references": {
-                        "ProgressStepStates": {
-                            "location": "import",
-                            "path": "../../models/reusableModels",
-                            "id": "src/models/reusableModels.ts::ProgressStepStates"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "second-step-state",
-                "reflect": false
-            },
-            "thirdStepState": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "ProgressStepStates",
-                    "resolved": "\"default\" | \"destructive\"",
-                    "references": {
-                        "ProgressStepStates": {
-                            "location": "import",
-                            "path": "../../models/reusableModels",
-                            "id": "src/models/reusableModels.ts::ProgressStepStates"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "third-step-state",
-                "reflect": false
-            },
-            "fourthStepState": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "ProgressStepStates",
-                    "resolved": "\"default\" | \"destructive\"",
-                    "references": {
-                        "ProgressStepStates": {
-                            "location": "import",
-                            "path": "../../models/reusableModels",
-                            "id": "src/models/reusableModels.ts::ProgressStepStates"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "fourth-step-state",
-                "reflect": false
-            },
-            "fifthStepState": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "ProgressStepStates",
-                    "resolved": "\"default\" | \"destructive\"",
-                    "references": {
-                        "ProgressStepStates": {
-                            "location": "import",
-                            "path": "../../models/reusableModels",
-                            "id": "src/models/reusableModels.ts::ProgressStepStates"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "fifth-step-state",
-                "reflect": false
-            },
-            "sixthStepState": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "ProgressStepStates",
-                    "resolved": "\"default\" | \"destructive\"",
-                    "references": {
-                        "ProgressStepStates": {
-                            "location": "import",
-                            "path": "../../models/reusableModels",
-                            "id": "src/models/reusableModels.ts::ProgressStepStates"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "sixth-step-state",
-                "reflect": false
-            },
-            "seventhStepState": {
-                "type": "string",
+            "steps": {
+                "type": "unknown",
                 "mutable": false,
                 "complexType": {
-                    "original": "ProgressStepStates",
-                    "resolved": "\"default\" | \"destructive\"",
+                    "original": "StepperType[]",
+                    "resolved": "StepperType[]",
                     "references": {
-                        "ProgressStepStates": {
+                        "StepperType": {
                             "location": "import",
                             "path": "../../models/reusableModels",
-                            "id": "src/models/reusableModels.ts::ProgressStepStates"
+                            "id": "src/models/reusableModels.ts::StepperType"
                         }
                     }
                 },
@@ -309,470 +169,23 @@ export class GbStepperHorizontalLineWithText {
                 },
                 "getter": false,
                 "setter": false,
-                "attribute": "seventh-step-state",
-                "reflect": false
-            },
-            "firstStepStatus": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "ProgressStepStatus",
-                    "resolved": "\"complete\" | \"current\" | \"incomplete\"",
-                    "references": {
-                        "ProgressStepStatus": {
-                            "location": "import",
-                            "path": "../../models/reusableModels",
-                            "id": "src/models/reusableModels.ts::ProgressStepStatus"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "first-step-status",
-                "reflect": false
-            },
-            "secondStepStatus": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "ProgressStepStatus",
-                    "resolved": "\"complete\" | \"current\" | \"incomplete\"",
-                    "references": {
-                        "ProgressStepStatus": {
-                            "location": "import",
-                            "path": "../../models/reusableModels",
-                            "id": "src/models/reusableModels.ts::ProgressStepStatus"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "second-step-status",
-                "reflect": false
-            },
-            "thirdStepStatus": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "ProgressStepStatus",
-                    "resolved": "\"complete\" | \"current\" | \"incomplete\"",
-                    "references": {
-                        "ProgressStepStatus": {
-                            "location": "import",
-                            "path": "../../models/reusableModels",
-                            "id": "src/models/reusableModels.ts::ProgressStepStatus"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "third-step-status",
-                "reflect": false
-            },
-            "fourthStepStatus": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "ProgressStepStatus",
-                    "resolved": "\"complete\" | \"current\" | \"incomplete\"",
-                    "references": {
-                        "ProgressStepStatus": {
-                            "location": "import",
-                            "path": "../../models/reusableModels",
-                            "id": "src/models/reusableModels.ts::ProgressStepStatus"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "fourth-step-status",
-                "reflect": false
-            },
-            "fifthStepStatus": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "ProgressStepStatus",
-                    "resolved": "\"complete\" | \"current\" | \"incomplete\"",
-                    "references": {
-                        "ProgressStepStatus": {
-                            "location": "import",
-                            "path": "../../models/reusableModels",
-                            "id": "src/models/reusableModels.ts::ProgressStepStatus"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "fifth-step-status",
-                "reflect": false
-            },
-            "sixthStepStatus": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "ProgressStepStatus",
-                    "resolved": "\"complete\" | \"current\" | \"incomplete\"",
-                    "references": {
-                        "ProgressStepStatus": {
-                            "location": "import",
-                            "path": "../../models/reusableModels",
-                            "id": "src/models/reusableModels.ts::ProgressStepStatus"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "sixth-step-status",
-                "reflect": false
-            },
-            "seventhStepStatus": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "ProgressStepStatus",
-                    "resolved": "\"complete\" | \"current\" | \"incomplete\"",
-                    "references": {
-                        "ProgressStepStatus": {
-                            "location": "import",
-                            "path": "../../models/reusableModels",
-                            "id": "src/models/reusableModels.ts::ProgressStepStatus"
-                        }
-                    }
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "seventh-step-status",
-                "reflect": false
-            },
-            "firstStepLabel": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "first-step-label",
-                "reflect": false,
-                "defaultValue": "''"
-            },
-            "secondStepLabel": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "second-step-label",
-                "reflect": false,
-                "defaultValue": "''"
-            },
-            "thirdStepLabel": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "third-step-label",
-                "reflect": false,
-                "defaultValue": "''"
-            },
-            "fourthStepLabel": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "fourth-step-label",
-                "reflect": false,
-                "defaultValue": "''"
-            },
-            "fifthStepLabel": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "fifth-step-label",
-                "reflect": false,
-                "defaultValue": "''"
-            },
-            "sixthStepLabel": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "sixth-step-label",
-                "reflect": false,
-                "defaultValue": "''"
-            },
-            "seventhStepLabel": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "seventh-step-label",
-                "reflect": false,
-                "defaultValue": "''"
-            },
-            "firstStepSupportingText": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "first-step-supporting-text",
-                "reflect": false,
-                "defaultValue": "''"
-            },
-            "secondStepSupportingText": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "second-step-supporting-text",
-                "reflect": false,
-                "defaultValue": "''"
-            },
-            "thirdStepSupportingText": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "third-step-supporting-text",
-                "reflect": false,
-                "defaultValue": "''"
-            },
-            "fourthStepSupportingText": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "fourth-step-supporting-text",
-                "reflect": false,
-                "defaultValue": "''"
-            },
-            "fifthStepSupportingText": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "fifth-step-supporting-text",
-                "reflect": false,
-                "defaultValue": "''"
-            },
-            "sixthStepSupportingText": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "sixth-step-supporting-text",
-                "reflect": false,
-                "defaultValue": "''"
-            },
-            "seventhStepSupportingText": {
-                "type": "string",
-                "mutable": false,
-                "complexType": {
-                    "original": "string",
-                    "resolved": "string",
-                    "references": {}
-                },
-                "required": false,
-                "optional": false,
-                "docs": {
-                    "tags": [],
-                    "text": ""
-                },
-                "getter": false,
-                "setter": false,
-                "attribute": "seventh-step-supporting-text",
-                "reflect": false,
-                "defaultValue": "''"
+                "defaultValue": "[\r\n    {\r\n      state: 'default',\r\n      status: 'complete',\r\n      label: 'First Step',\r\n      supportingText: 'Hiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiii',\r\n    },\r\n    {\r\n      state: 'default',\r\n      status: 'current',\r\n      label: 'First Step',\r\n      supportingText: 'Hiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiiii',\r\n    },\r\n  ]"
             }
         };
     }
     static get states() {
         return {
-            "width": {}
+            "internalSteps": {},
+            "width": {},
+            "internalState": {},
+            "internalStatus": {}
         };
     }
+    static get watchers() {
+        return [{
+                "propName": "steps",
+                "methodName": "onStepsChanged"
+            }];
+    }
 }
 //# sourceMappingURL=gb-stepper-horizontal-line-with-text.js.map