@ptcwebops/ptcw-design 3.0.2 → 3.0.3

package/dist/esm/ptc-pricing-table.entry.js

@@ -1,532 +0,0 @@
-import { r as registerInstance, h, F as Fragment, H as Host, g as getElement } from './index-62587d0b.js';
-
-const ptcPricingTableCss = ":host{display:block;position:relative}:host #vertical-scroll-content-clipper{position:fixed;top:0;left:0;right:0;margin:auto;background-color:white;z-index:25;display:none}:host .last-column-tooltip .tooltip{right:-48px}:host #sticky-header-container{position:fixed;z-index:20;background-color:white;overflow-x:scroll;overflow-y:visible;-ms-overflow-style:none;scrollbar-width:none;visibility:hidden;border-top-left-radius:var(--ptc-border-radius-standard);border-top-right-radius:var(--ptc-border-radius-standard);box-shadow:var(--ptc-shadow-x-large)}:host #sticky-header-container::-webkit-scrollbar{display:none}:host #sticky-header-container th{background:var(--color-gray-10);color:white;padding:var(--ptc-element-spacing-04) var(--ptc-element-spacing-06) var(--ptc-element-spacing-04) var(--ptc-element-spacing-06);min-width:168px;max-width:180px;vertical-align:middle}:host #sticky-header-container th:not(:last-child){border-right:1px solid var(--color-gray-07)}:host #sticky-header-container th.desktop-header-first-cell{display:none}:host #sticky-header-container th.border-box-header-cell{box-sizing:border-box}:host #sticky-header-container th.table-filler-header-cell{width:99%;box-sizing:content-box}:host .scroll-buttons-container{position:absolute;top:0;right:0;display:flex;align-items:center;box-sizing:border-box}:host .scroll-buttons-container .scroll-buttons{z-index:15;position:absolute;display:inline-block;width:36px;width:fit-content;height:36px;background-color:white;box-shadow:var(--ptc-shadow-x-medium);display:flex;justify-content:center;align-items:center}:host .scroll-buttons-container .scroll-buttons icon-asset{z-index:15;display:flex;justify-content:center;align-items:center;width:36px;height:100%}:host .scroll-buttons-container .scroll-buttons.prev-button{z-index:15;left:0;border-radius:0px var(--ptc-element-spacing-01) var(--ptc-element-spacing-01) 0px}:host .scroll-buttons-container .scroll-buttons.prev-button ptc-para{z-index:15;margin-right:var(--ptc-element-spacing-04);display:none}:host .scroll-buttons-container .scroll-buttons.next-button{z-index:15;right:0;border-radius:var(--ptc-element-spacing-01) 0px 0px var(--ptc-element-spacing-01)}:host .scroll-buttons-container .scroll-buttons.next-button ptc-para{z-index:15;margin-left:var(--ptc-element-spacing-04);display:none}:host #table-container{border-radius:var(--ptc-border-radius-standard);box-shadow:var(--ptc-shadow-x-small);overflow-x:scroll;position:relative}:host #table-container #horizontal-scroll-box-shadow{display:none}:host #table-container table{border-spacing:0}:host #table-container th{background:var(--color-gray-10);color:white;padding:var(--ptc-element-spacing-04) var(--ptc-element-spacing-06) var(--ptc-element-spacing-04) var(--ptc-element-spacing-06)}:host #table-container th:not(:last-child){border-right:1px solid var(--color-gray-07)}:host #table-container th.desktop-header-first-cell{display:none}:host #table-container th.table-filler-header-cell{width:99%;display:none}:host #table-container tbody.mobile-table-body{display:contents;width:100%}:host #table-container tbody.desktop-table-body{display:none}:host #table-container tr{background-color:white;width:100%;overflow-x:scroll}:host #table-container tr:nth-child(odd){background-color:var(--color-gray-01)}:host #table-container tr:nth-child(even){background-color:white}:host #table-container tr.table-button-row{background-color:white}:host #table-container tr.table-button-row td{border-top:1px solid var(--color-gray-02)}:host #table-container tr.table-button-row td ptc-tooltip .text-ellipsis{font-size:var(--ptc-font-size-x-small)}:host #table-container td{text-align:center;min-width:168px;max-width:180px;padding:var(--ptc-element-spacing-04) var(--ptc-element-spacing-06) var(--ptc-element-spacing-04) var(--ptc-element-spacing-06)}:host #table-container td:not(:last-child){border-right:1px solid var(--color-gray-02)}:host #table-container td.table-filler-body-cell{width:99%;display:none}@media only screen and (min-width: 768px){:host .table-descriptor{width:768px;margin:auto}}@media only screen and (min-width: 992px){:host #sticky-header-container{box-shadow:none}:host #sticky-header-container th{max-width:275px}:host #sticky-header-container th.desktop-header-first-cell{display:table-cell;min-width:275px;box-sizing:content-box}:host #sticky-header-container th:first-of-type{position:-webkit-sticky;position:sticky;left:0;z-index:5}:host #sticky-header-container th.table-filler-header-cell{width:99%;display:none;max-width:fit-content;box-sizing:border-box}:host #table-container #horizontal-scroll-box-shadow{display:block;position:absolute;top:0;left:0;height:100%;width:var(--ptc-element-spacing-06);background:linear-gradient(90deg, rgba(0, 0, 0, 0.12) 0%, rgba(0, 0, 0, 0) 100%);z-index:10;visibility:hidden}:host #table-container th{max-width:275px}:host #table-container th.desktop-header-first-cell{display:table-cell;min-width:275px}:host #table-container th:first-of-type{position:-webkit-sticky;position:sticky;left:0;z-index:5}:host #table-container th.table-filler-header-cell{width:99%;display:none}:host #table-container tbody.mobile-table-body{display:none}:host #table-container tbody.desktop-table-body{display:contents;width:100%}:host #table-container tr:nth-child(odd){background-color:white}:host #table-container tr:nth-child(even){background-color:var(--color-gray-01)}:host #table-container tr.table-button-row{background-color:white}:host #table-container tr.table-button-row td{border-top:1px solid var(--color-gray-02)}:host #table-container td{max-width:275px}:host #table-container td:first-of-type{position:-webkit-sticky;position:sticky;left:0;z-index:5;background:inherit;min-width:275px}:host #table-container td:not(:first-child){text-align:center}:host #table-container td.first-column-cell.scroll-shadow{box-shadow:var(--ptc-shadow-x-large)}:host #table-container td.first-column-cell.no-shadow{box-shadow:none}:host #table-container td.table-filler-body-cell{width:99%;display:none}:host #table-container td.table-filler-button-cell{width:99%;display:none}}";
-
-const PtcPricingTable = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.scrollTopClipperHeightOptions = {
-      withSubNav: {
-        desktop: "104px",
-        mobile: "80px"
-      },
-      withoutSubNav: {
-        desktop: "40px",
-        mobile: "24px"
-      }
-    };
-    this.verticalEdgePixelComparator = (edge1, edge2) => {
-      let delta = 2;
-      if ((edge1 == edge2) || ((edge1 >= (edge2 - delta)) && (edge1 <= (edge2 + delta)))) {
-        return 0;
-      }
-      if (edge1 < (edge2 - delta)) {
-        return -1;
-      }
-      if (edge1 > (edge2 + delta)) {
-        return 1;
-      }
-    };
-    this.handleHorizontalScroll = () => {
-      var _a, _b, _c, _d, _e, _f, _g, _h;
-      this.targetElements = this.getTargetElements();
-      this.targetElements["sticky-header-container"].scrollLeft = (_a = this.targetElements["table-container"]) === null || _a === void 0 ? void 0 : _a.scrollLeft;
-      // Scroll the button containers in sync with the table's scrolling
-      if ([-1, 0].includes(this.verticalEdgePixelComparator((_b = this.targetElements["table-container"]) === null || _b === void 0 ? void 0 : _b.getBoundingClientRect().right, (_c = this.targetElements["table"]) === null || _c === void 0 ? void 0 : _c.getBoundingClientRect().right))) {
-        this.targetElements["normal-scroll-buttons-container"].style.left = `${((_d = this.targetElements["table-container"]) === null || _d === void 0 ? void 0 : _d.scrollLeft) + this.desktopHeaderFirstCellWidth}px`;
-        this.targetElements["sticky-scroll-buttons-container"].style.left = `${((_e = this.targetElements["table-container"]) === null || _e === void 0 ? void 0 : _e.scrollLeft) + this.desktopHeaderFirstCellWidth}px`;
-      }
-      // Scroll the mobile row headers along with the table in the mobile view
-      if (this.targetElements["mobile-table-row-headers"].length > 0) {
-        for (let i = 0; i < this.dataRows; i++) {
-          this.targetElements["mobile-table-row-headers"][i].style.paddingLeft = `${(_f = this.targetElements["table-container"]) === null || _f === void 0 ? void 0 : _f.scrollLeft}px`;
-        }
-      }
-      // Managing the visibility of the next scroll buttons in both the sticky and normal headers, depending on whether the table can scroll further to the right or not
-      if ([0, 1].includes(this.verticalEdgePixelComparator((_g = this.targetElements["table-container"]) === null || _g === void 0 ? void 0 : _g.getBoundingClientRect().right, this.targetElements["table"].getBoundingClientRect().right))) {
-        this.targetElements["normal-next-scroll-button"].style.visibility = 'hidden';
-        if (this.targetElements["sticky-header-container"].style.visibility === 'visible') {
-          this.targetElements["sticky-next-scroll-button"].style.visibility = 'hidden';
-        }
-      }
-      else {
-        this.targetElements["normal-next-scroll-button"].style.visibility = 'visible';
-        if (this.targetElements["sticky-header-container"].style.visibility === 'visible') {
-          this.targetElements["sticky-next-scroll-button"].style.visibility = 'visible';
-        }
-      }
-      // Adjusting the visibility of the previous scroll buttons in both the sticky and normal headers, as well as the box shadow in desktop view, depending on whether the table can scroll further to the left or not
-      if (this.targetElements["table-container"].scrollLeft === 0) {
-        this.targetElements["horizontal-scroll-box-shadow"].style.left = '0';
-        this.targetElements["horizontal-scroll-box-shadow"].style.visibility = 'hidden';
-        this.targetElements["normal-previous-scroll-button"].style.visibility = 'hidden';
-        if (this.targetElements["sticky-header-container"].style.visibility === 'visible') {
-          this.targetElements["sticky-previous-scroll-button"].style.visibility = 'hidden';
-        }
-      }
-      else {
-        this.targetElements["horizontal-scroll-box-shadow"].style.left = `${((_h = this.targetElements["table-container"]) === null || _h === void 0 ? void 0 : _h.scrollLeft) + this.desktopHeaderFirstCellWidth}px`;
-        this.targetElements["horizontal-scroll-box-shadow"].style.visibility = 'visible';
-        this.targetElements["normal-previous-scroll-button"].style.visibility = 'visible';
-        if (this.targetElements["sticky-header-container"].style.visibility === 'visible') {
-          this.targetElements["sticky-previous-scroll-button"].style.visibility = 'visible';
-        }
-      }
-    };
-    this.handleVerticalScroll = () => {
-      this.targetElements = this.getTargetElements();
-      const scrollTopPosition = window.scrollY || document.documentElement.scrollTop;
-      if (scrollTopPosition < this.lastScrollTop) {
-        // Scrolling Up
-        if (this.targetElements["table-container"].getBoundingClientRect().bottom > 0) {
-          if (this.targetElements["sticky-header-container"].getBoundingClientRect().top < 0) {
-            // Scroll the sticky header back into view along with the table
-            this.targetElements["vertical-scroll-content-clipper"].style.display = 'block';
-            this.targetElements["sticky-scroll-buttons-container"].style.opacity = '1';
-            this.targetElements["sticky-header-container"].style.visibility = 'visible';
-            this.targetElements["sticky-header-container"].style.top = `${this.targetElements["table-container"].getBoundingClientRect().bottom - this.targetElements["sticky-header-container"].getBoundingClientRect().height}px`;
-          }
-          else {
-            // Make the sticky header fixed once it is entirely within the window
-            this.targetElements["sticky-header-container"].style.top = this.scrollTopClipperHeight;
-          }
-        }
-        if (this.targetElements["table-header"].getBoundingClientRect().top > this.targetElements["sticky-header-container"].getBoundingClientRect().top) {
-          // Conceal the sticky header and reveal the normal header
-          this.targetElements["sticky-scroll-buttons-container"].style.opacity = '0';
-          this.targetElements["sticky-header-container"].style.visibility = 'hidden';
-          this.targetElements["table-header"].style.visibility = 'visible';
-          this.targetElements["vertical-scroll-content-clipper"].style.display = 'none';
-        }
-      }
-      else if (scrollTopPosition > this.lastScrollTop) {
-        // Scrolling down
-        if (this.targetElements["sticky-header-container"].getBoundingClientRect().bottom <= 0) {
-          // Reset and hide the sticky header when it scrolls out of the top of the window
-          this.targetElements["sticky-header-container"].style.top = `${-this.targetElements["sticky-header-container"].getBoundingClientRect().height}px`;
-          this.targetElements["sticky-scroll-buttons-container"].style.opacity = '0';
-          this.targetElements["sticky-header-container"].style.visibility = 'hidden';
-          this.targetElements["vertical-scroll-content-clipper"].style.display = 'none';
-        }
-        else if (this.targetElements["table-header"].getBoundingClientRect().top <= this.targetElements["sticky-header-container"].getBoundingClientRect().top) {
-          if (this.targetElements["table-container"].getBoundingClientRect().bottom <= this.targetElements["sticky-header-container"].getBoundingClientRect().bottom) {
-            // Scroll the sticky header out of the window along with the table
-            this.targetElements["sticky-header-container"].style.top = `${(this.targetElements["table-container"].getBoundingClientRect().bottom - this.targetElements["sticky-header-container"].clientHeight)}px`;
-          }
-          else {
-            // Conceal the normal header and reveal the sticky header
-            this.targetElements["vertical-scroll-content-clipper"].style.display = 'block';
-            this.targetElements["sticky-scroll-buttons-container"].style.opacity = '1';
-            this.targetElements["sticky-header-container"].style.visibility = 'visible';
-            this.targetElements["table-header"].style.visibility = 'hidden';
-            this.targetElements["sticky-previous-scroll-button"].style.visibility = this.targetElements["normal-previous-scroll-button"].style.visibility;
-            this.targetElements["sticky-next-scroll-button"].style.visibility = this.targetElements["normal-next-scroll-button"].style.visibility;
-            if (getComputedStyle(this.targetElements["sticky-next-scroll-button"]).visibility === "visible") {
-              this.targetElements["table-filler-sticky-header-cell"].style.boxSizing = "content-box";
-            }
-          }
-        }
-      }
-      this.lastScrollTop = scrollTopPosition <= 0 ? 0 : scrollTopPosition;
-    };
-    this.handleResize = () => {
-      this.targetElements["table-container"].scrollLeft = 0;
-      this.handleHorizontalScroll();
-      this.configureStickyHeader();
-      this.configureScrollButtonsContainers();
-      this.configureTableFillerCells();
-    };
-    this.pageWithSubnav = false;
-    this.tableTitle = undefined;
-    this.tableSubTitle = "";
-    this.tableDescription = "";
-    this.dataRows = undefined;
-    this.dataCols = undefined;
-    this.disclaimerCount = 0;
-    this.scrollTopClipperHeight = undefined;
-    this.desktopHeaderFirstCellWidth = 0;
-    this.targetElements = {};
-    this.columnHeaderLinks = [];
-    this.lastScrollTop = undefined;
-    this.scrollTimeInterval = 35;
-    this.scrollAmount = 5;
-    this.scrollLimit = 50;
-    this.mobileHeaderRowColSpan = this.dataCols;
-    this.showCtaButtonsRow = undefined;
-    this.ctaButtons = [];
-    this.disclaimers = [];
-  }
-  // Provides an object containing frequently accessed HTML elements for table-related operations
-  getTargetElements() {
-    let pricingTable = this.el.shadowRoot;
-    let verticalScrollContentClipper = pricingTable === null || pricingTable === void 0 ? void 0 : pricingTable.querySelector('#vertical-scroll-content-clipper');
-    let tableContainer = pricingTable === null || pricingTable === void 0 ? void 0 : pricingTable.querySelector('#table-container');
-    let table = tableContainer === null || tableContainer === void 0 ? void 0 : tableContainer.querySelector('table');
-    let tableHeader = tableContainer === null || tableContainer === void 0 ? void 0 : tableContainer.querySelector('table thead');
-    let desktopHeaderFirstCell = tableContainer === null || tableContainer === void 0 ? void 0 : tableContainer.querySelector('.desktop-header-first-cell');
-    let tableHeaderCells = tableContainer === null || tableContainer === void 0 ? void 0 : tableContainer.querySelectorAll('th');
-    let desktopTableBody = tableContainer === null || tableContainer === void 0 ? void 0 : tableContainer.querySelector('.desktop-table-body');
-    let mobileTableBody = tableContainer === null || tableContainer === void 0 ? void 0 : tableContainer.querySelector('.mobile-table-body');
-    let stickyHeaderContainer = pricingTable === null || pricingTable === void 0 ? void 0 : pricingTable.querySelector('#sticky-header-container');
-    let stickyHeaderCells = stickyHeaderContainer === null || stickyHeaderContainer === void 0 ? void 0 : stickyHeaderContainer.querySelectorAll('th');
-    let verticalScrollBoxShadow = tableContainer === null || tableContainer === void 0 ? void 0 : tableContainer.querySelector("#vertical-scroll-box-shadow");
-    let tableFillerStickyHeaderCell = stickyHeaderContainer === null || stickyHeaderContainer === void 0 ? void 0 : stickyHeaderContainer.querySelector('.table-filler-header-cell');
-    let tableFillerHeaderCell = tableHeader === null || tableHeader === void 0 ? void 0 : tableHeader.querySelector('.table-filler-header-cell');
-    let tableFillerBodyCells = table === null || table === void 0 ? void 0 : table.querySelectorAll('.table-filler-body-cell');
-    let tableFillerButtonCell = table === null || table === void 0 ? void 0 : table.querySelector('.table-filler-button-cell');
-    let mobileTableRowHeaders = pricingTable === null || pricingTable === void 0 ? void 0 : pricingTable.querySelectorAll('.mobile-table-row-header');
-    let normalScrollButtonsContainer = tableContainer === null || tableContainer === void 0 ? void 0 : tableContainer.querySelector('.scroll-buttons-container');
-    let stickyScrollButtonsContainer = stickyHeaderContainer === null || stickyHeaderContainer === void 0 ? void 0 : stickyHeaderContainer.querySelector('.scroll-buttons-container');
-    let normalPreviousScrollButton = normalScrollButtonsContainer === null || normalScrollButtonsContainer === void 0 ? void 0 : normalScrollButtonsContainer.querySelector('.prev-button');
-    let normalPreviousScrollButtonText = normalPreviousScrollButton === null || normalPreviousScrollButton === void 0 ? void 0 : normalPreviousScrollButton.querySelector('ptc-para');
-    let stickyPreviousScrollButton = stickyScrollButtonsContainer === null || stickyScrollButtonsContainer === void 0 ? void 0 : stickyScrollButtonsContainer.querySelector('.prev-button');
-    let stickyPreviousScrollButtonText = stickyPreviousScrollButton === null || stickyPreviousScrollButton === void 0 ? void 0 : stickyPreviousScrollButton.querySelector('ptc-para');
-    let normalNextScrollButton = normalScrollButtonsContainer === null || normalScrollButtonsContainer === void 0 ? void 0 : normalScrollButtonsContainer.querySelector('.next-button');
-    let normalNextScrollButtonText = normalNextScrollButton === null || normalNextScrollButton === void 0 ? void 0 : normalNextScrollButton.querySelector('ptc-para');
-    let stickyNextScrollButton = stickyScrollButtonsContainer === null || stickyScrollButtonsContainer === void 0 ? void 0 : stickyScrollButtonsContainer.querySelector('.next-button');
-    let stickyNextScrollButtonText = stickyNextScrollButton === null || stickyNextScrollButton === void 0 ? void 0 : stickyNextScrollButton.querySelector('ptc-para');
-    let horizontalScrollBoxShadow = tableContainer === null || tableContainer === void 0 ? void 0 : tableContainer.querySelector('#horizontal-scroll-box-shadow');
-    let targetElements = {
-      "vertical-scroll-content-clipper": verticalScrollContentClipper,
-      "pricing-table": pricingTable,
-      "table-container": tableContainer,
-      "table": table,
-      "table-header": tableHeader,
-      "desktop-header-first-cell": desktopHeaderFirstCell,
-      "table-header-cells": tableHeaderCells,
-      "desktop-table-body": desktopTableBody,
-      "mobile-table-body": mobileTableBody,
-      "sticky-header-container": stickyHeaderContainer,
-      "sticky-header-cells": stickyHeaderCells,
-      "vertical-scroll-box-shadow": verticalScrollBoxShadow,
-      "table-filler-sticky-header-cell": tableFillerStickyHeaderCell,
-      "table-filler-header-cell": tableFillerHeaderCell,
-      "table-filler-body-cells": tableFillerBodyCells,
-      "table-filler-button-cell": tableFillerButtonCell,
-      "mobile-table-row-headers": mobileTableRowHeaders,
-      "normal-scroll-buttons-container": normalScrollButtonsContainer,
-      "sticky-scroll-buttons-container": stickyScrollButtonsContainer,
-      "normal-previous-scroll-button": normalPreviousScrollButton,
-      "normal-previous-scroll-button-text": normalPreviousScrollButtonText,
-      "sticky-previous-scroll-button": stickyPreviousScrollButton,
-      "sticky-previous-scroll-button-text": stickyPreviousScrollButtonText,
-      "normal-next-scroll-button": normalNextScrollButton,
-      "normal-next-scroll-button-text": normalNextScrollButtonText,
-      "sticky-next-scroll-button": stickyNextScrollButton,
-      "sticky-next-scroll-button-text": stickyNextScrollButtonText,
-      "horizontal-scroll-box-shadow": horizontalScrollBoxShadow,
-    };
-    return targetElements;
-  }
-  // Sets up the scroll buttons container for both the sticky and normal headers
-  configureScrollButtonsContainers() {
-    this.targetElements = this.getTargetElements();
-    // Defines the dimensions
-    this.targetElements["normal-scroll-buttons-container"].style.width = `${this.targetElements["table-container"].clientWidth}px`;
-    this.targetElements["normal-scroll-buttons-container"].style.height = `${this.targetElements["table-header"].clientHeight}px`;
-    this.targetElements["sticky-scroll-buttons-container"].style.width = `${this.targetElements["table-container"].clientWidth}px`;
-    this.targetElements["sticky-scroll-buttons-container"].style.height = `${this.targetElements["table-header"].clientHeight}px`;
-    // For desktop screens, scroll buttons are positioned after the first column of the table
-    if (this.targetElements["desktop-header-first-cell"]) {
-      this.targetElements["normal-scroll-buttons-container"].style.width = `${this.targetElements["normal-scroll-buttons-container"].getBoundingClientRect().width - this.desktopHeaderFirstCellWidth}px`;
-      this.targetElements["sticky-scroll-buttons-container"].style.width = `${this.targetElements["sticky-scroll-buttons-container"].getBoundingClientRect().width - this.desktopHeaderFirstCellWidth}px`;
-    }
-    // Controlling the visibility of the previous scroll buttons, of the sticky and normal headers, based on whether table can scroll further to the left or not
-    if (this.targetElements["table-container"].scrollLeft === 0) {
-      this.targetElements["normal-previous-scroll-button"].style.visibility = 'hidden';
-      if (this.targetElements["sticky-header-container"].style.visibility === 'visible') {
-        this.targetElements["sticky-previous-scroll-button"].style.visibility = 'hidden';
-      }
-    }
-    else {
-      this.targetElements["normal-previous-scroll-button"].style.visibility = 'visible';
-      if (this.targetElements["sticky-header-container"].style.visibility === 'visible') {
-        this.targetElements["sticky-previous-scroll-button"].style.visibility = 'visible';
-      }
-    }
-    // Managing the visibility of the next scroll buttons in both the sticky and normal headers, depending on whether the table can be scrolled further to the right or not
-    if (this.targetElements["table-container"].getBoundingClientRect().width >= this.targetElements["table"].getBoundingClientRect().width) {
-      this.targetElements["normal-next-scroll-button"].style.visibility = 'hidden';
-      if (this.targetElements["sticky-header-container"].style.visibility === 'visible') {
-        this.targetElements["sticky-next-scroll-button"].style.visibility = 'hidden';
-      }
-    }
-    else {
-      this.targetElements["normal-next-scroll-button"].style.visibility = 'visible';
-      if (this.targetElements["sticky-header-container"].style.visibility === 'visible') {
-        this.targetElements["sticky-next-scroll-button"].style.visibility = 'visible';
-      }
-    }
-  }
-  // Configures the sticky header based on the dimensions of the table header
-  configureStickyHeader() {
-    var _a, _b, _c, _d, _e, _f;
-    const targetElements = this.getTargetElements();
-    // Expanding the content clipper by an additional 10px on each side to accommodate the table's box-shadow
-    targetElements["vertical-scroll-content-clipper"].style.width = `${targetElements["table-container"].clientWidth + 20}px`;
-    // Aligns the background color of the element with the body's background color
-    const bodyBackgroundColor = window.getComputedStyle(document.body, null).getPropertyValue('background-color');
-    if (bodyBackgroundColor === ("rgba(0, 0, 0, 0)"  )) {
-      targetElements["vertical-scroll-content-clipper"].style.backgroundColor = "white";
-    }
-    else {
-      targetElements["vertical-scroll-content-clipper"].style.backgroundColor = bodyBackgroundColor;
-    }
-    // Establishing the width of the sticky header to be in line with the table's width
-    targetElements["sticky-header-container"].style.width = `${targetElements["table-container"].clientWidth}px`;
-    // Adjusts the table's sticky behavior, making it adhere at varying positions below the top, contingent on factors like the device type (mobile or desktop) and the presence of a subnav in the page
-    if (this.pageWithSubnav) {
-      if (window.innerWidth >= 1200) {
-        this.scrollTopClipperHeight = this.scrollTopClipperHeightOptions.withSubNav.desktop;
-      }
-      else {
-        this.scrollTopClipperHeight = this.scrollTopClipperHeightOptions.withSubNav.mobile;
-      }
-    }
-    else {
-      if (window.innerWidth >= 1200) {
-        this.scrollTopClipperHeight = this.scrollTopClipperHeightOptions.withoutSubNav.desktop;
-      }
-      else {
-        this.scrollTopClipperHeight = this.scrollTopClipperHeightOptions.withoutSubNav.mobile;
-      }
-    }
-    targetElements["vertical-scroll-content-clipper"].style.height = this.scrollTopClipperHeight;
-    targetElements["sticky-header-container"].style.top = this.scrollTopClipperHeight;
-    // Align the widths of sticky header cells with those of the normal header cells
-    for (let i = 0; i < targetElements["table-header-cells"].length; i++) {
-      targetElements["sticky-header-cells"][i].style.width = `${targetElements["table-header-cells"][i].getBoundingClientRect().width}px`;
-      if (targetElements["table-header-cells"][i].classList.contains('desktop-header-first-cell')) {
-        this.desktopHeaderFirstCellWidth = targetElements["table-header-cells"][i].getBoundingClientRect().width;
-      }
-    }
-    // Box-sizing
-    if (targetElements["table"].clientWidth <= targetElements["table-container"].clientWidth) {
-      if (targetElements["desktop-table-body"]) {
-        for (let i = 0; i < targetElements["sticky-header-cells"].length; i++) {
-          (_b = (_a = targetElements["sticky-header-cells"][i]) === null || _a === void 0 ? void 0 : _a.classList) === null || _b === void 0 ? void 0 : _b.add('border-box-header-cell');
-        }
-      }
-    }
-    else {
-      for (let i = 0; i < targetElements["sticky-header-cells"].length; i++) {
-        if ((_d = (_c = targetElements["sticky-header-cells"][i]) === null || _c === void 0 ? void 0 : _c.classList) === null || _d === void 0 ? void 0 : _d.contains('border-box-header-cell')) {
-          (_f = (_e = targetElements["sticky-header-cells"][i]) === null || _e === void 0 ? void 0 : _e.classList) === null || _f === void 0 ? void 0 : _f.remove('border-box-header-cell');
-        }
-      }
-    }
-  }
-  configureTableFillerCells() {
-    var _a, _b, _c, _d;
-    this.targetElements = this.getTargetElements();
-    this.targetElements["table-filler-sticky-header-cell"].style.width = this.targetElements["table-filler-header-cell"].getBoundingClientRect().width;
-    if (this.targetElements['table'].getBoundingClientRect().width < this.targetElements['table-container'].getBoundingClientRect().width) {
-      // If the table is smaller than the container, insert fillers
-      this.targetElements["table-filler-sticky-header-cell"].style.display = 'table-cell';
-      this.targetElements["table-filler-header-cell"].style.display = 'table-cell';
-      for (let i = 0; i < this.dataRows; i++) {
-        this.targetElements["table-filler-body-cells"][i].style.display = 'table-cell';
-      }
-      if (this.targetElements["table-filler-button-cell"]) {
-        this.targetElements["table-filler-button-cell"].style.display = 'table-cell';
-      }
-      this.mobileHeaderRowColSpan = this.dataCols + 1;
-    }
-    else {
-      // If the table is equal to or larger than the container, remove fillers
-      this.targetElements["table-filler-sticky-header-cell"].style.width = '99%';
-      if (getComputedStyle(this.targetElements["sticky-next-scroll-button"]).visibility === 'hidden') {
-        for (let i = 0; i < this.targetElements["sticky-header-cells"].length + 1; i++) {
-          if ((_b = (_a = this.targetElements["sticky-header-cells"][i]) === null || _a === void 0 ? void 0 : _a.classList) === null || _b === void 0 ? void 0 : _b.contains('border-box-header-cell')) {
-            (_d = (_c = this.targetElements["sticky-header-cells"][i]) === null || _c === void 0 ? void 0 : _c.classList) === null || _d === void 0 ? void 0 : _d.remove('border-box-header-cell');
-          }
-        }
-      }
-    }
-  }
-  handleStickyHeaderHorizontalScroll() {
-    var _a;
-    this.targetElements["table-container"].scrollLeft = (_a = this.targetElements["sticky-header-container"]) === null || _a === void 0 ? void 0 : _a.scrollLeft;
-  }
-  handleScrollForwardHover() {
-    if (this.targetElements["normal-next-scroll-button"].getAttribute("data-clicked") !== "true") {
-      document.body.style.cursor = 'pointer';
-      this.targetElements["normal-next-scroll-button-text"].style.display = "block";
-      this.targetElements["sticky-next-scroll-button-text"].style.display = "block";
-    }
-  }
-  handleScrollForwardHoverOut() {
-    if (this.targetElements["normal-next-scroll-button"].getAttribute("data-clicked") !== "true") {
-      document.body.style.cursor = 'auto';
-      this.targetElements["normal-next-scroll-button-text"].style.display = "none";
-      this.targetElements["sticky-next-scroll-button-text"].style.display = "none";
-    }
-  }
-  handleScrollForward() {
-    this.targetElements = this.getTargetElements();
-    // Display the "See more" text when clicked
-    document.body.style.cursor = 'pointer';
-    this.targetElements["normal-next-scroll-button"].setAttribute("data-clicked", "true");
-    this.targetElements["normal-next-scroll-button-text"].style.display = "block";
-    this.targetElements["sticky-next-scroll-button-text"].style.display = "block";
-    let scrollAdded = 0;
-    let intervalId = setInterval(() => {
-      scrollAdded += this.scrollAmount;
-      let tableContainerRight = this.targetElements["table-container"].getBoundingClientRect().right;
-      let tableRight = this.targetElements["table"].getBoundingClientRect().right;
-      if ((scrollAdded == this.scrollLimit) || ([0, 1].includes(this.verticalEdgePixelComparator(tableContainerRight, tableRight)))) {
-        clearInterval(intervalId);
-        this.targetElements["normal-next-scroll-button"].setAttribute("data-clicked", "false");
-        // Remove the "See more" text if the mouse is not hovering over the button after scrolling
-        if (!this.targetElements["normal-next-scroll-button"].matches(':hover') && !this.targetElements["sticky-next-scroll-button"].matches(':hover')) {
-          document.body.style.cursor = 'auto';
-          this.targetElements["normal-next-scroll-button-text"].style.display = "none";
-          this.targetElements["sticky-next-scroll-button-text"].style.display = "none";
-        }
-      }
-      this.targetElements["table-container"].scrollLeft += scrollAdded;
-    }, this.scrollTimeInterval);
-  }
-  handleScrollBackwardHover() {
-    document.body.style.cursor = 'pointer';
-    if (this.targetElements["normal-previous-scroll-button"].getAttribute("data-clicked") !== "true") {
-      this.targetElements["normal-previous-scroll-button-text"].style.display = "block";
-      this.targetElements["sticky-previous-scroll-button-text"].style.display = "block";
-    }
-  }
-  handleScrollBackwardHoverOut() {
-    document.body.style.cursor = 'auto';
-    if (this.targetElements["normal-previous-scroll-button"].getAttribute("data-clicked") !== "true") {
-      this.targetElements["normal-previous-scroll-button-text"].style.display = "none";
-      this.targetElements["sticky-previous-scroll-button-text"].style.display = "none";
-    }
-  }
-  handleScrollBackward() {
-    this.targetElements = this.getTargetElements();
-    // Display the "See more" text when clicked
-    document.body.style.cursor = 'pointer';
-    this.targetElements["normal-previous-scroll-button"].setAttribute("data-clicked", "true");
-    this.targetElements["normal-previous-scroll-button-text"].style.display = "block";
-    this.targetElements["sticky-previous-scroll-button-text"].style.display = "block";
-    let scrollReduced = 0;
-    let intervalId = setInterval(() => {
-      scrollReduced += this.scrollAmount;
-      let tableContainerLeft = this.targetElements["table-container"].getBoundingClientRect().left;
-      let tableLeft = this.targetElements["table"].getBoundingClientRect().left;
-      if ((scrollReduced == this.scrollLimit) || [-1, 0].includes(this.verticalEdgePixelComparator(tableContainerLeft, tableLeft))) {
-        clearInterval(intervalId);
-        this.targetElements["normal-previous-scroll-button"].setAttribute("data-clicked", "false");
-        // Remove the "See more" text if the mouse is not hovering over the button after scrolling
-        if (!this.targetElements["normal-previous-scroll-button"].matches(':hover') && !this.targetElements["sticky-previous-scroll-button"].matches(':hover')) {
-          document.body.style.cursor = 'auto';
-          this.targetElements["normal-previous-scroll-button-text"].style.display = "none";
-          this.targetElements["sticky-previous-scroll-button-text"].style.display = "none";
-        }
-        return;
-      }
-      this.targetElements["table-container"].scrollLeft -= scrollReduced;
-    }, this.scrollTimeInterval);
-  }
-  componentWillLoad() {
-    let desktopHeaderFirstCellSlot = this.el.querySelector('[slot="desktop-header-first-cell"]');
-    let desktopHeaderFirstCellText = desktopHeaderFirstCellSlot.innerHTML;
-    this.el.insertAdjacentHTML('afterbegin', `<span slot="normal-desktop-header-first-cell">${desktopHeaderFirstCellText}</span><span slot="sticky-desktop-header-first-cell">${desktopHeaderFirstCellText}</span>`);
-    desktopHeaderFirstCellSlot.remove();
-    let columnHeaders = this.el.querySelectorAll('[slot^="column-header"]');
-    for (let i = 0; i < this.dataCols; i++) {
-      let slotValue = columnHeaders[i].getAttribute('slot');
-      let headerText = columnHeaders[i].innerHTML;
-      this.el.insertAdjacentHTML('afterbegin', `<span slot="normal-${slotValue}">${headerText}</span><span slot="sticky-${slotValue}">${headerText}</span>`);
-      columnHeaders[i].remove();
-    }
-    let headerLinks = this.el.querySelectorAll('[slot^="header-link"]');
-    if (headerLinks.length > 0) {
-      for (let i = 0; i < this.dataCols; i++) {
-        let linkHref = headerLinks[i].getAttribute('href');
-        let linkText = headerLinks[i].innerHTML;
-        this.columnHeaderLinks.push({ linkHref, linkText });
-        headerLinks[i].remove();
-      }
-    }
-    let ctaButtons = this.el.querySelectorAll('[slot^="cta-button"]');
-    this.showCtaButtonsRow = (ctaButtons.length !== 0);
-    for (let i = 0; i < this.dataCols; i++) {
-      this.ctaButtons.push({
-        linkHref: ctaButtons[i].getAttribute('href'),
-        linkText: ctaButtons[i].innerHTML
-      });
-      ctaButtons[i].remove();
-    }
-    let disclaimers = this.el.querySelectorAll('[slot^="disclaimer"]');
-    for (let i = 0; i < this.disclaimerCount; i++) {
-      this.disclaimers.push(disclaimers[i].innerHTML);
-      disclaimers[i].remove();
-    }
-  }
-  componentDidLoad() {
-    this.configureTableFillerCells();
-    this.configureStickyHeader();
-    this.configureScrollButtonsContainers();
-    window.addEventListener('scroll', this.handleVerticalScroll);
-    window.addEventListener('resize', this.handleResize);
-  }
-  disconnectedCallback() {
-    window.removeEventListener('scroll', this.handleVerticalScroll);
-    window.removeEventListener('resize', this.handleResize);
-  }
-  render() {
-    const getTableTitle = () => {
-      return (this.tableTitle && h(Fragment, null, h("div", { class: "table-descriptor" }, h("ptc-title", { type: "h2", "text-align": "center", "title-size": "xx-large", upperline: "no-upperline", "title-height": "densest", "title-margin": "margin-flush", "title-weight": "w-8" }, this.tableTitle)), (this.tableSubTitle)
-        ? h(Fragment, null, h("ptc-spacer", { breakpoint: "small", size: "x-small" }), h("ptc-spacer", { breakpoint: "x-small", size: "small" }))
-        : (this.tableDescription)
-          ? h(Fragment, null, h("ptc-spacer", { breakpoint: "small", size: "small" }), h("ptc-spacer", { breakpoint: "x-small", size: "medium" }))
-          : null));
-    };
-    const getTableSubTitle = () => {
-      return (this.tableSubTitle && h(Fragment, null, h("div", { class: "table-descriptor" }, h("ptc-title", { type: "h3", "text-align": "center", "title-size": "large", upperline: "no-upperline", "title-height": "densest", "title-margin": "margin-flush", "title-weight": "w-7" }, this.tableSubTitle)), h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" })));
-    };
-    const getTableDescription = () => {
-      return (this.tableDescription && h(Fragment, null, h("div", { class: "table-descriptor" }, h("ptc-para", { "font-size": "small", "font-weight": "w-4", "para-align": "center", "para-line-h": "line-height-p", "para-margin": "margin-flush" }, (this.tableDescription.length <= 500) ? this.tableDescription : h("ptc-readmore", { "more-text": "See more" }, this.tableDescription)))));
-    };
-    const getScrollButtonsContainer = () => {
-      return h("div", { class: "scroll-buttons-container" }, h("div", { class: "scroll-buttons prev-button", "data-clicked": "false", onClick: () => this.handleScrollBackward(), onMouseOver: () => this.handleScrollBackwardHover(), onMouseOut: () => this.handleScrollBackwardHoverOut() }, h("icon-asset", { type: "solid", size: "medium", name: "chevron-left", color: "primary-gray" }), h("ptc-para", { "font-size": "small", "font-weight": "w-6", "para-align": "justify", "para-color": "primary-grey", "para-line-h": "line-height-p", "para-margin": "margin-flush" }, "See More")), h("div", { class: "scroll-buttons next-button", "data-clicked": "false", onClick: () => this.handleScrollForward(), onMouseOver: () => this.handleScrollForwardHover(), onMouseOut: () => this.handleScrollForwardHoverOut() }, h("ptc-para", { "font-size": "small", "font-weight": "w-6", "para-align": "justify", "para-color": "primary-grey", "para-line-h": "line-height-p", "para-margin": "margin-flush" }, "See More"), h("icon-asset", { type: "solid", size: "medium", name: "chevron-right", color: "primary-gray" })));
-    };
-    const getTableHeader = (headerType) => {
-      return h("thead", null, h("tr", null, h("th", { class: "desktop-header-first-cell" }, h("ptc-para", { "font-size": "medium", "font-weight": "w-7", "para-align": "left", "para-color": "white", "para-line-h": "line-height-p", "para-margin": "margin-flush" }, h("slot", { name: `${headerType}-desktop-header-first-cell` }))), ([...Array(this.dataCols).keys()]).map(col => {
-        return h("th", null, h("ptc-para", { "font-size": "medium", "font-weight": "w-7", "para-align": "center", "para-color": "white", "para-line-h": "line-height-p", "para-margin": "margin-flush" }, h("slot", { name: `${headerType}-column-header-${col + 1}` })), (this.columnHeaderLinks.length === this.dataCols) ? h(Fragment, null, h("ptc-spacer", { breakpoint: 'small', size: "small" }), h("ptc-spacer", { breakpoint: 'x-small', size: "medium" }), h("ptc-link", { "font-size": "medium", "font-weight": "w-extrabold", href: `${this.columnHeaderLinks[col].linkHref}`, "link-area": "undefined", target: "_blank", theme: "d-green-underline" }, h("ptc-tooltip", { class: (col === (this.dataCols - 1)) ? "last-column-tooltip" : "", "text-display": "inline", "max-length": "30", "z-index": "z-2", description: this.columnHeaderLinks[col].linkText, position: "top" }))) : null);
-      }), h("th", { class: "table-filler-header-cell" })));
-    };
-    const getMobileTableBody = () => {
-      return h("tbody", { class: "mobile-table-body" }, ([...Array(this.dataRows).keys()]).map(row => {
-        return h(Fragment, null, h("tr", null, h("td", { colSpan: this.mobileHeaderRowColSpan }, h("div", { class: "mobile-table-row-header" }, h("ptc-para", { "font-size": "small", "font-weight": "w-6", "para-align": "left", "para-color": "primary-grey", "para-line-h": "line-height-p", "para-margin": "margin-1" }, h("slot", { name: `row-header-${row + 1}` }))))), h("tr", null, ([...Array(this.dataCols).keys()]).map(col => {
-          return h("td", null, h("slot", { name: `cell-r${row + 1}-c${col + 1}` }));
-        }), h("td", { class: "table-filler-body-cell" })));
-      }), (this.showCtaButtonsRow) ?
-        h("tr", { class: "table-button-row" }, ([...Array(this.dataCols).keys()]).map(col => {
-          return h("td", null, h("ptc-button", { type: "link", color: "ptc-tertiary", "link-href": this.ctaButtons[col].linkHref, target: "_blank" }, this.ctaButtons[col].linkText));
-        }), (this.mobileHeaderRowColSpan > this.dataCols) ? h("td", { class: "table-filler-button-cell" }) : null) : null);
-    };
-    const getDesktopTableBody = () => {
-      return h("tbody", { class: "desktop-table-body" }, ([...Array(this.dataRows).keys()]).map(row => {
-        return h("tr", null, h("td", { class: "first-column-cell" }, h("ptc-para", { "font-size": "small", "font-weight": "w-6", "para-align": "left", "para-color": "primary-grey", "para-line-h": "line-height-p", "para-margin": "margin-1" }, h("slot", { name: `row-header-${row + 1}` }))), ([...Array(this.dataCols).keys()]).map(col => {
-          return h("td", null, h("slot", { name: `cell-r${row + 1}-c${col + 1}` }));
-        }), h("td", { class: "table-filler-body-cell" }));
-      }), (this.showCtaButtonsRow) ?
-        h("tr", { class: "table-button-row" }, h("td", null), ([...Array(this.dataCols).keys()]).map(col => {
-          return h("td", null, h("ptc-button", { type: "link", color: "ptc-tertiary", "link-href": this.ctaButtons[col].linkHref, target: "_blank" }, h("ptc-tooltip", { class: (col === (this.dataCols - 1)) ? "last-column-tooltip" : "", "text-display": "inline", "max-length": "30", "z-index": "z-2", description: this.ctaButtons[col].linkText, position: "top" })));
-        }), h("td", { class: "table-filler-button-cell" })) : null);
-    };
-    const getDisclaimers = () => {
-      return ((this.disclaimerCount > 0) && h(Fragment, null, h("ptc-spacer", { breakpoint: "small", size: "medium" }), h("ptc-spacer", { breakpoint: "x-small", size: "large" }), this.disclaimers.map((disclaimer, ind) => {
-        return h(Fragment, null, h("ptc-para", { "font-size": "xx-small", "font-weight": "w-6", "para-align": "center", "para-color": "primary-grey", "para-line-h": "line-height-p", "para-margin": "margin-flush" }, disclaimer), (ind != (this.disclaimerCount - 1)) ? h("ptc-spacer", { size: "xx-small" }) : null);
-      })));
-    };
-    return (h(Host, null, h("div", { id: "vertical-scroll-content-clipper" }), h("div", { id: "sticky-header-container", onScroll: () => this.handleStickyHeaderHorizontalScroll() }, getScrollButtonsContainer(), getTableHeader("sticky")), h("ptc-spacer", { breakpoint: "small", size: "xxx-large" }), h("ptc-spacer", { breakpoint: "x-small", size: "xxxx-large" }), getTableTitle(), getTableSubTitle(), getTableDescription(), h("ptc-spacer", { breakpoint: "small", size: "xx-large" }), h("ptc-spacer", { breakpoint: "small", size: "xx-small" }), h("ptc-spacer", { breakpoint: "x-small", size: "xxx-large" }), h("ptc-spacer", { breakpoint: "x-small", size: "xx-small" }), h("div", { id: "table-container", onScroll: () => this.handleHorizontalScroll() }, getScrollButtonsContainer(), h("table", null, h("div", { id: "horizontal-scroll-box-shadow" }), getTableHeader("normal"), (window.innerWidth >= 992)
-      ? getDesktopTableBody()
-      : getMobileTableBody())), getDisclaimers(), h("ptc-spacer", { breakpoint: "small", size: "xxx-large" }), h("ptc-spacer", { breakpoint: "x-small", size: "xxxx-large" })));
-  }
-  get el() { return getElement(this); }
-};
-PtcPricingTable.style = ptcPricingTableCss;
-
-export { PtcPricingTable as ptc_pricing_table };

package/dist/ptcw-design/p-220f86c0.entry.js

@@ -1 +0,0 @@
-import{r as t,h as e,H as l,g as i,F as a}from"./p-00a1336a.js";const s=class{constructor(e){t(this,e),this.verticalScrollContentClipperHeightOptions={withSubNav:{desktop:104,mobile:80},withoutSubNav:{desktop:40,mobile:24}},this.handleVerticalScroll=()=>{let t=this.el.shadowRoot.querySelector("#vertical-scroll-content-clipper"),e=this.el.shadowRoot.querySelector("#table-container"),l=this.el.shadowRoot.querySelector("#table-body"),i=this.el.shadowRoot.querySelector("#table-header-placeholder"),a=this.el.shadowRoot.querySelector("#table-header");const s=window.scrollY||document.documentElement.scrollTop;s<this.lastScrollTop?(i.getBoundingClientRect().top>=this.stickyTopAt&&(this.headerType="normal",a.style.top="0px"),"sticky"===this.headerType&&e.getBoundingClientRect().bottom>a.getBoundingClientRect().bottom&&a.getBoundingClientRect().top<this.stickyTopAt&&(a.style.top=`${Math.min(e.getBoundingClientRect().bottom-a.clientHeight,this.stickyTopAt)}px`,t.style.top=a.getBoundingClientRect().top-t.clientHeight+"px")):s>this.lastScrollTop&&(i.getBoundingClientRect().top<this.stickyTopAt&&(this.headerType="sticky",a.style.top=`${this.stickyTopAt}px`,a.style.width=`${l.getBoundingClientRect().width}px`,a.scrollLeft=l.scrollLeft),"sticky"===this.headerType&&e.getBoundingClientRect().bottom<=a.getBoundingClientRect().bottom&&(a.style.top=e.getBoundingClientRect().bottom-a.clientHeight+"px",t.style.top=a.getBoundingClientRect().top-t.clientHeight+"px")),this.lastScrollTop=s<=0?0:s},this.handleHorizontalScroll=()=>{let t=this.el.shadowRoot.querySelector("#table-header"),e=this.el.shadowRoot.querySelector("#table-body");t.scrollLeft=e.scrollLeft,this.handleScrollButtonsVisibility()},this.handleScrollButtonsVisibility=()=>{let t=this.el.shadowRoot.querySelector("#table-body"),e=this.el.shadowRoot.querySelector("#previous-scroll-button"),l=this.el.shadowRoot.querySelector("#next-scroll-button"),i=this.el.shadowRoot.querySelector("#horizontal-scroll-shadow");0===t.scrollLeft?(e.style.visibility="hidden",i.style.visibility="hidden"):(e.style.visibility="visible",i.style.visibility="visible"),l.style.visibility=[-1,0,1].includes(Math.trunc(t.scrollWidth-t.scrollLeft)-Math.trunc(t.getBoundingClientRect().width))?"hidden":"visible"},this.handleForwardScroll=()=>{let t=0,e=this.el.shadowRoot.querySelector("#table-body"),l=setInterval((()=>{t+=this.scrollAmount,(t==this.scrollLimit||[-1,0,1].includes(Math.trunc(e.scrollWidth-e.scrollLeft)-Math.trunc(e.getBoundingClientRect().width)))&&clearInterval(l),e.scrollLeft+=t}),this.scrollTimeInterval)},this.handleBackwardScroll=()=>{let t=0,e=this.el.shadowRoot.querySelector("#pricing-table"),l=this.el.shadowRoot.querySelector("#table-body"),i=setInterval((()=>{t+=this.scrollAmount,(t==this.scrollLimit||e.getBoundingClientRect().left>=l.getBoundingClientRect().right)&&clearInterval(i),l.scrollLeft-=t}),this.scrollTimeInterval)},this.setFillerCellWidth=t=>{this.el.style.setProperty("--filler-cell-width",`${t}px`)},this.expandTableCells=()=>{let t=this.el.shadowRoot.querySelector("#pricing-table"),e=this.el.shadowRoot.querySelector(".desktop-header-first-cell"),l=(t.getBoundingClientRect().width-e.getBoundingClientRect().width)/this.dataCols;this.isDesktopView?(this.el.style.setProperty("--cell-width-xxs",`${this.cellWidthXXS}px`),this.el.style.setProperty("--cell-width-md",l-this.cellLeftRightPadding+"px")):(this.el.style.setProperty("--cell-width-xxs",l-this.cellLeftRightPadding+"px"),this.el.style.setProperty("--cell-width-md",`${this.cellWidthMD}px`))},this.handleFillEmptySpace=()=>{let t=this.el.shadowRoot.querySelector("#pricing-table");this.el.shadowRoot.querySelector("#table-header-placeholder").getBoundingClientRect().right<t.getBoundingClientRect().right&&(this.hasEmptySpace=!0,this.expandTableCells())},this.resetWidthVariables=()=>{this.el.style.setProperty("--cell-width-xxs",`${this.cellWidthXXS}px`),this.el.style.setProperty("--cell-width-md",`${this.cellWidthMD}px`)},this.handleTableReset=()=>{let t=this.el.shadowRoot.querySelector("#vertical-scroll-content-clipper"),e=this.el.shadowRoot.querySelector("#table-header"),l=this.el.shadowRoot.querySelector("#table-body"),i=this.el.shadowRoot.querySelector("#next-scroll-button"),a=this.el.shadowRoot.querySelector(".desktop-header-first-cell"),s=this.el.shadowRoot.querySelector("#horizontal-scroll-shadow");this.isDesktopView=window.innerWidth>=992,this.resetWidthVariables(),this.stickyTopAt=this.pageWithSubnav?this.isDesktopView?this.verticalScrollContentClipperHeightOptions.withSubNav.desktop:this.verticalScrollContentClipperHeightOptions.withSubNav.mobile:this.isDesktopView?this.verticalScrollContentClipperHeightOptions.withoutSubNav.desktop:this.verticalScrollContentClipperHeightOptions.withoutSubNav.mobile,this.el.style.setProperty("--sticky-stop-at",`${this.stickyTopAt}px`);const r=window.getComputedStyle(document.body,null).getPropertyValue("background-color");t.style.backgroundColor="rgba(0, 0, 0, 0)"===r?"white":r,t.style.width=`${l.getBoundingClientRect().width+20}px`,t.style.transform="translateX(-10px)",e.style.width=`${l.getBoundingClientRect().width}px`,e.scrollLeft=l.scrollLeft,i.style.left=`${l.getBoundingClientRect().width}px`,s.style.left=`${a.getBoundingClientRect().width}px`,this.handleScrollButtonsVisibility(),this.handleFillEmptySpace()},this.preProcessTableDescription=()=>{let t=this.el.querySelector('[slot="table-description"]');t&&(this.tableDescription=t)},this.preProcessdesktopHeaderFirstCell=()=>{let t=this.el.querySelector('[slot="desktop-header-first-cell"]');this.el.insertAdjacentHTML("afterbegin",`<span slot="placeholder-desktop-header-first-cell">${t.innerHTML}</span>`)},this.preProcessColumnHeaders=()=>{let t=this.el.querySelectorAll('[slot^="column-header"]');for(let e=0;e<this.dataCols;e++){let l=t[e].getAttribute("slot");this.el.insertAdjacentHTML("afterbegin",`<span slot="placeholder-${l}">${t[e].innerHTML}</span>`)}},this.preProcessHeaderLinks=()=>{let t;for(let e=0;e<this.dataCols;e++)if(t=this.el.querySelector(`[slot^="header-link-${e+1}"]`),t){let e=t.getAttribute("href"),l=t.innerHTML,i=t.getAttribute("target");this.columnHeaderLinks.push({linkHref:e,linkText:l,linkTarget:i}),t.remove()}else this.columnHeaderLinks.push(null)},this.preProcessRowHeaders=()=>{let t;for(let e=0;e<this.dataRows;e++){t=this.el.querySelector(`[slot^="row-header-${e+1}"]`);let l=t.querySelectorAll(".table-row-header-p");for(let t=0;t<l.length;t++){let e=document.createElement("ptc-para");e.setAttribute("font-size","small"),e.setAttribute("font-weight","w-6"),e.setAttribute("para-align","left"),e.setAttribute("para-color","primary-grey"),e.setAttribute("para-line-h","line-height-p"),e.setAttribute("para-margin","margin-flush"),e.innerHTML=l[t].innerHTML,l[t].replaceWith(e)}let i=t.getAttribute("slot"),a=t.innerHTML;this.el.insertAdjacentHTML("afterbegin",`<div slot="desktop-${i}">${a}</div><div slot="mobile-${i}">${a}</div>`),t.remove()}},this.preProcessCtaButtons=()=>{let t;this.showCtaButtonsRow=!1;for(let e=0;e<this.dataCols;e++)if(t=this.el.querySelector(`[slot^="cta-button-${e+1}"]`),t){let e=t.getAttribute("href"),l=t.innerHTML,i=t.getAttribute("target");this.ctaButtons.push({linkHref:e,linkText:l,linkTarget:i}),t.remove(),this.showCtaButtonsRow=!0}else this.ctaButtons.push(null)},this.preProcessDisclaimers=()=>{let t=this.el.querySelectorAll('[slot^="disclaimer"]');for(let e=0;e<this.disclaimerCount;e++)this.disclaimers.push(t[e].innerHTML)},this.pageWithSubnav=!1,this.tableTitle=void 0,this.tableSubTitle="",this.dataRows=void 0,this.dataCols=void 0,this.disclaimerCount=0,this.isDesktopView=void 0,this.cellWidthXXS=180,this.cellWidthMD=225,this.cellLeftRightPadding=48,this.headerType="normal",this.lastScrollTop=void 0,this.scrollTimeInterval=25,this.scrollAmount=5,this.scrollLimit=50,this.stickyTopAt=void 0,this.columnHeaderLinks=[],this.hasEmptySpace=!1,this.showFillerCells=!1,this.showCtaButtonsRow=void 0,this.ctaButtons=[],this.disclaimers=[],this.tableDescription=void 0}componentWillLoad(){this.preProcessTableDescription(),this.preProcessdesktopHeaderFirstCell(),this.preProcessColumnHeaders(),this.preProcessHeaderLinks(),this.preProcessRowHeaders(),this.preProcessCtaButtons(),this.preProcessDisclaimers()}componentDidLoad(){this.handleTableReset(),window.addEventListener("scroll",(()=>this.handleVerticalScroll())),window.addEventListener("resize",(()=>this.handleTableReset()))}render(){return e(l,null,e("div",{id:"pricing-table"},e((()=>this.tableTitle&&e(a,null,e("div",{class:"table-descriptor"},e("ptc-title",{type:"h2","text-align":"center","title-size":"xx-large",upperline:"no-upperline","title-height":"densest","title-margin":"margin-flush","title-weight":"w-8"},this.tableTitle)),this.tableSubTitle?e(a,null,e("ptc-spacer",{breakpoint:"small",size:"x-small"}),e("ptc-spacer",{breakpoint:"x-small",size:"small"})):this.tableDescription?e(a,null,e("ptc-spacer",{breakpoint:"small",size:"small"}),e("ptc-spacer",{breakpoint:"x-small",size:"medium"})):null)),null),e((()=>this.tableSubTitle&&e(a,null,e("div",{class:"table-descriptor"},e("ptc-title",{type:"h3","text-align":"center","title-size":"large",upperline:"no-upperline","title-height":"densest","title-margin":"margin-flush","title-weight":"w-7"},this.tableSubTitle)),e("ptc-spacer",{breakpoint:"small",size:"medium"}),e("ptc-spacer",{breakpoint:"x-small",size:"large"}))),null),e((()=>this.tableDescription&&e(a,null,e("div",{class:"table-descriptor"},e("ptc-para",{"font-size":"small","font-weight":"w-4","para-align":"center","para-line-h":"line-height-p","para-margin":"margin-flush"},this.tableDescription.innerText.length<=500?e("slot",{name:"table-description"}):e("ptc-readmore",{"more-text":"More","less-text":"Less"},e("slot",{name:"table-description"})))))),null),e("ptc-spacer",{breakpoint:"small",size:"xx-large"}),e("ptc-spacer",{breakpoint:"small",size:"xx-small"}),e("ptc-spacer",{breakpoint:"x-small",size:"xxx-large"}),e("ptc-spacer",{breakpoint:"x-small",size:"xx-small"}),e("div",{id:"vertical-scroll-content-clipper",class:this.headerType}),e("div",{id:"table-container"},e("div",{id:"horizontal-scroll-shadow"}),e("div",{id:"table-body",onScroll:()=>this.handleHorizontalScroll()},e((()=>e("div",{id:"table-header",class:this.headerType,onScroll:()=>this.handleHorizontalScroll()},e("div",{class:"desktop-header-first-cell"},this.isDesktopView?e("ptc-para",{"font-size":"medium","font-weight":"w-7","para-align":"left","para-color":"white","para-line-h":"line-height-p","para-margin":"margin-flush"},e("slot",{name:"desktop-header-first-cell"})):null,e("div",{class:"scroll-button",id:"previous-scroll-button"},e("div",{onClick:()=>this.handleBackwardScroll()},e("icon-asset",{type:"solid",size:"medium",name:"chevron-left",color:"primary-gray"}),e("ptc-para",{"font-size":"small","font-weight":"w-6","para-align":"justify","para-color":"primary-grey","para-line-h":"line-height-p","para-margin":"margin-flush"},"More"))),e("div",{class:"scroll-button",id:"next-scroll-button"},e("div",{onClick:()=>this.handleForwardScroll()},e("ptc-para",{"font-size":"small","font-weight":"w-6","para-align":"justify","para-color":"primary-grey","para-line-h":"line-height-p","para-margin":"margin-flush"},"More"),e("icon-asset",{type:"solid",size:"medium",name:"chevron-right",color:"primary-gray"})))),[...Array(this.dataCols).keys()].map((t=>e("div",{class:"table-cell "+(t+1===this.dataCols?"table-last-cell":"")},e("ptc-para",{"font-size":"medium","font-weight":"w-7","para-align":"center","para-color":"white","para-line-h":"line-height-densest","para-margin":"margin-flush","para-z-index":"z-1"},e("slot",{name:`column-header-${t+1}`})),this.columnHeaderLinks.length===this.dataCols&&this.columnHeaderLinks[t]?e(a,null,e("ptc-spacer",{breakpoint:"small",size:"small"}),e("ptc-spacer",{breakpoint:"x-small",size:"medium"}),e("ptc-link",{"font-size":"medium","font-weight":"w-extrabold",href:`${this.columnHeaderLinks[t].linkHref}`,"link-area":"undefined",target:`${this.columnHeaderLinks[t].linkTarget}`,theme:"d-green-underline",styles:"a.ptc-link {line-height: var(--ptc-line-height-p);}"},this.isDesktopView?e("ptc-tooltip",{class:t===this.dataCols-1?"last-column-tooltip":"","text-display":"inline","max-length":"30","z-index":"z-2",description:this.columnHeaderLinks[t].linkText,position:"top"}):this.columnHeaderLinks[t].linkText)):null))),e("div",{class:"table-filler-cell "+(this.showFillerCells?"show":"")}))),null),e((()=>e("div",{id:"table-header-placeholder",class:this.headerType},e("div",{class:"desktop-header-first-cell"},this.isDesktopView?e("ptc-para",{"font-size":"medium","font-weight":"w-7","para-align":"left","para-color":"white","para-line-h":"line-height-p","para-margin":"margin-flush"},e("slot",{name:"placeholder-desktop-header-first-cell"})):null),[...Array(this.dataCols).keys()].map((t=>e("div",{class:"table-cell "+(t+1===this.dataCols?"table-last-cell":"")},e("ptc-para",{"font-size":"medium","font-weight":"w-7","para-align":"center","para-color":"white","para-line-h":"line-height-densest","para-margin":"margin-flush","para-z-index":"z-1"},e("slot",{name:`placeholder-column-header-${t+1}`})),this.columnHeaderLinks.length===this.dataCols&&this.columnHeaderLinks[t]?e(a,null,e("ptc-spacer",{breakpoint:"small",size:"small"}),e("ptc-spacer",{breakpoint:"x-small",size:"medium"}),e("ptc-link",{"font-size":"medium","font-weight":"w-extrabold",href:`${this.columnHeaderLinks[t].linkHref}`,"link-area":"undefined",target:`${this.columnHeaderLinks[t].linkTarget}`,theme:"d-green-underline",styles:"a.ptc-link {line-height: var(--ptc-line-height-p);}"},this.isDesktopView?e("ptc-tooltip",{class:t===this.dataCols-1?"last-column-tooltip":"","text-display":"inline","max-length":"30","z-index":"z-2",description:this.columnHeaderLinks[t].linkText,position:"top"}):this.columnHeaderLinks[t].linkText)):null))),e("div",{class:"table-filler-cell "+(this.showFillerCells?"show":"")}))),null),e((()=>[...Array(this.dataRows).keys()].map((t=>e(a,null,e("div",{class:"mobile-sticky-row-header"},e("slot",{name:`mobile-row-header-${t+1}`})),e("div",{class:"table-row "+(this.isDesktopView&&t%2!=0?"desktop-alternate-row":"")},this.isDesktopView?e("div",{class:"desktop-sticky-row-header "+(this.isDesktopView&&t%2!=0?"desktop-alternate-row":"")},e("slot",{name:`desktop-row-header-${t+1}`})):null,[...Array(this.dataCols).keys()].map((l=>e("div",{class:"table-cell "+(l+1===this.dataCols?"table-last-cell":"")},e("slot",{name:`cell-r${t+1}-c${l+1}`})))),e("div",{class:"table-filler-cell "+(this.showFillerCells?"show":"")})))))),null),e((()=>this.showCtaButtonsRow?e("div",{class:"table-cta-row"},this.isDesktopView?e("div",{class:"desktop-sticky-row-header"}):null,[...Array(this.dataCols).keys()].map((t=>e("div",{class:"table-cell "+(t+1===this.dataCols?"table-last-cell":"")},this.ctaButtons[t]?e("ptc-button",{type:"link",color:"ptc-tertiary","link-href":this.ctaButtons[t].linkHref,target:`${this.ctaButtons[t].linkTarget}`},this.isDesktopView?e("ptc-tooltip",{class:t===this.dataCols-1?"last-column-tooltip":"","text-display":"inline","max-length":"30","z-index":"z-2",description:this.ctaButtons[t].linkText,position:"top"}):this.ctaButtons[t].linkText):null))),e("div",{class:"table-filler-cell "+(this.showFillerCells?"show":"")})):null),null))),e((()=>this.disclaimerCount>0&&e(a,null,e("ptc-spacer",{breakpoint:"small",size:"medium"}),e("ptc-spacer",{breakpoint:"x-small",size:"large"}),this.disclaimers.map(((t,l)=>e(a,null,e("ptc-para",{"font-size":"xx-small","font-weight":"w-6","para-align":"center","para-color":"primary-grey","para-line-h":"line-height-p","para-margin":"margin-flush"},e("slot",{name:`disclaimer-${l+1}`})),l!=this.disclaimerCount-1?e("ptc-spacer",{size:"xx-small"}):null))))),null)))}get el(){return i(this)}};s.style=":host{display:block}:host #pricing-table{position:relative;overflow-wrap:break-word}:host #vertical-scroll-content-clipper.normal{display:none}:host #vertical-scroll-content-clipper.sticky{display:block;z-index:20;position:fixed;top:0;width:100%;height:var(--sticky-stop-at, 50px)}:host #table-container{width:100%;overflow-x:auto;border-radius:var(--ptc-border-radius-standard);box-shadow:var(--ptc-shadow-x-small);position:relative}:host #table-body{width:100%;overflow-x:scroll;position:relative}:host .scroll-button{display:flex;align-items:center;position:absolute;z-index:15;height:100%}:host .scroll-button#previous-scroll-button div{margin-right:var(--ptc-element-spacing-02);border-radius:0px var(--ptc-element-spacing-01) var(--ptc-element-spacing-01) 0px}:host .scroll-button#previous-scroll-button div ptc-para{margin-right:var(--ptc-element-spacing-04)}:host .scroll-button#next-scroll-button{transform:translateX(-100%)}:host .scroll-button#next-scroll-button div{margin-left:var(--ptc-element-spacing-02);border-radius:var(--ptc-element-spacing-01) 0px 0px var(--ptc-element-spacing-01)}:host .scroll-button#next-scroll-button div ptc-para{margin-left:var(--ptc-element-spacing-04)}:host .scroll-button div{display:inline-block;width:fit-content;height:36px;background-color:white;color:black;box-shadow:var(--ptc-shadow-x-medium);display:flex;justify-content:center;align-items:center}:host .scroll-button div icon-asset{display:flex;justify-content:center;align-items:center;width:36px;height:100%}:host .scroll-button div ptc-para{display:none;white-space:nowrap}:host .table-filler-cell{display:none;min-width:var(--filler-cell-width, 0px);max-width:var(--filler-cell-width, 0px);height:100%;box-sizing:content-box;padding:var(--ptc-element-spacing-04) var(--ptc-element-spacing-06) var(--ptc-element-spacing-04) var(--ptc-element-spacing-06);border-bottom:1px solid var(--color-gray-02)}:host .table-filler-cell.show{display:table-cell}:host #table-header{display:table-row;background:var(--color-gray-10);color:white;z-index:10}:host #table-header.normal{position:relative}:host #table-header.sticky{position:fixed;top:var(--sticky-stop-at, 50px);border-top-left-radius:var(--ptc-border-radius-standard);border-top-right-radius:var(--ptc-border-radius-standard);overflow-x:hidden;-ms-overflow-style:none;scrollbar-width:none;box-shadow:0 16px 16px -16px grey}:host #table-header.sticky::-webkit-scrollbar{display:none}:host #table-header .table-cell{min-width:var(--cell-width-xxs, 180px);max-width:var(--cell-width-xxs, 180px);box-sizing:content-box;padding:var(--ptc-element-spacing-04) var(--ptc-element-spacing-06) var(--ptc-element-spacing-04) var(--ptc-element-spacing-06);border-right:1px solid var(--color-gray-07);text-align:center;display:table-cell;vertical-align:middle}:host #table-header .table-cell.table-last-cell{border-right:none}:host #table-header .table-cell ptc-link a.ptc-link{line-height:var(--ptc-line-height-p)}:host #table-header .table-filler-cell{border-bottom:none;border-left:1px solid var(--color-gray-07)}:host #table-header-placeholder.normal{position:absolute;top:0;display:table-row;opacity:0}:host #table-header-placeholder.sticky{position:relative;display:table-row;opacity:0;overflow-x:hidden;-ms-overflow-style:none;scrollbar-width:none}:host #table-header-placeholder .table-cell{min-width:var(--cell-width-xxs, 180px);max-width:var(--cell-width-xxs, 180px);box-sizing:content-box;padding:var(--ptc-element-spacing-04) var(--ptc-element-spacing-06) var(--ptc-element-spacing-04) var(--ptc-element-spacing-06);border-right:1px solid var(--color-gray-07);text-align:center;display:table-cell;vertical-align:middle}:host #table-header-placeholder .table-cell.table-last-cell{border-right:none}:host #table-header-placeholder .table-filler-cell{border-bottom:none;border-left:1px solid var(--color-gray-07)}:host .desktop-header-first-cell{display:table-cell;position:sticky;left:0;z-index:10}:host .mobile-sticky-row-header{display:block;position:sticky;left:0;background-color:var(--color-gray-01);border-bottom:1px solid var(--color-gray-02);padding:var(--ptc-element-spacing-04) var(--ptc-element-spacing-06) var(--ptc-element-spacing-04) var(--ptc-element-spacing-06)}:host .table-row{display:table-row;background-color:white}:host .table-row .table-cell{min-width:var(--cell-width-xxs, 180px);max-width:var(--cell-width-xxs, 180px);box-sizing:content-box;padding:var(--ptc-element-spacing-04) var(--ptc-element-spacing-06) var(--ptc-element-spacing-04) var(--ptc-element-spacing-06);border-right:1px solid var(--color-gray-02);border-bottom:1px solid var(--color-gray-02);text-align:center;display:table-cell;vertical-align:middle}:host .table-row .table-cell.table-last-cell{border-right:none}:host .table-row .table-filler-cell{border-left:1px solid var(--color-gray-02)}:host .table-cta-row{display:table-row;background-color:white}:host .table-cta-row .table-cell{min-width:var(--cell-width-xxs, 180px);max-width:var(--cell-width-xxs, 180px);box-sizing:content-box;padding:var(--ptc-element-spacing-06);border-right:1px solid var(--color-gray-02);border-bottom:1px solid var(--color-gray-02);text-align:center;display:table-cell;vertical-align:middle}:host .table-cta-row .table-cell.table-last-cell{border-right:none}:host .table-cta-row .table-filler-cell{border-left:1px solid var(--color-gray-02)}@media only screen and (min-width: 768px){:host .table-descriptor{max-width:768px;margin:auto}}@media only screen and (min-width: 992px){:host .scroll-button{height:100%;top:0}:host .scroll-button div ptc-para{display:none}:host .scroll-button div:hover{cursor:pointer}:host .scroll-button div:hover ptc-para{display:block}:host .scroll-button#previous-scroll-button{right:0;transform:translateX(100%)}:host #horizontal-scroll-shadow{display:block;position:absolute;top:0;left:0;height:100%;width:var(--ptc-element-spacing-06);background:linear-gradient(90deg, rgba(0, 0, 0, 0.12) 0%, rgba(0, 0, 0, 0) 100%);z-index:1}:host #table-header.sticky{box-shadow:none}:host #table-header .table-cell{min-width:var(--cell-width-md, 225px);max-width:var(--cell-width-md, 225px)}:host #table-header .last-column-tooltip .tooltip{right:4px}:host #table-header-placeholder .table-cell{min-width:var(--cell-width-md, 225px);max-width:var(--cell-width-md, 225px)}:host #table-header-placeholder .last-column-tooltip .tooltip{right:-4px}:host .desktop-sticky-row-header{min-width:var(--desktop-row-header-cell-width-md, 275px);max-width:var(--desktop-row-header-cell-width-md, 275px);box-sizing:content-box;padding:var(--ptc-element-spacing-04) var(--ptc-element-spacing-06) var(--ptc-element-spacing-04) var(--ptc-element-spacing-06);border-right:1px solid var(--color-gray-02);border-bottom:1px solid var(--color-gray-02);display:table-cell;vertical-align:middle;position:sticky;left:0;background-color:white;z-index:5}:host .desktop-sticky-row-header.desktop-alternate-row{background-color:var(--color-gray-01)}:host .desktop-header-first-cell{min-width:var(--desktop-row-header-cell-width-md, 275px);max-width:var(--desktop-row-header-cell-width-md, 275px);box-sizing:content-box;padding:var(--ptc-element-spacing-04) var(--ptc-element-spacing-06) var(--ptc-element-spacing-04) var(--ptc-element-spacing-06);border-right:1px solid var(--color-gray-07);display:table-cell;vertical-align:middle;position:sticky;left:0;z-index:10;background:var(--color-gray-10)}:host .table-row .table-cell{min-width:var(--cell-width-md, 225px);max-width:var(--cell-width-md, 225px)}:host .table-row.desktop-alternate-row{background-color:var(--color-gray-01)}:host .mobile-sticky-row-header{display:none}:host .table-cta-row{display:table-row}:host .table-cta-row .table-cell{min-width:var(--cell-width-md, 225px);max-width:var(--cell-width-md, 225px)}:host .table-cta-row .last-column-tooltip .tooltip{right:-4px}}";export{s as ptc_pricing_packaging_table}