@ptcwebops/ptcw-design 6.3.37 → 6.3.38

package/dist/esm/ptc-product-list.entry.js

@@ -25,68 +25,73 @@ const PtcProductList = class {
   handleEmptyResult(event) {
     const { sender, searchTerm } = event.detail;
     if (sender) {
-      this.noresultSection.classList.add('show');
+      this.noresultSection.classList.add("show");
       this.sortCards(searchTerm);
     }
   }
   sortMultipleCards(searchItems) {
-    const categoryList = Array.from(this.hostElement.querySelectorAll('ptc-product-category'));
+    const categoryList = Array.from(this.hostElement.querySelectorAll("ptc-product-category"));
     categoryList.forEach((category) => {
-      const categoryTitle = category.getAttribute('category-title');
-      const productList = Array.from(category.querySelectorAll('ptc-product-card'));
+      const categoryTitle = category.getAttribute("category-title");
+      const productList = Array.from(category.querySelectorAll("ptc-product-card"));
       if (searchItems.length > 0) {
-        const shouldDisplayCategory = searchItems.some(searchItem => categoryTitle && categoryTitle.includes(searchItem));
-        category.style.display = shouldDisplayCategory ? 'block' : 'none';
+        const shouldDisplayCategory = searchItems.some((searchItem) => categoryTitle && categoryTitle.includes(searchItem));
+        category.style.display = shouldDisplayCategory
+          ? "block"
+          : "none";
         if (shouldDisplayCategory) {
-          productList.forEach(product => {
-            product.style.display = 'block';
+          productList.forEach((product) => {
+            product.style.display = "block";
           });
         }
         else {
-          productList.forEach(product => {
-            const productTitle = product.getAttribute('card-title');
-            const shouldDisplayProduct = searchItems.some(searchItem => productTitle && productTitle.includes(searchItem));
-            product.style.display = shouldDisplayProduct ? 'block' : 'none';
+          productList.forEach((product) => {
+            const productTitle = product.getAttribute("card-title");
+            const shouldDisplayProduct = searchItems.some((searchItem) => productTitle &&
+              productTitle.includes(searchItem));
+            product.style.display = shouldDisplayProduct
+              ? "block"
+              : "none";
           });
         }
       }
       else {
-        category.style.display = 'block';
-        productList.forEach(product => {
-          product.style.display = 'block';
+        category.style.display = "block";
+        productList.forEach((product) => {
+          product.style.display = "block";
         });
       }
     });
   }
   // Sorting the
   sortCards(searchItem) {
-    const categoryList = this.hostElement.querySelectorAll('ptc-product-category');
+    const categoryList = this.hostElement.querySelectorAll("ptc-product-category");
     categoryList.forEach((category) => {
-      const categoryTitle = category.getAttribute('category-title');
-      const productList = category.querySelectorAll('ptc-product-card');
-      category.style.display = 'none';
-      if (searchItem === '') {
-        category.style.display = 'block';
-        productList.forEach(product => {
-          product.style.display = 'block';
+      const categoryTitle = category.getAttribute("category-title");
+      const productList = category.querySelectorAll("ptc-product-card");
+      category.style.display = "none";
+      if (searchItem === "") {
+        category.style.display = "block";
+        productList.forEach((product) => {
+          product.style.display = "block";
         });
-        this.noresultSection.classList.remove('show');
+        this.noresultSection.classList.remove("show");
       }
       else {
         const searchItemLowerCase = searchItem; //
         if (searchItemLowerCase === categoryTitle) {
-          category.style.display = 'block';
-          productList.forEach(product => {
-            product.style.display = 'block';
+          category.style.display = "block";
+          productList.forEach((product) => {
+            product.style.display = "block";
           });
         }
         else {
-          productList.forEach(product => {
-            const productTitle = product.getAttribute('card-title');
-            product.style.display = 'none';
+          productList.forEach((product) => {
+            const productTitle = product.getAttribute("card-title");
+            product.style.display = "none";
             if (searchItemLowerCase === productTitle) {
-              product.style.display = 'block';
-              category.style.display = 'block';
+              product.style.display = "block";
+              category.style.display = "block";
             }
           });
         }
@@ -99,24 +104,24 @@ const PtcProductList = class {
     // ptcLogger.warn('Component loaded!');
     // ptcLogger.error('Component loaded!');
     this.addIds();
-    this.noresultSection = this.hostElement.shadowRoot.querySelector('.no-result-wrap');
-    this.productList = this.hostElement.shadowRoot.querySelector('.product-list');
-    const productCards = this.hostElement.querySelectorAll('ptc-product-category ptc-product-card');
-    productCards.forEach(card => {
-      const toggleBtn = (card.shadowRoot).querySelector('.toggle-btn');
+    this.noresultSection = this.hostElement.shadowRoot.querySelector(".no-result-wrap");
+    this.productList = this.hostElement.shadowRoot.querySelector(".product-list");
+    const productCards = this.hostElement.querySelectorAll("ptc-product-category ptc-product-card");
+    productCards.forEach((card) => {
+      const toggleBtn = card.shadowRoot.querySelector(".toggle-btn");
       if (toggleBtn) {
         const handleToggle = () => {
-          if (card.classList.contains('has-opened')) {
-            card.classList.remove('has-opened');
+          if (card.classList.contains("has-opened")) {
+            card.classList.remove("has-opened");
           }
           else {
-            card.classList.add('has-opened');
+            card.classList.add("has-opened");
           }
           this.hideAllCards(card);
         };
-        toggleBtn.addEventListener('click', handleToggle);
-        toggleBtn.addEventListener('keydown', (event) => {
-          if (event.key === 'Enter') {
+        toggleBtn.addEventListener("click", handleToggle);
+        toggleBtn.addEventListener("keydown", (event) => {
+          if (event.key === "Enter") {
             handleToggle();
           }
         });
@@ -124,34 +129,37 @@ const PtcProductList = class {
     });
   }
   hideAllCards(selectedCard) {
-    const productCards = this.hostElement.querySelectorAll('ptc-product-category ptc-product-card');
-    productCards.forEach(card => {
+    const productCards = this.hostElement.querySelectorAll("ptc-product-category ptc-product-card");
+    productCards.forEach((card) => {
       if (selectedCard != card) {
-        card.classList.remove('has-opened');
+        card.classList.remove("has-opened");
       }
     });
   }
   handleClick(event) {
     this.clearCtaClicked.emit({
-      'sender': this,
-      'event': event,
+      sender: this,
+      event: event,
     });
   }
   // Adding id to the category and product cards
   addIds() {
-    const categoryList = this.hostElement.querySelectorAll('ptc-product-category');
+    const categoryList = this.hostElement.querySelectorAll("ptc-product-category");
     categoryList.forEach((category) => {
-      const categoryTitle = category.getAttribute('category-title');
-      category.setAttribute('id', categoryTitle);
-      const productList = category.querySelectorAll('ptc-product-card');
-      productList.forEach(product => {
-        const productTitle = product.getAttribute('card-title');
-        product.setAttribute('id', productTitle);
+      const categoryTitle = category.getAttribute("category-title");
+      category.setAttribute("id", categoryTitle);
+      const productList = category.querySelectorAll("ptc-product-card");
+      productList.forEach((product) => {
+        const productTitle = product.getAttribute("card-title");
+        product.setAttribute("id", productTitle);
       });
     });
   }
   render() {
-    return (h(Host, null, h("div", { class: "product-list" }, h("slot", null)), h("div", { class: "no-result-wrap" }, h("div", { class: "no-result" }, h("div", null, h("ptc-title", { type: 'h3', "title-margin": "margin-flush", upperline: 'no-upperline', "title-size": "large" }, this.emptyTitle || "No Results Found"), h("ptc-para", { "font-size": "x-small" }, this.emptySubTitle || "Try changing or removing some of your filters"), h("ptc-button", { type: "link", color: "ptc-quaternary", target: "_blank", onClick: (e) => { this.handleClick(e); } }, this.clearButtonLabel || "Clear Filters"))))));
+    return (h(Host, null, h("div", { class: "product-list" }, h("slot", null)), h("div", { class: "no-result-wrap" }, h("div", { class: "no-result" }, h("div", null, h("ptc-title", { type: "h3", "title-margin": "margin-flush", upperline: "no-upperline", "title-size": "large" }, this.emptyTitle || "No Results Found"), h("ptc-para", { "font-size": "x-small" }, this.emptySubTitle ||
+      "Try changing or removing some of your filters"), h("ptc-button", { type: "link", color: "ptc-quaternary", target: "_blank", onClick: (e) => {
+        this.handleClick(e);
+      } }, this.clearButtonLabel || "Clear Filters"))))));
   }
   get hostElement() { return getElement(this); }
 };

package/dist/esm/ptc-product-sidebar.entry.js

@@ -9,7 +9,7 @@ const PtcProductSidebar = class {
     this.clearsearch = createEvent(this, "clearsearch", 7);
     this.inputChanged = createEvent(this, "inputChanged", 7);
     this.emptyResult = createEvent(this, "emptyResult", 7);
-    this.searchTerm = '';
+    this.searchTerm = "";
     this.suggestions = [];
     this.filterResults = "Filter Results";
     this.filterText = "Filter";
@@ -23,20 +23,20 @@ const PtcProductSidebar = class {
     this.getDomData();
   }
   componentDidLoad() {
-    this.productListWrap = this.hostElement.shadowRoot.querySelector('.product-list-wrap');
-    this.clearBtn = this.hostElement.shadowRoot.querySelector('.clear-cta');
-    this.inputBox = this.hostElement.shadowRoot.querySelector('#searchBox');
+    this.productListWrap = this.hostElement.shadowRoot.querySelector(".product-list-wrap");
+    this.clearBtn = this.hostElement.shadowRoot.querySelector(".clear-cta");
+    this.inputBox = this.hostElement.shadowRoot.querySelector("#searchBox");
   }
   // Getting category title and products list
   getDomData() {
-    const categoryList = document.querySelectorAll('ptc-product-category');
-    categoryList.forEach(category => {
-      let categoryTitle = category.getAttribute('category-title');
+    const categoryList = document.querySelectorAll("ptc-product-category");
+    categoryList.forEach((category) => {
+      let categoryTitle = category.getAttribute("category-title");
       let categoryObject = { categoryName: categoryTitle, products: [] };
       this.suggestionList.push(categoryObject);
-      let productList = category.querySelectorAll('ptc-product-card');
-      productList.forEach(product => {
-        let productTitle = product.getAttribute('card-title');
+      let productList = category.querySelectorAll("ptc-product-card");
+      productList.forEach((product) => {
+        let productTitle = product.getAttribute("card-title");
         categoryObject.products.push(productTitle);
       });
     });
@@ -44,11 +44,11 @@ const PtcProductSidebar = class {
   handleInputChange(event) {
     const inputElement = event.target;
     this.searchTerm = inputElement.value.toLocaleLowerCase();
-    this.clearBtn.classList.add('show');
+    this.clearBtn.classList.add("show");
     this.getSuggestions();
     this.inputChanged.emit({
-      'sender': this,
-      'event': event,
+      sender: this,
+      event: event,
     });
   }
   getSuggestions() {
@@ -67,11 +67,11 @@ const PtcProductSidebar = class {
   }
   handleSelectSuggestion(suggestion, event) {
     this.searchTerm = suggestion;
-    this.productListWrap.classList.add('hide');
+    this.productListWrap.classList.add("hide");
     this.selectedResult.emit({
-      'sender': this,
-      'event': event,
-      'searchTerm': this.searchTerm
+      sender: this,
+      event: event,
+      searchTerm: this.searchTerm,
     });
   }
   handleKeyUp(e) {
@@ -79,39 +79,39 @@ const PtcProductSidebar = class {
     this.searchTerm = inputElement.value.toLocaleLowerCase();
     if (e.keyCode === 13 && this.suggestions.length == 0) {
       this.emptyResult.emit({
-        'sender': this,
-        'event': e,
+        sender: this,
+        event: e,
       });
     }
-    else if (e.key === 'Escape') {
+    else if (e.key === "Escape") {
       this.clearSearch(e);
       this.inputBox.focus();
     }
   }
   handleKeyDownClearCta(e) {
-    if (e.key === 'Enter') {
+    if (e.key === "Enter") {
       this.clearSearch(e);
     }
   }
   clearSearch(event) {
-    let input = this.hostElement.shadowRoot.querySelector('input');
-    this.productListWrap.classList.remove('hide');
-    this.clearBtn.classList.remove('show');
+    let input = this.hostElement.shadowRoot.querySelector("input");
+    this.productListWrap.classList.remove("hide");
+    this.clearBtn.classList.remove("show");
     if (input) {
       input.value = "";
     }
     this.suggestions = [];
     this.clearsearch.emit({
-      'sender': this,
-      'event': event,
-      'searchTerm': input.value
+      sender: this,
+      event: event,
+      searchTerm: input.value,
     });
   }
   handleDropdownTouched(event) {
     const { sender, isOpen } = event.detail;
     if (sender) {
       if (isOpen) {
-        let input = this.hostElement.shadowRoot.querySelector('input');
+        let input = this.hostElement.shadowRoot.querySelector("input");
         if (input) {
           input.value = "";
         }
@@ -131,25 +131,25 @@ const PtcProductSidebar = class {
     const { sender, selectedOptions } = event.detail;
     if (sender) {
       if (selectedOptions.length > 0) {
-        this.clearBtn.classList.add('show');
-        this.productListWrap.classList.add('hide');
+        this.clearBtn.classList.add("show");
+        this.productListWrap.classList.add("hide");
       }
       else {
-        this.clearBtn.classList.remove('show');
-        this.productListWrap.classList.remove('hide');
+        this.clearBtn.classList.remove("show");
+        this.productListWrap.classList.remove("hide");
       }
     }
   }
   handleSuggestionKeyDown(e, index, suggestion) {
     var _a;
-    const listItems = (_a = e.currentTarget.parentElement) === null || _a === void 0 ? void 0 : _a.querySelectorAll('li');
+    const listItems = (_a = e.currentTarget.parentElement) === null || _a === void 0 ? void 0 : _a.querySelectorAll("li");
     if (!listItems)
       return;
-    if (e.key === 'Enter') {
+    if (e.key === "Enter") {
       this.handleSelectSuggestion(suggestion, e);
       this.suggestions = [];
     }
-    else if (e.key === 'Tab') {
+    else if (e.key === "Tab") {
       e.preventDefault();
       const isShift = e.shiftKey;
       const nextIndex = isShift
@@ -157,14 +157,15 @@ const PtcProductSidebar = class {
         : (index + 1) % listItems.length;
       listItems[nextIndex].focus();
     }
-    else if (e.key === 'Escape') {
+    else if (e.key === "Escape") {
       this.clearSearch(e);
       this.inputBox.focus();
     }
   }
   render() {
-    return (h(Host, { class: 'search-box' }, h("div", { class: "filter-result-wrap white-box" }, h("div", { class: "result-header" }, h("ptc-title", { type: "h3", "title-margin": "margin-flush", upperline: "no-upperline", "title-size": "medium", "title-height": "densest" }, this.filterResults), h("span", { class: "clear-cta", onClick: (e) => this.clearSearch(e), tabIndex: 0, onKeyDown: (e) => { this.handleKeyDownClearCta(e); } }, this.clearText)), h("div", { class: "sort-wrap" }, h("div", { class: "typeahead-input" }, h("label", { htmlFor: "searchBox" }, this.filterText), h("div", { class: "input-wrap" }, h("svg", { width: "19", height: "18", viewBox: "0 0 19 18", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M0.208984 0V1.2375L6.95898 7.65V14.2875L11.5715 17.8875V7.65L18.209 1.35V0H0.208984Z", fill: "#323B42" })), h("input", { type: "text", value: this.searchTerm, onInput: (event) => this.handleInputChange(event), onKeyUp: (e) => this.handleKeyUp(e), id: 'searchBox' })), this.suggestions.length > 0 &&
-      h("div", { class: "suggestion-wrap" }, h("ul", { class: "suggestions" }, this.suggestions.map((suggestion, index) => (h("li", { onClick: (e) => this.handleSelectSuggestion(suggestion, e), tabIndex: 0, onKeyDown: (e) => this.handleSuggestionKeyDown(e, index, suggestion) }, suggestion)))))), h("div", { class: "dropdwon-filter" }, h("label", { htmlFor: "tech-dropdown" }, this.technologyText), h("ptc-product-dropdown", { placeholder: this.selectTechnology, id: "tech-dropdown" }, this.suggestionList.map((item) => (h("span", null, item.categoryName))))))), h("ptc-spacer", { size: "large" }), h("ptc-spacer", { size: "large" }), h("div", { class: "product-list-wrap white-box" }, h("ptc-title", { type: "h3", "title-margin": "margin-flush", upperline: "no-upperline", "title-size": "medium", "title-height": "densest" }, this.jumpToProduct), this.suggestionList.map((item) => (h("div", { class: "category-list" }, h("ptc-para", { "font-size": 'x-small', "font-weight": 'w-7', "para-line-h": "line-height-densest", "para-margin": 'margin-flush' }, h("list-item", { "list-type": "list-underline", "link-href": '#' + item.categoryName }, h("ptc-tooltip", { "text-display": "inline", "text-lines": "4", "z-index": "z-2", description: item.categoryName, position: "bottom" }))), h("div", { class: "product-list" }, h("ul", null, item.products.map((product) => (h("list-item", { "list-type": "list-underline", "link-href": '#' + product }, product)))))))))));
+    return (h(Host, { class: "search-box" }, h("div", { class: "filter-result-wrap white-box" }, h("div", { class: "result-header" }, h("ptc-title", { type: "h3", "title-margin": "margin-flush", upperline: "no-upperline", "title-size": "medium", "title-height": "densest" }, this.filterResults), h("span", { class: "clear-cta", onClick: (e) => this.clearSearch(e), tabIndex: 0, onKeyDown: (e) => {
+        this.handleKeyDownClearCta(e);
+      } }, this.clearText)), h("div", { class: "sort-wrap" }, h("div", { class: "typeahead-input" }, h("label", { htmlFor: "searchBox" }, this.filterText), h("div", { class: "input-wrap" }, h("svg", { width: "19", height: "18", viewBox: "0 0 19 18", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M0.208984 0V1.2375L6.95898 7.65V14.2875L11.5715 17.8875V7.65L18.209 1.35V0H0.208984Z", fill: "#323B42" })), h("input", { type: "text", value: this.searchTerm, onInput: (event) => this.handleInputChange(event), onKeyUp: (e) => this.handleKeyUp(e), id: "searchBox" })), this.suggestions.length > 0 && (h("div", { class: "suggestion-wrap" }, h("ul", { class: "suggestions" }, this.suggestions.map((suggestion, index) => (h("li", { onClick: (e) => this.handleSelectSuggestion(suggestion, e), tabIndex: 0, onKeyDown: (e) => this.handleSuggestionKeyDown(e, index, suggestion) }, suggestion))))))), h("div", { class: "dropdwon-filter" }, h("label", { htmlFor: "tech-dropdown" }, this.technologyText), h("ptc-product-dropdown", { placeholder: this.selectTechnology, id: "tech-dropdown" }, this.suggestionList.map((item) => (h("span", null, item.categoryName))))))), h("ptc-spacer", { size: "large" }), h("ptc-spacer", { size: "large" }), h("div", { class: "product-list-wrap white-box" }, h("ptc-title", { type: "h3", "title-margin": "margin-flush", upperline: "no-upperline", "title-size": "medium", "title-height": "densest" }, this.jumpToProduct), this.suggestionList.map((item) => (h("div", { class: "category-list" }, h("ptc-para", { "font-size": "x-small", "font-weight": "w-7", "para-line-h": "line-height-densest", "para-margin": "margin-flush" }, h("list-item", { "list-type": "list-underline", "link-href": "#" + item.categoryName }, h("ptc-tooltip", { "text-display": "inline", "text-lines": "4", "z-index": "z-2", description: item.categoryName, position: "bottom" }))), h("div", { class: "product-list" }, h("ul", null, item.products.map((product) => (h("list-item", { "list-type": "list-underline", "link-href": "#" + product }, product)))))))))));
   }
   get hostElement() { return getElement(this); }
 };

package/dist/esm/ptc-progress-bar.entry.js

@@ -9,7 +9,8 @@ const PtcProgressBar = class {
   }
   handleScroll() {
     const scrollTop = document.documentElement.scrollTop;
-    const scrollHeight = document.documentElement.scrollHeight - document.documentElement.clientHeight;
+    const scrollHeight = document.documentElement.scrollHeight -
+      document.documentElement.clientHeight;
     const percentage = (scrollTop / scrollHeight) * 100;
     this.scrollPercentage = percentage;
   }

package/dist/esm/ptc-quantity-counter.entry.js

@@ -6,7 +6,7 @@ const PtcQuantityCounter = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.addToCartClicked = createEvent(this, "addToCartClicked", 7);
-    this.defaultStyles = '.ptc-quaternary{width: 100%; border-radius: 0px 0px 4px 4px !important;} .tracker-div { display: block !important}';
+    this.defaultStyles = ".ptc-quaternary{width: 100%; border-radius: 0px 0px 4px 4px !important;} .tracker-div { display: block !important}";
     this.handleDecrement = () => {
       if (this.count > 1) {
         this.count -= 1;
@@ -22,11 +22,11 @@ const PtcQuantityCounter = class {
       const value = parseInt(input.value);
       if (!isNaN(value)) {
         if (value < 1) {
-          input.value = '1';
+          input.value = "1";
           this.count = 1;
         }
         else if (value > 999) {
-          input.value = '999';
+          input.value = "999";
           this.count = 999;
         }
         else {
@@ -50,13 +50,15 @@ const PtcQuantityCounter = class {
       }
       this.addToCartClicked.emit({
         sender: this,
-        itemCount: (_a = this.itemCountInput) === null || _a === void 0 ? void 0 : _a.value
+        itemCount: (_a = this.itemCountInput) === null || _a === void 0 ? void 0 : _a.value,
       });
       if (this.addToCartCta) {
         try {
-          let width = this.addToCartCta.offsetWidth > 50 ? this.addToCartCta.offsetWidth : this.addToCartCta.clientWidth;
+          let width = this.addToCartCta.offsetWidth > 50
+            ? this.addToCartCta.offsetWidth
+            : this.addToCartCta.clientWidth;
           if (width < 50) {
-            let button = this.addToCartCta.shadowRoot.querySelector('button');
+            let button = this.addToCartCta.shadowRoot.querySelector("button");
             width = button.getBoundingClientRect().width;
           }
           if (width > 50) {
@@ -66,26 +68,26 @@ const PtcQuantityCounter = class {
         catch (e) {
           console.log(e);
         }
-        this.addToCartCta.classList.add('added');
+        this.addToCartCta.classList.add("added");
         this.addToCartCta.innerHTML = `<svg xmlns="http://www.w3.org/2000/svg" width="16" height="12" viewBox="0 0 16 12" fill="none">
   <path d="M1.71436 4.92857L6.28578 9.5L14.2858 1.5" stroke="white" stroke-width="3" stroke-linecap="round"/>
 </svg>${this.addedLabel}`;
       }
       setTimeout(() => {
         if (this.addToCartCta) {
-          this.addToCartCta.classList.remove('added');
+          this.addToCartCta.classList.remove("added");
           this.addToCartCta.innerHTML = this.addToCartLabel;
           this.addToCartCta.styles = this.defaultStyles;
         }
       }, 3000);
     };
     this.count = 1;
-    this.addToCartLabel = 'Add to Cart';
-    this.addedLabel = 'Added';
+    this.addToCartLabel = "Add to Cart";
+    this.addedLabel = "Added";
     this.disabled = false;
   }
   render() {
-    return (h(Host, null, h("div", { class: "quantity-counter" }, h("button", { class: "decrement mf-listen", onClick: this.handleDecrement, disabled: this.disabled, tabindex: "-1" }, h("span", { tabindex: "0" }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "8", height: "8", viewBox: "0 0 8 8", fill: "none" }, h("path", { d: "M0 3.15039V4.85039H8V3.15039H0Z", fill: "#20262A" })))), h("input", { type: "number", onInput: this.handleInputChange, onClick: this.selectText, min: "1", max: "999", value: this.count, ref: el => (this.itemCountInput = el), disabled: this.disabled, class: "mf-listen" }), h("button", { class: "increment mf-listen", onClick: this.handleIncrement, disabled: this.disabled, tabindex: "-1" }, h("span", { tabindex: "0" }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "8", height: "8", viewBox: "0 0 8 8", fill: "none" }, h("g", { "clip-path": "url(#clip0_2974_659)" }, h("path", { d: "M7.95006 3.14981H4.85005V0.0498047H3.15005V3.14981H0.0500488V4.84981H3.15005V7.9498H4.85005V4.84981H7.95006V3.14981Z", fill: "#20262A" })), h("defs", null, h("clipPath", { id: "clip0_2974_659" }, h("rect", { width: "8", height: "8", fill: "white" }))))))), h("ptc-button", { disabled: this.disabled, type: "button", color: "ptc-quaternary", onClick: this.addToCart, ref: el => (this.addToCartCta = el), styles: this.defaultStyles }, this.addToCartLabel)));
+    return (h(Host, null, h("div", { class: "quantity-counter" }, h("button", { class: "decrement mf-listen", onClick: this.handleDecrement, disabled: this.disabled, tabindex: "-1" }, h("span", { tabindex: "0" }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "8", height: "8", viewBox: "0 0 8 8", fill: "none" }, h("path", { d: "M0 3.15039V4.85039H8V3.15039H0Z", fill: "#20262A" })))), h("input", { type: "number", onInput: this.handleInputChange, onClick: this.selectText, min: "1", max: "999", value: this.count, ref: (el) => (this.itemCountInput = el), disabled: this.disabled, class: "mf-listen" }), h("button", { class: "increment mf-listen", onClick: this.handleIncrement, disabled: this.disabled, tabindex: "-1" }, h("span", { tabindex: "0" }, h("svg", { xmlns: "http://www.w3.org/2000/svg", width: "8", height: "8", viewBox: "0 0 8 8", fill: "none" }, h("g", { "clip-path": "url(#clip0_2974_659)" }, h("path", { d: "M7.95006 3.14981H4.85005V0.0498047H3.15005V3.14981H0.0500488V4.84981H3.15005V7.9498H4.85005V4.84981H7.95006V3.14981Z", fill: "#20262A" })), h("defs", null, h("clipPath", { id: "clip0_2974_659" }, h("rect", { width: "8", height: "8", fill: "white" }))))))), h("ptc-button", { disabled: this.disabled, type: "button", color: "ptc-quaternary", onClick: this.addToCart, ref: (el) => (this.addToCartCta = el), styles: this.defaultStyles }, this.addToCartLabel)));
   }
 };
 PtcQuantityCounter.style = ptcQuantityCounterCss;

package/dist/esm/ptc-quote.entry.js

@@ -8,7 +8,7 @@ const PtcQuote = class {
   constructor(hostRef) {
     registerInstance(this, hostRef);
     this.quoteType = "image-quote";
-    this.quoteName = 'John Smith';
+    this.quoteName = "John Smith";
     this.ctaText = undefined;
     this.ctaUrl = undefined;
     this.imgSrc = undefined;
@@ -20,12 +20,14 @@ const PtcQuote = class {
   }
   render() {
     const classMap = this.getCssClassMap();
-    return (h(Host, { class: classMap }, this.imgSrc ? (h("div", { class: "quote-media" }, this.imgSrc ? h("img", { src: this.imgSrc, alt: this.imgTitle ? this.imgTitle : 'quote Image' }) : null, this.imgTitle ? this.getImageTitle() : null)) : null, h("div", { class: "quote-content" }, this.quoteType == 'image-quote' ? h("div", { class: 'quotemarks', innerHTML: QuotationMark }) : null, h("blockquote", null, this.quoteType == 'value-led-quote' && this.quoteImage &&
-      h("ptc-picture", { alt: "quote", src: this.quoteImage }), h("p", null, h("slot", null)), h("span", { class: "quote-name" }, this.quoteName ? this.quoteName : null), this.ctaText && this.ctaUrl ? (h("ptc-button", { type: "link", color: "ptc-secondary", "link-href": this.ctaUrl }, this.ctaText)) : null))));
+    return (h(Host, { class: classMap }, this.imgSrc ? (h("div", { class: "quote-media" }, this.imgSrc ? (h("img", { src: this.imgSrc, alt: this.imgTitle
+        ? this.imgTitle
+        : "quote Image" })) : null, this.imgTitle ? this.getImageTitle() : null)) : null, h("div", { class: "quote-content" }, this.quoteType == "image-quote" ? (h("div", { class: "quotemarks", innerHTML: QuotationMark })) : null, h("blockquote", null, this.quoteType == "value-led-quote" &&
+      this.quoteImage && (h("ptc-picture", { alt: "quote", src: this.quoteImage })), h("p", null, h("slot", null)), h("span", { class: "quote-name" }, this.quoteName ? this.quoteName : null), this.ctaText && this.ctaUrl ? (h("ptc-button", { type: "link", color: "ptc-secondary", "link-href": this.ctaUrl }, this.ctaText)) : null))));
   }
   getCssClassMap() {
     return {
-      [this.quoteType]: true
+      [this.quoteType]: true,
     };
   }
 };

package/dist/esm/ptc-readmore-char.entry.js

@@ -1,6 +1,6 @@
 import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-c83db688.js';
 
-const ptcReadmoreCharCss = "h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}a{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);text-decoration-line:underline;color:var(--color-hyperlink);transition:color var(--ptc-transition-medium) var(--ptc-ease-out);font-weight:var(--ptc-font-weight-bold)}a:visited{color:var(--color-blue-10)}a:active,a:visited:active{transition:none;color:var(--color-blue-09)}a:hover,a:visited:hover{color:var(--color-blue-08)}a.disabled{color:var(--color-gray-04) !important;cursor:not-allowed}a:focus-visible{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{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{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{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{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{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{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{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{border-radius:var(--ptc-border-radius-standard);border:2px solid white;outline:5px solid var(--keyboard-nav-outline)}.ptc-link{color:var(--color-gray-10);text-decoration:underline;text-decoration-thickness:2px;text-decoration-color:var(--color-green-06);text-underline-offset:5px;transition:text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.ptc-link:hover{color:var(--color-green-06)}.ptc-link:visited{color:var(--color-gray-10)}.ptc-link:active,.ptc-link:visited:active{transition:none;color:var(--color-green-06)}.ptc-link:hover,.ptc-link:visited:hover{color:var(--color-green-06)}.ptc-link-dark{color:var(--color-white);text-decoration:underline;text-decoration-thickness:2px;text-decoration-color:var(--color-green-06);text-underline-offset:5px;transition:text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.ptc-link-dark:hover{color:var(--color-green-06)}.ptc-link-dark:visited{color:var(--color-white)}.ptc-link-dark:active,.ptc-link-dark:visited:active{transition:none;color:var(--color-green-06)}.ptc-link-dark:hover,.ptc-link-dark:visited:hover{color:var(--color-green-06)}.vjs-social-share-links a{color:var(--color-white)}.vjs-social-share-links a:hover{color:var(--color-white)}:host{display:block}:host .description{display:inline}:host .truncated-label{cursor:pointer;color:var(--color-hyperlink);font-size:var(--ptc-font-size-small);font-weight:var(--ptc-font-weight-bold);text-decoration-line:underline;line-height:var(--ptc-line-height-densest)}:host .truncated-label::before{content:\"\";padding-left:8px}:host .truncated-label:focus-visible{border-radius:var(--ptc-border-radius-standard);outline:5px solid var(--keyboard-nav-outline)}:host .tracker-div{display:inline;display:inline-block}";
+const ptcReadmoreCharCss = "h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{word-break:break-word;hyphens:manual;-webkit-hyphens:manual;-moz-hyphens:manual;-ms-hyphens:manual}@supports (hyphenate-limit-chars: 12 3 3){h1,h2,h3,h4,h5,h6,p,ul,li,ptc-subnav,ptc-tab-list,ptc-link,ptc-square-card,.hyphenate-text,ptc-footer{hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;hyphenate-limit-chars:12 3 3;hyphenate-limit-lines:2;hyphenate-limit-last:always;hyphenate-limit-zone:6%;-webkit-hyphens:auto;-webkit-hyphenate-limit-before:3;-webkit-hyphenate-limit-after:3;-webkit-hyphenate-limit-chars:12 3 3;-webkit-hyphenate-limit-lines:2;-moz-hyphens:auto;-moz-hyphenate-limit-chars:12 3 3;-moz-hyphenate-limit-lines:2;-ms-hyphens:auto;-ms-hyphenate-limit-chars:12 3 3;-ms-hyphenate-limit-lines:2}}a{font-family:var(--ptc-font-latin);font-style:var(--ptc-font-style-normal);text-decoration-line:underline;color:var(--color-hyperlink);transition:color var(--ptc-transition-medium) var(--ptc-ease-out);font-weight:var(--ptc-font-weight-bold)}a:visited{color:var(--color-blue-10)}a:active,a:visited:active{transition:none;color:var(--color-blue-09)}a:hover,a:visited:hover{color:var(--color-blue-08)}a.disabled{color:var(--color-gray-04) !important;cursor:not-allowed}a:focus-visible{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{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{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{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{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{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{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{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{border-radius:var(--ptc-border-radius-standard);border:2px solid white;outline:5px solid var(--keyboard-nav-outline)}.ptc-link{color:var(--color-gray-10);text-decoration:underline;text-decoration-thickness:2px;text-decoration-color:var(--color-green-06);text-underline-offset:5px;transition:text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.ptc-link:hover{color:var(--color-green-06)}.ptc-link:visited{color:var(--color-gray-10)}.ptc-link:active,.ptc-link:visited:active{transition:none;color:var(--color-green-06)}.ptc-link:hover,.ptc-link:visited:hover{color:var(--color-green-06)}.ptc-link-dark{color:var(--color-white);text-decoration:underline;text-decoration-thickness:2px;text-decoration-color:var(--color-green-06);text-underline-offset:5px;transition:text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.ptc-link-dark:hover{color:var(--color-green-06)}.ptc-link-dark:visited{color:var(--color-white)}.ptc-link-dark:active,.ptc-link-dark:visited:active{transition:none;color:var(--color-green-06)}.ptc-link-dark:hover,.ptc-link-dark:visited:hover{color:var(--color-green-06)}.vjs-social-share-links a{color:var(--color-white)}.vjs-social-share-links a:hover{color:var(--color-white)}:host{display:block}:host .description{display:inline}:host .truncated-label{cursor:pointer;color:var(--color-hyperlink);font-size:var(--ptc-font-size-small);font-weight:var(--ptc-font-weight-bold);text-decoration-line:underline;line-height:var(--ptc-line-height-densest)}:host .truncated-label::before{content:\"\";padding-left:8px}:host .truncated-label:focus-visible{border-radius:var(--ptc-border-radius-standard);outline:5px solid var(--keyboard-nav-outline)}:host .tracker-div{display:inline;display:inline-block}";
 
 const PtcReadmoreChar = class {
   constructor(hostRef) {
@@ -22,13 +22,13 @@ const PtcReadmoreChar = class {
     this.readMoreClicked.emit(this.expanded);
   }
   render() {
-    const contentText = this.description
-      ? this.description.trim()
-      : '';
-    const truncatedContent = contentText.length > this.maxCharacters ? contentText.substring(0, this.maxCharacters) + '...' : contentText;
+    const contentText = this.description ? this.description.trim() : "";
+    const truncatedContent = contentText.length > this.maxCharacters
+      ? contentText.substring(0, this.maxCharacters) + "..."
+      : contentText;
     const label = this.expanded ? this.readLessText : this.readMoreText;
-    return (h(Host, null, h("p", { class: "description" }, this.expanded ? (this.description) : (truncatedContent)), contentText.length > this.maxCharacters && (h("div", { id: this.trackerId, class: 'tracker-div' }, h("label", { class: "truncated-label mf-listen", onClick: () => this.toggleExpand(), onKeyDown: (e) => {
-        if (e.key === 'Enter') {
+    return (h(Host, null, h("p", { class: "description" }, this.expanded ? this.description : truncatedContent), contentText.length > this.maxCharacters && (h("div", { id: this.trackerId, class: "tracker-div" }, h("label", { class: "truncated-label mf-listen", onClick: () => this.toggleExpand(), onKeyDown: (e) => {
+        if (e.key === "Enter") {
           this.toggleExpand();
         }
       }, tabIndex: 0 }, label)))));