@ptcwebops/ptcw-design 3.5.3 → 3.5.5

package/dist/collection/components/organism-bundles/news-search-result/news-search-result.js

@@ -7,40 +7,13 @@ export class NewsSearchResult {
     this.cardHeights = [];
     this.maxCardHeight = 0;
   }
-  // @Listen('resize', { target: 'window' })
-  // handleWindowResize() {
-  //   //this.cardHeights = [];
-  //   //this.updatePictureSize();
-  //   //this.updateMaxHeight();
-  // }
-  // @Listen('squareHeightChanged', { target: 'body' })
-  // squareHeightChangedHandler(event: CustomEvent<number>) {
-  //   //console.log('Received the height:', event.detail); // Here you get the height
-  //   this.cardHeights = [...this.cardHeights, event.detail];
-  //   //this.updateMaxHeight();
-  // }
-  // Replace it with search logic
   componentDidLoad() {
     setTimeout(() => {
       this.isLoading = false;
     }, 3000);
-    //this.updatePictureSize();
   }
-  // updateMaxHeight() {
-  //   this.maxCardHeight = Math.max(...this.cardHeights, 0); // Update maxHeight based on the current cardHeights
-  //   console.log('cardheights: ' + this.cardHeights);
-  // }
-  // private updatePictureSize() {
-  //   const pictureComponents = this.el.shadowRoot.querySelectorAll('ptc-picture');
-  //   for (let i = 0; i < pictureComponents.length; i++) {
-  //     const pictureComponent = pictureComponents[i] as HTMLPtcPictureElement;
-  //     pictureComponent.isFullWidth = true;
-  //     pictureComponent.styles =
-  //       ':host{padding-bottom: 56.25%;overflow: hidden;margin:0;padding-top:56.25%;position: relative;} :host img{position:absolute;width:100%;height:100%;object-fit:cover;top:50%;left:50%;transform:translate(-50%,-50%);}';
-  //   }
-  // }
   render() {
-    return (h(Host, null, h("div", { class: "is-grid has-col-1 has-col-2-md has-col-3-lg has-col-gap-md has-row-gap-md" }, h("div", { class: "is-col-1" }, h("ptc-card", { "card-href": "http://www.google.com", "card-type": "listing-card", "has-image": "true", heading: "2022 SoCal RUG Event", "heading-transform": "none", "ribbon-text": "eBook", target: "_blank" }, h("ptc-img", { slot: "slot-image", "img-url": "http://s7d1.scene7.com/is/image/ptcinc/cs-boeing-planes-runway", "image-type": "smart-img", "load-mode": "lazy-bg" }), h("div", { slot: "slot-description" }, h("ptc-para", { "font-size": "medium", "font-weight": "w-4", "para-line-h": "line-height-19" }, "Join us for live presentations and hear about the latest updates for Creo, Windchill PLM, and Thingworx IOT and Augmented Reality.")))), h("div", { class: "is-col-1" }, h("ptc-card", { "card-href": "http://www.google.com", "card-type": "listing-card", "has-image": "true", heading: "2022 SoCal RUG Event", "heading-transform": "none", "ribbon-text": "eBook", target: "_blank" }, h("ptc-img", { slot: "slot-image", "img-url": "http://s7d1.scene7.com/is/image/ptcinc/cs-boeing-planes-runway", "image-type": "smart-img", "load-mode": "lazy-bg" }), h("div", { slot: "slot-description" }, h("ptc-para", { "font-size": "medium", "font-weight": "w-4", "para-line-h": "line-height-19" }, "Join us for live presentations and hear about the latest updates for Creo, Windchill PLM, and Thingworx IOT and Augmented Reality.")))), h("div", { class: "is-col-1" }, h("ptc-card", { "card-href": "http://www.google.com", "card-type": "listing-card", "has-image": "true", heading: "2022 SoCal RUG Event", "heading-transform": "none", "ribbon-text": "eBook", target: "_blank" }, h("ptc-img", { slot: "slot-image", "img-url": "http://s7d1.scene7.com/is/image/ptcinc/cs-boeing-planes-runway", "image-type": "smart-img", "load-mode": "lazy-bg" }), h("div", { slot: "slot-description" }, h("ptc-para", { "font-size": "medium", "font-weight": "w-4", "para-line-h": "line-height-19" }, "Join us for live presentations and hear about the latest updates for Creo, Windchill PLM, and Thingworx IOT and Augmented Reality.")))), h("div", { class: "is-col-1" }, h("ptc-card", { "card-href": "http://www.google.com", "card-type": "listing-card", "has-image": "true", heading: "2022 SoCal RUG Event", "heading-transform": "none", "ribbon-text": "eBook", target: "_blank" }, h("ptc-img", { slot: "slot-image", "img-url": "http://s7d1.scene7.com/is/image/ptcinc/cs-boeing-planes-runway", "image-type": "smart-img", "load-mode": "lazy-bg" }), h("div", { slot: "slot-description" }, h("ptc-para", { "font-size": "medium", "font-weight": "w-4", "para-line-h": "line-height-19" }, "Join us for live presentations and hear about the latest updates for Creo, Windchill PLM, and Thingworx IOT and Augmented Reality.")))), h("div", { class: "is-col-1" }, h("ptc-card", { "card-href": "http://www.google.com", "card-type": "listing-card", "has-image": "true", heading: "2022 SoCal RUG Event", "heading-transform": "none", "ribbon-text": "eBook", target: "_blank" }, h("ptc-img", { slot: "slot-image", "img-url": "http://s7d1.scene7.com/is/image/ptcinc/cs-boeing-planes-runway", "image-type": "smart-img", "load-mode": "lazy-bg" }), h("div", { slot: "slot-description" }, h("ptc-para", { "font-size": "medium", "font-weight": "w-4", "para-line-h": "line-height-19" }, "Join us for live presentations and hear about the latest updates for Creo, Windchill PLM, and Thingworx IOT and Augmented Reality.")))), h("div", { class: "is-col-1" }, h("ptc-card", { "card-href": "http://www.google.com", "card-type": "listing-card", "has-image": "true", heading: "2022 SoCal RUG Event", "heading-transform": "none", "ribbon-text": "eBook", target: "_blank" }, h("ptc-img", { slot: "slot-image", "img-url": "http://s7d1.scene7.com/is/image/ptcinc/cs-boeing-planes-runway", "image-type": "smart-img", "load-mode": "lazy-bg" }), h("div", { slot: "slot-description" }, h("ptc-para", { "font-size": "medium", "font-weight": "w-4", "para-line-h": "line-height-19" }, "Join us for live presentations and hear about the latest updates for Creo, Windchill PLM, and Thingworx IOT and Augmented Reality.")))))));
+    return (h(Host, null, h("ptc-preloader-section", { "section-type": "cards", "number-of-cards": "9" }, h("div", { class: "is-grid has-col-1 has-col-2-md has-col-3-lg has-col-gap-md has-row-gap-md" }, h("div", { class: "is-col-1" }, h("ptc-card", { "has-image": "true", "card-type": "case-studies-card", "card-href": "/en/events/Events-Item", heading: "[Boston Globe] Jim Heppelmann Tech Power Players Ranked #11", styles: ":host(.case-studies-card) .card-media{height:230px!important;}" }, h("ptc-picture", { slot: "slot-image", src: "http://s7d1.scene7.com/is/image/ptcinc/cs-boeing-planes-runway", "load-mode": "lazy-bg", height: "230", "is-full-width": true }), h("div", { slot: "slot-description" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-4", "para-line-h": "line-height-19", class: "hydrated" }, "For more than a decade, Jim Heppelmann has led the software company PTC as its CEO, expanding it from its roots in computer-aided design applications")), h("p", { slot: "seo-content" }, "For more than a decade, Jim Heppelmann has led the software company PTC as its CEO, expanding it from its roots in computer-aided design applications"))), h("div", { class: "is-col-1" }, h("ptc-card", { "has-image": "true", "card-type": "case-studies-card", "card-href": "/en/events/Events-Item", heading: "[Boston Globe] Jim Heppelmann Tech Power Players Ranked #11", styles: ":host(.case-studies-card) .card-media{height:230px!important;}" }, h("ptc-picture", { slot: "slot-image", src: "http://s7d1.scene7.com/is/image/ptcinc/cs-boeing-planes-runway", "load-mode": "lazy-bg", height: "230", "is-full-width": true }), h("div", { slot: "slot-description" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-4", "para-line-h": "line-height-19", class: "hydrated" }, "For more than a decade, Jim Heppelmann has led the software company PTC as its CEO, expanding it from its roots in computer-aided design applications")), h("p", { slot: "seo-content" }, "For more than a decade, Jim Heppelmann has led the software company PTC as its CEO, expanding it from its roots in computer-aided design applications"))), h("div", { class: "is-col-1" }, h("ptc-card", { "has-image": "true", "card-type": "case-studies-card", "card-href": "/en/events/Events-Item", heading: "[Boston Globe] Jim Heppelmann Tech Power Players Ranked #11", styles: ":host(.case-studies-card) .card-media{height:230px!important;}" }, h("ptc-picture", { slot: "slot-image", src: "http://s7d1.scene7.com/is/image/ptcinc/cs-boeing-planes-runway", "load-mode": "lazy-bg", height: "230", "is-full-width": true }), h("div", { slot: "slot-description" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-4", "para-line-h": "line-height-19", class: "hydrated" }, "For more than a decade, Jim Heppelmann has led the software company PTC as its CEO, expanding it from its roots in computer-aided design applications")), h("p", { slot: "seo-content" }, "For more than a decade, Jim Heppelmann has led the software company PTC as its CEO, expanding it from its roots in computer-aided design applications"))), h("div", { class: "is-col-1" }, h("ptc-card", { "has-image": "true", "card-type": "case-studies-card", "card-href": "/en/events/Events-Item", heading: "[Boston Globe] Jim Heppelmann Tech Power Players Ranked #11", styles: ":host(.case-studies-card) .card-media{height:230px!important;}" }, h("ptc-picture", { slot: "slot-image", src: "http://s7d1.scene7.com/is/image/ptcinc/cs-boeing-planes-runway", "load-mode": "lazy-bg", height: "230", "is-full-width": true }), h("div", { slot: "slot-description" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-4", "para-line-h": "line-height-19", class: "hydrated" }, "For more than a decade, Jim Heppelmann has led the software company PTC as its CEO, expanding it from its roots in computer-aided design applications")), h("p", { slot: "seo-content" }, "For more than a decade, Jim Heppelmann has led the software company PTC as its CEO, expanding it from its roots in computer-aided design applications"))), h("div", { class: "is-col-1" }, h("ptc-card", { "has-image": "true", "card-type": "case-studies-card", "card-href": "/en/events/Events-Item", heading: "[Boston Globe] Jim Heppelmann Tech Power Players Ranked #11", styles: ":host(.case-studies-card) .card-media{height:230px!important;}" }, h("ptc-picture", { slot: "slot-image", src: "http://s7d1.scene7.com/is/image/ptcinc/cs-boeing-planes-runway", "load-mode": "lazy-bg", height: "230", "is-full-width": true }), h("div", { slot: "slot-description" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-4", "para-line-h": "line-height-19", class: "hydrated" }, "For more than a decade, Jim Heppelmann has led the software company PTC as its CEO, expanding it from its roots in computer-aided design applications")), h("p", { slot: "seo-content" }, "For more than a decade, Jim Heppelmann has led the software company PTC as its CEO, expanding it from its roots in computer-aided design applications"))), h("div", { class: "is-col-1" }, h("ptc-card", { "has-image": "true", "card-type": "case-studies-card", "card-href": "/en/events/Events-Item", heading: "[Boston Globe] Jim Heppelmann Tech Power Players Ranked #11", styles: ":host(.case-studies-card) .card-media{height:230px!important;}" }, h("ptc-picture", { slot: "slot-image", src: "http://s7d1.scene7.com/is/image/ptcinc/cs-boeing-planes-runway", "load-mode": "lazy-bg", height: "230", "is-full-width": true }), h("div", { slot: "slot-description" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-4", "para-line-h": "line-height-19", class: "hydrated" }, "For more than a decade, Jim Heppelmann has led the software company PTC as its CEO, expanding it from its roots in computer-aided design applications")), h("p", { slot: "seo-content" }, "For more than a decade, Jim Heppelmann has led the software company PTC as its CEO, expanding it from its roots in computer-aided design applications"))), h("div", { class: "is-col-1" }, h("ptc-card", { "has-image": "true", "card-type": "case-studies-card", "card-href": "/en/events/Events-Item", heading: "[Boston Globe] Jim Heppelmann Tech Power Players Ranked #11", styles: ":host(.case-studies-card) .card-media{height:230px!important;}" }, h("ptc-picture", { slot: "slot-image", src: "http://s7d1.scene7.com/is/image/ptcinc/cs-boeing-planes-runway", "load-mode": "lazy-bg", height: "230", "is-full-width": true }), h("div", { slot: "slot-description" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-4", "para-line-h": "line-height-19", class: "hydrated" }, "For more than a decade, Jim Heppelmann has led the software company PTC as its CEO, expanding it from its roots in computer-aided design applications")), h("p", { slot: "seo-content" }, "For more than a decade, Jim Heppelmann has led the software company PTC as its CEO, expanding it from its roots in computer-aided design applications"))), h("div", { class: "is-col-1" }, h("ptc-card", { "has-image": "true", "card-type": "case-studies-card", "card-href": "/en/events/Events-Item", heading: "[Boston Globe] Jim Heppelmann Tech Power Players Ranked #11", styles: ":host(.case-studies-card) .card-media{height:230px!important;}" }, h("ptc-picture", { slot: "slot-image", src: "http://s7d1.scene7.com/is/image/ptcinc/cs-boeing-planes-runway", "load-mode": "lazy-bg", height: "230", "is-full-width": true }), h("div", { slot: "slot-description" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-4", "para-line-h": "line-height-19", class: "hydrated" }, "For more than a decade, Jim Heppelmann has led the software company PTC as its CEO, expanding it from its roots in computer-aided design applications")), h("p", { slot: "seo-content" }, "For more than a decade, Jim Heppelmann has led the software company PTC as its CEO, expanding it from its roots in computer-aided design applications"))), h("div", { class: "is-col-1" }, h("ptc-card", { "has-image": "true", "card-type": "case-studies-card", "card-href": "/en/events/Events-Item", heading: "[Boston Globe] Jim Heppelmann Tech Power Players Ranked #11", styles: ":host(.case-studies-card) .card-media{height:230px!important;}" }, h("ptc-picture", { slot: "slot-image", src: "http://s7d1.scene7.com/is/image/ptcinc/cs-boeing-planes-runway", "load-mode": "lazy-bg", height: "230", "is-full-width": true }), h("div", { slot: "slot-description" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-4", "para-line-h": "line-height-19", class: "hydrated" }, "For more than a decade, Jim Heppelmann has led the software company PTC as its CEO, expanding it from its roots in computer-aided design applications")), h("p", { slot: "seo-content" }, "For more than a decade, Jim Heppelmann has led the software company PTC as its CEO, expanding it from its roots in computer-aided design applications")))))));
   }
   static get is() { return "news-search-result"; }
   static get encapsulation() { return "shadow"; }

package/dist/collection/components/ptc-badge/ptc-badge.css

@@ -14,18 +14,26 @@ li {
   -ms-hyphens: manual;
 }
 
-.badge {
+.number-badge, .svg-badge {
+  position: absolute;
+  top: 0;
+  left: 0;
+  transform: translate(-50%, -50%);
+  z-index: 2;
+}
+
+.number-badge {
   background-color: var(--color-green-08);
   color: white;
   border-radius: 50%;
   padding: 0.5em;
   min-width: 1.18em;
   text-align: center;
-  position: absolute;
-  top: 0;
-  left: 0;
-  transform: translate(-50%, -50%);
-  z-index: 2;
   font-weight: var(--ptc-font-weight-bold);
   font-size: var(--ptc-font-size-x-small);
+}
+
+.svg-badge {
+  width: 35px;
+  height: 35px;
 }

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

@@ -2,9 +2,19 @@ import { Host, h } from '@stencil/core';
 export class PtcBadge {
   constructor() {
     this.number = undefined;
+    this.svgCode = undefined;
+    this.type = 'number';
+  }
+  renderContent() {
+    if (this.type === 'svg' && !!this.svgCode) {
+      return h("div", { class: "svg-badge", innerHTML: this.svgCode });
+    }
+    else if (this.type === 'number' && !!this.number) {
+      return h("div", { class: "number-badge" }, this.number);
+    }
   }
   render() {
-    return (h(Host, null, h("div", { class: "badge" }, this.number)));
+    return h(Host, null, this.renderContent());
   }
   static get is() { return "ptc-badge"; }
   static get encapsulation() { return "shadow"; }
@@ -36,6 +46,41 @@ export class PtcBadge {
         },
         "attribute": "number",
         "reflect": false
+      },
+      "svgCode": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "string",
+          "resolved": "string",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "svg-code",
+        "reflect": false
+      },
+      "type": {
+        "type": "string",
+        "mutable": false,
+        "complexType": {
+          "original": "'svg' | 'number'",
+          "resolved": "\"number\" | \"svg\"",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "type",
+        "reflect": false,
+        "defaultValue": "'number'"
       }
     };
   }

package/dist/collection/components/ptc-bio-card/ptc-bio-card.css

@@ -110,13 +110,6 @@ li {
   max-width: 27px;
   max-height: 44px;
 }
-:host .bio-card:hover {
-  box-shadow: var(--ptc-shadow-x-large);
-  cursor: pointer;
-}
-:host .bio-card:hover .bio-card__name {
-  border-bottom-color: var(--color-green-07);
-}
 :host .modal-wrap {
   display: flex;
   height: 100%;
@@ -267,4 +260,12 @@ li {
 }
 :host .social-icon:hover .cls-4 {
   fill: var(--color-green-14);
+}
+
+:host(.card-with-modal) .bio-card:hover {
+  box-shadow: var(--ptc-shadow-x-large);
+  cursor: pointer;
+}
+:host(.card-with-modal) .bio-card:hover .bio-card__name {
+  border-bottom-color: var(--color-green-07);
 }

package/dist/collection/components/ptc-bio-card/ptc-bio-card.js

@@ -7,9 +7,12 @@ export class PtcBioCard {
     this.image = undefined;
     this.linkedin = undefined;
     this.twitter = undefined;
+    this.isModal = true;
   }
   openModal() {
-    this.showModal = true;
+    if (this.isModal) {
+      this.showModal = true;
+    }
   }
   componentDidLoad() {
     let PtcModal = this.el.shadowRoot.querySelector('#bio-modal');
@@ -18,7 +21,8 @@ export class PtcBioCard {
     });
   }
   render() {
-    return (h(Host, { onClick: () => { this.openModal(); }, type: "button" }, h("div", { class: "bio-card" }, h("slot", { name: "seo-content" }), h("div", { class: "bio-card__image" }, h("img", { src: this.image, alt: `${this.name} profile image` })), h("div", { class: "bio-card__content" }, h("div", null, h("h3", { class: "bio-card__name" }, this.name), h("p", { class: "bio-card__job-title" }, this.jobTitle)), (this.linkedin || this.twitter) && (h("div", { class: "bio-card__social-links" }, this.linkedin && (h("a", { href: this.linkedin, target: "_blank", class: "tw social-icon", "aria-label": "linkedin" }, h("style", null, `.social-icon .cls-1 {  fill: url(#linear-gradient1-in);  } `), h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "36.794", viewBox: "0 0 32 36.794" }, h("defs", null, h("linearGradient", { id: "linear-gradient1-in", x1: ".5", x2: ".5", y2: "1", gradientUnits: "objectBoundingBox" }, h("stop", { offset: "0", "stop-color": "#fff" }), h("stop", { offset: "1", "stop-color": "#e5e5e5" }))), h("g", { class: "cls-1", "data-name": "Path 4255" }, h("path", { d: "M27.307 31.495H9.487L.578 15.998 9.487.5h17.82l8.91 15.498-8.91 15.497z", class: "cls-3", transform: "rotate(90 15.998 15.998)" }), h("path", { d: "M9.777 1L1.154 15.998l8.623 14.997h17.24l8.624-14.997L27.017 1H9.777M9.2 0h18.397l9.198 15.998-9.198 15.997H9.199L0 15.998 9.199 0z", class: "cls-4", transform: "rotate(90 15.998 15.998)" })), h("path", { d: "M-416.964 153.563h-2.487v-7.987h2.487zm-1.311-8.985h-.018a1.385 1.385 0 0 1-1.485-1.279v-.107a1.4 1.4 0 0 1 1.524-1.385 1.393 1.393 0 0 1 1.5 1.278v.107a1.4 1.4 0 0 1-1.521 1.386zm11.283 8.985h-2.842v-4.132c0-1.066-.441-1.819-1.421-1.819a1.422 1.422 0 0 0-1.35.977 1.82 1.82 0 0 0-.06.65v4.324h-2.778s.036-7.319 0-7.983h2.8v1.265a2.563 2.563 0 0 1 2.487-1.329c1.776 0 3.165 1.147 3.165 3.62z", class: "cls-2", "data-name": "Path 8769", transform: "translate(429.342 -128.977)" })))), this.twitter && (h("a", { href: this.twitter, target: "_blank", class: "tw social-icon", "aria-label": "twitter" }, h("style", null, `.social-icon .cls-1 {  fill: url(#linear-gradient0-tw);  } `), h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "36.794", viewBox: "0 0 32 36.794" }, h("defs", null, h("linearGradient", { id: "linear-gradient0-tw", x1: ".5", x2: ".5", y2: "1", gradientUnits: "objectBoundingBox" }, h("stop", { offset: "0", "stop-color": "#fff" }), h("stop", { offset: "1", "stop-color": "#e5e5e5" }))), h("g", { class: "cls-1", "data-name": "Path 4255" }, h("path", { d: "M27.307 31.495H9.487L.578 15.998 9.487.5h17.82l8.91 15.498-8.91 15.497z", class: "cls-3", transform: "rotate(90 15.998 15.998)" }), h("path", { d: "M9.777 1L1.154 15.998l8.623 14.997h17.24l8.624-14.997L27.017 1H9.777M9.2 0h18.397l9.198 15.998-9.198 15.997H9.199L0 15.998 9.199 0z", class: "cls-4", transform: "rotate(90 15.998 15.998)" })), h("g", { "data-name": "Group 3004", transform: "translate(9.205 13.034)" }, h("g", null, h("path", { d: "M-617.4 147a5.577 5.577 0 0 1-1.6.436 2.78 2.78 0 0 0 1.219-1.535 5.54 5.54 0 0 1-1.765.674 2.78 2.78 0 0 0-3.93-.118 2.782 2.782 0 0 0-.874 2.018 2.754 2.754 0 0 0 .072.632 7.9 7.9 0 0 1-5.73-2.9 2.784 2.784 0 0 0 .861 3.71 2.784 2.784 0 0 1-1.26-.346v.034a2.78 2.78 0 0 0 2.231 2.724 2.714 2.714 0 0 1-.734.1 2.774 2.774 0 0 1-.534-.049 2.776 2.776 0 0 0 2.6 1.93 5.619 5.619 0 0 1-4.1 1.151 7.874 7.874 0 0 0 4.259 1.249 7.844 7.844 0 0 0 7.9-7.9v-.376A5.652 5.652 0 0 0-617.4 147", class: "cls-2", "data-name": "Path 4252", transform: "translate(630.939 -145.697)" })))))))))), h("ptc-modal", { id: "bio-modal", show: this.showModal, size: "lg", "border-radius": 'large', "is-bio-modal": true, fixed: true }, h("div", { class: "modal-wrap" }, h("div", { class: "bio-modal-left" }, h("div", { class: "bio-modal__image" }, h("img", { src: this.image, alt: `${this.name} profile image` })), (this.linkedin || this.twitter) && (h("div", { class: "bio-card__social-links" }, this.linkedin && (h("a", { href: this.linkedin, target: "_blank", class: "tw social-icon", "aria-label": "linkedin" }, h("style", null, `.social-icon .cls-1 {  fill: url(#linear-gradient1-in);  } `), h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "36.794", viewBox: "0 0 32 36.794" }, h("defs", null, h("linearGradient", { id: "linear-gradient1-in", x1: ".5", x2: ".5", y2: "1", gradientUnits: "objectBoundingBox" }, h("stop", { offset: "0", "stop-color": "#fff" }), h("stop", { offset: "1", "stop-color": "#e5e5e5" }))), h("g", { class: "cls-1", "data-name": "Path 4255" }, h("path", { d: "M27.307 31.495H9.487L.578 15.998 9.487.5h17.82l8.91 15.498-8.91 15.497z", class: "cls-3", transform: "rotate(90 15.998 15.998)" }), h("path", { d: "M9.777 1L1.154 15.998l8.623 14.997h17.24l8.624-14.997L27.017 1H9.777M9.2 0h18.397l9.198 15.998-9.198 15.997H9.199L0 15.998 9.199 0z", class: "cls-4", transform: "rotate(90 15.998 15.998)" })), h("path", { d: "M-416.964 153.563h-2.487v-7.987h2.487zm-1.311-8.985h-.018a1.385 1.385 0 0 1-1.485-1.279v-.107a1.4 1.4 0 0 1 1.524-1.385 1.393 1.393 0 0 1 1.5 1.278v.107a1.4 1.4 0 0 1-1.521 1.386zm11.283 8.985h-2.842v-4.132c0-1.066-.441-1.819-1.421-1.819a1.422 1.422 0 0 0-1.35.977 1.82 1.82 0 0 0-.06.65v4.324h-2.778s.036-7.319 0-7.983h2.8v1.265a2.563 2.563 0 0 1 2.487-1.329c1.776 0 3.165 1.147 3.165 3.62z", class: "cls-2", "data-name": "Path 8769", transform: "translate(429.342 -128.977)" })))), this.twitter && (h("a", { href: this.twitter, target: "_blank", class: "tw social-icon", "aria-label": "twitter" }, h("style", null, `.social-icon .cls-1 {  fill: url(#linear-gradient0-tw);  } `), h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "36.794", viewBox: "0 0 32 36.794" }, h("defs", null, h("linearGradient", { id: "linear-gradient0-tw", x1: ".5", x2: ".5", y2: "1", gradientUnits: "objectBoundingBox" }, h("stop", { offset: "0", "stop-color": "#fff" }), h("stop", { offset: "1", "stop-color": "#e5e5e5" }))), h("g", { class: "cls-1", "data-name": "Path 4255" }, h("path", { d: "M27.307 31.495H9.487L.578 15.998 9.487.5h17.82l8.91 15.498-8.91 15.497z", class: "cls-3", transform: "rotate(90 15.998 15.998)" }), h("path", { d: "M9.777 1L1.154 15.998l8.623 14.997h17.24l8.624-14.997L27.017 1H9.777M9.2 0h18.397l9.198 15.998-9.198 15.997H9.199L0 15.998 9.199 0z", class: "cls-4", transform: "rotate(90 15.998 15.998)" })), h("g", { "data-name": "Group 3004", transform: "translate(9.205 13.034)" }, h("g", null, h("path", { d: "M-617.4 147a5.577 5.577 0 0 1-1.6.436 2.78 2.78 0 0 0 1.219-1.535 5.54 5.54 0 0 1-1.765.674 2.78 2.78 0 0 0-3.93-.118 2.782 2.782 0 0 0-.874 2.018 2.754 2.754 0 0 0 .072.632 7.9 7.9 0 0 1-5.73-2.9 2.784 2.784 0 0 0 .861 3.71 2.784 2.784 0 0 1-1.26-.346v.034a2.78 2.78 0 0 0 2.231 2.724 2.714 2.714 0 0 1-.734.1 2.774 2.774 0 0 1-.534-.049 2.776 2.776 0 0 0 2.6 1.93 5.619 5.619 0 0 1-4.1 1.151 7.874 7.874 0 0 0 4.259 1.249 7.844 7.844 0 0 0 7.9-7.9v-.376A5.652 5.652 0 0 0-617.4 147", class: "cls-2", "data-name": "Path 4252", transform: "translate(630.939 -145.697)" }))))))))), h("div", { class: "bio-modal-right" }, h("div", { class: "bio-modal-header" }, h("h2", { class: "bio-card__name" }, this.name), h("p", { class: "bio-card__job-title" }, this.jobTitle)), h("div", { class: "bio-modal-description" }, h("slot", null)))))));
+    return (h(Host, { onClick: () => { this.openModal(); }, type: "button", class: this.isModal ? 'card-with-modal' : '' }, h("div", { class: "bio-card" }, h("slot", { name: "seo-content" }), h("div", { class: "bio-card__image" }, h("img", { src: this.image, alt: `${this.name} profile image` })), h("div", { class: "bio-card__content" }, h("div", null, h("h3", { class: "bio-card__name" }, this.name), h("p", { class: "bio-card__job-title" }, this.jobTitle)), (this.linkedin || this.twitter) && (h("div", { class: "bio-card__social-links" }, this.linkedin && (h("a", { href: this.linkedin, target: "_blank", class: "tw social-icon", "aria-label": "linkedin" }, h("style", null, `.social-icon .cls-1 {  fill: url(#linear-gradient1-in);  } `), h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "36.794", viewBox: "0 0 32 36.794" }, h("defs", null, h("linearGradient", { id: "linear-gradient1-in", x1: ".5", x2: ".5", y2: "1", gradientUnits: "objectBoundingBox" }, h("stop", { offset: "0", "stop-color": "#fff" }), h("stop", { offset: "1", "stop-color": "#e5e5e5" }))), h("g", { class: "cls-1", "data-name": "Path 4255" }, h("path", { d: "M27.307 31.495H9.487L.578 15.998 9.487.5h17.82l8.91 15.498-8.91 15.497z", class: "cls-3", transform: "rotate(90 15.998 15.998)" }), h("path", { d: "M9.777 1L1.154 15.998l8.623 14.997h17.24l8.624-14.997L27.017 1H9.777M9.2 0h18.397l9.198 15.998-9.198 15.997H9.199L0 15.998 9.199 0z", class: "cls-4", transform: "rotate(90 15.998 15.998)" })), h("path", { d: "M-416.964 153.563h-2.487v-7.987h2.487zm-1.311-8.985h-.018a1.385 1.385 0 0 1-1.485-1.279v-.107a1.4 1.4 0 0 1 1.524-1.385 1.393 1.393 0 0 1 1.5 1.278v.107a1.4 1.4 0 0 1-1.521 1.386zm11.283 8.985h-2.842v-4.132c0-1.066-.441-1.819-1.421-1.819a1.422 1.422 0 0 0-1.35.977 1.82 1.82 0 0 0-.06.65v4.324h-2.778s.036-7.319 0-7.983h2.8v1.265a2.563 2.563 0 0 1 2.487-1.329c1.776 0 3.165 1.147 3.165 3.62z", class: "cls-2", "data-name": "Path 8769", transform: "translate(429.342 -128.977)" })))), this.twitter && (h("a", { href: this.twitter, target: "_blank", class: "tw social-icon", "aria-label": "twitter" }, h("style", null, `.social-icon .cls-1 {  fill: url(#linear-gradient0-tw);  } `), h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "36.794", viewBox: "0 0 32 36.794" }, h("defs", null, h("linearGradient", { id: "linear-gradient0-tw", x1: ".5", x2: ".5", y2: "1", gradientUnits: "objectBoundingBox" }, h("stop", { offset: "0", "stop-color": "#fff" }), h("stop", { offset: "1", "stop-color": "#e5e5e5" }))), h("g", { class: "cls-1", "data-name": "Path 4255" }, h("path", { d: "M27.307 31.495H9.487L.578 15.998 9.487.5h17.82l8.91 15.498-8.91 15.497z", class: "cls-3", transform: "rotate(90 15.998 15.998)" }), h("path", { d: "M9.777 1L1.154 15.998l8.623 14.997h17.24l8.624-14.997L27.017 1H9.777M9.2 0h18.397l9.198 15.998-9.198 15.997H9.199L0 15.998 9.199 0z", class: "cls-4", transform: "rotate(90 15.998 15.998)" })), h("g", { "data-name": "Group 3004", transform: "translate(9.205 13.034)" }, h("g", null, h("path", { d: "M-617.4 147a5.577 5.577 0 0 1-1.6.436 2.78 2.78 0 0 0 1.219-1.535 5.54 5.54 0 0 1-1.765.674 2.78 2.78 0 0 0-3.93-.118 2.782 2.782 0 0 0-.874 2.018 2.754 2.754 0 0 0 .072.632 7.9 7.9 0 0 1-5.73-2.9 2.784 2.784 0 0 0 .861 3.71 2.784 2.784 0 0 1-1.26-.346v.034a2.78 2.78 0 0 0 2.231 2.724 2.714 2.714 0 0 1-.734.1 2.774 2.774 0 0 1-.534-.049 2.776 2.776 0 0 0 2.6 1.93 5.619 5.619 0 0 1-4.1 1.151 7.874 7.874 0 0 0 4.259 1.249 7.844 7.844 0 0 0 7.9-7.9v-.376A5.652 5.652 0 0 0-617.4 147", class: "cls-2", "data-name": "Path 4252", transform: "translate(630.939 -145.697)" })))))))))), this.isModal &&
+      h("ptc-modal", { id: "bio-modal", show: this.showModal, size: "lg", "border-radius": 'large', "is-bio-modal": true, fixed: true }, h("div", { class: "modal-wrap" }, h("div", { class: "bio-modal-left" }, h("div", { class: "bio-modal__image" }, h("img", { src: this.image, alt: `${this.name} profile image` })), (this.linkedin || this.twitter) && (h("div", { class: "bio-card__social-links" }, this.linkedin && (h("a", { href: this.linkedin, target: "_blank", class: "tw social-icon", "aria-label": "linkedin" }, h("style", null, `.social-icon .cls-1 {  fill: url(#linear-gradient1-in);  } `), h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "36.794", viewBox: "0 0 32 36.794" }, h("defs", null, h("linearGradient", { id: "linear-gradient1-in", x1: ".5", x2: ".5", y2: "1", gradientUnits: "objectBoundingBox" }, h("stop", { offset: "0", "stop-color": "#fff" }), h("stop", { offset: "1", "stop-color": "#e5e5e5" }))), h("g", { class: "cls-1", "data-name": "Path 4255" }, h("path", { d: "M27.307 31.495H9.487L.578 15.998 9.487.5h17.82l8.91 15.498-8.91 15.497z", class: "cls-3", transform: "rotate(90 15.998 15.998)" }), h("path", { d: "M9.777 1L1.154 15.998l8.623 14.997h17.24l8.624-14.997L27.017 1H9.777M9.2 0h18.397l9.198 15.998-9.198 15.997H9.199L0 15.998 9.199 0z", class: "cls-4", transform: "rotate(90 15.998 15.998)" })), h("path", { d: "M-416.964 153.563h-2.487v-7.987h2.487zm-1.311-8.985h-.018a1.385 1.385 0 0 1-1.485-1.279v-.107a1.4 1.4 0 0 1 1.524-1.385 1.393 1.393 0 0 1 1.5 1.278v.107a1.4 1.4 0 0 1-1.521 1.386zm11.283 8.985h-2.842v-4.132c0-1.066-.441-1.819-1.421-1.819a1.422 1.422 0 0 0-1.35.977 1.82 1.82 0 0 0-.06.65v4.324h-2.778s.036-7.319 0-7.983h2.8v1.265a2.563 2.563 0 0 1 2.487-1.329c1.776 0 3.165 1.147 3.165 3.62z", class: "cls-2", "data-name": "Path 8769", transform: "translate(429.342 -128.977)" })))), this.twitter && (h("a", { href: this.twitter, target: "_blank", class: "tw social-icon", "aria-label": "twitter" }, h("style", null, `.social-icon .cls-1 {  fill: url(#linear-gradient0-tw);  } `), h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "32", height: "36.794", viewBox: "0 0 32 36.794" }, h("defs", null, h("linearGradient", { id: "linear-gradient0-tw", x1: ".5", x2: ".5", y2: "1", gradientUnits: "objectBoundingBox" }, h("stop", { offset: "0", "stop-color": "#fff" }), h("stop", { offset: "1", "stop-color": "#e5e5e5" }))), h("g", { class: "cls-1", "data-name": "Path 4255" }, h("path", { d: "M27.307 31.495H9.487L.578 15.998 9.487.5h17.82l8.91 15.498-8.91 15.497z", class: "cls-3", transform: "rotate(90 15.998 15.998)" }), h("path", { d: "M9.777 1L1.154 15.998l8.623 14.997h17.24l8.624-14.997L27.017 1H9.777M9.2 0h18.397l9.198 15.998-9.198 15.997H9.199L0 15.998 9.199 0z", class: "cls-4", transform: "rotate(90 15.998 15.998)" })), h("g", { "data-name": "Group 3004", transform: "translate(9.205 13.034)" }, h("g", null, h("path", { d: "M-617.4 147a5.577 5.577 0 0 1-1.6.436 2.78 2.78 0 0 0 1.219-1.535 5.54 5.54 0 0 1-1.765.674 2.78 2.78 0 0 0-3.93-.118 2.782 2.782 0 0 0-.874 2.018 2.754 2.754 0 0 0 .072.632 7.9 7.9 0 0 1-5.73-2.9 2.784 2.784 0 0 0 .861 3.71 2.784 2.784 0 0 1-1.26-.346v.034a2.78 2.78 0 0 0 2.231 2.724 2.714 2.714 0 0 1-.734.1 2.774 2.774 0 0 1-.534-.049 2.776 2.776 0 0 0 2.6 1.93 5.619 5.619 0 0 1-4.1 1.151 7.874 7.874 0 0 0 4.259 1.249 7.844 7.844 0 0 0 7.9-7.9v-.376A5.652 5.652 0 0 0-617.4 147", class: "cls-2", "data-name": "Path 4252", transform: "translate(630.939 -145.697)" }))))))))), h("div", { class: "bio-modal-right" }, h("div", { class: "bio-modal-header" }, h("h2", { class: "bio-card__name" }, this.name), h("p", { class: "bio-card__job-title" }, this.jobTitle)), h("div", { class: "bio-modal-description" }, h("slot", null)))))));
   }
   static get is() { return "ptc-bio-card"; }
   static get encapsulation() { return "shadow"; }
@@ -118,6 +122,24 @@ export class PtcBioCard {
         },
         "attribute": "twitter",
         "reflect": false
+      },
+      "isModal": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "is-modal",
+        "reflect": false,
+        "defaultValue": "true"
       }
     };
   }

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

@@ -16,6 +16,7 @@ export class PtcFormCheckbox {
     this.ptcDataEloquaName = undefined;
     this.hasError = false;
     this.language = 'en';
+    this.ignoreBlindSubmit = false;
   }
   handleChange(event) {
     if (this.disabled) {
@@ -60,7 +61,7 @@ export class PtcFormCheckbox {
           this.mdcCheckbox = mdcCheckbox;
         } }, h("input", Object.assign({ id: this.checkboxId, ref: checkboxInput => {
           this.checkboxInput = checkboxInput;
-        }, type: "checkbox" }, (this.isRequired ? { required: true } : { required: false }), { "data-eloqua-name": this.ptcDataEloquaName, class: "mdc-checkbox__native-control", onChange: this.handleChange.bind(this) })), h("div", { class: "mdc-checkbox__background" }, h("svg", { class: "mdc-checkbox__checkmark", viewBox: "0 0 24 24" }, h("path", { class: "mdc-checkbox__checkmark-path", fill: "none", d: "M1.73,12.91 8.1,19.28 22.79,4.59" })), h("div", { class: "mdc-checkbox__mixedmark" })), h("div", { class: "mdc-checkbox__ripple" })), h("label", { htmlFor: this.checkboxId, innerHTML: this.label })),
+        }, type: "checkbox" }, (this.isRequired ? { required: true } : { required: false }), (this.ignoreBlindSubmit ? { ignoreBlindSubmit: true } : null), { "data-eloqua-name": this.ptcDataEloquaName, class: "mdc-checkbox__native-control", onChange: this.handleChange.bind(this) })), h("div", { class: "mdc-checkbox__background" }, h("svg", { class: "mdc-checkbox__checkmark", viewBox: "0 0 24 24" }, h("path", { class: "mdc-checkbox__checkmark-path", fill: "none", d: "M1.73,12.91 8.1,19.28 22.79,4.59" })), h("div", { class: "mdc-checkbox__mixedmark" })), h("div", { class: "mdc-checkbox__ripple" })), h("label", { htmlFor: this.checkboxId, innerHTML: this.label })),
       this.hasError ? (h("div", { class: "checkbox-helper-wrapper" }, h("p", { id: this.name }, h("svg", { class: "select-error-svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { "clip-path": "url(#clip0_12_1424)" }, h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.3156 0L16 4.68444V11.3156L11.3156 16H4.68444L0 11.3156V4.68444L4.68444 0H11.3156ZM8 10.4C7.36 10.4 6.84444 10.9156 6.84444 11.5556C6.84444 12.1956 7.36 12.7111 8 12.7111C8.64 12.7111 9.15556 12.1956 9.15556 11.5556C9.15556 10.9156 8.64 10.4 8 10.4ZM8.88889 3.55556H7.11111V8.88889H8.88889V3.55556Z", fill: "#AF3231" })), h("defs", null, h("clipPath", { id: "clip0_12_1424" }, h("rect", { width: "16", height: "16", fill: "white" })))), this.helpertext))) : null,
     ];
   }
@@ -234,6 +235,24 @@ export class PtcFormCheckbox {
         },
         "attribute": "ptc-data-eloqua-name",
         "reflect": false
+      },
+      "ignoreBlindSubmit": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "attribute": "ignore-blind-submit",
+        "reflect": false,
+        "defaultValue": "false"
       }
     };
   }

package/dist/collection/components/ptc-nav-tile/ptc-nav-tile.css

@@ -0,0 +1,43 @@
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+p,
+ul,
+li {
+  word-break: break-word;
+  hyphens: manual;
+  -webkit-hyphens: manual;
+  -moz-hyphens: manual;
+  -ms-hyphens: manual;
+}
+
+:host {
+  display: block;
+}
+
+.nav-link-group {
+  display: inline-block;
+  padding: 12px 16px;
+  border-radius: var(--ptc-border-radius-standard);
+  background: var(--color-gray-02);
+  /* Drop Shadow (Small) */
+  box-shadow: 0px 2px 6px 0px rgba(0, 0, 0, 0.24);
+}
+.nav-link-group .nav-title-link {
+  color: var(--color-gray-10);
+  font-family: var(--ptc-font-latin);
+  font-size: var(--ptc-font-size-x-small);
+  font-weight: var(--ptc-font-weight-semibold);
+  line-height: var(--ptc-line-height-densest);
+  margin: 0 16px;
+  text-decoration: none;
+  outline: none;
+}
+.nav-link-group .nav-title-link:hover, .nav-link-group .nav-title-link:visited {
+  color: var(--color-gray-10);
+  text-decoration: none;
+  outline: none;
+}

package/dist/collection/components/ptc-nav-tile/ptc-nav-tile.js

@@ -0,0 +1,40 @@
+import { Host, h } from '@stencil/core';
+export class PtcNavTile {
+  constructor() {
+    this.navLinks = [];
+  }
+  render() {
+    return (h(Host, null, h("div", { class: "nav-link-group" }, this.navLinks.map((link) => (h("a", { href: link.url, class: "nav-title-link" }, link.title))))));
+  }
+  static get is() { return "ptc-nav-tile"; }
+  static get originalStyleUrls() {
+    return {
+      "$": ["ptc-nav-tile.scss"]
+    };
+  }
+  static get styleUrls() {
+    return {
+      "$": ["ptc-nav-tile.css"]
+    };
+  }
+  static get properties() {
+    return {
+      "navLinks": {
+        "type": "unknown",
+        "mutable": false,
+        "complexType": {
+          "original": "{ title: string; url: string} []",
+          "resolved": "{ title: string; url: string; }[]",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": ""
+        },
+        "defaultValue": "[]"
+      }
+    };
+  }
+}