@ptcwebops/ptcw-design 6.3.37 → 6.3.38-beta

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

@@ -1,164 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-63ddc79c.js');
-
-const ptcProductListCss = "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}}:host{display:block;padding-bottom:52px}@media only screen and (min-width: 992px){:host{padding-bottom:102px}}:host .no-result-wrap{display:none}:host .no-result-wrap.show{display:block}:host .no-result-wrap .no-result{display:flex;justify-content:center;align-items:center;min-height:160px;padding:20px;text-align:center}";
-
-const PtcProductList = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.clearCtaClicked = index.createEvent(this, "clearCtaClicked", 7);
-    this.emptyTitle = undefined;
-    this.emptySubTitle = undefined;
-    this.clearButtonLabel = undefined;
-  }
-  handleSearchResult(event) {
-    const { sender, searchTerm } = event.detail;
-    if (sender) {
-      this.sortCards(searchTerm);
-    }
-  }
-  handleMultipleSearchResult(event) {
-    const { sender, selectedOptions } = event.detail;
-    if (sender) {
-      this.sortMultipleCards(selectedOptions);
-    }
-  }
-  handleEmptyResult(event) {
-    const { sender, searchTerm } = event.detail;
-    if (sender) {
-      this.noresultSection.classList.add('show');
-      this.sortCards(searchTerm);
-    }
-  }
-  sortMultipleCards(searchItems) {
-    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'));
-      if (searchItems.length > 0) {
-        const shouldDisplayCategory = searchItems.some(searchItem => categoryTitle && categoryTitle.includes(searchItem));
-        category.style.display = shouldDisplayCategory ? 'block' : 'none';
-        if (shouldDisplayCategory) {
-          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';
-          });
-        }
-      }
-      else {
-        category.style.display = 'block';
-        productList.forEach(product => {
-          product.style.display = 'block';
-        });
-      }
-    });
-  }
-  // Sorting the
-  sortCards(searchItem) {
-    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';
-        });
-        this.noresultSection.classList.remove('show');
-      }
-      else {
-        const searchItemLowerCase = searchItem; //
-        if (searchItemLowerCase === categoryTitle) {
-          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';
-            if (searchItemLowerCase === productTitle) {
-              product.style.display = 'block';
-              category.style.display = 'block';
-            }
-          });
-        }
-      }
-    });
-  }
-  componentDidLoad() {
-    // ptcLogger.log('Component loaded!');
-    // ptcLogger.info('Component loaded!');
-    // 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');
-      if (toggleBtn) {
-        const handleToggle = () => {
-          if (card.classList.contains('has-opened')) {
-            card.classList.remove('has-opened');
-          }
-          else {
-            card.classList.add('has-opened');
-          }
-          this.hideAllCards(card);
-        };
-        toggleBtn.addEventListener('click', handleToggle);
-        toggleBtn.addEventListener('keydown', (event) => {
-          if (event.key === 'Enter') {
-            handleToggle();
-          }
-        });
-      }
-    });
-  }
-  hideAllCards(selectedCard) {
-    const productCards = this.hostElement.querySelectorAll('ptc-product-category ptc-product-card');
-    productCards.forEach(card => {
-      if (selectedCard != card) {
-        card.classList.remove('has-opened');
-      }
-    });
-  }
-  handleClick(event) {
-    this.clearCtaClicked.emit({
-      'sender': this,
-      'event': event,
-    });
-  }
-  // Adding id to the category and product cards
-  addIds() {
-    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);
-      });
-    });
-  }
-  render() {
-    return (index.h(index.Host, null, index.h("div", { class: "product-list" }, index.h("slot", null)), index.h("div", { class: "no-result-wrap" }, index.h("div", { class: "no-result" }, index.h("div", null, index.h("ptc-title", { type: 'h3', "title-margin": "margin-flush", upperline: 'no-upperline', "title-size": "large" }, this.emptyTitle || "No Results Found"), index.h("ptc-para", { "font-size": "x-small" }, this.emptySubTitle || "Try changing or removing some of your filters"), index.h("ptc-button", { type: "link", color: "ptc-quaternary", target: "_blank", onClick: (e) => { this.handleClick(e); } }, this.clearButtonLabel || "Clear Filters"))))));
-  }
-  get hostElement() { return index.getElement(this); }
-};
-PtcProductList.style = ptcProductListCss;
-
-exports.ptc_product_list = PtcProductList;

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

@@ -1,177 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-63ddc79c.js');
-
-const ptcProductSidebarCss = "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}}:host{display:block;position:relative}:host .hide{display:none !important}:host .white-box{padding:12px;background-color:var(--color-white);border-radius:var(--ptc-border-radius-standard)}:host .sort-wrap{display:block}@media only screen and (min-width: 768px){:host .sort-wrap{display:flex;justify-content:space-between}}@media only screen and (min-width: 992px){:host .sort-wrap{display:block}}:host .filter-result-wrap label{font-size:var(--ptc-font-size-xx-small);font-weight:600}@media only screen and (min-width: 992px){:host .filter-result-wrap label{font-size:var(--ptc-font-size-x-small)}}:host .filter-result-wrap .result-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}@media only screen and (min-width: 992px){:host .filter-result-wrap .result-header{margin-bottom:26px}}:host .filter-result-wrap .result-header .clear-cta{cursor:pointer;display:none;color:var(--color-gray-07);font-size:var(--ptc-font-size-x-small);text-decoration:underline}:host .filter-result-wrap .result-header .clear-cta:focus-visible{border-radius:var(--ptc-border-radius-standard);outline:5px solid var(--keyboard-nav-outline)}:host .filter-result-wrap .result-header .clear-cta.show{display:block}:host .filter-result-wrap .typeahead-input{box-sizing:border-box;margin-bottom:14px;width:100%;margin-right:0}@media only screen and (min-width: 768px){:host .filter-result-wrap .typeahead-input{margin-right:40px}}@media only screen and (min-width: 992px){:host .filter-result-wrap .typeahead-input{margin-right:0}}:host .filter-result-wrap .typeahead-input .input-wrap{position:relative}:host .filter-result-wrap .typeahead-input .input-wrap svg{position:absolute;left:8px;top:8px}:host .filter-result-wrap .typeahead-input .input-wrap input{margin-top:4px;padding:8px 8px 8px 34px;display:block;width:100%;box-sizing:border-box;border:1px solid var(--color-gray-03);font-size:14px}:host .filter-result-wrap .typeahead-input .input-wrap input:focus-visible{border-radius:var(--ptc-border-radius-standard);outline:5px solid var(--keyboard-nav-outline)}:host .filter-result-wrap .typeahead-input .suggestion-wrap{position:relative;width:100%}:host .filter-result-wrap .typeahead-input .suggestion-wrap .suggestions{border:1px solid var(--color-gray-03);box-shadow:0px 2px 4px rgba(35, 43, 45, 0.3);background-color:var(--color-white);position:absolute;z-index:105;top:0;margin:0;width:100%;box-sizing:border-box;padding:0;max-height:400px;overflow-y:auto}:host .filter-result-wrap .typeahead-input .suggestion-wrap .suggestions::-webkit-scrollbar{width:5px}:host .filter-result-wrap .typeahead-input .suggestion-wrap .suggestions::-webkit-scrollbar-track{-webkit-box-shadow:inset 0 0 6px rgba(0, 0, 0, 0.3)}:host .filter-result-wrap .typeahead-input .suggestion-wrap .suggestions::-webkit-scrollbar-thumb{background-color:var(--color-gray-05);outline:1px solid var(--color-gray-05)}:host .filter-result-wrap .typeahead-input .suggestion-wrap .suggestions li{list-style:none;padding:10px 16px;cursor:pointer;display:block;font-size:14px}:host .filter-result-wrap .typeahead-input .suggestion-wrap .suggestions li:focus-visible{border-radius:var(--ptc-border-radius-standard);outline:5px solid var(--keyboard-nav-outline)}:host .filter-result-wrap .typeahead-input .suggestion-wrap .suggestions li:first-child{padding-top:20px}:host .filter-result-wrap .typeahead-input .suggestion-wrap .suggestions li:last-child{padding-bottom:20px}:host .filter-result-wrap .dropdwon-filter{margin-bottom:10px;width:100%}:host .product-list-wrap{display:none}@media only screen and (min-width: 992px){:host .product-list-wrap{display:block}}:host .product-list-wrap .category-list{display:block;padding:12px 4px;font-size:var(--ptc-font-size-x-small)}:host .product-list-wrap .category-list ptc-para{padding-bottom:4px;display:block}:host .product-list-wrap .category-list ul{padding-left:20px;margin:0}";
-
-const PtcProductSidebar = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.selectedResult = index.createEvent(this, "selectedResult", 7);
-    this.clearsearch = index.createEvent(this, "clearsearch", 7);
-    this.inputChanged = index.createEvent(this, "inputChanged", 7);
-    this.emptyResult = index.createEvent(this, "emptyResult", 7);
-    this.searchTerm = '';
-    this.suggestions = [];
-    this.filterResults = "Filter Results";
-    this.filterText = "Filter";
-    this.clearText = "Clear";
-    this.technologyText = "Technology";
-    this.jumpToProduct = "Jump to Product";
-    this.selectTechnology = "Select a technology";
-    this.suggestionList = [];
-  }
-  componentWillLoad() {
-    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');
-  }
-  // Getting category title and products list
-  getDomData() {
-    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');
-        categoryObject.products.push(productTitle);
-      });
-    });
-  }
-  handleInputChange(event) {
-    const inputElement = event.target;
-    this.searchTerm = inputElement.value.toLocaleLowerCase();
-    this.clearBtn.classList.add('show');
-    this.getSuggestions();
-    this.inputChanged.emit({
-      'sender': this,
-      'event': event,
-    });
-  }
-  getSuggestions() {
-    const searchTerm = this.searchTerm.toLowerCase();
-    const suggestions = this.suggestionList.reduce((acc, item) => {
-      if (item.categoryName.toLowerCase().includes(searchTerm)) {
-        acc.push(item.categoryName); // Include the category if it matches the search term
-      }
-      const matchedProducts = item.products.filter((product) => product.toLowerCase().includes(searchTerm));
-      if (matchedProducts.length > 0) {
-        acc.push(...matchedProducts); // Include the matching products
-      }
-      return acc;
-    }, []);
-    this.suggestions = suggestions;
-  }
-  handleSelectSuggestion(suggestion, event) {
-    this.searchTerm = suggestion;
-    this.productListWrap.classList.add('hide');
-    this.selectedResult.emit({
-      'sender': this,
-      'event': event,
-      'searchTerm': this.searchTerm
-    });
-  }
-  handleKeyUp(e) {
-    const inputElement = e.target;
-    this.searchTerm = inputElement.value.toLocaleLowerCase();
-    if (e.keyCode === 13 && this.suggestions.length == 0) {
-      this.emptyResult.emit({
-        'sender': this,
-        'event': e,
-      });
-    }
-    else if (e.key === 'Escape') {
-      this.clearSearch(e);
-      this.inputBox.focus();
-    }
-  }
-  handleKeyDownClearCta(e) {
-    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');
-    if (input) {
-      input.value = "";
-    }
-    this.suggestions = [];
-    this.clearsearch.emit({
-      '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');
-        if (input) {
-          input.value = "";
-        }
-      }
-    }
-  }
-  handleClick() {
-    this.suggestions = [];
-  }
-  handleclearCtaClicked(eve) {
-    const { sender, event } = eve.detail;
-    if (sender) {
-      this.clearSearch(event);
-    }
-  }
-  handleSelectedValues(event) {
-    const { sender, selectedOptions } = event.detail;
-    if (sender) {
-      if (selectedOptions.length > 0) {
-        this.clearBtn.classList.add('show');
-        this.productListWrap.classList.add('hide');
-      }
-      else {
-        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');
-    if (!listItems)
-      return;
-    if (e.key === 'Enter') {
-      this.handleSelectSuggestion(suggestion, e);
-      this.suggestions = [];
-    }
-    else if (e.key === 'Tab') {
-      e.preventDefault();
-      const isShift = e.shiftKey;
-      const nextIndex = isShift
-        ? (index - 1 + listItems.length) % listItems.length
-        : (index + 1) % listItems.length;
-      listItems[nextIndex].focus();
-    }
-    else if (e.key === 'Escape') {
-      this.clearSearch(e);
-      this.inputBox.focus();
-    }
-  }
-  render() {
-    return (index.h(index.Host, { class: 'search-box' }, index.h("div", { class: "filter-result-wrap white-box" }, index.h("div", { class: "result-header" }, index.h("ptc-title", { type: "h3", "title-margin": "margin-flush", upperline: "no-upperline", "title-size": "medium", "title-height": "densest" }, this.filterResults), index.h("span", { class: "clear-cta", onClick: (e) => this.clearSearch(e), tabIndex: 0, onKeyDown: (e) => { this.handleKeyDownClearCta(e); } }, this.clearText)), index.h("div", { class: "sort-wrap" }, index.h("div", { class: "typeahead-input" }, index.h("label", { htmlFor: "searchBox" }, this.filterText), index.h("div", { class: "input-wrap" }, index.h("svg", { width: "19", height: "18", viewBox: "0 0 19 18", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, index.h("path", { d: "M0.208984 0V1.2375L6.95898 7.65V14.2875L11.5715 17.8875V7.65L18.209 1.35V0H0.208984Z", fill: "#323B42" })), index.h("input", { type: "text", value: this.searchTerm, onInput: (event) => this.handleInputChange(event), onKeyUp: (e) => this.handleKeyUp(e), id: 'searchBox' })), this.suggestions.length > 0 &&
-      index.h("div", { class: "suggestion-wrap" }, index.h("ul", { class: "suggestions" }, this.suggestions.map((suggestion, index$1) => (index.h("li", { onClick: (e) => this.handleSelectSuggestion(suggestion, e), tabIndex: 0, onKeyDown: (e) => this.handleSuggestionKeyDown(e, index$1, suggestion) }, suggestion)))))), index.h("div", { class: "dropdwon-filter" }, index.h("label", { htmlFor: "tech-dropdown" }, this.technologyText), index.h("ptc-product-dropdown", { placeholder: this.selectTechnology, id: "tech-dropdown" }, this.suggestionList.map((item) => (index.h("span", null, item.categoryName))))))), index.h("ptc-spacer", { size: "large" }), index.h("ptc-spacer", { size: "large" }), index.h("div", { class: "product-list-wrap white-box" }, index.h("ptc-title", { type: "h3", "title-margin": "margin-flush", upperline: "no-upperline", "title-size": "medium", "title-height": "densest" }, this.jumpToProduct), this.suggestionList.map((item) => (index.h("div", { class: "category-list" }, index.h("ptc-para", { "font-size": 'x-small', "font-weight": 'w-7', "para-line-h": "line-height-densest", "para-margin": 'margin-flush' }, index.h("list-item", { "list-type": "list-underline", "link-href": '#' + item.categoryName }, index.h("ptc-tooltip", { "text-display": "inline", "text-lines": "4", "z-index": "z-2", description: item.categoryName, position: "bottom" }))), index.h("div", { class: "product-list" }, index.h("ul", null, item.products.map((product) => (index.h("list-item", { "list-type": "list-underline", "link-href": '#' + product }, product)))))))))));
-  }
-  get hostElement() { return index.getElement(this); }
-};
-PtcProductSidebar.style = ptcProductSidebarCss;
-
-exports.ptc_product_sidebar = PtcProductSidebar;

package/dist/cjs/ptc-readmore.cjs.entry.js

@@ -1,180 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-63ddc79c.js');
-
-const ptcReadmoreCss = "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}}:host{display:block}.box input{opacity:0;position:absolute;pointer-events:none}.box .read-more-text{display:-webkit-box;-webkit-box-orient:vertical;margin:0;overflow:hidden;word-wrap:break-word}.box .line1{-webkit-line-clamp:1}.box .line2{-webkit-line-clamp:2}.box .line3{-webkit-line-clamp:3}.box .line4{-webkit-line-clamp:4}.box .line5{-webkit-line-clamp:5}.box .line10{-webkit-line-clamp:10}.box input~label{display:block;position:relative;cursor:pointer;right:0;margin-top:var(--ptc-element-spacing-02);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-x-small);line-height:var(--ptc-line-height-densest);text-decoration-line:underline;color:var(--color-hyperlink);text-align:right;margin-right:var(--ptc-element-spacing-07)}.box input~label.left{text-align:left}.box input~label.right{text-align:right}.box input~label.center{text-align:center;margin-right:0}.box label:focus-visible{outline:none}.box label:focus-visible span{border-radius:var(--ptc-border-radius-standard);outline:5px solid var(--keyboard-nav-outline)}.box .z-auto{z-index:auto}.box .z-1{z-index:1}.box .z-2{z-index:2}.box .z-3{z-index:3}.box .z-999{z-index:999}.box input:checked+.read-more-text{-webkit-line-clamp:unset !important}.box .read-more-text:not(.truncated)~label{display:none}.box .show-less-cta{display:block !important}:host .box.add-icon .read-more-cta-label span{display:inline-block;position:relative;padding-right:var(--ptc-element-spacing-03)}:host .box.add-icon .read-more-cta-label span::after{content:\"\";background-image:url(\"data:image/svg+xml,%3Csvg viewBox='0 0 10 7' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M1 1L5 5L9 1' stroke='%2300890B' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E\");width:10px;height:7px;background-size:cover;position:absolute;right:-5px;bottom:7px}:host .box.add-icon .read-more-cta-label.show-less-cta span::after{transform:rotate(180deg)}:host .box.blue .read-more-cta-label{color:var(--color-hyperlink)}:host .box.gray .read-more-cta-label{color:var(--color-gray-10)}:host .box.green .read-more-cta-label{color:var(--color-green-07)}:host .box.initial .read-more-cta-label{color:initial}:host .box.small .read-more-cta-label{font-size:var(--ptc-font-size-x-small);line-height:var(--ptc-line-height-densest)}:host .box.medium .read-more-cta-label{font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-p)}:host .box.large .read-more-cta-label{font-size:var(--ptc-font-size-large);line-height:var(--ptc-line-height-p)}:host .box.large.add-icon .read-more-cta-label span{padding-right:var(--ptc-element-spacing-04)}:host .box.large.add-icon .read-more-cta-label span::after{width:15px;height:10px}";
-
-const PtcReadmore = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.readmoreToggle = index.createEvent(this, "readmoreToggle", 7);
-    /**
-   * Handle keyboard interactions
-   */
-    this.handleKeyDown = (event) => {
-      if (event.key !== 'Enter')
-        return;
-      const checkBoxEl = this.el.shadowRoot.querySelector('#expanded');
-      const cta = this.el.shadowRoot.querySelector('.read-more-cta-label');
-      if (!checkBoxEl || !cta)
-        return;
-      checkBoxEl.checked = !checkBoxEl.checked;
-      const isExpanded = checkBoxEl.checked;
-      cta.innerHTML = `<span>${isExpanded ? this.lessText || '' : this.moreText || ''}</span>`;
-      cta.classList.toggle('show-less-cta', isExpanded);
-      if (isExpanded) {
-        // Focus on the first element with tabindex="-1" within 'ptc-readmore'
-        const firstTabIndexMinusOne = this.el.querySelector('[tabindex="-1"]');
-        firstTabIndexMinusOne === null || firstTabIndexMinusOne === void 0 ? void 0 : firstTabIndexMinusOne.focus();
-      }
-      else {
-        cta.focus();
-        const readMoreText = this.el.shadowRoot.querySelector('.read-more-text');
-        readMoreText === null || readMoreText === void 0 ? void 0 : readMoreText.classList.add('truncated');
-      }
-      this.setTabIndex();
-      // if lessText content is not present then add tabindex=-1 to the more/less label
-      if (cta.textContent == '') {
-        cta.setAttribute('tabindex', '-1');
-      }
-    };
-    this.moreText = 'read more';
-    this.lessText = undefined;
-    this.readMorePosition = 'right';
-    this.display = 'inline';
-    this.visibleLines = 'line2';
-    this.visibleLinesCustom = undefined;
-    this.zIndex = 'z-auto';
-    this.checked = false;
-    this.size = 'small';
-    this.isIcon = false;
-    this.color = 'blue';
-    this.isContentSlotted = false;
-  }
-  async updateReadmoreStatus() {
-    setTimeout(() => {
-      this.addBtnTruncated();
-    }, 100);
-  }
-  addBtnTruncated() {
-    const appRoot = this.el.shadowRoot;
-    const ps = appRoot.querySelectorAll('.read-more-text');
-    ps.forEach(p => {
-      // if (this.visibleCharacters){
-      //   const truncatedText = p.textContent.slice(0, this.visibleCharacters);
-      //   p.textContent = truncatedText;
-      // }
-      p.classList[p.scrollHeight > p.clientHeight ? 'add' : 'remove']('truncated');
-    });
-  }
-  // Created this function to initialize the truncate function on specific elements like tabs
-  enableAddTruncatedClass(element) {
-    const allTabHeaders = document.querySelectorAll(element);
-    for (const element of Array.from(allTabHeaders)) {
-      let tabHeader = element;
-      if (tabHeader) {
-        tabHeader.addEventListener('click', () => {
-          setTimeout(() => {
-            this.addBtnTruncated();
-          }, 100);
-        });
-      }
-    }
-  }
-  componentDidLoad() {
-    this.addBtnTruncated();
-    document.addEventListener("readystatechange", () => {
-      if (document.readyState === "complete") {
-        this.addBtnTruncated();
-      }
-    });
-    this.enableAddTruncatedClass('tab-header');
-    this.enableAddTruncatedClass('ptc-ellipsis-dropdown');
-    this.enableAddTruncatedClass('ptc-product-card');
-    // added code for tabnavigation
-    setTimeout(() => {
-      this.setTabIndex();
-    }, 400);
-  }
-  setTabIndex() {
-    var _a, _b, _c;
-    //debugger
-    let links;
-    if (!this.isContentSlotted) {
-      links = (_a = this.el) === null || _a === void 0 ? void 0 : _a.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');
-    }
-    else {
-      let slot = (_b = this.el) === null || _b === void 0 ? void 0 : _b.querySelector('slot').assignedNodes();
-      links = (slot[0] instanceof HTMLElement)
-        ? slot[0].querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])')
-        : null;
-    }
-    let bottom = 999999;
-    let rects = (_c = this.el.shadowRoot.querySelector('.read-more-text')) === null || _c === void 0 ? void 0 : _c.getClientRects();
-    if (rects && rects.length > 0) {
-      bottom = rects[0].bottom;
-    }
-    if (links) {
-      links.forEach(link => {
-        let linkRects = link.getClientRects();
-        if (linkRects && linkRects.length > 0) {
-          if (linkRects[0].top < bottom) {
-            link.setAttribute('tabindex', '0');
-          }
-          else {
-            link.setAttribute('tabindex', '-1');
-          }
-        }
-      });
-    }
-  }
-  // click event handler
-  handleClick(event) {
-    var _a;
-    let links = (_a = this.el) === null || _a === void 0 ? void 0 : _a.querySelectorAll('button, [href], input, select, textarea, [tabindex]:not([tabindex="-1"])');
-    this.addBtnTruncated();
-    // check if the input box is checked
-    this.checked = event.target.checked;
-    // Getting cta element
-    const cta = this.el.shadowRoot.querySelector('.read-more-cta-label');
-    // Updating the cta text
-    this.checked
-      ? cta.innerHTML = `<span> ${this.lessText ? this.lessText : ''} </span>`
-      : cta.innerHTML = `<span> ${this.moreText ? this.moreText : ''}</span>`;
-    this.checked ? cta.classList.add('show-less-cta') : cta.classList.remove('show-less-cta');
-    // Emit the state change event
-    this.readmoreToggle.emit({
-      event: event,
-      sender: this.el,
-      isExpanded: this.checked,
-    });
-    if (links) {
-      if (this.checked) {
-        links.forEach(link => {
-          link.setAttribute('tabindex', '0');
-        });
-      }
-      else {
-        this.setTabIndex();
-      }
-    }
-  }
-  render() {
-    const classMap = this.getCssClassMap();
-    return (index.h(index.Host, { class: this.display }, index.h("div", { class: classMap }, index.h("input", { type: "checkbox", id: "expanded", onClick: (e) => this.handleClick(e), tabIndex: -1 }), !!this.visibleLines || !!this.visibleLinesCustom ? index.h("p", { class: `read-more-text ${this.visibleLines}`, style: { WebkitLineClamp: `${this.visibleLinesCustom}` } }, index.h("slot", null)) : null, index.h("label", { onKeyDown: this.handleKeyDown, htmlFor: "expanded", role: "button", class: `${this.zIndex + ' ' + this.readMorePosition} read-more-cta-label mf-listen`, tabIndex: 0 }, index.h("span", null, this.moreText)))));
-  }
-  getCssClassMap() {
-    return {
-      ['box']: true,
-      [this.color]: true,
-      [this.size]: true,
-      ['add-icon']: this.isIcon
-    };
-  }
-  get el() { return index.getElement(this); }
-};
-PtcReadmore.style = ptcReadmoreCss;
-
-exports.ptc_readmore = PtcReadmore;

package/dist/cjs/ptc-spacer.cjs.entry.js

@@ -1,38 +0,0 @@
-'use strict';
-
-Object.defineProperty(exports, '__esModule', { value: true });
-
-const index = require('./index-63ddc79c.js');
-
-const ptcSpacerCss = ":host{box-sizing:border-box;padding:0;margin:0;background:transparent;border:0;-moz-appearance:none;-webkit-appearance:none;appearance:none;position:relative;display:block;width:12px;min-width:12px;height:12px}@media (min-width: 36em){:host{width:16px;min-width:16px;height:16px}}:host(.ptc-spacer-horizontal){display:inline-block;height:100% !important}:host(.ptc-spacer-horizontal.xx-small){width:4px;min-width:4px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.xx-small){width:4px;min-width:4px}}:host(.ptc-spacer-horizontal.x-small){width:4px;min-width:4px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.x-small){width:8px;min-width:8px}}:host(.ptc-spacer-horizontal.small){width:8px;min-width:8px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.small){width:12px;min-width:12px}}:host(.ptc-spacer-horizontal.medium){height:100%}:host(.ptc-spacer-horizontal.large){width:16px;min-width:16px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.large){width:20px;min-width:20px}}:host(.ptc-spacer-horizontal.x-large){width:20px;min-width:20px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.x-large){width:28px;min-width:28px}}:host(.ptc-spacer-horizontal.xx-large){width:28px;min-width:28px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.xx-large){width:36px;min-width:36px}}:host(.ptc-spacer-horizontal.xxx-large){width:36px;min-width:36px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.xxx-large){width:48px;min-width:48px}}:host(.ptc-spacer-horizontal.xxxx-large){width:48px;min-width:48px;height:100%}@media (min-width: 36em){:host(.ptc-spacer-horizontal.xxxx-large){width:72px;min-width:72px}}:host(.ptc-spacer-vertical.xx-small){width:100%;height:4px;min-height:4px}:host(.ptc-spacer-vertical.x-small){width:100%;height:4px;min-height:4px}@media (min-width: 36em){:host(.ptc-spacer-vertical.x-small){height:8px;min-height:8px}}:host(.ptc-spacer-vertical.small){width:100%;height:8px;min-height:8px}@media (min-width: 36em){:host(.ptc-spacer-vertical.small){height:12px;min-height:12px}}:host(.ptc-spacer-vertical.medium){width:100%}:host(.ptc-spacer-vertical.large){width:100%;height:16px;min-height:16px}@media (min-width: 36em){:host(.ptc-spacer-vertical.large){height:20px;min-height:20px}}:host(.ptc-spacer-vertical.x-large){width:100%;height:20px;min-height:20px}@media (min-width: 36em){:host(.ptc-spacer-vertical.x-large){height:28px;min-height:28px}}:host(.ptc-spacer-vertical.xx-large){width:100%;height:28px;min-height:28px}@media (min-width: 36em){:host(.ptc-spacer-vertical.xx-large){height:36px;min-height:36px}}:host(.ptc-spacer-vertical.xxx-large){width:100%;height:36px;min-height:36px}@media (min-width: 36em){:host(.ptc-spacer-vertical.xxx-large){height:48px;min-height:48px}}:host(.ptc-spacer-vertical.xxxx-large){width:100%;height:48px;min-height:48px}@media (min-width: 36em){:host(.ptc-spacer-vertical.xxxx-large){height:72px;min-height:72px}}:host(.ptc-spacer-vertical.space-144){width:100%;height:144px;min-height:144px}:host(.ptc-spacer-vertical.space-120){width:100%;height:120px;min-height:120px}:host(.ptc-spacer-vertical.space-128){width:100%;height:128px;min-height:128px}:host(.ptc-spacer-xx-small){display:none}@media (max-width: 22.5em){:host(.ptc-spacer-xx-small){display:block}}:host(.ptc-spacer-x-small){display:none}@media (max-width: 35.99em){:host(.ptc-spacer-x-small){display:block}}:host(.ptc-spacer-small){display:none}@media (min-width: 36em){:host(.ptc-spacer-small){display:block}}:host(.ptc-spacer-medium){display:none}@media (min-width: 48em){:host(.ptc-spacer-medium){display:block}}:host(.ptc-spacer-large){display:none}@media (min-width: 62em){:host(.ptc-spacer-large){display:block}}:host(.ptc-spacer-x-large){display:none}@media (min-width: 64.0625em){:host(.ptc-spacer-x-large){display:block}}:host(.ptc-spacer-xx-large){display:none}@media (min-width: 75em){:host(.ptc-spacer-xx-large){display:block}}:host(.ptc-spacer-xxx-large){display:none}@media (min-width: 90em){:host(.ptc-spacer-xxx-large){display:block}}";
-
-const PtcSpacer = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.breakpoint = '';
-    this.size = 'medium';
-    this.direction = 'vertical';
-  }
-  render() {
-    const classMap = this.getCssClassMap();
-    return (index.h(index.Host, { class: classMap }));
-  }
-  getCssClassMap() {
-    return {
-      [this.size]: true,
-      ['ptc-spacer-horizontal']: this.direction === 'horizontal',
-      ['ptc-spacer-vertical']: this.direction === 'vertical',
-      ['ptc-spacer-xx-small']: this.breakpoint === 'xx-small',
-      ['ptc-spacer-x-small']: this.breakpoint === 'x-small',
-      ['ptc-spacer-small']: this.breakpoint === 'small',
-      ['ptc-spacer-medium']: this.breakpoint === 'medium',
-      ['ptc-spacer-large']: this.breakpoint === 'large',
-      ['ptc-spacer-x-large']: this.breakpoint === 'x-large',
-      ['ptc-spacer-xx-large']: this.breakpoint === 'xx-large',
-      ['ptc-spacer-xxx-large']: this.breakpoint === 'xxx-large',
-    };
-  }
-};
-PtcSpacer.style = ptcSpacerCss;
-
-exports.ptc_spacer = PtcSpacer;