@ptcwebops/ptcw-design 6.0.8 → 6.0.10

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

@@ -81,6 +81,13 @@ ptc-link, ptc-square-card,
   border-radius: var(--ptc-border-radius-standard);
   outline: 5px solid var(--keyboard-nav-outline);
 }
+.ptc-link:focus-visible .focus-state-dark-background:focus-visible {
+  border-radius: var(--ptc-border-radius-standard);
+  border: 2px solid white;
+  outline: 5px solid var(--keyboard-nav-outline);
+  transition: none;
+  text-decoration-line: none;
+}
 
 .simple {
   text-decoration: underline;
@@ -97,8 +104,18 @@ ptc-link, ptc-square-card,
   transition: none;
 }
 .simple:focus-visible {
-  outline: 5px solid #003DD6 !important;
-  outline-offset: 0px !important;
+  border-radius: var(--ptc-border-radius-standard);
+  outline: 5px solid var(--keyboard-nav-outline);
+  transition: none;
+  color: var(--color-green-06);
+  transition: text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout);
+}
+.simple:focus-visible.focus-state-dark-background {
+  border-radius: var(--ptc-border-radius-standard);
+  border: 2px solid white;
+  outline: 5px solid var(--keyboard-nav-outline);
+  transition: none;
+  text-decoration-line: none;
 }
 
 .global {
@@ -356,6 +373,20 @@ ptc-link, ptc-square-card,
 .d-green-underline:active {
   transition: none;
 }
+.d-green-underline:focus-visible {
+  border-radius: var(--ptc-border-radius-standard);
+  outline: 5px solid var(--keyboard-nav-outline);
+  transition: none;
+  color: var(--color-green-06);
+  transition: text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout);
+}
+.d-green-underline:focus-visible.focus-state-dark-background {
+  border-radius: var(--ptc-border-radius-standard);
+  border: 2px solid white;
+  outline: 5px solid var(--keyboard-nav-outline);
+  transition: none;
+  text-decoration-line: none;
+}
 
 .d-white-underline {
   color: var(--color-white);

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

@@ -14,6 +14,7 @@ export class PtcLink {
     this.seoCompatibilityMode = false;
     this.styles = undefined;
     this.trackerId = undefined;
+    this.darkFocusState = false;
   }
   seoCompRender() {
     const classMap = this.getCssClassMap();
@@ -75,6 +76,7 @@ export class PtcLink {
       [this.fontSize]: true,
       [this.linkArea]: this.linkArea ? true : false,
       [this.fontWeight]: this.fontWeight ? true : false,
+      ['focus-state-dark-background']: this.darkFocusState
     };
   }
   static get is() { return "ptc-link"; }
@@ -300,6 +302,24 @@ export class PtcLink {
         },
         "attribute": "tracker-id",
         "reflect": false
+      },
+      "darkFocusState": {
+        "type": "boolean",
+        "mutable": false,
+        "complexType": {
+          "original": "boolean",
+          "resolved": "boolean",
+          "references": {}
+        },
+        "required": false,
+        "optional": false,
+        "docs": {
+          "tags": [],
+          "text": "darkFocusState for dark background"
+        },
+        "attribute": "dark-focus-state",
+        "reflect": false,
+        "defaultValue": "false"
       }
     };
   }

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

@@ -52,7 +52,7 @@ export class PtcMediaCard {
       //   : null)}
       style: this.cardType != "case-study-icon" ?
         ((this.isHovered && this.hoverBackgroundImage) ? { backgroundImage: `url(${this.hoverBackgroundImage})` } : { backgroundImage: `url(${this.activeBackgroundImage})` }) : {} }, h("slot", { name: "seo-content" }), this.cardType != "case-study-icon" ?
-      (h(Tag, { class: 'anchor-wrap', target: this.target, href: this.cardHref, rel: this.rel, "aria-label": this.cardHref ? 'Read more about ' + this.ariaLabel : undefined }, isVideoUrl && (h("video", { muted: true, loop: true, playsinline: true, poster: this.activeBackgroundImage, ref: el => (this.videoEle = el), style: this.isHovered ? { display: 'block' } : { display: 'none' } }, h("source", { src: this.hoverBackgroundImage, type: "video/mp4" }, "Your browser does not support the video tag."))), this.cardType === "media-card" && h("ptc-overlay", { "filter-color": "black-2" }), this.cardType === "media-card" && this.getCardText())) : null, this.cardType === "case-study-icon" ? (h("div", { id: this.trackerId, class: "tracker-div" }, h("a", { class: "case-study-img-anchor mf-listen", target: this.target, href: this.cardHref, rel: this.rel, "aria-label": this.cardHref ? 'Read more about ' + this.ariaLabel : undefined }, h("img", { class: "case-study-bg-img", src: this.activeBackgroundImage, alt: this.activeBackgroundImageAlt }), h("div", { class: "after" }), h("img", { class: "case-study-icon-img", src: this.iconImage, alt: this.iconImageAlt }))))
+      (h(Tag, { class: 'anchor-wrap', target: this.target, href: this.cardHref, rel: this.rel, tabindex: "-1", "aria-label": this.cardHref ? 'Read more about ' + this.ariaLabel : undefined }, isVideoUrl && (h("video", { muted: true, loop: true, playsinline: true, poster: this.activeBackgroundImage, ref: el => (this.videoEle = el), style: this.isHovered ? { display: 'block' } : { display: 'none' }, tabindex: "-1" }, h("source", { src: this.hoverBackgroundImage, type: "video/mp4" }, "Your browser does not support the video tag."))), this.cardType === "media-card" && h("ptc-overlay", { "filter-color": "black-2" }), this.cardType === "media-card" && this.getCardText())) : null, this.cardType === "case-study-icon" ? (h("div", { id: this.trackerId, class: "tracker-div" }, h("a", { class: "case-study-img-anchor mf-listen", target: this.target, href: this.cardHref, rel: this.rel, "aria-label": this.cardHref ? 'Read more about ' + this.ariaLabel : undefined }, h("img", { class: "case-study-bg-img", src: this.activeBackgroundImage, alt: this.activeBackgroundImageAlt }), h("div", { class: "after" }), h("img", { class: "case-study-icon-img", src: this.iconImage, alt: this.iconImageAlt }))))
       : null));
   }
   getCssClassMap() {

package/dist/collection/components/ptc-preloader-section/ptc-preloader-section.css

@@ -1754,6 +1754,148 @@ ptc-link, ptc-square-card,
   margin-bottom: 4px !important;
 }
 
+.preloader-generic-form .form-block-1 {
+  border-radius: 4px;
+  border: 8px solid var(--color-gray-02);
+  padding: 45px 32px;
+  margin-bottom: 118px;
+  display: block;
+}
+@media only screen and (min-width: 992px) {
+  .preloader-generic-form .form-block-1 {
+    display: none;
+  }
+}
+.preloader-generic-form .form-block-1 .form-block-skeleton {
+  padding-bottom: 37px;
+}
+.preloader-generic-form .form-block-2 {
+  border-radius: 4px;
+  border: 8px solid var(--color-gray-02);
+  padding: 45px 32px;
+  margin-bottom: 118px;
+  display: none;
+}
+@media only screen and (min-width: 992px) {
+  .preloader-generic-form .form-block-2 {
+    display: block;
+  }
+}
+.preloader-generic-form .form-block-2 .form-block-skeleton {
+  padding-bottom: 37px;
+}
+.preloader-generic-form .skeleton .skeleton-block.very-bold {
+  width: 60%;
+  height: 55px;
+}
+@media only screen and (min-width: 768px) {
+  .preloader-generic-form .skeleton .skeleton-block.very-bold {
+    width: 50%;
+  }
+}
+@media only screen and (min-width: 992px) {
+  .preloader-generic-form .skeleton .skeleton-block.very-bold {
+    width: 40%;
+  }
+}
+@media only screen and (min-width: 1200px) {
+  .preloader-generic-form .skeleton .skeleton-block.very-bold {
+    width: 60%;
+  }
+}
+
+.pdf-skeleton-preloader .jumbotron-sec {
+  background: #fff;
+}
+.pdf-skeleton-preloader .section-1 {
+  padding-top: 60px;
+  padding-bottom: 222px;
+}
+.pdf-skeleton-preloader .section-1 .line-1 {
+  height: 44px;
+  width: 100%;
+  margin-bottom: 39px;
+}
+@media only screen and (min-width: 992px) {
+  .pdf-skeleton-preloader .section-1 .line-1 {
+    width: 70%;
+  }
+}
+@media only screen and (min-width: 1200px) {
+  .pdf-skeleton-preloader .section-1 .line-1 {
+    width: 50%;
+  }
+}
+.pdf-skeleton-preloader .section-1 .line-2 {
+  width: 100%;
+}
+@media only screen and (min-width: 1200px) {
+  .pdf-skeleton-preloader .section-1 .line-2 {
+    width: 90%;
+  }
+}
+.pdf-skeleton-preloader .section-1 .line-3 {
+  width: 97%;
+}
+@media only screen and (min-width: 1200px) {
+  .pdf-skeleton-preloader .section-1 .line-3 {
+    width: 87%;
+  }
+}
+.pdf-skeleton-preloader .section-1 .line-4 {
+  width: 95%;
+}
+@media only screen and (min-width: 1200px) {
+  .pdf-skeleton-preloader .section-1 .line-4 {
+    width: 85%;
+  }
+}
+.pdf-skeleton-preloader .pdf-area {
+  padding-bottom: 110px;
+}
+.pdf-skeleton-preloader .pdf-area .pdf-section {
+  background-color: #fff;
+  width: auto;
+}
+@media only screen and (min-width: 1440px) {
+  .pdf-skeleton-preloader .pdf-area .pdf-section {
+    width: 781px;
+    margin: auto;
+  }
+}
+.pdf-skeleton-preloader .pdf-area .pdf-section .top-border {
+  height: 48px;
+  background-color: var(--color-gray-03);
+}
+.pdf-skeleton-preloader .pdf-area .pdf-section .pdf-body {
+  padding-top: 60px;
+  padding-left: 24px;
+  padding-right: 24px;
+  padding-bottom: 58px;
+}
+@media only screen and (min-width: 992px) {
+  .pdf-skeleton-preloader .pdf-area .pdf-section .pdf-body {
+    padding-left: 155px;
+    padding-right: 155px;
+  }
+}
+@media only screen and (min-width: 1200px) {
+  .pdf-skeleton-preloader .pdf-area .pdf-section .pdf-body {
+    padding-left: 247px;
+    padding-right: 247px;
+  }
+}
+@media only screen and (min-width: 1440px) {
+  .pdf-skeleton-preloader .pdf-area .pdf-section .pdf-body {
+    padding-left: 70px;
+    padding-right: 70px;
+  }
+}
+.pdf-skeleton-preloader .pdf-area .pdf-section .pdf-body .skeleton .skeleton-block.thick-block {
+  height: 623px;
+  width: 100%;
+}
+
 @keyframes pulse {
   0% {
     opacity: 0.5;

package/dist/collection/components/ptc-preloader-section/ptc-preloader-section.js

@@ -60,6 +60,12 @@ export class PtcPreloaderSection {
       case 'value-led': {
         return (h("div", { class: "preloader-wrapper" }, h("div", { class: "preloader-value-led" }, h("div", { class: "hero-image" }), h("div", { class: "ptc-container content-container" }, h("div", { class: "content-container-child" }, h("div", { class: "is-grid has-col-gap-md" }, h("div", { class: "is-col-3-lg" }, h("div", { class: "skeleton container-child-1" }, h("div", { class: "is-grid block grid-1" }, h("div", { class: "is-col-12 is-placed-left" }, Array.from({ length: 8 }).map(() => (h("div", { class: "skeleton" }, h("div", { class: "skeleton-block thinnest-1" }), h("div", { class: "skeleton-block thinnest-1 long-4" }), h("ptc-spacer", { breakpoint: "x-small", size: "medium" })))))))), h("div", { class: "is-col-12 is-col-9-lg" }, h("div", { class: "skeleton container-child-2" }, h("div", { class: "is-grid block grid-top" }, h("div", { class: "is-col-12 is-placed-left" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block thin smallest left" }), h("div", { class: "skeleton-block thick long-1" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block bold long-2" }), h("div", { class: "skeleton-block bold long-1" }), h("div", { class: "skeleton-block bold long-3" })))), h("div", { class: "grid-top-1" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block block-1" }))), h("div", { class: "skeleton-block bold" }), h("div", { class: "skeleton-block bold long-2" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block thinnnest longer" }), h("div", { class: "skeleton-block thinnnest longer" }), h("div", { class: "skeleton-block thinnnest longest" }), h("div", { class: "skeleton-block thinnnest long" }), h("div", { class: "skeleton-block thinnnest long-4" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block bold" }), h("div", { class: "skeleton-block bold long-2" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block thinnnest longer" }), h("div", { class: "skeleton-block thinnnest longer" }), h("div", { class: "skeleton-block thinnnest longest" }), h("div", { class: "skeleton-block thinnnest long" }), h("div", { class: "skeleton-block thinnnest long-4" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block thinnnest longer" }), h("div", { class: "skeleton-block thinnnest longer" }), h("div", { class: "skeleton-block thinnnest longest" }), h("div", { class: "skeleton-block thinnnest long" }), h("div", { class: "skeleton-block thinnnest long-4" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }))))), h("div", { class: "related-items" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" })))));
       }
+      case 'generic-form-with-image': {
+        return (h("div", { class: "preloader-wrapper" }, h("div", { class: "ptc-container skeleton-jumbotron" }, h("div", { class: "is-grid has-no-row-gap has-col-gap-lg" }, h("div", { class: "is-col-12 is-col-8-lg" }, h("div", { class: "sekleton" }, h("div", { class: "skeleton-block thin short" }), h("div", { class: "skeleton-block thick" }), h("div", { class: "skeleton-block thick" }), h("ptc-spacer", { breakpoint: "small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "x-large" }), h("div", { class: "skeleton-block thin" }), h("div", { class: "skeleton-block thin medium" }), h("ptc-spacer", { breakpoint: "small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "x-large" }), h("div", { class: "cta-wrap" }, h("div", { class: "skeleton-block cta" }), h("div", { class: "skeleton-block cta" })))))), h("div", { class: "ptc-container preloader-generic-form" }, h("div", { class: "is-grid block form-block-1" }, h("div", { class: "is-col-12" }, Array.from({ length: 7 }).map(() => (h("div", { class: "skeleton form-block-skeleton" }, h("div", { class: "skeleton-block bold" })))), h("div", { class: "skeleton" }, h("div", { class: "skeleton-block very-bold" })))), h("div", { class: "is-grid block" }, h("div", { class: "is-col-12-xs is-col-12-sm is-col-md-8" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block thin short" }), h("div", { class: "skeleton-block thin" }), h("div", { class: "skeleton-block thin" }), h("div", { class: "skeleton-block thin" }), h("div", { class: "skeleton-block thin medium" }), h("div", { class: "skeleton-block thin medium" }), h("div", { class: "skeleton-block thin medium" }))), h("div", { class: "is-col-12-xs is-col-12-sm is-col-4-md form-block-2" }, Array.from({ length: 7 }).map(() => (h("div", { class: "skeleton form-block-skeleton" }, h("div", { class: "skeleton-block bold" })))), h("div", { class: "skeleton" }, h("div", { class: "skeleton-block very-bold" })))))));
+      }
+      case 'pdf-skeleton': {
+        return (h("div", { class: "preloader-wrapper pdf-skeleton-preloader" }, h("div", { class: "jumbotron-sec" }, h("div", { class: "ptc-container skeleton-jumbotron" }, h("div", { class: "is-grid has-no-row-gap has-col-gap-lg" }, h("div", { class: "is-col-12 is-col-8-lg" }, h("div", { class: "sekleton" }, h("div", { class: "skeleton-block thin short" }), h("div", { class: "skeleton-block thick" }), h("div", { class: "skeleton-block thick" }), h("ptc-spacer", { breakpoint: "small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "x-large" }), h("div", { class: "skeleton-block thin" }), h("div", { class: "skeleton-block thin medium" }), h("ptc-spacer", { breakpoint: "small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "x-large" }), h("div", { class: "cta-wrap" }, h("div", { class: "skeleton-block cta" }))))))), h("div", { class: "ptc-container" }, h("div", { class: "section-1" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block line-1" }), h("div", { class: "skeleton-block line-2 thin" }), h("div", { class: "skeleton-block line-3 thin" }), h("div", { class: "skeleton-block line-4 thin" }))), h("div", { class: "pdf-area" }, h("div", { class: "pdf-section" }, h("div", { class: "top-border" }), h("div", { class: "pdf-body" }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-block thick" }), h("div", { class: "skeleton-block thick" }), h("ptc-spacer", { breakpoint: "small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "x-large" }), h("div", { class: "skeleton-block thin" }), h("div", { class: "skeleton-block thin medium" }), h("ptc-spacer", { breakpoint: "small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "x-large" }), h("ptc-spacer", { breakpoint: "small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "x-large" }), h("div", { class: "skeleton-block thick-block" }), h("div", { class: "skeleton-block thin" }), h("div", { class: "skeleton-block thin medium" }))))))));
+      }
       default:
         return (h("div", { class: "ptc-section-standard preload-min-height" }, h("div", { class: "ptc-container" }, h("max-width-container", { "max-width": "960", breakpoint: 1200 }, h("div", { class: "skeleton" }, h("div", { class: "skeleton-header" }, h("div", { class: "skeleton-block bold" }), h("div", { class: "skeleton-block wide bold" }), h("ptc-spacer", { breakpoint: "small", size: "large" }), h("ptc-spacer", { breakpoint: "x-small", size: "x-large" }), h("div", { class: "skeleton-block medium" }), h("div", { class: "skeleton-block narrow" }), h("div", { class: "skeleton-block short" })), h("div", { class: "skeleton-image" }), h("div", { class: "skeleton-text" }, h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block long" }), h("div", { class: "skeleton-block narrow" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block medium" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block long" }), h("div", { class: "skeleton-block medium" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block long" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block medium" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block wide" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block short bold" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block wide" }), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block" }), h("div", { class: "skeleton-block medium" })))))));
     }

package/dist/collection/components/ptc-search-field/ptc-search-field.css

@@ -61,6 +61,10 @@ ptc-link, ptc-square-card,
   height: 51px;
   border-radius: var(--ptc-border-radius-standard);
 }
+:host .search-div:focus-visible {
+  outline: 5px solid var(--keyboard-nav-outline) !important;
+  border-radius: var(--ptc-border-radius-standard) !important;
+}
 :host .search-div .input-wrap {
   position: relative;
   width: 100%;

package/dist/collection/components/ptc-search-field/ptc-search-field.js

@@ -59,7 +59,7 @@ export class PtcSearchField {
   render() {
     const classMap = this.getCssClassMap();
     const clearIconColor = this.darkTheme ? "white" : "black";
-    return (h(Host, { class: classMap }, this.styles && h("style", null, this.styles), h("div", { class: "search-div" }, h("div", { class: 'input-wrap' }, h("input", { id: "ptc-search-input", type: "text", value: this.textValue, placeholder: this.placeholderLabel, onKeyDown: (e) => { this.keyDownHandler(e); }, onKeyUp: () => { this.keyUpHandler(); }, onChange: (e) => { this.textChangedHandler(e); } }), this.enableClear && h("div", { class: "icon-wrapper" }, h("icon-asset", { class: "cls", type: "ptc", color: clearIconColor, name: "times", size: "xxx-small", onClick: (e) => { this.clearSearchValue(); this.buttonClickHandler(e); } }))), h("button", { type: "button", color: "blackgrey", class: "search-btn", onClick: (e) => { this.buttonClickHandler(e); } }, h("icon-asset", { type: "ptc", size: "medium", name: "new-search", color: "white" })))));
+    return (h(Host, { class: classMap }, this.styles && h("style", null, this.styles), h("div", { class: "search-div", tabindex: "0" }, h("div", { class: 'input-wrap' }, h("input", { id: "ptc-search-input", type: "text", value: this.textValue, placeholder: this.placeholderLabel, onKeyDown: (e) => { this.keyDownHandler(e); }, onKeyUp: () => { this.keyUpHandler(); }, onChange: (e) => { this.textChangedHandler(e); } }), this.enableClear && h("div", { class: "icon-wrapper" }, h("icon-asset", { class: "cls", type: "ptc", color: clearIconColor, name: "times", size: "xxx-small", onClick: (e) => { this.clearSearchValue(); this.buttonClickHandler(e); } }))), h("button", { type: "button", color: "blackgrey", class: "search-btn", onClick: (e) => { this.buttonClickHandler(e); }, tabindex: "-1" }, h("icon-asset", { type: "ptc", size: "medium", name: "new-search", color: "white" })))));
   }
   getCssClassMap() {
     return {

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

@@ -84,6 +84,7 @@ ptc-link, ptc-square-card,
   }
 }
 :host .navArrows {
+  cursor: pointer;
   display: inline-block;
 }
 :host .navArrows svg {