@dnncommunity/dnn-elements 0.15.1 → 0.15.2

package/dist/collection/components/dnn-button/dnn-button.js

@@ -1,4 +1,4 @@
-import { Component, Element, Host, h, Prop, State, Event } from '@stencil/core';
+import { Host, h } from '@stencil/core';
 /**
  * @slot Content of the button
  */
@@ -70,207 +70,210 @@ export class DnnButton {
     return classes.join(' ');
   }
   render() {
-    return (h(Host, { class: this.getElementClasses(), disabled: this.disabled, style: { 'pointer-events': this.disabled ? 'none' : 'all' } },
-      h("button", { class: "button", onClick: () => this.handleClick(), disabled: this.disabled },
-        h("slot", null)),
-      this.confirm &&
-        h("dnn-modal", { showCloseButton: false, backdropDismiss: false },
-          h("p", null, this.confirmMessage),
-          h("div", { style: {
-              display: 'flex',
-              justifyContent: 'flex-end'
-            } },
-            h("dnn-button", { type: 'primary', style: { margin: '5px' }, onClick: () => this.handleConfirm() }, this.confirmYesText),
-            h("dnn-button", { type: 'secondary', style: { margin: '5px' }, onClick: () => this.handleCancel() }, this.confirmNoText)))));
+    return (h(Host, { class: this.getElementClasses(), disabled: this.disabled, style: { 'pointer-events': this.disabled ? 'none' : 'all' } }, h("button", { class: "button", onClick: () => this.handleClick(), disabled: this.disabled }, h("slot", null)), this.confirm &&
+      h("dnn-modal", { showCloseButton: false, backdropDismiss: false }, h("p", null, this.confirmMessage), h("div", { style: {
+          display: 'flex',
+          justifyContent: 'flex-end'
+        } }, h("dnn-button", { type: 'primary', style: { margin: '5px' }, onClick: () => this.handleConfirm() }, this.confirmYesText), h("dnn-button", { type: 'secondary', style: { margin: '5px' }, onClick: () => this.handleCancel() }, this.confirmNoText)))));
   }
   static get is() { return "dnn-button"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["dnn-button.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["dnn-button.css"]
-  }; }
-  static get properties() { return {
-    "type": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'primary' | 'secondary' | 'tertiary'",
-        "resolved": "\"primary\" | \"secondary\" | \"tertiary\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Optional button style,\ncan be either primary, secondary or tertiary and defaults to primary if not specified"
-      },
-      "attribute": "type",
-      "reflect": false,
-      "defaultValue": "'primary'"
-    },
-    "reversed": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Optionally reverses the button style."
-      },
-      "attribute": "reversed",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "size": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'small' | 'normal' | 'large'",
-        "resolved": "\"large\" | \"normal\" | \"small\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "Optionally sets the button size, small normal or large, defaults to normal"
-      },
-      "attribute": "size",
-      "reflect": false,
-      "defaultValue": "'normal'"
-    },
-    "confirm": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "Optionally add a confirmation dialog before firing the action."
-      },
-      "attribute": "confirm",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "confirmYesText": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "The text of the yes button for confirmation."
+  static get originalStyleUrls() {
+    return {
+      "$": ["dnn-button.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["dnn-button.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "type": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'primary' | 'secondary' | 'tertiary'",
+          "resolved": "\"primary\" | \"secondary\" | \"tertiary\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Optional button style,\ncan be either primary, secondary or tertiary and defaults to primary if not specified"
+        },
+        "attribute": "type",
+        "reflect": false,
+        "defaultValue": "'primary'"
       },
-      "attribute": "confirm-yes-text",
-      "reflect": false,
-      "defaultValue": "\"Yes\""
-    },
-    "confirmNoText": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
+      "reversed": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Optionally reverses the button style."
+        },
+        "attribute": "reversed",
+        "reflect": false,
+        "defaultValue": "false"
       },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "The text of the no button for confirmation."
+      "size": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'small' | 'normal' | 'large'",
+          "resolved": "\"large\" | \"normal\" | \"small\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Optionally sets the button size, small normal or large, defaults to normal"
+        },
+        "attribute": "size",
+        "reflect": false,
+        "defaultValue": "'normal'"
       },
-      "attribute": "confirm-no-text",
-      "reflect": false,
-      "defaultValue": "\"No\""
-    },
-    "confirmMessage": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
+      "confirm": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Optionally add a confirmation dialog before firing the action."
+        },
+        "attribute": "confirm",
+        "reflect": false,
+        "defaultValue": "false"
       },
-      "required": false,
-      "optional": true,
-      "docs": {
-        "tags": [],
-        "text": "The text of the confirmation message;"
+      "confirmYesText": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "The text of the yes button for confirmation."
+        },
+        "attribute": "confirm-yes-text",
+        "reflect": false,
+        "defaultValue": "\"Yes\""
       },
-      "attribute": "confirm-message",
-      "reflect": false,
-      "defaultValue": "\"Are you sure ?\""
-    },
-    "disabled": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
+      "confirmNoText": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "The text of the no button for confirmation."
+        },
+        "attribute": "confirm-no-text",
+        "reflect": false,
+        "defaultValue": "\"No\""
       },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Disables the button"
+      "confirmMessage": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "The text of the confirmation message;"
+        },
+        "attribute": "confirm-message",
+        "reflect": false,
+        "defaultValue": "\"Are you sure ?\""
       },
-      "attribute": "disabled",
-      "reflect": false,
-      "defaultValue": "false"
-    }
-  }; }
-  static get states() { return {
-    "modalVisible": {}
-  }; }
-  static get events() { return [{
-      "method": "confirmed",
-      "name": "confirmed",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Fires when confirm is true and the user confirms the action."
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
+      "disabled": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Disables the button"
+        },
+        "attribute": "disabled",
+        "reflect": false,
+        "defaultValue": "false"
       }
-    }, {
-      "method": "canceled",
-      "name": "canceled",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Fires when confirm is true and the user cancels the action."
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      }
-    }]; }
+    };
+  }
+  static get states() {
+    return {
+      "modalVisible": {}
+    };
+  }
+  static get events() {
+    return [{
+        "method": "confirmed",
+        "name": "confirmed",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Fires when confirm is true and the user confirms the action."
+        },
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        }
+      }, {
+        "method": "canceled",
+        "name": "canceled",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Fires when confirm is true and the user cancels the action."
+        },
+        "complexType": {
+          "original": "any",
+          "resolved": "any",
+          "references": {}
+        }
+      }];
+  }
   static get elementRef() { return "el"; }
 }
-//# sourceMappingURL=dnn-button.js.map
+//# sourceMappingURL=dnn-button.js.map

package/dist/collection/components/dnn-button/dnn-button.stories.js

@@ -69,4 +69,4 @@ Button.args = {
   disabled: false,
   slot: 'Click me!'
 };
-//# sourceMappingURL=dnn-button.stories.js.map
+//# sourceMappingURL=dnn-button.stories.js.map

package/dist/collection/components/dnn-checkbox/dnn-checkbox.js

@@ -1,4 +1,4 @@
-import { Component, Element, Host, h, Prop, Event } from '@stencil/core';
+import { Host, h } from '@stencil/core';
 /**
  * @slot - The label for the checkbox.
  * @slot checkedicon - Allows overriding the default checked icon.
@@ -44,109 +44,95 @@ export class DnnCheckbox {
     this.checkedchange.emit(this.checked);
   }
   render() {
-    return (h(Host, null,
-      h("button", { class: `icon ${this.checked}`, onClick: () => this.changeState() },
-        h("div", { class: "unchecked" },
-          h("slot", { name: "uncheckedicon" },
-            h("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24px", viewBox: "0 0 24 24", width: "24px", fill: "#000000" },
-              h("path", { d: "M0 0h24v24H0z", fill: "none" }),
-              h("path", { d: "M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z" })))),
-        h("div", { class: "checked" },
-          h("slot", { name: "checkedicon" },
-            h("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24px", viewBox: "0 0 24 24", width: "24px", fill: "#000000" },
-              h("path", { d: "M0 0h24v24H0z", fill: "none" }),
-              h("path", { d: "M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z" })))),
-        h("div", { class: "intermediate" },
-          h("slot", { name: "intermediateicon" },
-            h("svg", { class: "undefined", xmlns: "http://www.w3.org/2000/svg", "enable-background": "new 0 0 24 24", height: "24px", viewBox: "0 0 24 24", width: "24px", fill: "#000000" },
-              h("g", null,
-                h("rect", { fill: "none", height: "24", width: "24" })),
-              h("g", null,
-                h("g", null,
-                  h("g", null,
-                    h("path", { d: "M19,3H5C3.9,3,3,3.9,3,5v14c0,1.1,0.9,2,2,2h14c1.1,0,2-0.9,2-2V5C21,3.9,20.1,3,19,3z M17,13H7v-2h10V13z" })))))))),
-      h("label", { htmlFor: this.el.id, onClick: () => this.changeState() },
-        h("slot", null))));
+    return (h(Host, null, h("button", { class: `icon ${this.checked}`, onClick: () => this.changeState() }, h("div", { class: "unchecked" }, h("slot", { name: "uncheckedicon" }, h("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24px", viewBox: "0 0 24 24", width: "24px", fill: "#000000" }, h("path", { d: "M0 0h24v24H0z", fill: "none" }), h("path", { d: "M19 5v14H5V5h14m0-2H5c-1.1 0-2 .9-2 2v14c0 1.1.9 2 2 2h14c1.1 0 2-.9 2-2V5c0-1.1-.9-2-2-2z" })))), h("div", { class: "checked" }, h("slot", { name: "checkedicon" }, h("svg", { xmlns: "http://www.w3.org/2000/svg", height: "24px", viewBox: "0 0 24 24", width: "24px", fill: "#000000" }, h("path", { d: "M0 0h24v24H0z", fill: "none" }), h("path", { d: "M19 3H5c-1.11 0-2 .9-2 2v14c0 1.1.89 2 2 2h14c1.11 0 2-.9 2-2V5c0-1.1-.89-2-2-2zm-9 14l-5-5 1.41-1.41L10 14.17l7.59-7.59L19 8l-9 9z" })))), h("div", { class: "intermediate" }, h("slot", { name: "intermediateicon" }, h("svg", { class: "undefined", xmlns: "http://www.w3.org/2000/svg", "enable-background": "new 0 0 24 24", height: "24px", viewBox: "0 0 24 24", width: "24px", fill: "#000000" }, h("g", null, h("rect", { fill: "none", height: "24", width: "24" })), h("g", null, h("g", null, h("g", null, h("path", { d: "M19,3H5C3.9,3,3,3.9,3,5v14c0,1.1,0.9,2,2,2h14c1.1,0,2-0.9,2-2V5C21,3.9,20.1,3,19,3z M17,13H7v-2h10V13z" })))))))), h("label", { htmlFor: this.el.id, onClick: () => this.changeState() }, h("slot", null))));
   }
   static get is() { return "dnn-checkbox"; }
   static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["dnn-checkbox.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["dnn-checkbox.css"]
-  }; }
-  static get properties() { return {
-    "checked": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "\"checked\" | \"unchecked\" | \"intermediate\"",
-        "resolved": "\"checked\" | \"intermediate\" | \"unchecked\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Defines if the checkbox is checked (true) or unchecked (false) or in an intermediate state (undefined)"
-      },
-      "attribute": "checked",
-      "reflect": false,
-      "defaultValue": "\"unchecked\""
-    },
-    "useIntermediate": {
-      "type": "boolean",
-      "mutable": false,
-      "complexType": {
-        "original": "boolean",
-        "resolved": "boolean",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Defines if clicking the checkbox will go through the intermediate state between checked and unchecked (tri-state)"
-      },
-      "attribute": "use-intermediate",
-      "reflect": false,
-      "defaultValue": "false"
-    },
-    "value": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "The value for this checkbox (not to be confused with its checked state)."
+  static get originalStyleUrls() {
+    return {
+      "$": ["dnn-checkbox.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["dnn-checkbox.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "checked": {
+        "type": "string",
+        "mutable": true,
+        "complexType": {
+          "original": "\"checked\" | \"unchecked\" | \"intermediate\"",
+          "resolved": "\"checked\" | \"intermediate\" | \"unchecked\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Defines if the checkbox is checked (true) or unchecked (false) or in an intermediate state (undefined)"
+        },
+        "attribute": "checked",
+        "reflect": false,
+        "defaultValue": "\"unchecked\""
       },
-      "attribute": "value",
-      "reflect": false
-    }
-  }; }
-  static get events() { return [{
-      "method": "checkedchange",
-      "name": "checkedchange",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": "Fires up when the checkbox checked property changes."
+      "useIntermediate": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "Defines if clicking the checkbox will go through the intermediate state between checked and unchecked (tri-state)"
+        },
+        "attribute": "use-intermediate",
+        "reflect": false,
+        "defaultValue": "false"
       },
-      "complexType": {
-        "original": "\"checked\" | \"unchecked\" | \"intermediate\"",
-        "resolved": "\"checked\" | \"intermediate\" | \"unchecked\"",
-        "references": {}
+      "value": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "The value for this checkbox (not to be confused with its checked state)."
+        },
+        "attribute": "value",
+        "reflect": false
       }
-    }]; }
+    };
+  }
+  static get events() {
+    return [{
+        "method": "checkedchange",
+        "name": "checkedchange",
+        "bubbles": true,
+        "cancelable": true,
+        "composed": true,
+        "docs": {
+          "tags": [],
+          "text": "Fires up when the checkbox checked property changes."
+        },
+        "complexType": {
+          "original": "\"checked\" | \"unchecked\" | \"intermediate\"",
+          "resolved": "\"checked\" | \"intermediate\" | \"unchecked\"",
+          "references": {}
+        }
+      }];
+  }
   static get elementRef() { return "el"; }
 }
-//# sourceMappingURL=dnn-checkbox.js.map
+//# sourceMappingURL=dnn-checkbox.js.map

package/dist/collection/components/dnn-checkbox/dnn-checkbox.stories.js

@@ -36,4 +36,4 @@ Checkbox.args = {
   useIntermediate: false,
   value: '1',
 };
-//# sourceMappingURL=dnn-checkbox.stories.js.map
+//# sourceMappingURL=dnn-checkbox.stories.js.map