@ptcwebops/ptcw-design 6.3.38 → 6.3.40-beta

package/dist/collection/components/ptc-video-embed/ptc-video-embed.js

@@ -1,9 +1,9 @@
-import { h } from "@stencil/core";
+import { h } from '@stencil/core';
 export class PtcVideoEmbed {
   constructor() {
     this.src = undefined;
     this.width = undefined;
-    this.type = "Brightcove";
+    this.type = 'Brightcove';
     this.videoLoaded = undefined;
   }
   componentWillLoad() {
@@ -13,13 +13,13 @@ export class PtcVideoEmbed {
     return this.getRenderer();
   }
   renderPreloader() {
-    return h("div", { class: "skeleton-block" });
+    return (h("div", { class: "skeleton-block" }));
   }
   renderHtmlVideoEmbed() {
-    let videoUrl = this.src || "";
+    let videoUrl = this.src || '';
     let type = "video/mp4";
-    if (videoUrl.indexOf(".") > 0) {
-      let parts = videoUrl.split(".");
+    if (videoUrl.indexOf('.') > 0) {
+      let parts = videoUrl.split('.');
       let type = parts[parts.length - 1];
       switch (type) {
         case "webm":
@@ -29,7 +29,7 @@ export class PtcVideoEmbed {
           type = 'video/ogv; codecs="theora, vorbis"';
           break;
         case "ogg":
-          type = "video/ogg";
+          type = 'video/ogg';
           break;
       }
     }
@@ -41,37 +41,37 @@ export class PtcVideoEmbed {
   renderBrightcoveVideoEmbed() {
     return (h("div", { class: "video-container", style: this.getWidth() }, h("iframe", { src: `https://players.brightcove.net/1532789042001/HknUe20R_default/index.html?videoId=${this.src}`, allowfullScreen: true, allow: "encrypted-media" })));
     /*return (
-            <div class="video-module embed-responsive embed-responsive-16by9">
-                <div>
-                    <video-js data-account="1532789042001" data-player="HknUe20R" data-embed="default"
-                        controls="" data-video-id={this.src} data-playlist-id="" data-application-id=""
-                        class="vjs-fluid">
-                    </video-js>
-                </div>
-                <script
-                    src="https://players.brightcove.net/1532789042001/HknUe20R_default/index.min.js"></script>
+        <div class="video-module embed-responsive embed-responsive-16by9">
+            <div>
+                <video-js data-account="1532789042001" data-player="HknUe20R" data-embed="default"
+                    controls="" data-video-id={this.src} data-playlist-id="" data-application-id=""
+                    class="vjs-fluid">
+                </video-js>
             </div>
-        );*/
+            <script
+                src="https://players.brightcove.net/1532789042001/HknUe20R_default/index.min.js"></script>
+        </div>
+    );*/
   }
   getWidth() {
     if (this.width) {
       return {
         maxWidth: `${this.width}px`,
-        width: "100%",
+        width: '100%'
       };
     }
     else {
       return {
-        width: "100%",
+        width: '100%'
       };
     }
   }
   getRenderer() {
     if (this.videoLoaded) {
       switch (this.type) {
-        case "Youtube":
+        case 'Youtube':
           return this.renderYoutubeVideoEmbed();
-        case "Brightcove":
+        case 'Brightcove':
           return this.renderBrightcoveVideoEmbed();
         default:
           return this.renderHtmlVideoEmbed();
@@ -133,7 +133,7 @@ export class PtcVideoEmbed {
         "type": "string",
         "mutable": false,
         "complexType": {
-          "original": "\"Brightcove\" | \"Youtube\" | \"HTML\"",
+          "original": "'Brightcove' | 'Youtube' | 'HTML'",
           "resolved": "\"Brightcove\" | \"HTML\" | \"Youtube\"",
           "references": {}
         },
@@ -145,7 +145,7 @@ export class PtcVideoEmbed {
         },
         "attribute": "type",
         "reflect": false,
-        "defaultValue": "\"Brightcove\""
+        "defaultValue": "'Brightcove'"
       }
     };
   }

package/dist/collection/components/ptc-white-paper/ptc-white-paper.css

@@ -9,10 +9,8 @@ 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;
@@ -31,10 +29,8 @@ 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 */
@@ -5658,131 +5654,39 @@ a.disabled {
   cursor: not-allowed;
 }
 a:focus-visible {
-  outline: 5px solid #003dd6 !important;
+  outline: 5px solid #003DD6 !important;
   outline-offset: 0px !important;
   border-radius: var(--ptc-border-radius-standard);
 }
 
-.light-links a:not(.hero-footer-form-wrapper a,
-ptc-modal inline-form a,
-.vjs-social-share-links a),
-.light-links a.light-link,
-.background-grey-10 a:not(.hero-footer-form-wrapper a,
-ptc-modal inline-form a,
-.vjs-social-share-links a),
-.background-grey-10 a.light-link,
-.background-plm-grey a:not(.hero-footer-form-wrapper a,
-ptc-modal inline-form a,
-.vjs-social-share-links a),
-.background-plm-grey a.light-link {
+.light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a), .light-links a.light-link, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a), .background-grey-10 a.light-link, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a), .background-plm-grey a.light-link {
   color: var(--color-blue-04);
   margin: -2px;
   border: 2px solid transparent;
 }
-.light-links a:not(.hero-footer-form-wrapper a,
-ptc-modal inline-form a,
-.vjs-social-share-links a):visited,
-.light-links a.light-link:visited,
-.background-grey-10 a:not(.hero-footer-form-wrapper a,
-ptc-modal inline-form a,
-.vjs-social-share-links a):visited,
-.background-grey-10 a.light-link:visited,
-.background-plm-grey a:not(.hero-footer-form-wrapper a,
-ptc-modal inline-form a,
-.vjs-social-share-links a):visited,
-.background-plm-grey a.light-link:visited {
+.light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited, .light-links a.light-link:visited, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited, .background-grey-10 a.light-link:visited, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited, .background-plm-grey a.light-link:visited {
   color: var(--color-blue-06);
 }
-.light-links a:not(.hero-footer-form-wrapper a,
-ptc-modal inline-form a,
-.vjs-social-share-links a):active, .light-links a:not(.hero-footer-form-wrapper a,
-ptc-modal inline-form a,
-.vjs-social-share-links a):visited:active,
-.light-links a.light-link:active,
-.light-links a.light-link:visited:active,
-.background-grey-10 a:not(.hero-footer-form-wrapper a,
-ptc-modal inline-form a,
-.vjs-social-share-links a):active,
-.background-grey-10 a:not(.hero-footer-form-wrapper a,
-ptc-modal inline-form a,
-.vjs-social-share-links a):visited:active,
-.background-grey-10 a.light-link:active,
-.background-grey-10 a.light-link:visited:active,
-.background-plm-grey a:not(.hero-footer-form-wrapper a,
-ptc-modal inline-form a,
-.vjs-social-share-links a):active,
-.background-plm-grey a:not(.hero-footer-form-wrapper a,
-ptc-modal inline-form a,
-.vjs-social-share-links a):visited:active,
-.background-plm-grey a.light-link:active,
-.background-plm-grey a.light-link:visited:active {
+.light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):active, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:active, .light-links a.light-link:active, .light-links a.light-link:visited:active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):active, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:active, .background-grey-10 a.light-link:active, .background-grey-10 a.light-link:visited:active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):active, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:active, .background-plm-grey a.light-link:active, .background-plm-grey a.light-link:visited:active {
   transition: none;
   color: var(--color-blue-07);
 }
-.light-links a:not(.hero-footer-form-wrapper a,
-ptc-modal inline-form a,
-.vjs-social-share-links a):hover, .light-links a:not(.hero-footer-form-wrapper a,
-ptc-modal inline-form a,
-.vjs-social-share-links a):visited:hover,
-.light-links a.light-link:hover,
-.light-links a.light-link:visited:hover,
-.background-grey-10 a:not(.hero-footer-form-wrapper a,
-ptc-modal inline-form a,
-.vjs-social-share-links a):hover,
-.background-grey-10 a:not(.hero-footer-form-wrapper a,
-ptc-modal inline-form a,
-.vjs-social-share-links a):visited:hover,
-.background-grey-10 a.light-link:hover,
-.background-grey-10 a.light-link:visited:hover,
-.background-plm-grey a:not(.hero-footer-form-wrapper a,
-ptc-modal inline-form a,
-.vjs-social-share-links a):hover,
-.background-plm-grey a:not(.hero-footer-form-wrapper a,
-ptc-modal inline-form a,
-.vjs-social-share-links a):visited:hover,
-.background-plm-grey a.light-link:hover,
-.background-plm-grey a.light-link:visited:hover {
+.light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):hover, .light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:hover, .light-links a.light-link:hover, .light-links a.light-link:visited:hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):hover, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:hover, .background-grey-10 a.light-link:hover, .background-grey-10 a.light-link:visited:hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):hover, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):visited:hover, .background-plm-grey a.light-link:hover, .background-plm-grey a.light-link:visited:hover {
   color: var(--color-blue-05);
 }
-.light-links a:not(.hero-footer-form-wrapper a,
-ptc-modal inline-form a,
-.vjs-social-share-links a).disabled,
-.light-links a.light-link.disabled,
-.background-grey-10 a:not(.hero-footer-form-wrapper a,
-ptc-modal inline-form a,
-.vjs-social-share-links a).disabled,
-.background-grey-10 a.light-link.disabled,
-.background-plm-grey a:not(.hero-footer-form-wrapper a,
-ptc-modal inline-form a,
-.vjs-social-share-links a).disabled,
-.background-plm-grey a.light-link.disabled {
+.light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a).disabled, .light-links a.light-link.disabled, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a).disabled, .background-grey-10 a.light-link.disabled, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a).disabled, .background-plm-grey a.light-link.disabled {
   color: var(--color-gray-04) !important;
   cursor: not-allowed;
 }
-.light-links a:not(.hero-footer-form-wrapper a,
-ptc-modal inline-form a,
-.vjs-social-share-links a):focus-visible,
-.light-links a.light-link:focus-visible,
-.background-grey-10 a:not(.hero-footer-form-wrapper a,
-ptc-modal inline-form a,
-.vjs-social-share-links a):focus-visible,
-.background-grey-10 a.light-link:focus-visible,
-.background-plm-grey a:not(.hero-footer-form-wrapper a,
-ptc-modal inline-form a,
-.vjs-social-share-links a):focus-visible,
-.background-plm-grey a.light-link:focus-visible {
+.light-links a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):focus-visible, .light-links a.light-link:focus-visible, .background-grey-10 a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):focus-visible, .background-grey-10 a.light-link:focus-visible, .background-plm-grey a:not(.hero-footer-form-wrapper a, ptc-modal inline-form a, .podcast-cta-section a, .vjs-social-share-links a):focus-visible, .background-plm-grey a.light-link:focus-visible {
   border-radius: var(--ptc-border-radius-standard);
   border: 2px solid white;
   outline: 5px solid var(--keyboard-nav-outline);
 }
-.light-links .podcast-cta-section a,
-.background-grey-10 .podcast-cta-section a,
-.background-plm-grey .podcast-cta-section a {
+.light-links .podcast-cta-section a, .background-grey-10 .podcast-cta-section a, .background-plm-grey .podcast-cta-section a {
   border: 2px solid transparent;
 }
-.light-links .podcast-cta-section a:focus-visible,
-.background-grey-10 .podcast-cta-section a:focus-visible,
-.background-plm-grey .podcast-cta-section a:focus-visible {
+.light-links .podcast-cta-section a:focus-visible, .background-grey-10 .podcast-cta-section a:focus-visible, .background-plm-grey .podcast-cta-section a:focus-visible {
   border-radius: var(--ptc-border-radius-standard);
   border: 2px solid white;
   outline: 5px solid var(--keyboard-nav-outline);
@@ -5846,9 +5750,8 @@ ptc-modal inline-form a,
   /* Fonts */
   --ptc-font-latin: "Raleway", sans-serif;
   --ptc-font-secondary-latin: "Rajdhani", sans-serif;
-  --ptc-font-sans:
-  	-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial,
-  	sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
+  --ptc-font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif,
+    "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
   /* Font sizes */
   --ptc-font-size-xxx-small: 0.75rem;
   /* 12px */
@@ -5907,10 +5810,8 @@ 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;
@@ -5929,10 +5830,8 @@ 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 */
@@ -6224,12 +6123,7 @@ blockquote p {
   font-size: var(--ptc-font-size-small);
   line-height: var(--ptc-line-height-p);
 }
-:host .sub-heading h1,
-:host .sub-heading h2,
-:host .sub-heading h3,
-:host .sub-heading h4,
-:host .sub-heading h5,
-:host .sub-heading h6,
+:host .sub-heading h1, :host .sub-heading h2, :host .sub-heading h3, :host .sub-heading h4, :host .sub-heading h5, :host .sub-heading h6,
 :host .wp-component h1,
 :host .wp-component h2,
 :host .wp-component h3,

package/dist/collection/components/ptc-white-paper/ptc-white-paper.js

@@ -1,4 +1,4 @@
-import { Host, h, } from "@stencil/core";
+import { Host, h } from '@stencil/core';
 export class PtcWhitePaper {
   constructor() {
     this.items = undefined;
@@ -28,8 +28,7 @@ export class PtcWhitePaper {
       window.scrollTo(0, 0);
       if (newPage == 2) {
         let modalForm = document.querySelector("#modal-form");
-        modalForm.focusBackElement =
-          this.el.shadowRoot.querySelectorAll(".pagination button")[2];
+        modalForm.focusBackElement = this.el.shadowRoot.querySelectorAll('.pagination button')[2];
         if (modalForm) {
           modalForm.setAttribute("show", "true");
           setTimeout(() => {
@@ -85,42 +84,34 @@ export class PtcWhitePaper {
   }
   renderContent(item, index) {
     const components = Object.values(item);
-    return (h("div", { class: "content-wrapper", key: index }, components.map((comp, i) => (h("div", { key: i }, comp.heading && comp.heading.trim() !== "" ? (this.currentPage == 1 ? (h("ptc-title", { type: "h1", upperline: comp.isStyledHeading
-        ? "dotted"
-        : "no-upperline", "title-height": "densest", "title-margin": "margin-flush" }, comp.heading, h("ptc-spacer", { size: "large" }))) : (h("ptc-title", { type: "h2", upperline: comp.isStyledHeading
-        ? "dotted"
-        : "no-upperline", "title-height": "densest", "title-margin": "margin-flush" }, comp.heading, h("ptc-spacer", { size: "large" })))) : (""), comp.subHeading && comp.subHeading.trim() !== "" ? (h("div", { class: "sub-heading rich-content-text-editor", innerHTML: comp.subHeading })) : (""), comp.componentType === "two-column-with-text-media" &&
-      this.renderTwoColumnText(comp, i), comp.componentType === "fullspan-media" &&
-      this.renderfullspanMedia(comp, i), comp.componentType === "fullspan-text" &&
-      this.renderFullspanText(comp, i))))));
-  }
-  renderTwoColumnText(_, index) {
-    const pageNumber = this.currentPage;
-    const componentNumber = index + 1;
-    return (h("div", null, h("div", { class: "is-grid has-col-gap-xl has-row-gap-sm wp-component", key: index }, h("div", { class: "is-col-6-md" }, h("div", { class: "left-content" }, h("slot", { name: `left-column-content-page${pageNumber}-comp${componentNumber}` }))), h("div", { class: "is-col-6-md" }, h("div", { class: "right-content" }, h("slot", { name: `right-column-content-page${pageNumber}-comp${componentNumber}` }))))));
+    return (h("div", { class: "content-wrapper", key: index }, components.map((comp, i) => {
+      var _a, _b;
+      let heading = this.el.querySelector(`[slot="heading-page${this.currentPage}-comp${i + 1}"]`);
+      let subHeading = this.el.querySelector(`[slot="subheading-page${this.currentPage}-comp${i + 1}"]`);
+      return h("div", { key: i }, (heading && heading.innerText && ((_a = heading.innerText) === null || _a === void 0 ? void 0 : _a.trim()) !== '') ? (this.currentPage == 1
+        ? (h("ptc-title", { type: "h1", upperline: comp.isStyledHeading ? 'dotted' : 'no-upperline', "title-height": "densest", "title-margin": "margin-flush" }, h("slot", { name: `heading-page${this.currentPage}-comp${i + 1}` }), h("ptc-spacer", { size: "large" })))
+        : (h("ptc-title", { type: "h2", upperline: comp.isStyledHeading ? 'dotted' : 'no-upperline', "title-height": "densest", "title-margin": "margin-flush" }, h("slot", { name: `heading-page${this.currentPage}-comp${i + 1}` }), h("ptc-spacer", { size: "large" })))) : "", (subHeading && subHeading.innerText && ((_b = subHeading.innerText) === null || _b === void 0 ? void 0 : _b.trim()) !== '') ? (h("div", { class: "sub-heading rich-content-text-editor" }, h("slot", { name: `subheading-page${this.currentPage}-comp${i + 1}` }))) : '', comp.componentType === 'two-column-with-text-media' && this.renderTwoColumnText(comp, i), comp.componentType === 'fullspan-media' && this.renderfullspanMedia(comp, i), comp.componentType === 'fullspan-text' && this.renderFullspanText(comp, i));
+    })));
+  }
+  renderTwoColumnText(comp, index) {
+    return (h("div", null, comp.leftColumnContent && (h("div", { class: "is-grid has-col-gap-xl has-row-gap-sm wp-component", key: index }, h("div", { class: "is-col-6-md" }, h("div", { class: "left-content", innerHTML: comp.leftColumnContent })), h("div", { class: "is-col-6-md" }, h("div", { class: "right-content", innerHTML: comp.rightColumnContent }))))));
   }
   renderfullspanMedia(comp, index) {
-    const pageNumber = this.currentPage;
-    const componentNumber = index + 1;
-    return (h("div", { class: "wp-component wp-media", key: index }, comp.mainImage && (h("ptc-picture", { alt: comp.mainImageAlt, "display-image": "inline-block", "image-alignment": "center", "image-position": "relative", "object-fit": "cover", src: comp.mainImage })), h("div", { class: "image-description" }, h("slot", { name: `main-image-description-page${pageNumber}-comp${componentNumber}` }))));
+    return (h("div", { class: "wp-component wp-media", key: index }, comp.mainImage && (h("ptc-picture", { alt: comp.mainImageAlt, "display-image": "inline-block", "image-alignment": "center", "image-position": "relative", "object-fit": "cover", src: comp.mainImage })), comp.mainImageDescription && h("div", { class: "image-description", innerHTML: comp.mainImageDescription })));
   }
   renderFullspanText(comp, index) {
-    const pageNumber = this.currentPage;
-    const componentNumber = index + 1;
     const classes = {
-      "wp-component": true,
-      "wp-fullspan-text": true,
-      "text-center": comp.isCenterText,
+      'wp-component': true,
+      'wp-fullspan-text': true,
+      'text-center': comp.isCenterText,
     };
-    return (h("div", { class: classes, key: index }, h("div", { class: "" }, h("slot", { name: `main-content-page${pageNumber}-comp${componentNumber}` })), h("div", { class: "" }, h("slot", { name: `main-content-multi-line-page${pageNumber}-comp${componentNumber}` })), comp.mainContentChart && (h("div", { class: "" }, h("ptc-spacer", { size: "large" }), h("object", { id: "", type: "text/html", width: "100%", height: comp.mainContentChartHeight, "data-dw-widget": "Edge", data: comp.mainContentChart, tabindex: "-1" }), h("ptc-spacer", { size: "large" })))));
+    return (h("div", { class: classes, key: index }, comp.mainContent && h("div", { class: "", innerHTML: comp.mainContent }), comp.mainContentMultiLine && h("div", { class: "", innerHTML: comp.mainContentMultiLine }), comp.mainContentChart && (h("div", { class: "" }, h("ptc-spacer", { size: "large" }), h("object", { id: "", type: "text/html", width: "100%", height: comp.mainContentChartHeight, "data-dw-widget": "Edge", data: comp.mainContentChart, tabindex: "-1" }), h("ptc-spacer", { size: "large" })))));
   }
   render() {
     const startIndex = (this.currentPage - 1) * this.itemsPerPage;
     const endIndex = startIndex + this.itemsPerPage;
     const currentItems = JSON.parse(this.items).slice(startIndex, endIndex);
-    return (h(Host, null, h("div", { class: "hero-image" }, h("ptc-img", { "image-type": "smart-bg", "img-url": this.topBackgroundImage, "load-mode": "lazy-bg", styles: "" })), h("div", { class: "ptc-container " }, h("div", { class: "content-container" }, h("div", { class: "pagination-wrap" }, h("div", { class: "pagination" }, h("button", { class: "mf-listen", id: "prevPageBtnID", onClick: () => this.handlePrevPage(), onKeyPress: () => this.handlePrevPage(), tabIndex: 0, disabled: this.currentPage === 1 }, h("svg", { preserveAspectRatio: "xMidYMid meet", focusable: "false", viewBox: "0 0 18 18" }, h("g", { id: "icon_chevron_left_mini", viewBox: "0 0 18 18" }, h("g", { class: "icon_chevron_left_mini" }, h("path", { d: "M12 12.833L8.304 9 12 5.167 10.821 4 6 9l4.821 5L12 12.833z", class: "icon_chevron_left" }))))), this.renderPaginationButtons(), h("button", { class: "mf-listen", id: "nextPageBtnID", onClick: () => this.handleNextPage(), onKeyPress: () => this.handleNextPage(), tabIndex: 0, disabled: this.currentPage === this.totalPages }, h("svg", { preserveAspectRatio: "xMidYMid meet", focusable: "false", viewBox: "0 0 18 18" }, h("g", { id: "icon_chevron_right_mini", viewBox: "0 0 18 18" }, h("g", { class: "icon_chevron_right_mini" }, h("path", { d: "M6 5.167L9.696 9 6 12.833 7.179 14 12 9 7.179 4 6 5.167z", class: "icon_chevron_right" })))))), h("div", { class: "mf-listen dl-btn-wrapper", id: "downloadBtnID" }, h("a", { class: "dl-btn", tabindex: 0, onKeyPress: (e) => this.downloadCtaClicked.emit(e), onClick: (e) => {
-        this.downloadCtaClicked.emit(e);
-      } }, h("span", { class: "dl-text" }, "Download"), h("img", { src: "https://www.ptc.com/dist/ptc/images/download-arrow.svg", alt: "Down Arrow" })))), h("div", null, currentItems.map((item, index) => this.renderContent(item, index)))))));
+    return (h(Host, null, h("div", { class: "hero-image" }, h("ptc-img", { "image-type": "smart-bg", "img-url": this.topBackgroundImage, "load-mode": "lazy-bg", styles: "" })), h("div", { class: "ptc-container " }, h("div", { class: "content-container" }, h("div", { class: "pagination-wrap" }, h("div", { class: "pagination" }, h("button", { class: "mf-listen", id: "prevPageBtnID", onClick: () => this.handlePrevPage(), onKeyPress: () => this.handlePrevPage(), tabIndex: 0, disabled: this.currentPage === 1 }, h("svg", { preserveAspectRatio: "xMidYMid meet", focusable: "false", viewBox: "0 0 18 18" }, h("g", { id: "icon_chevron_left_mini", viewBox: "0 0 18 18" }, h("g", { class: "icon_chevron_left_mini" }, h("path", { d: "M12 12.833L8.304 9 12 5.167 10.821 4 6 9l4.821 5L12 12.833z", class: "icon_chevron_left" }))))), this.renderPaginationButtons(), h("button", { class: "mf-listen", id: "nextPageBtnID", onClick: () => this.handleNextPage(), onKeyPress: () => this.handleNextPage(), tabIndex: 0, disabled: this.currentPage === this.totalPages }, h("svg", { preserveAspectRatio: "xMidYMid meet", focusable: "false", viewBox: "0 0 18 18" }, h("g", { id: "icon_chevron_right_mini", viewBox: "0 0 18 18" }, h("g", { class: "icon_chevron_right_mini" }, h("path", { d: "M6 5.167L9.696 9 6 12.833 7.179 14 12 9 7.179 4 6 5.167z", class: "icon_chevron_right" })))))), h("div", { class: "mf-listen dl-btn-wrapper", id: "downloadBtnID" }, h("a", { class: "dl-btn", tabindex: 0, onKeyPress: (e) => this.downloadCtaClicked.emit(e), onClick: (e) => { this.downloadCtaClicked.emit(e); } }, h("span", { class: "dl-text" }, "Download"), h("img", { src: "https://www.ptc.com/dist/ptc/images/download-arrow.svg", alt: "Down Arrow" })))), h("div", null, currentItems.map((item, index) => this.renderContent(item, index)))))));
   }
   static get is() { return "ptc-white-paper"; }
   static get encapsulation() { return "shadow"; }

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

@@ -9,10 +9,8 @@ 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;
@@ -31,10 +29,8 @@ 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/subnav/ptc-nav-link/ptc-nav-link.js

@@ -1,36 +1,36 @@
-import { h, Host, } from "@stencil/core";
+import { h, Host } from '@stencil/core';
 export class PtcNavLink {
   constructor() {
     this.href = undefined;
     this.isOutsideLink = false;
-    this.titleText = "";
+    this.titleText = '';
     this.trackerId = undefined;
   }
   handleClick(event) {
     // Prevent the event from propagating to the underlying <a> element
     event.stopPropagation();
     // Check if the href starts with #
-    if (this.href && this.href.startsWith("#")) {
+    if (this.href && this.href.startsWith('#')) {
       // Find the corresponding section
       const section = document.querySelector(this.href);
       section.scrollIntoView({
-        behavior: "smooth",
+        behavior: 'smooth',
       });
       this.navLinkClicked.emit();
     }
   }
   trimString(inputString, maxLength) {
     if (inputString.length > maxLength) {
-      return inputString.slice(0, maxLength) + "...";
+      return inputString.slice(0, maxLength) + '...';
     }
     else {
       return inputString;
     }
   }
   render() {
-    return (h(Host, null, h("div", { class: "tracker-div mf-listen" }, h("a", { id: this.trackerId, href: this.href, target: this.isOutsideLink ? "_blank" : "_self", title: this.titleText, onClick: (event) => {
+    return (h(Host, null, h("div", { class: "tracker-div", id: this.trackerId }, h("a", { href: this.href, target: this.isOutsideLink ? '_blank' : '_self', title: this.titleText, onClick: event => {
         this.handleClick(event);
-      } }, h("slot", null), !this.href.startsWith("#") && (h("svg", { class: "icon-arrow-right", xmlns: "http://www.w3.org/2000/svg", width: "14", height: "10", viewBox: "0 0 14 10", fill: "none" }, h("path", { d: "M8.84921 0.77792L8.81313 3.41153L0.51545 3.55584L0.515449 6.5863L8.81313 6.44199L8.81313 9.40029L13.1424 5.07107L8.84921 0.77792Z", fill: "#AEB8BD" })))))));
+      } }, h("slot", null), !this.href.startsWith('#') && (h("svg", { class: "icon-arrow-right", xmlns: "http://www.w3.org/2000/svg", width: "14", height: "10", viewBox: "0 0 14 10", fill: "none" }, h("path", { d: "M8.84921 0.77792L8.81313 3.41153L0.51545 3.55584L0.515449 6.5863L8.81313 6.44199L8.81313 9.40029L13.1424 5.07107L8.84921 0.77792Z", fill: "#AEB8BD" })))))));
   }
   static get is() { return "ptc-nav-link"; }
   static get encapsulation() { return "shadow"; }
@@ -97,7 +97,7 @@ export class PtcNavLink {
         },
         "attribute": "title-text",
         "reflect": false,
-        "defaultValue": "\"\""
+        "defaultValue": "''"
       },
       "trackerId": {
         "type": "string",

package/dist/collection/components/subnav/ptc-nav-slider/ptc-nav-slider.css

@@ -9,10 +9,8 @@ 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;
@@ -31,10 +29,8 @@ 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/subnav/ptc-nav-slider/ptc-nav-slider.js

@@ -1,4 +1,4 @@
-import { Host, h } from "@stencil/core";
+import { Host, h } from '@stencil/core';
 export class PtcNavSlider {
   constructor() {
     this.sliderId = `ptc-nav-slider-${Math.floor(Math.random() * 1000000)}`;
@@ -9,40 +9,32 @@ export class PtcNavSlider {
     // use the ID to select elements within the component's shadow root
     this.updateSlider(this);
     const { shadowRoot } = document.querySelector(`#${this.sliderId}`);
-    const boxWrap = shadowRoot.querySelector(".box-wrap");
-    boxWrap.addEventListener("scroll", this.updateSlider.bind(this));
+    const boxWrap = shadowRoot.querySelector('.box-wrap');
+    boxWrap.addEventListener('scroll', this.updateSlider.bind(this));
     setTimeout(() => {
       this.updateSlider(this);
     }, 3100);
   }
   handledropdownClickEvent(element) {
-    const sliderId = element.target.querySelector(".nav-slider").id;
-    const boxWrap = element.target
-      .querySelector(".nav-slider")
-      .shadowRoot.querySelector(".box-wrap");
-    const prevBtn = document
-      .querySelector(`#${sliderId}`)
-      .shadowRoot.querySelector("#prevBtn");
-    const nextBtn = document
-      .querySelector(`#${sliderId}`)
-      .shadowRoot.querySelector("#nextBtn");
-    let notDropdown = element.target.tagName.toLowerCase() != "ptc-nav-submenu";
+    const sliderId = element.target.querySelector('.nav-slider').id;
+    const boxWrap = element.target.querySelector('.nav-slider').shadowRoot.querySelector('.box-wrap');
+    const prevBtn = document.querySelector(`#${sliderId}`).shadowRoot.querySelector('#prevBtn');
+    const nextBtn = document.querySelector(`#${sliderId}`).shadowRoot.querySelector('#nextBtn');
+    let notDropdown = element.target.tagName.toLowerCase() != 'ptc-nav-submenu';
     this.updateArrows(boxWrap, prevBtn, nextBtn, notDropdown);
   }
   updateArrows(boxWrap, prevBtn, nextBtn, isNotDropdown) {
-    if (boxWrap.offsetWidth == boxWrap.scrollWidth) {
+    if ((boxWrap.offsetWidth) == boxWrap.scrollWidth) {
       prevBtn.style.visibility = "hidden";
       nextBtn.style.visibility = "hidden";
       if (isNotDropdown)
-        prevBtn.closest(".btn-wrap-left").style.display = "none";
+        prevBtn.closest('.btn-wrap-left').style.display = 'none';
     }
-    else if (boxWrap.scrollLeft + boxWrap.offsetWidth <=
-      boxWrap.scrollWidth) {
+    else if ((boxWrap.scrollLeft + boxWrap.offsetWidth) <= boxWrap.scrollWidth) {
       if (isNotDropdown)
-        prevBtn.closest(".btn-wrap-left").style.display = "";
+        prevBtn.closest('.btn-wrap-left').style.display = '';
       if (boxWrap.scrollLeft > 0) {
-        if (boxWrap.scrollLeft + boxWrap.offsetWidth ==
-          boxWrap.scrollWidth) {
+        if ((boxWrap.scrollLeft + boxWrap.offsetWidth) == boxWrap.scrollWidth) {
           nextBtn.style.visibility = "hidden";
           prevBtn.style.visibility = "visible";
         }
@@ -62,17 +54,11 @@ export class PtcNavSlider {
     }
   }
   updateSlider(event) {
-    const boxWrap = document
-      .querySelector(`#${this.sliderId}`)
-      .shadowRoot.querySelector(".box-wrap");
-    const prevBtn = document
-      .querySelector(`#${this.sliderId}`)
-      .shadowRoot.querySelector("#prevBtn");
-    const nextBtn = document
-      .querySelector(`#${this.sliderId}`)
-      .shadowRoot.querySelector("#nextBtn");
+    const boxWrap = document.querySelector(`#${this.sliderId}`).shadowRoot.querySelector('.box-wrap');
+    const prevBtn = document.querySelector(`#${this.sliderId}`).shadowRoot.querySelector('#prevBtn');
+    const nextBtn = document.querySelector(`#${this.sliderId}`).shadowRoot.querySelector('#nextBtn');
     if (event !== undefined && event.target) {
-      let notDropdown = !event.target.closest(".dropdown-content");
+      let notDropdown = !event.target.closest('.dropdown-content');
       this.updateArrows(event.target, prevBtn, nextBtn, notDropdown);
     }
     else {
@@ -81,18 +67,14 @@ export class PtcNavSlider {
   }
   leftScroll(ele) {
     const sliderId = ele.sliderId;
-    const left = document
-      .querySelector(`#${sliderId}`)
-      .shadowRoot.querySelector(`.box-wrap`);
+    const left = document.querySelector(`#${sliderId}`).shadowRoot.querySelector(`.box-wrap`);
     if (left.scrollLeft > 0) {
       left.scrollBy(-200, 0);
     }
   }
   rightScroll(ele) {
     const sliderId = ele.sliderId;
-    const right = document
-      .querySelector(`#${sliderId}`)
-      .shadowRoot.querySelector(`.box-wrap`);
+    const right = document.querySelector(`#${sliderId}`).shadowRoot.querySelector(`.box-wrap`);
     if (right.scrollLeft + right.offsetWidth < right.scrollWidth) {
       right.scrollBy(200, 0);
     }