@ptcwebops/ptcw-design 6.3.65-beta → 6.3.68-beta

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

@@ -1,10 +1,10 @@
-import { Host, h } from '@stencil/core';
+import { Host, h, } from "@stencil/core";
 export class PtcJumbotron {
   constructor() {
-    this.jumbotronType = 'light';
+    this.jumbotronType = "light";
     this.hasPopupVideo = false;
-    this.mainTitle = 'Lorem Ipsum Dolor Sit Amet Consectetur';
-    this.subTitle = 'Lorem Ipsum Dolor Sit Amet Consectetur Adipiscing Lorem Ipsum Dolor Sit Amet Consectetur Adipisci Lorem Ipsum Dolor Sit Amet';
+    this.mainTitle = "Lorem Ipsum Dolor Sit Amet Consectetur";
+    this.subTitle = "Lorem Ipsum Dolor Sit Amet Consectetur Adipiscing Lorem Ipsum Dolor Sit Amet Consectetur Adipisci Lorem Ipsum Dolor Sit Amet";
     this.pngSrc = undefined;
     this.pngImgStyles = "";
     this.gifSrc = undefined;
@@ -19,7 +19,7 @@ export class PtcJumbotron {
     this.buttonTabIndex = 0;
     this.contentBackground = undefined;
     this.contentColor = undefined;
-    this.textAlign = 'left';
+    this.textAlign = "left";
     this.isMobile = undefined;
     this.isTransitioning = undefined;
     this.blogAuthorImage = "";
@@ -54,89 +54,123 @@ export class PtcJumbotron {
     const classMap = this.getCssClassMap();
     let mediaElement;
     switch (this.jumbotronType) {
-      case 'png':
-        mediaElement = (h("div", { class: "mobile-media-image" }, h("div", { class: "media-image-wrapper" }, h("ptc-picture", { src: this.pngSrc }), this.hasPopupVideo && this.isMobile ? h("slot", { name: "video" }) : null)));
+      case "png":
+        mediaElement = (h("div", { class: "mobile-media-image" }, h("div", { class: "media-image-wrapper" }, h("ptc-picture", { src: this.pngSrc }), this.hasPopupVideo && this.isMobile ? (h("slot", { name: "video" })) : null)));
         break;
-      case 'blog':
+      case "blog":
         mediaElement = (h("div", { class: "mobile-media-image" }, h("div", { class: "media-image-wrapper" }, h("ptc-picture", { "is-full-width": true, src: this.pngSrc, styles: "img {height: 100%;}" }))));
         break;
-      case 'gif':
+      case "gif":
         mediaElement = (h("div", { class: "mobile-media-image gif-bg" }, h("img", { src: this.gifSrc })));
         break;
-      case 'dark-video':
-      case 'light-video':
-        mediaElement = (h("ptc-background-video", { class: "video-ratio", overlay: false, "video-src": this.bgVideoSrc, isIframe: this.isIframe, "play-button-title": this.playButtonTitle, "pause-button-title": this.pauseButtonTitle, "button-location": this.buttonLocation, "button-tab-index": this.buttonTabIndex, defer: this.defer, posterSrc: this.bgVideoPosterSrc }, ' ', this.hasPopupVideo && this.isMobile ? (h("div", { class: "mobile-modal-play-btn" }, ' ', h("slot", { name: "video" }))) : null));
+      case "dark-video":
+      case "light-video":
+        mediaElement = (h("ptc-background-video", { class: "video-ratio", overlay: false, "video-src": this.bgVideoSrc, isIframe: this.isIframe, "play-button-title": this.playButtonTitle, "pause-button-title": this.pauseButtonTitle, "button-location": this.buttonLocation, "button-tab-index": this.buttonTabIndex, defer: this.defer, posterSrc: this.bgVideoPosterSrc }, " ", this.hasPopupVideo && this.isMobile ? (h("div", { class: "mobile-modal-play-btn" }, " ", h("slot", { name: "video" }))) : null));
         break;
-      case 'dark':
-      case 'light':
-        mediaElement = (h("div", { class: 'dl-img-wrap' }, h("ptc-img", { "img-url": this.bgSrc, "enable-lazy-load": this.enableLazy, styles: ".smart-bg{background-position:right !important;}" }), this.hasPopupVideo && this.isMobile ? (h("div", { class: "mobile-modal-play-btn" }, ' ', h("slot", { name: "video" }))) : null));
+      case "dark":
+      case "light":
+        mediaElement = (h("div", { class: "dl-img-wrap" }, h("ptc-img", { "img-url": this.bgSrc, "enable-lazy-load": this.enableLazy, styles: ".smart-bg{background-position:right !important;}" }), this.hasPopupVideo && this.isMobile ? (h("div", { class: "mobile-modal-play-btn" }, " ", h("slot", { name: "video" }))) : null));
         break;
       default:
-        mediaElement = h("ptc-img", { "img-url": this.bgSrc, "enable-lazy-load": this.enableLazy, styles: ".smart-bg{background-position:right !important;}" });
+        mediaElement = (h("ptc-img", { "img-url": this.bgSrc, "enable-lazy-load": this.enableLazy, styles: ".smart-bg{background-position:right !important;}" }));
     }
-    return (h(Host, { class: classMap }, this.styles && h("style", null, this.styles), h("div", { class: { 'parent': true, 'light-links': this.jumbotronType === 'dark' || this.jumbotronType === 'dark-video', 'hp-adjustments': this.isHomepage, 'transitioning': this.isTransitioning } }, h("div", { class: `div1 image-container ${this.jumbotronType === 'text' ? 'hidden' : ''}` }, mediaElement), h("div", { class: "div2 content-container" }, h("div", { class: "bg-overlay", style: { background: this.contentBackground } }), h("div", { class: { "ptc-container": true, "content-layout": true, 'hp-container': this.isHomepage, 'blog-container': (this.jumbotronType === "blog") } }, h("max-width-container", { "max-width-p": "60", breakpoint: 992, "content-align": this.jumbotronType === 'text' ? 'center' : this.textAlign, styles: ":host{z-index: 999}" }, h("slot", { name: "breadcrumb" }), !!this.logo && h("div", { class: "logo-frame" }, h("img", { alt: "Logo", src: this.logo })), h("span", { class: "main-content-items" }, h("ptc-spacer", { breakpoint: "small", size: "small" }), h("ptc-spacer", { breakpoint: "x-small", size: "medium" }), h("slot", { name: "main-title" }), h("slot", { name: "hp-sub-title" }), (this.jumbotronType !== 'text' || (this.jumbotronType === 'text' && this.subTitle)) && (!this.isHomepage) && (h("div", null, h("ptc-spacer", { breakpoint: "small", size: "small" }), h("ptc-spacer", { breakpoint: "x-small", size: "medium" }))), !this.isHomepage && (h("ptc-para", { styles: `p{color: ${this.contentColor}!important;}`, "font-size": this.jumbotronType === 'text' && this.isMobile ? 'x-small' : 'small', "font-weight": "w-4", "para-margin": `${this.jumbotronType === 'text' || this.jumbotronType === 'blog' ? 'margin-flush' : 'margin-bottom-6'}`, "para-color": "white", "para-line-h": "line-height-p", "para-align": this.jumbotronType === 'text' ? 'center' : 'left', "seo-compatibility-mode": true }, h("p", { innerHTML: this.subTitle, style: { margin: '0' } }), h("p", { style: { margin: '0' } }, h("slot", { name: "blog-date" })), this.jumbotronType === 'blog' && h("div", null, h("ptc-spacer", { breakpoint: 'x-small', size: 'medium' }), h("ptc-spacer", { breakpoint: 'small', size: 'small' }), h("div", { id: "header-blog-author", slot: "blog-author" }, h("div", { class: "image" }, h("img", { alt: this.blogAuthorImageAlt, src: this.blogAuthorImage })), h("ptc-para", { "font-size": "small", "font-weight": "w-4", "para-color": "primary-grey", "para-line-h": "line-height-p", "para-margin": "margin-flush" }, h("a", { class: "blog-author-name mf-listen", tabindex: "0", href: this.blogAuthorQueryHref, target: this.blogAuthorQueryTarget, "aria-label": "Other blogs by author" }, this.blogAuthorName)))))), this.hasCtaSlot && (h("div", { class: `u-flex u-flex-wrap gap-adjustment${this.jumbotronType === 'text' ? ' text-adjustment' : ''}` }, h("slot", { name: "j-cta" }))))), this.hasPopupVideo && this.jumbotronType !== 'png' ? h("slot", { name: "video" }) : null, this.hasCountdown ? h("slot", { name: "countdown" }) : null, this.jumbotronType === 'png' ? (h("div", { class: "desktop-media-image" }, h("div", { class: "media-image-wrapper" }, h("ptc-picture", { "is-full-width": true, src: this.pngSrc, styles: `img {${this.pngImgStyles}}` }), this.hasPopupVideo ? h("slot", { name: "video" }) : null))) : null, this.jumbotronType === 'gif' ? (h("div", { class: "desktop-media-image desk-gif-adjustment" }, h("img", { src: this.gifSrc }))) : null, this.jumbotronType === 'blog' ? (h("div", { class: "desktop-media-image" }, h("div", { class: "media-image-wrapper" }, h("ptc-picture", { "is-full-width": true, src: this.pngSrc, styles: "img {height: 100%;}" })))) : null)))));
+    return (h(Host, { class: classMap }, this.styles && h("style", null, this.styles), h("div", { class: {
+        parent: true,
+        "light-links": this.jumbotronType === "dark" ||
+          this.jumbotronType === "dark-video",
+        "hp-adjustments": this.isHomepage,
+        transitioning: this.isTransitioning,
+      } }, h("div", { class: `div1 image-container ${this.jumbotronType === "text" ? "hidden" : ""}` }, mediaElement), h("div", { class: "div2 content-container" }, h("div", { class: "bg-overlay", style: { background: this.contentBackground } }), h("div", { class: {
+        "ptc-container": true,
+        "content-layout": true,
+        "hp-container": this.isHomepage,
+        "blog-container": this.jumbotronType === "blog",
+      } }, h("max-width-container", { "max-width-p": "60", breakpoint: 992, "content-align": this.jumbotronType === "text"
+        ? "center"
+        : this.textAlign, styles: ":host{z-index: 999}" }, h("slot", { name: "breadcrumb" }), !!this.logo && (h("div", { class: "logo-frame" }, h("img", { alt: "Logo", src: this.logo }))), h("span", { class: "main-content-items" }, h("ptc-spacer", { breakpoint: "small", size: "small" }), h("ptc-spacer", { breakpoint: "x-small", size: "medium" }), h("slot", { name: "main-title" }), h("slot", { name: "hp-sub-title" }), (this.jumbotronType !== "text" ||
+      (this.jumbotronType === "text" &&
+        this.subTitle)) &&
+      !this.isHomepage && (h("div", null, h("ptc-spacer", { breakpoint: "small", size: "small" }), h("ptc-spacer", { breakpoint: "x-small", size: "medium" }))), !this.isHomepage && (h("ptc-para", { styles: `p{color: ${this.contentColor}!important;}`, "font-size": this.jumbotronType === "text" &&
+        this.isMobile
+        ? "x-small"
+        : "small", "font-weight": "w-4", "para-margin": `${this.jumbotronType === "text" ||
+        this.jumbotronType === "blog"
+        ? "margin-flush"
+        : "margin-bottom-6"}`, "para-color": "white", "para-line-h": "line-height-p", "para-align": this.jumbotronType === "text"
+        ? "center"
+        : "left", "seo-compatibility-mode": true }, h("p", { innerHTML: this.subTitle, style: { margin: "0" } }), h("p", { style: { margin: "0" } }, h("slot", { name: "blog-date" })), this.jumbotronType === "blog" && (h("div", null, h("ptc-spacer", { breakpoint: "x-small", size: "medium" }), h("ptc-spacer", { breakpoint: "small", size: "small" }), h("div", { id: "header-blog-author", slot: "blog-author" }, h("div", { class: "image" }, h("img", { alt: this
+        .blogAuthorImageAlt, src: this
+        .blogAuthorImage })), h("ptc-para", { "font-size": "small", "font-weight": "w-4", "para-color": "primary-grey", "para-line-h": "line-height-p", "para-margin": "margin-flush" }, h("a", { class: "blog-author-name mf-listen", tabindex: "0", href: this
+        .blogAuthorQueryHref, target: this
+        .blogAuthorQueryTarget, "aria-label": "Other blogs by author" }, this
+      .blogAuthorName))))))), this.hasCtaSlot && (h("div", { class: `u-flex u-flex-wrap gap-adjustment${this.jumbotronType === "text"
+        ? " text-adjustment"
+        : ""}` }, h("slot", { name: "j-cta" }))))), this.hasPopupVideo &&
+      this.jumbotronType !== "png" ? (h("slot", { name: "video" })) : null, this.hasCountdown ? (h("slot", { name: "countdown" })) : null, this.jumbotronType === "png" ? (h("div", { class: "desktop-media-image" }, h("div", { class: "media-image-wrapper" }, h("ptc-picture", { "is-full-width": true, src: this.pngSrc, styles: `img {${this.pngImgStyles}}` }), this.hasPopupVideo ? (h("slot", { name: "video" })) : null))) : null, this.jumbotronType === "gif" ? (h("div", { class: "desktop-media-image desk-gif-adjustment" }, h("img", { src: this.gifSrc }))) : null, this.jumbotronType === "blog" ? (h("div", { class: "desktop-media-image" }, h("div", { class: "media-image-wrapper" }, h("ptc-picture", { "is-full-width": true, src: this.pngSrc, styles: "img {height: 100%;}" })))) : null)))));
   }
   getCssClassMap() {
     return {
       // [this.imageZIndex] : true
-      'text-jumbotron': this.jumbotronType === 'text' ? true : false,
-      'png-jumbotron': this.jumbotronType === 'png' ? true : false,
-      'blog-jumbotron': this.jumbotronType === 'blog' ? true : false,
-      'gif-jumbotron': this.jumbotronType === 'gif' ? true : false,
-      'dark-video-jumbotron light-links': this.jumbotronType === 'dark-video' ? true : false,
-      'light-video-jumbotron': this.jumbotronType === 'light-video' ? true : false,
-      'dark-jumbotron light-links': this.jumbotronType === 'dark' ? true : false,
-      'light-jumbotron': this.jumbotronType === 'light' ? true : false,
+      "text-jumbotron": this.jumbotronType === "text" ? true : false,
+      "png-jumbotron": this.jumbotronType === "png" ? true : false,
+      "blog-jumbotron": this.jumbotronType === "blog" ? true : false,
+      "gif-jumbotron": this.jumbotronType === "gif" ? true : false,
+      "dark-video-jumbotron light-links": this.jumbotronType === "dark-video" ? true : false,
+      "light-video-jumbotron": this.jumbotronType === "light-video" ? true : false,
+      "dark-jumbotron light-links": this.jumbotronType === "dark" ? true : false,
+      "light-jumbotron": this.jumbotronType === "light" ? true : false,
     };
   }
   getContentBackground() {
     if (window.innerWidth < 992) {
       switch (this.jumbotronType) {
-        case 'light':
-        case 'light-video':
-        case 'png':
-          this.contentBackground = 'var(--color-white)';
-          this.contentColor = 'var(--color-gray-10)';
+        case "light":
+        case "light-video":
+        case "png":
+          this.contentBackground = "var(--color-white)";
+          this.contentColor = "var(--color-gray-10)";
           break;
-        case 'dark':
-        case 'dark-video':
-          this.contentBackground = 'var(--color-gray-09)';
-          this.contentColor = 'var(--color-gray-01)';
+        case "dark":
+        case "dark-video":
+          this.contentBackground = "var(--color-gray-09)";
+          this.contentColor = "var(--color-gray-01)";
           break;
-        case 'blog':
-          this.contentBackground = 'white';
-          this.contentColor = 'var(--color-gray-10)';
+        case "blog":
+          this.contentBackground = "white";
+          this.contentColor = "var(--color-gray-10)";
           break;
         default:
-          this.contentBackground = 'transparent';
-          this.contentColor = 'var(--color-gray-10)';
+          this.contentBackground = "transparent";
+          this.contentColor = "var(--color-gray-10)";
       }
       this.isMobile = true;
     }
     else {
       switch (this.jumbotronType) {
-        case 'light':
-        case 'light-video':
-        case 'png':
-          this.contentBackground = 'linear-gradient(90.19deg, rgba(255, 255, 255, 0.9) 62.55%, rgba(228, 231, 233, 0) 99.86%)';
-          this.contentColor = 'var(--color-gray-10)';
+        case "light":
+        case "light-video":
+        case "png":
+          this.contentBackground =
+            "linear-gradient(90.19deg, rgba(255, 255, 255, 0.9) 62.55%, rgba(228, 231, 233, 0) 99.86%)";
+          this.contentColor = "var(--color-gray-10)";
           break;
-        case 'dark':
-        case 'dark-video':
-          this.contentBackground = 'linear-gradient(90deg, rgba(0, 0, 0, 0.63) 52.42%, rgba(40, 47, 53, 0) 100%)';
-          this.contentColor = 'var(--color-gray-01)';
+        case "dark":
+        case "dark-video":
+          this.contentBackground =
+            "linear-gradient(90deg, rgba(0, 0, 0, 0.63) 52.42%, rgba(40, 47, 53, 0) 100%)";
+          this.contentColor = "var(--color-gray-01)";
           break;
-        case 'gif':
-          this.contentBackground = '#F3F3F3';
-          this.contentColor = 'var(--color-gray-10)';
+        case "gif":
+          this.contentBackground = "#F3F3F3";
+          this.contentColor = "var(--color-gray-10)";
           break;
-        case 'blog':
-          this.contentBackground = 'white';
-          this.contentColor = 'var(--color-gray-10)';
+        case "blog":
+          this.contentBackground = "white";
+          this.contentColor = "var(--color-gray-10)";
           break;
         default:
-          this.contentBackground = 'transparent';
-          this.contentColor = 'var(--color-gray-10)';
+          this.contentBackground = "transparent";
+          this.contentColor = "var(--color-gray-10)";
       }
       this.isMobile = false;
     }
@@ -171,7 +205,7 @@ export class PtcJumbotron {
         },
         "attribute": "jumbotron-type",
         "reflect": false,
-        "defaultValue": "'light'"
+        "defaultValue": "\"light\""
       },
       "hasPopupVideo": {
         "type": "boolean",
@@ -207,7 +241,7 @@ export class PtcJumbotron {
         },
         "attribute": "main-title",
         "reflect": false,
-        "defaultValue": "'Lorem Ipsum Dolor Sit Amet Consectetur'"
+        "defaultValue": "\"Lorem Ipsum Dolor Sit Amet Consectetur\""
       },
       "subTitle": {
         "type": "string",
@@ -225,7 +259,7 @@ export class PtcJumbotron {
         },
         "attribute": "sub-title",
         "reflect": false,
-        "defaultValue": "'Lorem Ipsum Dolor Sit Amet Consectetur Adipiscing Lorem Ipsum Dolor Sit Amet Consectetur Adipisci Lorem Ipsum Dolor Sit Amet'"
+        "defaultValue": "\"Lorem Ipsum Dolor Sit Amet Consectetur Adipiscing Lorem Ipsum Dolor Sit Amet Consectetur Adipisci Lorem Ipsum Dolor Sit Amet\""
       },
       "pngSrc": {
         "type": "string",

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

@@ -9,8 +9,10 @@ ul,
 li,
 ptc-subnav,
 ptc-tab-list,
-ptc-link, ptc-square-card,
-.hyphenate-text, ptc-footer {
+ptc-link,
+ptc-square-card,
+.hyphenate-text,
+ptc-footer {
   word-break: break-word;
   hyphens: manual;
   -webkit-hyphens: manual;
@@ -29,8 +31,10 @@ ul,
 li,
 ptc-subnav,
 ptc-tab-list,
-ptc-link, ptc-square-card,
-.hyphenate-text, ptc-footer {
+ptc-link,
+ptc-square-card,
+.hyphenate-text,
+ptc-footer {
     hyphens: auto;
     -webkit-hyphenate-limit-before: 3;
     /* For Safari */
@@ -169,8 +173,8 @@ ptc-link, ptc-square-card,
   border-bottom: 2px solid var(--color-green-06);
 }
 .underline:hover {
-  color: #00890B;
-  border-bottom: 2px solid #00890B;
+  color: #00890b;
+  border-bottom: 2px solid #00890b;
 }
 .underline:active {
   transition: none;
@@ -417,7 +421,8 @@ ptc-link, ptc-square-card,
   z-index: 2;
 }
 
-.standard-link, .blog-link {
+.standard-link,
+.blog-link {
   font-weight: 800;
   line-height: 1;
   display: flex;
@@ -429,10 +434,12 @@ ptc-link, ptc-square-card,
   text-underline-offset: 5px;
   transition: text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout);
 }
-.standard-link:hover, .blog-link:hover {
+.standard-link:hover,
+.blog-link:hover {
   color: var(--color-green-06);
 }
-.standard-link:active, .blog-link:active {
+.standard-link:active,
+.blog-link:active {
   transition: none;
 }
 

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

@@ -1,14 +1,14 @@
-import { h, Host } from '@stencil/core';
-import { getSeoTagType, CheckDarkFocusState } from '../../utils/utils';
+import { h, Host } from "@stencil/core";
+import { getSeoTagType, CheckDarkFocusState } from "../../utils/utils";
 export class PtcLink {
   constructor() {
     this.disabled = false;
     this.external = false;
     this.href = undefined;
-    this.target = '_self';
+    this.target = "_self";
     this.linkTitle = undefined;
-    this.theme = 'simple';
-    this.fontSize = 'medium';
+    this.theme = "simple";
+    this.fontSize = "medium";
     this.fontWeight = undefined;
     this.linkArea = undefined;
     this.seoCompatibilityMode = false;
@@ -25,13 +25,17 @@ export class PtcLink {
     const [TagType, firstChild] = getSeoTagType(this.el, "a");
     const html = firstChild && firstChild.innerHTML;
     if (this.el == firstChild) {
-      this.el.innerHTML = '';
+      this.el.innerHTML = "";
     }
-    return (h(Host, null, this.styles && h("style", null, this.styles), h("div", { id: this.trackerId, class: "tracker-div mf-listen" }, h(TagType, Object.assign({ class: classMap, innerHTML: html, href: this.href, target: this.external ? '_blank' : this.target, title: this.linkTitle }, (!!this.tabNav ? { tabindex: -1 } : { tabindex: 0 })), h("slot", null)))));
+    return (h(Host, null, this.styles && h("style", null, this.styles), h("div", { id: this.trackerId, class: "tracker-div mf-listen" }, h(TagType, Object.assign({ class: classMap, innerHTML: html, href: this.href, target: this.external ? "_blank" : this.target, title: this.linkTitle }, (!!this.tabNav
+      ? { tabindex: -1 }
+      : { tabindex: 0 })), h("slot", null)))));
   }
   standardRender() {
     const classMap = this.getCssClassMap();
-    return (h(Host, null, this.styles && h("style", null, this.styles), h("div", { id: this.trackerId, class: "tracker-div mf-listen" }, h("a", Object.assign({ class: classMap, href: this.href, target: this.external ? '_blank' : this.target, title: this.linkTitle }, (!!this.tabNav ? { tabindex: -1 } : { tabindex: 0 })), h("slot", null)))));
+    return (h(Host, null, this.styles && h("style", null, this.styles), h("div", { id: this.trackerId, class: "tracker-div mf-listen" }, h("a", Object.assign({ class: classMap, href: this.href, target: this.external ? "_blank" : this.target, title: this.linkTitle }, (!!this.tabNav
+      ? { tabindex: -1 }
+      : { tabindex: 0 })), h("slot", null)))));
   }
   render() {
     if (this.seoCompatibilityMode) {
@@ -43,33 +47,33 @@ export class PtcLink {
   }
   getCssClassMap() {
     const classOptions = [
-      'simple',
-      'underline',
-      'nav-title',
-      'primary-nav-link',
-      'nav-title-link',
-      'nav-card-link',
-      'secondary-nav-link',
-      'footer-nav-link',
-      'copyright-link',
-      'product-link',
-      'd-green-underline',
-      'd-white-underline',
-      'global',
-      'utility-nav-link'
+      "simple",
+      "underline",
+      "nav-title",
+      "primary-nav-link",
+      "nav-title-link",
+      "nav-card-link",
+      "secondary-nav-link",
+      "footer-nav-link",
+      "copyright-link",
+      "product-link",
+      "d-green-underline",
+      "d-white-underline",
+      "global",
+      "utility-nav-link",
     ];
     let mainClass = this.theme;
     if (classOptions.indexOf(mainClass) < 0) {
-      mainClass = 'simple'; // fallback to simple class if theme is unavailable
+      mainClass = "simple"; // fallback to simple class if theme is unavailable
     }
     return {
-      ['ptc-link']: true,
+      ["ptc-link"]: true,
       [mainClass]: true,
-      ['disabled']: this.disabled,
+      ["disabled"]: this.disabled,
       [this.fontSize]: true,
       [this.linkArea]: this.linkArea ? true : false,
       [this.fontWeight]: this.fontWeight ? true : false,
-      ['focus-state-dark-background']: this.darkFocusState
+      ["focus-state-dark-background"]: this.darkFocusState,
     };
   }
   static get is() { return "ptc-link"; }
@@ -155,7 +159,7 @@ export class PtcLink {
         },
         "attribute": "target",
         "reflect": false,
-        "defaultValue": "'_self'"
+        "defaultValue": "\"_self\""
       },
       "linkTitle": {
         "type": "string",
@@ -178,7 +182,7 @@ export class PtcLink {
         "type": "string",
         "mutable": false,
         "complexType": {
-          "original": "| 'simple'\r\n    | 'underline'\r\n    | 'nav-title'\r\n    | 'primary-nav-link'\r\n    | 'nav-title-link'\r\n    | 'nav-card-link'\r\n    | 'secondary-nav-link'\r\n    | 'footer-nav-link'\r\n    | 'copyright-link'\r\n    | 'product-link'\r\n    | 'd-green-underline'\r\n    | 'd-white-underline'\r\n    | 'global'\r\n    | 'utility-nav-link'\r\n    | 'standard-link'",
+          "original": "| \"simple\"\r\n\t\t| \"underline\"\r\n\t\t| \"nav-title\"\r\n\t\t| \"primary-nav-link\"\r\n\t\t| \"nav-title-link\"\r\n\t\t| \"nav-card-link\"\r\n\t\t| \"secondary-nav-link\"\r\n\t\t| \"footer-nav-link\"\r\n\t\t| \"copyright-link\"\r\n\t\t| \"product-link\"\r\n\t\t| \"d-green-underline\"\r\n\t\t| \"d-white-underline\"\r\n\t\t| \"global\"\r\n\t\t| \"utility-nav-link\"\r\n\t\t| \"standard-link\"",
           "resolved": "\"copyright-link\" | \"d-green-underline\" | \"d-white-underline\" | \"footer-nav-link\" | \"global\" | \"nav-card-link\" | \"nav-title\" | \"nav-title-link\" | \"primary-nav-link\" | \"product-link\" | \"secondary-nav-link\" | \"simple\" | \"standard-link\" | \"underline\" | \"utility-nav-link\"",
           "references": {}
         },
@@ -190,13 +194,13 @@ export class PtcLink {
         },
         "attribute": "theme",
         "reflect": false,
-        "defaultValue": "'simple'"
+        "defaultValue": "\"simple\""
       },
       "fontSize": {
         "type": "string",
         "mutable": false,
         "complexType": {
-          "original": "'small' | 'medium' | 'large' | 'medium-large'",
+          "original": "\"small\" | \"medium\" | \"large\" | \"medium-large\"",
           "resolved": "\"large\" | \"medium\" | \"medium-large\" | \"small\"",
           "references": {}
         },
@@ -208,13 +212,13 @@ export class PtcLink {
         },
         "attribute": "font-size",
         "reflect": false,
-        "defaultValue": "'medium'"
+        "defaultValue": "\"medium\""
       },
       "fontWeight": {
         "type": "string",
         "mutable": false,
         "complexType": {
-          "original": "'w-thin' | 'w-regular' | 'w-medium' | 'w-semibold' | 'w-bold' | 'w-extrabold' | 'w-black'",
+          "original": "| \"w-thin\"\r\n\t\t| \"w-regular\"\r\n\t\t| \"w-medium\"\r\n\t\t| \"w-semibold\"\r\n\t\t| \"w-bold\"\r\n\t\t| \"w-extrabold\"\r\n\t\t| \"w-black\"",
           "resolved": "\"w-black\" | \"w-bold\" | \"w-extrabold\" | \"w-medium\" | \"w-regular\" | \"w-semibold\" | \"w-thin\"",
           "references": {}
         },
@@ -231,7 +235,7 @@ export class PtcLink {
         "type": "string",
         "mutable": false,
         "complexType": {
-          "original": "'link-area-cover-parent'",
+          "original": "\"link-area-cover-parent\"",
           "resolved": "\"link-area-cover-parent\"",
           "references": {}
         },

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

@@ -9,8 +9,10 @@ ul,
 li,
 ptc-subnav,
 ptc-tab-list,
-ptc-link, ptc-square-card,
-.hyphenate-text, ptc-footer {
+ptc-link,
+ptc-square-card,
+.hyphenate-text,
+ptc-footer {
   word-break: break-word;
   hyphens: manual;
   -webkit-hyphens: manual;
@@ -29,8 +31,10 @@ ul,
 li,
 ptc-subnav,
 ptc-tab-list,
-ptc-link, ptc-square-card,
-.hyphenate-text, ptc-footer {
+ptc-link,
+ptc-square-card,
+.hyphenate-text,
+ptc-footer {
     hyphens: auto;
     -webkit-hyphenate-limit-before: 3;
     /* For Safari */

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

@@ -1,9 +1,9 @@
-import { Host, h } from '@stencil/core';
+import { Host, h } from "@stencil/core";
 class ListItem {
 }
 export class PtcList {
   constructor() {
-    this.listType = 'list-primary';
+    this.listType = "list-primary";
     this.listItems = [];
   }
   render() {
@@ -12,29 +12,29 @@ export class PtcList {
     if (!listItems || listItems.length === 0) {
       return null;
     }
-    return (h(Host, { class: classMap }, h("ul", null, listItems.map(listItem => {
+    return (h(Host, { class: classMap }, h("ul", null, listItems.map((listItem) => {
       return (h("list-item", { "link-type": listItem.type, "link-href": listItem.href, "link-target": listItem.target, "flush-before": listItem.flushBefore }, listItem.value));
     }))));
   }
   getListItems() {
     let result = new Array();
     if (this.listItems && this.listItems.length > 0) {
-      this.listItems.map(listItem => {
+      this.listItems.map((listItem) => {
         let i = new ListItem();
         i.value = listItem;
         result.push(i);
       });
     }
     else {
-      let items = Array.from(this.el.querySelectorAll('list-item'));
-      items.map(el => {
+      let items = Array.from(this.el.querySelectorAll("list-item"));
+      items.map((el) => {
         let i = new ListItem();
         let item = el;
         i.value = item.innerText;
-        i.href = item.getAttribute('link-href');
-        i.target = item.getAttribute('link-target');
-        i.flushBefore = item.getAttribute('flush-before') == 'true';
-        i.type = item.getAttribute('link-type');
+        i.href = item.getAttribute("link-href");
+        i.target = item.getAttribute("link-target");
+        i.flushBefore = item.getAttribute("flush-before") == "true";
+        i.type = item.getAttribute("link-type");
         result.push(i);
       });
     }
@@ -63,7 +63,7 @@ export class PtcList {
         "type": "string",
         "mutable": false,
         "complexType": {
-          "original": "'list-primary'",
+          "original": "\"list-primary\"",
           "resolved": "\"list-primary\"",
           "references": {}
         },
@@ -75,7 +75,7 @@ export class PtcList {
         },
         "attribute": "list-type",
         "reflect": false,
-        "defaultValue": "'list-primary'"
+        "defaultValue": "\"list-primary\""
       },
       "listItems": {
         "type": "unknown",

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

@@ -9,8 +9,10 @@ ul,
 li,
 ptc-subnav,
 ptc-tab-list,
-ptc-link, ptc-square-card,
-.hyphenate-text, ptc-footer {
+ptc-link,
+ptc-square-card,
+.hyphenate-text,
+ptc-footer {
   word-break: break-word;
   hyphens: manual;
   -webkit-hyphens: manual;
@@ -29,8 +31,10 @@ ul,
 li,
 ptc-subnav,
 ptc-tab-list,
-ptc-link, ptc-square-card,
-.hyphenate-text, ptc-footer {
+ptc-link,
+ptc-square-card,
+.hyphenate-text,
+ptc-footer {
     hyphens: auto;
     -webkit-hyphenate-limit-before: 3;
     /* For Safari */
@@ -192,7 +196,7 @@ ptc-link, ptc-square-card,
   width: 92px;
   height: 42px;
   border-radius: 4px;
-  background: #FFF;
+  background: #fff;
   padding: 24px;
   box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.24);
   transition: var(--ptc-transition-medium) var(--ptc-ease-inout);