@ptcwebops/ptcw-design 0.5.9 → 0.6.0

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

@@ -1,114 +1,114 @@
-import { Component, h, Host, Prop, Event, Element } from '@stencil/core';
-import CheckIcon from '../../media/svg-imgs/check-mark.svg';
-export class PtcCheckbox {
-  constructor() {
-    this.checked = 'unchecked';
-    this.handleClick = (e) => {
-      let input = this.host.shadowRoot.querySelector('input');
-      let parameter = {
-        event: e,
-        sender: input,
-        value: this.value,
-        checked: this.checked
-      };
-      if (this.checked == 'unchecked') {
-        this.checked = 'checked';
-      }
-      else {
-        this.checked = 'unchecked';
-      }
-      this.checkedChanged.emit(parameter);
-    };
-  }
-  componentDidLoad() {
-    let input = this.host.shadowRoot.querySelector('input');
-    input.checked = this.checked == 'checked';
-  }
-  render() {
-    return (h(Host, null,
-      h("label", { class: "ptc-checkbox", onClick: (e) => this.handleClick(e) },
-        h("slot", null),
-        h("input", { type: "checkbox", name: this.inputName, value: this.value }),
-        h("span", { class: "check" },
-          h("span", { class: "mark", innerHTML: CheckIcon })))));
-  }
-  static get is() { return "ptc-checkbox"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["ptc-checkbox.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["ptc-checkbox.css"]
-  }; }
-  static get properties() { return {
-    "checked": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "'checked' | 'unchecked'",
-        "resolved": "\"checked\" | \"unchecked\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "checked",
-      "reflect": false,
-      "defaultValue": "'unchecked'"
-    },
-    "value": {
-      "type": "string",
-      "mutable": true,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "value",
-      "reflect": false
-    },
-    "inputName": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "string",
-        "resolved": "string",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "input-name",
-      "reflect": false
-    }
-  }; }
-  static get events() { return [{
-      "method": "checkedChanged",
-      "name": "checkedChanged",
-      "bubbles": true,
-      "cancelable": true,
-      "composed": true,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "complexType": {
-        "original": "any",
-        "resolved": "any",
-        "references": {}
-      }
-    }]; }
-  static get elementRef() { return "host"; }
-}
+import { Component, h, Host, Prop, Event, Element } from '@stencil/core';
+export class PtcCheckbox {
+  constructor() {
+    this.checked = 'unchecked';
+    this.handleClick = (e) => {
+      let input = this.host.shadowRoot.querySelector('input');
+      if (this.checked == 'unchecked') {
+        this.checked = 'checked';
+      }
+      else {
+        this.checked = 'unchecked';
+      }
+      let parameter = {
+        event: e,
+        sender: input,
+        value: this.value,
+        checked: this.checked
+      };
+      this.checkedChanged.emit(parameter);
+    };
+  }
+  componentDidLoad() {
+    let input = this.host.shadowRoot.querySelector('input');
+    input.checked = this.checked == 'checked';
+  }
+  render() {
+    return (h(Host, null,
+      h("label", { class: "ptc-checkbox" },
+        h("slot", null),
+        h("input", { type: "checkbox", checked: this.checked == "checked", name: this.inputName, value: this.value, onChange: (e) => this.handleClick(e) }),
+        h("span", { class: "check" },
+          h("span", { class: "mark" },
+            h("icon-asset", { type: "ptc", size: "xx-small", name: "check-mark" }))))));
+  }
+  static get is() { return "ptc-checkbox"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() { return {
+    "$": ["ptc-checkbox.scss"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["ptc-checkbox.css"]
+  }; }
+  static get properties() { return {
+    "checked": {
+      "type": "string",
+      "mutable": true,
+      "complexType": {
+        "original": "'checked' | 'unchecked'",
+        "resolved": "\"checked\" | \"unchecked\"",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "checked",
+      "reflect": false,
+      "defaultValue": "'unchecked'"
+    },
+    "value": {
+      "type": "string",
+      "mutable": true,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "value",
+      "reflect": false
+    },
+    "inputName": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "string",
+        "resolved": "string",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "input-name",
+      "reflect": false
+    }
+  }; }
+  static get events() { return [{
+      "method": "checkedChanged",
+      "name": "checkedChanged",
+      "bubbles": true,
+      "cancelable": true,
+      "composed": true,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "complexType": {
+        "original": "any",
+        "resolved": "any",
+        "references": {}
+      }
+    }]; }
+  static get elementRef() { return "host"; }
+}

package/dist/collection/components/ptc-container/ptc-container.js

@@ -1,119 +1,119 @@
-import { Component, h, Prop, Host } from '@stencil/core';
-export class PtcContainer {
-  constructor() {
-    /**
-     * Theme
-     */
-    this.backgroundColor = 'white';
-    this.elevation = 'small';
-    this.containerType = 'normal';
-    this.spacing = 'xxx-large';
-  }
-  render() {
-    const classMap = this.getCssClassMap();
-    return (h(Host, { class: this.getContainerClass() },
-      h("div", { class: classMap },
-        h("slot", null))));
-  }
-  getContainerClass() {
-    switch (this.containerType) {
-      case 'large':
-        return 'ptc-container-lg';
-      case 'none':
-        return undefined;
-      default:
-        return 'ptc-container';
-    }
-  }
-  getCssClassMap() {
-    const spacing = `spacing-${this.spacing}`;
-    return {
-      ['content-wrapper']: true,
-      [this.backgroundColor]: true,
-      [this.elevation]: true,
-      [spacing]: true
-    };
-  }
-  static get is() { return "ptc-container"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() { return {
-    "$": ["ptc-container.scss"]
-  }; }
-  static get styleUrls() { return {
-    "$": ["ptc-container.css"]
-  }; }
-  static get properties() { return {
-    "backgroundColor": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'white' | 'gray'",
-        "resolved": "\"gray\" | \"white\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": "Theme"
-      },
-      "attribute": "background-color",
-      "reflect": false,
-      "defaultValue": "'white'"
-    },
-    "elevation": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'x-small' | 'small' | 'medium' | 'large' | 'x-large'",
-        "resolved": "\"large\" | \"medium\" | \"small\" | \"x-large\" | \"x-small\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "elevation",
-      "reflect": false,
-      "defaultValue": "'small'"
-    },
-    "containerType": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'normal' | 'large' | 'none'",
-        "resolved": "\"large\" | \"none\" | \"normal\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "container-type",
-      "reflect": false,
-      "defaultValue": "'normal'"
-    },
-    "spacing": {
-      "type": "string",
-      "mutable": false,
-      "complexType": {
-        "original": "'xx-small' | 'x-small' | 'small' | 'medium' | 'large' | 'x-large' | 'xxx-large' | 'xxx-large'",
-        "resolved": "\"large\" | \"medium\" | \"small\" | \"x-large\" | \"x-small\" | \"xx-small\" | \"xxx-large\"",
-        "references": {}
-      },
-      "required": false,
-      "optional": false,
-      "docs": {
-        "tags": [],
-        "text": ""
-      },
-      "attribute": "spacing",
-      "reflect": false,
-      "defaultValue": "'xxx-large'"
-    }
-  }; }
-}
+import { Component, h, Prop, Host } from '@stencil/core';
+export class PtcContainer {
+  constructor() {
+    /**
+     * Theme
+     */
+    this.backgroundColor = 'white';
+    this.elevation = 'small';
+    this.containerType = 'normal';
+    this.spacing = 'xxx-large';
+  }
+  render() {
+    const classMap = this.getCssClassMap();
+    return (h(Host, { class: this.getContainerClass() },
+      h("div", { class: classMap },
+        h("slot", null))));
+  }
+  getContainerClass() {
+    switch (this.containerType) {
+      case 'large':
+        return 'ptc-container-lg';
+      case 'none':
+        return undefined;
+      default:
+        return 'ptc-container';
+    }
+  }
+  getCssClassMap() {
+    const spacing = `spacing-${this.spacing}`;
+    return {
+      ['content-wrapper']: true,
+      [this.backgroundColor]: true,
+      [this.elevation]: true,
+      [spacing]: true
+    };
+  }
+  static get is() { return "ptc-container"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() { return {
+    "$": ["ptc-container.scss"]
+  }; }
+  static get styleUrls() { return {
+    "$": ["ptc-container.css"]
+  }; }
+  static get properties() { return {
+    "backgroundColor": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "'white' | 'gray'",
+        "resolved": "\"gray\" | \"white\"",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": "Theme"
+      },
+      "attribute": "background-color",
+      "reflect": false,
+      "defaultValue": "'white'"
+    },
+    "elevation": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "'x-small' | 'small' | 'medium' | 'large' | 'x-large'",
+        "resolved": "\"large\" | \"medium\" | \"small\" | \"x-large\" | \"x-small\"",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "elevation",
+      "reflect": false,
+      "defaultValue": "'small'"
+    },
+    "containerType": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "'normal' | 'large' | 'none'",
+        "resolved": "\"large\" | \"none\" | \"normal\"",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "container-type",
+      "reflect": false,
+      "defaultValue": "'normal'"
+    },
+    "spacing": {
+      "type": "string",
+      "mutable": false,
+      "complexType": {
+        "original": "'xx-small' | 'x-small' | 'small' | 'medium' | 'large' | 'x-large' | 'xxx-large' | 'xxx-large'",
+        "resolved": "\"large\" | \"medium\" | \"small\" | \"x-large\" | \"x-small\" | \"xx-small\" | \"xxx-large\"",
+        "references": {}
+      },
+      "required": false,
+      "optional": false,
+      "docs": {
+        "tags": [],
+        "text": ""
+      },
+      "attribute": "spacing",
+      "reflect": false,
+      "defaultValue": "'xxx-large'"
+    }
+  }; }
+}