@duetds/components 6.2.3 → 6.2.5

package/lib/collection/components/duet-progress/duet-progress.js

@@ -1,7 +1,7 @@
 /*!
  * Built with Duet Design System
  */
-import { Component, Element, h, Host, Prop } from "@stencil/core";
+import { h, Host } from "@stencil/core";
 import { inheritGlobalTheme } from "../../common";
 import { createID } from "../../utils/create-id";
 import { getLocaleString } from "../../utils/language-utils";
@@ -12,42 +12,20 @@ export class DuetProgress {
      */
     this.progressId = createID("DuetProgress");
     this.progressLabelId = createID("DuetProgressLabel");
-    /**
-     * Aria Details of the component
-     */
+    this.accessibleDescribedBy = undefined;
     this.accessibleDetails = undefined;
-    /**
-     * String of id's that indicate alternative labels elements
-     */
     this.accessibleLabelledBy = undefined;
-    /**
-     * Aria description the button
-     */
     this.accessibleDescription = undefined;
-    /**
-     * Defaults for accessibleLabel
-     */
+    this.accessibleLabel = undefined;
     this.accessibleLabelUploadDefaults = {
       fi: ["lähetys valmis", "lähetys käynnissä"],
       sv: ["Uppladdningen är klar", "Uppladdning pågår"],
       en: ["upload completed", "upload in progress"],
     };
-    /**
-     * Adds accessible label for upload in progress and upload complete states
-     * @default {fi: ["lähetys valmis", "lähetys käynnissä"],sv: ["Uppladdningen är klar", "Uppladdning pågår"], en:  ["completed", "in progress"]}
-     */
     this.accessibleLabelUpload = getLocaleString(this.accessibleLabelUploadDefaults);
-    /**
-     * Progress of the bar, a value from 0-100
-     */
     this.progress = 0;
-    /**
-     * Height of progressbar
-     */
+    this.caption = undefined;
     this.height = "10px";
-    /**
-     * Theme of the input.
-     */
     this.theme = "";
   }
   /**
@@ -61,246 +39,238 @@ export class DuetProgress {
    * Always the last one in the class.
    */
   render() {
-    return (h(Host, null,
-      h("div", { "aria-live": this.accessibleLabel ? "polite" : "off", "aria-hidden": this.accessibleLabel ? "false" : "true", "aria-atomic": "true", style: {
-          height: this.height,
-        }, id: this.progressId, class: {
-          "duet-progress": true,
-          "duet-progress-done": this.progress === 100,
-          "duet-progress-start": this.progress === 0,
-          "duet-progress-inprogress": this.progress < 99 && this.progress !== 0,
-          "duet-theme-turva": this.theme === "turva",
-        } },
-        h("duet-visually-hidden", null,
-          h("label", { htmlFor: this.progressLabelId }, this.progress !== 0 && (h("span", null,
-            this.accessibleLabel,
-            ", ",
-            this.accessibleLabelUpload[this.progress < 99 ? 1 : 0])))),
-        this.caption && (h("div", { class: "duet-progress-caption" },
-          h("span", null, this.caption))),
-        h("progress", { id: this.progressLabelId, "aria-describedby": this.accessibleDescribedBy, "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, role: "progressbar", value: this.progress, max: "100", "aria-valuemin": "0", "aria-valuemax": "100" },
-          h("div", { class: "progress-bar" },
-            h("span", { style: { width: `${this.progress}%;` } },
-              "Progress: ",
-              this.progress,
-              "%"))))));
+    return (h(Host, null, h("div", { "aria-live": this.accessibleLabel ? "polite" : "off", "aria-hidden": this.accessibleLabel ? "false" : "true", "aria-atomic": "true", style: {
+        height: this.height,
+      }, id: this.progressId, class: {
+        "duet-progress": true,
+        "duet-progress-done": this.progress === 100,
+        "duet-progress-start": this.progress === 0,
+        "duet-progress-inprogress": this.progress < 99 && this.progress !== 0,
+        "duet-theme-turva": this.theme === "turva",
+      } }, h("duet-visually-hidden", null, h("label", { htmlFor: this.progressLabelId }, this.progress !== 0 && (h("span", null, this.accessibleLabel, ", ", this.accessibleLabelUpload[this.progress < 99 ? 1 : 0])))), this.caption && (h("div", { class: "duet-progress-caption" }, h("span", null, this.caption))), h("progress", { id: this.progressLabelId, "aria-describedby": this.accessibleDescribedBy, "aria-labelledby": this.accessibleLabelledBy, "aria-details": this.accessibleDetails, "aria-description": this.accessibleDescription, role: "progressbar", value: this.progress, max: "100", "aria-valuemin": "0", "aria-valuemax": "100" }, h("div", { class: "progress-bar" }, h("span", { style: { width: `${this.progress}%;` } }, "Progress: ", this.progress, "%"))))));
   }
   static get is() { return "duet-progress"; }
-  static get originalStyleUrls() { return {
-    "$": ["duet-progress.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["duet-progress.css"]
-  }; }
-  static get properties() { return {
-    "accessibleDescribedBy": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Indicates the id of a component that describes the upload component."
-      },
-      "attribute": "accessible-described-by",
-      "reflect": false
-    },
-    "accessibleDetails": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Aria Details of the component"
-      },
-      "attribute": "accessible-details",
-      "reflect": false,
-      "defaultValue": "undefined"
-    },
-    "accessibleLabelledBy": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "String of id's that indicate alternative labels elements"
+  static get originalStyleUrls() {
+    return {
+      "$": ["duet-progress.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["duet-progress.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "accessibleDescribedBy": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Indicates the id of a component that describes the upload component."
+        },
+        "attribute": "accessible-described-by",
+        "reflect": false
       },
-      "attribute": "accessible-labelled-by",
-      "reflect": false,
-      "defaultValue": "undefined"
-    },
-    "accessibleDescription": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
+      "accessibleDetails": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Aria Details of the component"
+        },
+        "attribute": "accessible-details",
+        "reflect": false,
+        "defaultValue": "undefined"
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Aria description the button"
+      "accessibleLabelledBy": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "String of id's that indicate alternative labels elements"
+        },
+        "attribute": "accessible-labelled-by",
+        "reflect": false,
+        "defaultValue": "undefined"
       },
-      "attribute": "accessible-description",
-      "reflect": false,
-      "defaultValue": "undefined"
-    },
-    "accessibleLabel": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
+      "accessibleDescription": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Aria description the button"
+        },
+        "attribute": "accessible-description",
+        "reflect": false,
+        "defaultValue": "undefined"
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Indicates the aria-label of the component -\nthis will get combined with an label+uploading when uploading,\nand label+upload complete when upload is complete"
+      "accessibleLabel": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Indicates the aria-label of the component -\nthis will get combined with an label+uploading when uploading,\nand label+upload complete when upload is complete"
+        },
+        "attribute": "accessible-label",
+        "reflect": false
       },
-      "attribute": "accessible-label",
-      "reflect": false
-    },
-    "accessibleLabelUploadDefaults": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "DuetLangObject | string",
-        "resolved": "DuetLangObject | string",
-        "references": {
-          "DuetLangObject": {
-            "location": "import",
-            "path": "../../utils/language-utils"
+      "accessibleLabelUploadDefaults": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "DuetLangObject | string",
+          "resolved": "DuetLangObject | string",
+          "references": {
+            "DuetLangObject": {
+              "location": "import",
+              "path": "../../utils/language-utils"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Defaults for accessibleLabel"
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Defaults for accessibleLabel"
+        },
+        "attribute": "accessible-label-upload-defaults",
+        "reflect": false,
+        "defaultValue": "{\n    fi: [\"l\u00E4hetys valmis\", \"l\u00E4hetys k\u00E4ynniss\u00E4\"],\n    sv: [\"Uppladdningen \u00E4r klar\", \"Uppladdning p\u00E5g\u00E5r\"],\n    en: [\"upload completed\", \"upload in progress\"],\n  }"
       },
-      "attribute": "accessible-label-upload-defaults",
-      "reflect": false,
-      "defaultValue": "{\n    fi: [\"l\u00E4hetys valmis\", \"l\u00E4hetys k\u00E4ynniss\u00E4\"],\n    sv: [\"Uppladdningen \u00E4r klar\", \"Uppladdning p\u00E5g\u00E5r\"],\n    en: [\"upload completed\", \"upload in progress\"],\n  }"
-    },
-    "accessibleLabelUpload": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
+      "accessibleLabelUpload": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [{
+              "name": "default",
+              "text": "{fi: [\"l\u00E4hetys valmis\", \"l\u00E4hetys k\u00E4ynniss\u00E4\"],sv: [\"Uppladdningen \u00E4r klar\", \"Uppladdning p\u00E5g\u00E5r\"], en:  [\"completed\", \"in progress\"]}"
+            }],
+          "text": "Adds accessible label for upload in progress and upload complete states"
+        },
+        "attribute": "accessible-label-upload",
+        "reflect": false,
+        "defaultValue": "getLocaleString(this.accessibleLabelUploadDefaults)"
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [{
-            "name": "default",
-            "text": "{fi: [\"l\u00E4hetys valmis\", \"l\u00E4hetys k\u00E4ynniss\u00E4\"],sv: [\"Uppladdningen \u00E4r klar\", \"Uppladdning p\u00E5g\u00E5r\"], en:  [\"completed\", \"in progress\"]}"
-          }],
-        "text": "Adds accessible label for upload in progress and upload complete states"
+      "progress": {
+        "type": "number",
+        "mutable": true,
+        "complexType": {
+          "original": "number",
+          "resolved": "number",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Progress of the bar, a value from 0-100"
+        },
+        "attribute": "progress",
+        "reflect": true,
+        "defaultValue": "0"
       },
-      "attribute": "accessible-label-upload",
-      "reflect": false,
-      "defaultValue": "getLocaleString(this.accessibleLabelUploadDefaults)"
-    },
-    "progress": {
-      "type": "number",
-      "mutable": true,
-      "complexType": {
-        "original": "number",
-        "resolved": "number",
-        "references": {}
+      "caption": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Caption (underneath label) that can be set as a way of adding extra information"
+        },
+        "attribute": "caption",
+        "reflect": false
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Progress of the bar, a value from 0-100"
+      "height": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Height of progressbar"
+        },
+        "attribute": "height",
+        "reflect": false,
+        "defaultValue": "\"10px\""
       },
-      "attribute": "progress",
-      "reflect": true,
-      "defaultValue": "0"
-    },
-    "caption": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Caption (underneath label) that can be set as a way of adding extra information"
-      },
-      "attribute": "caption",
-      "reflect": false
-    },
-    "height": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Height of progressbar"
-      },
-      "attribute": "height",
-      "reflect": false,
-      "defaultValue": "\"10px\""
-    },
-    "theme": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "DuetTheme",
-        "resolved": "\"\" | \"default\" | \"turva\"",
-        "references": {
-          "DuetTheme": {
-            "location": "import",
-            "path": "../../common-types"
+      "theme": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "DuetTheme",
+          "resolved": "\"\" | \"default\" | \"turva\"",
+          "references": {
+            "DuetTheme": {
+              "location": "import",
+              "path": "../../common-types"
+            }
           }
-        }
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Theme of the input."
-      },
-      "attribute": "theme",
-      "reflect": false,
-      "defaultValue": "\"\""
-    }
-  }; }
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Theme of the input."
+        },
+        "attribute": "theme",
+        "reflect": false,
+        "defaultValue": "\"\""
+      }
+    };
+  }
   static get elementRef() { return "element"; }
 }