@ptcwebops/ptcw-design 1.3.0 → 1.3.2

package/dist/collection/components/ptc-social-share/ptc-social-share.js

@@ -1,239 +1,239 @@
-import { Host, h } from '@stencil/core';
-export class PtcSocialShare {
-  constructor() {
-    this.display = 'inline-block';
-    this.shareType = 'twitter';
-    this.shareTitle = undefined;
-    this.text = undefined;
-    this.url = undefined;
-    this.source = '';
-    this.recipient = '';
-    this.iconColor = 'white';
-    this.iconHoverColor = 'gray';
-    this.isHover = false;
-  }
-  render() {
-    const classMap = this.getCssClassMap();
-    return (h(Host, { class: classMap }, h("div", { onClick: () => this.share(), onMouseEnter: () => this.hoverToggle(), onMouseLeave: () => this.hoverToggle() }, this.shareType == 'mail' ? h("icon-asset", Object.assign({ type: "ptc", size: "large", name: "plm-mail" }, (this.isHover ? { color: this.iconHoverColor } : { color: this.iconColor }))) : null, this.shareType == 'linkedin' ? h("icon-asset", Object.assign({ type: "ptc", size: "large", name: "plm-linkedin" }, (this.isHover ? { color: this.iconHoverColor } : { color: this.iconColor }))) : null, this.shareType == 'twitter' ? h("icon-asset", Object.assign({ type: "ptc", size: "large", name: "plm-twitter" }, (this.isHover ? { color: this.iconHoverColor } : { color: this.iconColor }))) : null, this.shareType == 'facebook' ? h("icon-asset", Object.assign({ type: "ptc", size: "large", name: "plm-fb" }, (this.isHover ? { color: this.iconHoverColor } : { color: this.iconColor }))) : null, this.shareType == 'share-api' ? h("icon-asset", Object.assign({ type: "solid", size: "large", name: "share-square" }, (this.isHover ? { color: this.iconHoverColor } : { color: this.iconColor }))) : null)));
-  }
-  getCssClassMap() {
-    return {
-      ['ptc-social-share']: true,
-      [this.display]: true,
-    };
-  }
-  hoverToggle() {
-    this.isHover = !this.isHover;
-  }
-  share() {
-    if (this.shareType == 'twitter') {
-      window.open(`https://twitter.com/share?text=${this.text}&url=${this.url}`);
-    }
-    if (this.shareType == 'facebook') {
-      window.open(`https://www.facebook.com/sharer/sharer.php?u=${this.url}`);
-    }
-    if (this.shareType == 'linkedin') {
-      window.open(`https://www.linkedin.com/shareArticle?mini=true&url=${this.url}&title=${this.shareTitle}&summary=${this.text}&source=${this.source}`);
-    }
-    if (this.shareType == 'mail') {
-      window.open(`mailto:${this.recipient}?subject=${this.text}&body=${this.url}`);
-    }
-    if (this.shareType == 'share-api') {
-      if (navigator.share) {
-        navigator
-          .share({
-          title: this.shareTitle,
-          text: this.text,
-          url: this.url,
-        })
-          .then(() => console.log('Successful share'))
-          .catch(error => console.log('Error sharing', error));
-      }
-      else {
-        // fallback to sharing to twitter
-        window.open(`http://twitter.com/share?text=${this.text}&url=${this.url}`);
-      }
-    }
-  }
-  static get is() { return "ptc-social-share"; }
-  static get encapsulation() { return "shadow"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["ptc-social-share.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["ptc-social-share.css"]
-    };
-  }
-  static get properties() {
-    return {
-      "display": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "'inline-block' | 'block' | 'inline' | 'flex'",
-          "resolved": "\"block\" | \"flex\" | \"inline\" | \"inline-block\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "display",
-        "reflect": false,
-        "defaultValue": "'inline-block'"
-      },
-      "shareType": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "'mail' | 'twitter' | 'linkedin' | 'facebook' | 'share-api'",
-          "resolved": "\"facebook\" | \"linkedin\" | \"mail\" | \"share-api\" | \"twitter\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "share-type",
-        "reflect": false,
-        "defaultValue": "'twitter'"
-      },
-      "shareTitle": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "share-title",
-        "reflect": false
-      },
-      "text": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "text",
-        "reflect": false
-      },
-      "url": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": false,
-        "docs": {
-          "tags": [],
-          "text": ""
-        },
-        "attribute": "url",
-        "reflect": false
-      },
-      "source": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "Optional - source for linkedin"
-        },
-        "attribute": "source",
-        "reflect": false,
-        "defaultValue": "''"
-      },
-      "recipient": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "string",
-          "resolved": "string",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "Email recipient.\r\nIf you want to use mail share, you need to use this property"
-        },
-        "attribute": "recipient",
-        "reflect": false,
-        "defaultValue": "''"
-      },
-      "iconColor": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "'black' | 'white' | 'ptc-green' | 'gray' | 'primary-gray' |'inherit'",
-          "resolved": "\"black\" | \"gray\" | \"inherit\" | \"primary-gray\" | \"ptc-green\" | \"white\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "Icon asset color"
-        },
-        "attribute": "icon-color",
-        "reflect": false,
-        "defaultValue": "'white'"
-      },
-      "iconHoverColor": {
-        "type": "string",
-        "mutable": false,
-        "complexType": {
-          "original": "'black' | 'white' | 'ptc-green' | 'gray' | 'primary-gray' | 'inherit'",
-          "resolved": "\"black\" | \"gray\" | \"inherit\" | \"primary-gray\" | \"ptc-green\" | \"white\"",
-          "references": {}
-        },
-        "required": false,
-        "optional": true,
-        "docs": {
-          "tags": [],
-          "text": "Icon asset hover color"
-        },
-        "attribute": "icon-hover-color",
-        "reflect": false,
-        "defaultValue": "'gray'"
-      }
-    };
-  }
-  static get states() {
-    return {
-      "isHover": {}
-    };
-  }
-  static get elementRef() { return "el"; }
-}
+import { Host, h } from '@stencil/core';
+export class PtcSocialShare {
+  constructor() {
+    this.display = 'inline-block';
+    this.shareType = 'twitter';
+    this.shareTitle = undefined;
+    this.text = undefined;
+    this.url = undefined;
+    this.source = '';
+    this.recipient = '';
+    this.iconColor = 'white';
+    this.iconHoverColor = 'gray';
+    this.isHover = false;
+  }
+  render() {
+    const classMap = this.getCssClassMap();
+    return (h(Host, { class: classMap }, h("div", { onClick: () => this.share(), onMouseEnter: () => this.hoverToggle(), onMouseLeave: () => this.hoverToggle() }, this.shareType == 'mail' ? h("icon-asset", Object.assign({ type: "ptc", size: "large", name: "plm-mail" }, (this.isHover ? { color: this.iconHoverColor } : { color: this.iconColor }))) : null, this.shareType == 'linkedin' ? h("icon-asset", Object.assign({ type: "ptc", size: "large", name: "plm-linkedin" }, (this.isHover ? { color: this.iconHoverColor } : { color: this.iconColor }))) : null, this.shareType == 'twitter' ? h("icon-asset", Object.assign({ type: "ptc", size: "large", name: "plm-twitter" }, (this.isHover ? { color: this.iconHoverColor } : { color: this.iconColor }))) : null, this.shareType == 'facebook' ? h("icon-asset", Object.assign({ type: "ptc", size: "large", name: "plm-fb" }, (this.isHover ? { color: this.iconHoverColor } : { color: this.iconColor }))) : null, this.shareType == 'share-api' ? h("icon-asset", Object.assign({ type: "solid", size: "large", name: "share-square" }, (this.isHover ? { color: this.iconHoverColor } : { color: this.iconColor }))) : null)));
+  }
+  getCssClassMap() {
+    return {
+      ['ptc-social-share']: true,
+      [this.display]: true,
+    };
+  }
+  hoverToggle() {
+    this.isHover = !this.isHover;
+  }
+  share() {
+    if (this.shareType == 'twitter') {
+      window.open(`https://twitter.com/share?text=${this.text}&url=${this.url}`);
+    }
+    if (this.shareType == 'facebook') {
+      window.open(`https://www.facebook.com/sharer/sharer.php?u=${this.url}`);
+    }
+    if (this.shareType == 'linkedin') {
+      window.open(`https://www.linkedin.com/shareArticle?mini=true&url=${this.url}&title=${this.shareTitle}&summary=${this.text}&source=${this.source}`);
+    }
+    if (this.shareType == 'mail') {
+      window.open(`mailto:${this.recipient}?subject=${this.text}&body=${this.url}`);
+    }
+    if (this.shareType == 'share-api') {
+      if (navigator.share) {
+        navigator
+          .share({
+          title: this.shareTitle,
+          text: this.text,
+          url: this.url,
+        })
+          .then(() => console.log('Successful share'))
+          .catch(error => console.log('Error sharing', error));
+      }
+      else {
+        // fallback to sharing to twitter
+        window.open(`http://twitter.com/share?text=${this.text}&url=${this.url}`);
+      }
+    }
+  }
+  static get is() { return "ptc-social-share"; }
+  static get encapsulation() { return "shadow"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["ptc-social-share.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["ptc-social-share.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "display": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'inline-block' | 'block' | 'inline' | 'flex'",
+          "resolved": "\"block\" | \"flex\" | \"inline\" | \"inline-block\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "display",
+        "reflect": false,
+        "defaultValue": "'inline-block'"
+      },
+      "shareType": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'mail' | 'twitter' | 'linkedin' | 'facebook' | 'share-api'",
+          "resolved": "\"facebook\" | \"linkedin\" | \"mail\" | \"share-api\" | \"twitter\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "share-type",
+        "reflect": false,
+        "defaultValue": "'twitter'"
+      },
+      "shareTitle": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "share-title",
+        "reflect": false
+      },
+      "text": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "text",
+        "reflect": false
+      },
+      "url": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "url",
+        "reflect": false
+      },
+      "source": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Optional - source for linkedin"
+        },
+        "attribute": "source",
+        "reflect": false,
+        "defaultValue": "''"
+      },
+      "recipient": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Email recipient.\nIf you want to use mail share, you need to use this property"
+        },
+        "attribute": "recipient",
+        "reflect": false,
+        "defaultValue": "''"
+      },
+      "iconColor": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'black' | 'white' | 'ptc-green' | 'gray' | 'primary-gray' |'inherit'",
+          "resolved": "\"black\" | \"gray\" | \"inherit\" | \"primary-gray\" | \"ptc-green\" | \"white\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Icon asset color"
+        },
+        "attribute": "icon-color",
+        "reflect": false,
+        "defaultValue": "'white'"
+      },
+      "iconHoverColor": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'black' | 'white' | 'ptc-green' | 'gray' | 'primary-gray' | 'inherit'",
+          "resolved": "\"black\" | \"gray\" | \"inherit\" | \"primary-gray\" | \"ptc-green\" | \"white\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": true,
+        "docs": {
+          "tags": [],
+          "text": "Icon asset hover color"
+        },
+        "attribute": "icon-hover-color",
+        "reflect": false,
+        "defaultValue": "'gray'"
+      }
+    };
+  }
+  static get states() {
+    return {
+      "isHover": {}
+    };
+  }
+  static get elementRef() { return "el"; }
+}