@ptcwebops/ptcw-design 6.4.18 → 6.4.19

package/dist/esm/ptc-multi-select.entry.js

@@ -0,0 +1,322 @@
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-c83db688.js';
+import { V as ValidationMessages } from './validation-messages-1379b825.js';
+import { a as getLanguageFromURL } from './utils-d14265f5.js';
+
+const ptcMultiSelectCss = "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}}.ptc-multi-select{position:relative;display:block;margin-bottom:var(--ptc-element-spacing-04)}.ptc-multi-select.invalid::before{content:\"\";position:absolute;width:calc(100% + 16px);height:calc(100% + 8px);background:#fef3f3;display:flex;flex-direction:column;justify-content:center;z-index:0;left:50%;top:50%;transform:translate(-50%, -50%)}.ptc-multi-select.invalid .mdc-select-helper-text--validation-msg{z-index:2;opacity:1;position:relative;color:#af3231;font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-xx-small);font-style:normal;font-weight:var(--ptc-font-weight-semibold);line-height:var(--ptc-line-height-densest);opacity:1;height:auto;margin-left:8px;margin-top:var(--ptc-element-spacing-02)}.ptc-multi-select.invalid .mdc-select-helper-text--validation-msg svg{transform:translate(-8px, 3px)}.ptc-multi-select .multi-select-label{display:block;font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-semibold);line-height:normal;margin-bottom:var(--ptc-element-spacing-01);z-index:1;position:relative;color:#40434a}.ptc-multi-select .selected-items{cursor:pointer;background-color:#fff;border:1px solid rgba(0, 0, 0, 0.38);padding:8px;border-radius:0px;position:relative;-webkit-user-select:none;-moz-user-select:none;user-select:none;color:var(--color-gray-12);font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-regular);max-width:100%;max-height:34px;overflow:hidden;line-height:24px;display:flex;align-items:center}.ptc-multi-select .selected-items:focus-visible{border-radius:var(--ptc-border-radius-standard);outline:5px solid var(--keyboard-nav-outline);outline-offset:-4px}.ptc-multi-select .selected-items:focus{border:2px solid var(--color-blue-07)}.ptc-multi-select .selected-items[aria-expanded]{border:2px solid var(--color-blue-07)}.ptc-multi-select .selected-items .input-text{width:calc(100% - 18px);display:-webkit-box;-webkit-line-clamp:1;line-clamp:1;-webkit-box-orient:vertical;text-overflow:ellipsis}.ptc-multi-select .multi-select-icon{fill:rgba(0, 0, 0, 0.54);position:absolute;right:var(--ptc-element-spacing-02);width:18px;height:18px;margin:0 auto}.ptc-multi-select .multi-select-icon .multi-arrow-svg{transform:translate(-50%, 25%);position:relative;left:50%;bottom:25%}.ptc-multi-select .dropdown{display:none;list-style:none;padding:0;margin:0;border:1px solid #ccc;max-height:350px;overflow-y:auto;position:absolute;width:100%;background-color:#fff;z-index:1000;}.ptc-multi-select .dropdown.show{display:block}.ptc-multi-select .dropdown li{display:flex;align-items:center;padding:5px 8px;cursor:pointer;color:var(--color-gray-10);position:relative;}.ptc-multi-select .dropdown li:hover,.ptc-multi-select .dropdown li:focus-within{background-color:var(--color-gray-02)}.ptc-multi-select .dropdown li.selected{background-color:var(--color-gray-02)}.ptc-multi-select .dropdown li.selected:hover{background-color:var(--color-gray-04)}.ptc-multi-select .dropdown li label{display:-webkit-box;font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-xx-small);position:relative;padding-left:22px;cursor:pointer;width:100%;overflow:hidden;-webkit-line-clamp:4;line-clamp:4;-webkit-box-orient:vertical;text-overflow:ellipsis;line-height:24px}.ptc-multi-select .dropdown li:focus-within{background-color:var(--color-gray-02);outline:none}.ptc-multi-select .dropdown li:last-child{border-bottom:none}.ptc-multi-select .dropdown input[type=checkbox]{position:absolute;opacity:0;cursor:pointer}.ptc-multi-select .dropdown input[type=checkbox]:checked{background-color:var(--color-green-07)}.ptc-multi-select .dropdown label::before{content:\"\";position:absolute;left:0;top:5px;width:14px;height:14px;background-color:#fff;border:1px solid #ccc;box-sizing:border-box}.ptc-multi-select .dropdown input[type=checkbox]:checked+label::before{background-color:var(--color-green-07);border-color:var(--color-green-07)}.ptc-multi-select .dropdown input[type=checkbox]:checked+label::after{content:url(\"data:image/svg+xml,%3Csvg width='8' height='8' viewBox='0 0 8 8' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M7.15341 1.14134C7.0572 1.04719 6.94024 1 6.80262 1C6.66499 1 6.54771 1.04719 6.45158 1.14134L3.06571 4.45979L1.5485 2.96965C1.45197 2.8755 1.33501 2.82831 1.19738 2.82831C1.05976 2.82831 0.942797 2.8755 0.846348 2.96965L0.144437 3.65645C0.0482247 3.75091 0 3.86528 0 4.00004C0 4.13472 0.0482247 4.2494 0.144437 4.34355L2.01277 6.17186L2.71492 6.85866C2.81113 6.95312 2.92809 7 3.06571 7C3.20334 7 3.3203 6.95312 3.41675 6.85866L4.11866 6.17186L7.85556 2.51525C7.95177 2.42086 8 2.30641 8 2.17173C8 2.03705 7.95177 1.9226 7.85556 1.82814L7.15341 1.14134Z' fill='white'/%3E%3C/svg%3E\");position:absolute;left:3px;top:0px;color:white;width:8px;height:24px}.ptc-multi-select button.ddl-click-text{all:unset;cursor:pointer;color:var(--color-gray-7);text-decoration:underline;font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-semibold)}.ptc-multi-select .tooltip{position:absolute;transform:translate(0, -12px);z-index:1001;padding:8px;color:var(--color-white);font-size:var(--ptc-font-size-xxx-small);font-weight:var(--ptc-font-weight-semibold);background:var(--color-gray-09);box-shadow:0px 2px 4px rgba(0, 0, 0, 0.3);border:none;border-radius:2px;width:auto;height:-moz-fit-content;height:fit-content;text-align:left;text-shadow:none;white-space:normal}.ptc-multi-select .tooltip::after{position:absolute;content:\"\";bottom:0px;border:8px solid transparent;border-top:8px solid var(--color-gray-09);left:50%;transform:translate(-50%, 100%)}@media only screen and (min-width: 992px){.ptc-multi-select .tooltip{width:273px;transform:translate(-100%, 80%)}.ptc-multi-select .tooltip::after{right:8px;left:auto;transform:translateY(100%)}}.ptc-multi-select .tooltip span{word-break:initial}";
+
+const PtcMultiSelect = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.ptcMultiSelectLoaded = createEvent(this, "ptcMultiSelectLoaded", 7);
+    this.handleBlur = () => {
+      this.hasInteracted = true;
+      this.updateValidity();
+    };
+    this.updateValidity = () => {
+      if (this.hasInteracted && this.isRequired && !this.showDropdown) {
+        this.isValid = this.selectedItemsCount > 0;
+        this.setHelperText();
+      }
+      else {
+        this.isValid = true;
+        this.setHelperText();
+      }
+    };
+    this.selectAllItems = (event) => {
+      event.preventDefault();
+      event.stopPropagation();
+      this.items = this.items.map((item) => (Object.assign(Object.assign({}, item), { selected: true })));
+      this.selectedItemsCount = this.items.length;
+      this.updateValidity();
+    };
+    this.clearSelectedItems = (event) => {
+      event.preventDefault();
+      event.stopPropagation();
+      this.items = this.items.map((item) => (Object.assign(Object.assign({}, item), { selected: false })));
+      this.selectedItemsCount = 0;
+      this.updateValidity();
+    };
+    this.items = [
+      // Initialize with your items, setting 'selected' to false
+      {
+        text: "Lorem Ipsum dolor sit amet",
+        selected: false,
+        ptcDataEloquaName: "data-eloqua-name",
+        ptcDataTargetEloquaName: "data-target-eloqua-name",
+      },
+      {
+        text: "Consectetur adipiscing elit",
+        selected: false,
+        ptcDataEloquaName: "data-eloqua-name",
+        ptcDataTargetEloquaName: "data-target-eloqua-name",
+      },
+      {
+        text: "Sed do eiusmod tempor",
+        selected: false,
+        ptcDataEloquaName: "data-eloqua-name",
+        ptcDataTargetEloquaName: "data-target-eloqua-name",
+      },
+      {
+        text: "Incididunt ut labore",
+        selected: false,
+        ptcDataEloquaName: "data-eloqua-name",
+        ptcDataTargetEloquaName: "data-target-eloqua-name",
+      },
+      {
+        text: "Et dolore magna aliqua",
+        selected: false,
+        ptcDataEloquaName: "data-eloqua-name",
+        ptcDataTargetEloquaName: "data-target-eloqua-name",
+      },
+      {
+        text: "Duis aute irure dolor",
+        selected: false,
+        ptcDataEloquaName: "data-eloqua-name",
+        ptcDataTargetEloquaName: "data-target-eloqua-name",
+      },
+      {
+        text: "In reprehenderit in voluptate",
+        selected: false,
+        ptcDataEloquaName: "data-eloqua-name",
+        ptcDataTargetEloquaName: "data-target-eloqua-name",
+      },
+    ];
+    this.label = "label";
+    this.selectAllText = "Select All";
+    this.clearAllText = "Clear Selected Items";
+    this.isRequired = false;
+    this.helpertext = "This field is required";
+    this.placeholderText = "Please select a company";
+    this.showDropdown = false;
+    this.language = "en";
+    this.isValid = true;
+    this.selectedItemsCount = 0;
+    this.hasInteracted = false;
+    this.tooltipText = "";
+    this.tooltipVisible = false;
+    this.tooltipPosition = {
+      top: 0,
+      left: 0,
+    };
+    this.focusedItemIndex = -1;
+  }
+  componentWillLoad() {
+    this.language = getLanguageFromURL();
+    // Initialize selectedItemsCount based on initial selections
+    this.selectedItemsCount = this.items.filter((item) => item.selected).length;
+  }
+  componentDidLoad() {
+    this.ptcMultiSelectLoaded.emit();
+  }
+  handleDocumentClick(event) {
+    const clickedInside = this.el.contains(event.target);
+    if (!clickedInside) {
+      this.showDropdown = false;
+      this.selectedItemsCount = this.items.filter((item) => item.selected).length;
+      this.updateValidity();
+      this.focusedItemIndex = -1;
+    }
+  }
+  toggleDropdown() {
+    this.showDropdown = !this.showDropdown;
+    this.hasInteracted = true;
+    if (this.showDropdown) {
+      requestAnimationFrame(() => {
+        this.focusFirstItem();
+      });
+    }
+    else {
+      this.selectedItemsCount = this.items.filter((item) => item.selected).length;
+      this.updateValidity();
+      this.focusedItemIndex = -1;
+    }
+  }
+  async focusToggleButton() {
+    const toggleButton = this.el.querySelector(".selected-items");
+    if (toggleButton) {
+      toggleButton.focus();
+    }
+  }
+  toggleItemSelection(index) {
+    this.items = [
+      ...this.items.slice(0, index),
+      Object.assign(Object.assign({}, this.items[index]), { selected: !this.items[index].selected }),
+      ...this.items.slice(index + 1),
+    ];
+    this.selectedItemsCount = this.items.filter((item) => item.selected).length;
+    this.updateValidity();
+  }
+  getValidationMessage(type) {
+    return ValidationMessages[this.language][type];
+  }
+  setHelperText() {
+    this.helpertext = this.getValidationMessage("select");
+  }
+  showTooltip(event, text) {
+    this.tooltipText = text;
+    // this.tooltipPosition = {
+    //   top: 100, // Adjust as necessary to position above the item
+    //   left: -rect.left + 624.1,
+    // };
+    this.tooltipVisible = true;
+  }
+  hideTooltip() {
+    this.tooltipVisible = false;
+  }
+  // Keyboard Accessibility Handlers
+  handleKeyDownToggle(event) {
+    switch (event.key) {
+      case "Enter":
+      case " ":
+        event.preventDefault();
+        this.toggleDropdown();
+        break;
+      case "ArrowDown":
+        event.preventDefault();
+        if (!this.showDropdown) {
+          this.toggleDropdown();
+        }
+        else {
+          this.focusNextItem();
+        }
+        break;
+      case "ArrowUp":
+        event.preventDefault();
+        if (!this.showDropdown) {
+          this.toggleDropdown();
+        }
+        else {
+          this.focusPreviousItem();
+        }
+        break;
+    }
+  }
+  handleKeyDownItem(event, index) {
+    const isAllSelected = this.selectedItemsCount === this.items.length &&
+      this.items.length > 0;
+    switch (event.key) {
+      case "ArrowDown":
+        event.preventDefault();
+        this.focusNextItem();
+        break;
+      case "ArrowUp":
+        event.preventDefault();
+        this.focusPreviousItem();
+        break;
+      case "Enter":
+      case " ":
+        event.preventDefault();
+        if (index === 0) {
+          // First item is "Select All/Clear Selected Items"
+          if (isAllSelected) {
+            this.clearSelectedItems(event);
+          }
+          else {
+            this.selectAllItems(event);
+          }
+        }
+        else {
+          this.toggleItemSelection(index - 1);
+        }
+        break;
+      case "Escape":
+        event.preventDefault();
+        this.showDropdown = false;
+        this.focusToggleButton();
+        break;
+    }
+  }
+  focusFirstItem() {
+    if (this.items.length + 1 > 0) {
+      this.focusedItemIndex = 0;
+      this.focusItem(this.focusedItemIndex);
+    }
+  }
+  focusLastItem() {
+    if (this.items.length + 1 > 0) {
+      this.focusedItemIndex = this.items.length;
+      this.focusItem(this.focusedItemIndex);
+    }
+  }
+  focusNextItem() {
+    if (this.focusedItemIndex < this.items.length) {
+      this.focusedItemIndex += 1;
+    }
+    else {
+      this.focusedItemIndex = 0;
+    }
+    this.focusItem(this.focusedItemIndex);
+  }
+  focusPreviousItem() {
+    if (this.focusedItemIndex > 0) {
+      this.focusedItemIndex -= 1;
+    }
+    else {
+      this.focusedItemIndex = this.items.length; // Loop to last
+    }
+    this.focusItem(this.focusedItemIndex);
+  }
+  focusItem(index) {
+    if (index === 0) {
+      const selectAllButton = this.el.querySelector(`#multi-select-item-0 > button`);
+      if (selectAllButton) {
+        selectAllButton.focus();
+      }
+    }
+    else {
+      const checkbox = this.el.querySelector(`#multi-select-item-${index} input[type="checkbox"]`);
+      if (checkbox) {
+        checkbox.focus();
+      }
+    }
+  }
+  render() {
+    const selectedItems = this.items.filter((item) => item.selected);
+    const selectedItemsCount = selectedItems.length;
+    const isAllSelected = selectedItemsCount === this.items.length && this.items.length > 0;
+    const buttonLabel = isAllSelected
+      ? this.clearAllText
+      : this.selectAllText;
+    const buttonAction = isAllSelected
+      ? this.clearSelectedItems
+      : this.selectAllItems;
+    let displayText = `${selectedItemsCount} selected`;
+    if (selectedItemsCount === 0) {
+      displayText = this.placeholderText;
+    }
+    if (selectedItemsCount === 1) {
+      displayText = selectedItems[0].text;
+    }
+    return (h(Host, { class: {
+        "ptc-multi-select": true,
+        invalid: !this.isValid,
+        "mf-listen": true,
+      } }, h("label", { class: "multi-select-label", id: `multi-select-label-${this.label}` }, this.label), h("div", { class: "selected-items multi-selected-items", role: "button", "aria-haspopup": "listbox", "aria-expanded": this.showDropdown, "aria-labelledby": `multi-select-label-${this.label}`, tabIndex: 0, onClick: () => this.toggleDropdown(), onKeyDown: (event) => this.handleKeyDownToggle(event) }, h("div", { class: "input-text" }, displayText), h("span", { class: "multi-select-icon" }, h("svg", { class: "multi-arrow-svg", width: "10", height: "10", viewBox: "0 0 10 10", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M1.375 1.875L5 5.5L8.625 1.875L9.9375 3.1875L5 8.125L0.0625 3.1875L1.375 1.875Z" })))), h("ul", { class: "dropdown" + (this.showDropdown ? " show" : ""), role: "listbox", "aria-labelledby": `multi-select-label-${this.label}`, tabIndex: -1 }, h("li", { id: `multi-select-item-0`, role: "option", "aria-selected": isAllSelected, class: { selected: isAllSelected }, tabIndex: -1, onKeyDown: (event) => this.handleKeyDownItem(event, 0) }, h("button", { onClick: (event) => {
+        event.preventDefault();
+        event.stopPropagation();
+        buttonAction(event);
+      }, class: "ddl-click-text" }, buttonLabel)), this.items.map((item, index) => (h("li", { key: index + 1, id: `multi-select-item-${index + 1}`, role: "option", "aria-selected": item.selected, class: { selected: item.selected }, tabIndex: -1, onMouseEnter: (event) => this.checkOverflow(event, item.text), onMouseLeave: () => this.hideTooltip(), onKeyDown: (event) => this.handleKeyDownItem(event, index + 1), onClick: (event) => {
+        event.preventDefault();
+        event.stopPropagation();
+        this.toggleItemSelection(index);
+      } }, h("input", { class: "multi-checkbox", type: "checkbox", id: `checkbox-${index}`, checked: item.selected, "data-eloqua-name": item.ptcDataEloquaName, "data-target-eloqua-name": item.ptcDataTargetEloquaName, required: this.isRequired, onClick: (event) => {
+        event.stopPropagation(); // Prevents the dropdown from closing
+        this.toggleItemSelection(index);
+      }, onBlur: this.handleBlur }), h("label", { htmlFor: `checkbox-${index}` }, item.text))))), this.tooltipVisible && (h("div", { class: "tooltip", style: {
+        top: `${this.tooltipPosition.top}px`,
+        left: `${this.tooltipPosition.left}px`,
+      } }, this.tooltipText)), h("div", { id: "tbd", class: "mdc-select-helper-text mdc-select-helper-text--validation-msg" }, h("svg", { class: "select-error-svg", width: "16", height: "16", viewBox: "0 0 16 16", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("g", { "clip-path": "url(#clip0_12_1424)" }, h("path", { "fill-rule": "evenodd", "clip-rule": "evenodd", d: "M11.3156 0L16 4.68444V11.3156L11.3156 16H4.68444L0 11.3156V4.68444L4.68444 0H11.3156ZM8 10.4C7.36 10.4 6.84444 10.9156 6.84444 11.5556C6.84444 12.1956 7.36 12.7111 8 12.7111C8.64 12.7111 9.15556 12.1956 9.15556 11.5556C9.15556 10.9156 8.64 10.4 8 10.4ZM8.88889 3.55556H7.11111V8.88889H8.88889V3.55556Z", fill: "#AF3231" })), h("defs", null, h("clipPath", { id: "clip0_12_1424" }, h("rect", { width: "16", height: "16", fill: "white" })))), this.helpertext)));
+  }
+  // Ensure that checkOverflow is inside the class
+  checkOverflow(event, text) {
+    const target = event.currentTarget;
+    const label = target.querySelector("label");
+    if (label && label.scrollHeight > label.clientHeight) {
+      this.showTooltip(event, text);
+    }
+  }
+  get el() { return getElement(this); }
+};
+PtcMultiSelect.style = ptcMultiSelectCss;
+
+export { PtcMultiSelect as ptc_multi_select };

package/dist/esm/ptc-nav-card.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host } from './index-0bf594c4.js';
+import { r as registerInstance, h, H as Host } from './index-c83db688.js';
 
 const ptcNavCardCss = "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:flex;height:100%;width:100%;position:relative}:host .nav-card-wrap{-webkit-box-pack:center;-ms-flex-pack:center;display:flex;flex-direction:column;font-size:16px;justify-content:center;letter-spacing:1.2px;line-height:1.5;list-style:none;margin:2.5px;padding:16px 40px 16px 0;text-align:left;width:100%}:host .nav-card-wrap:active{border-radius:4px;background:var(--color-gray-11)}@media only screen and (min-width: 1200px){:host .nav-card-wrap{display:flex;width:100%;border-radius:var(--ptc-border-radius-standard);background-color:var(--color-gray-12);transition:background-color var(--ptc-transition-medium) var(--ptc-ease-inout);-webkit-box-pack:center;-ms-flex-pack:center;border-radius:4px;display:flex;flex-direction:column;font-size:12px;justify-content:center;letter-spacing:1.2px;line-height:18px;list-style:none;padding:16px;text-align:left;background:transparent;margin:0px}:host .nav-card-wrap:hover{background-color:var(--color-gray-11);border-radius:4px}:host .nav-card-wrap:active{border-radius:4px;background:var(--color-gray-10)}}:host .nav-card-wrap h4,:host .nav-card-wrap p,:host .nav-card-wrap a{color:var(--color-white);margin:0;text-decoration:none}:host .nav-card-wrap .media-card-wrap{align-items:center;display:flex;flex-direction:row}@media only screen and (min-width: 1200px){:host .nav-card-wrap .media-card-wrap{padding:1rem;padding:1rem 1.5rem 1.125rem 1.5rem;width:100%;height:100%;display:flex;align-items:center}}:host .nav-card-wrap .media-card-wrap h4{font-weight:800;display:flex;align-items:center;font-size:var(--ptc-font-size-medium);word-break:break-word;margin-bottom:2px}@media only screen and (min-width: 1200px){:host .nav-card-wrap .media-card-wrap h4{font-size:var(--ptc-font-size-xxx-small)}}:host .nav-card-wrap .media-card-wrap p{font-size:var(--ptc-font-size-x-small)}@media only screen and (min-width: 1200px){:host .nav-card-wrap .media-card-wrap p{font-size:var(--ptc-font-size-xxx-small)}}:host .nav-card-wrap .media-card-wrap .card-logo{padding-right:20px}@media only screen and (min-width: 1200px){:host .nav-card-wrap .media-card-wrap .card-logo{padding-right:1rem}}:host .nav-card-wrap .media-card-wrap .card-logo img{width:100%;max-width:2rem;min-width:2rem}@media only screen and (min-width: 1200px){:host .nav-card-wrap .media-card-wrap .card-logo img{max-width:1.5rem;min-width:1.5rem}}:host(.media-card) .nav-card-wrap .media-card-wrap{align-items:center;display:flex;flex-direction:row}@media only screen and (min-width: 1200px){:host(.media-card) .nav-card-wrap .media-card-wrap{padding:0px}:host(.media-card) .nav-card-wrap .media-card-wrap:focus{border:none !important;outline:none !important}}:host(.media-card) .nav-card-wrap .media-card-wrap .card-logo img{height:auto;width:24px;max-width:24px;min-width:24px}:host(.media-card) .nav-card-wrap .media-card-wrap h4{font-size:16px;font-stretch:normal;font-style:normal;font-weight:800;letter-spacing:normal;line-height:24px;text-align:left;word-break:break-word;hyphens:auto;margin-bottom:2px}@media only screen and (min-width: 1200px){:host(.media-card) .nav-card-wrap .media-card-wrap h4{font-size:12px;hyphens:auto;line-height:18px;text-align:left;margin-bottom:2px;font-stretch:normal;font-style:normal;letter-spacing:normal}}:host(.media-card) .nav-card-wrap .media-card-wrap p{font-size:14px;font-stretch:normal;font-style:normal;font-weight:400;hyphens:auto;letter-spacing:normal;line-height:21px;text-align:left;word-break:break-word}@media only screen and (min-width: 1200px){:host(.media-card) .nav-card-wrap .media-card-wrap p{font-size:12px;font-stretch:normal;font-style:normal;font-weight:400;letter-spacing:normal;line-height:18px;margin-bottom:0;text-align:left}}:host(.cta-card) .nav-card-wrap{border:1px solid var(--color-gray-10);border-radius:var(--ptc-border-radius-standard);background-color:var(--color-gray-09);min-height:99px;box-sizing:border-box;transition:background-color var(--ptc-transition-medium) var(--ptc-ease-inout)}@media only screen and (min-width: 1200px){:host(.cta-card) .nav-card-wrap{min-height:80px;background-color:transparent}}:host(.cta-card) .nav-card-wrap:hover{background-color:var(--color-gray-08)}:host(.cta-card) .nav-card-wrap .card-content{margin:auto}:host(.cta-card) .nav-card-wrap .card-content h4{margin:0}:host(.cta-card) .nav-card-wrap .card-content svg{vertical-align:middle;margin-left:0.375rem}:host(.links-card) .nav-card-wrap .links-card-wrap{display:flex;flex-direction:row;justify-content:left;background:transparent}:host(.links-card) .nav-card-wrap h3{margin:0;display:inline-block;font-weight:800;color:var(--color-white);font-size:16px;font-style:normal;letter-spacing:normal;line-height:normal;position:relative;text-align:left}@media only screen and (min-width: 1200px){:host(.links-card) .nav-card-wrap h3{display:inline-block;font-size:12px;line-height:1.5;align-self:center}}:host(.links-card) .nav-card-wrap h3 svg{margin-left:6px;margin-bottom:3px;vertical-align:middle;width:9.375px;height:11.25px}:host(.links-card) ::slotted(ptc-link){padding:8px 0;line-height:14px}@media only screen and (min-width: 1200px){:host(.links-card) ::slotted(ptc-link){padding:6px 0}}";
 

package/dist/esm/ptc-nav-link.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-0bf594c4.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-c83db688.js';
 
 const ptcNavLinkCss = "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}@media only screen and (min-width: 1200px){:host{display:inline-block}}:host::before,:host::after{content:\" \";width:1600px;height:1px;background-color:var(--color-gray-08);position:absolute;right:0;bottom:0}@media only screen and (min-width: 1200px){:host::before,:host::after{display:none}}:host::after{left:0;right:auto}:host a{color:var(--color-gray-03);text-decoration:none;display:block;border-bottom:2px solid transparent;margin-left:34%;padding:var(--ptc-element-spacing-04) var(--ptc-element-spacing-03);font-size:var(--ptc-font-size-xx-small);line-height:var(--ptc-line-height-denser);font-weight:var(--ptc-font-weight-bold)}@media only screen and (min-width: 480px){:host a{margin-left:38%}}@media only screen and (min-width: 768px){:host a{margin-left:42%}}@media only screen and (min-width: 1200px){:host a{padding:14px var(--ptc-element-spacing-03) 22px;margin-top:6px;border-top:2px solid transparent;margin-left:0;display:flex;align-items:center;white-space:nowrap;position:relative}:host a::after{content:\"\";display:block;border-bottom:2px solid transparent;margin:auto;position:absolute;width:calc(100% - 20px);left:0;right:0;bottom:20px}}:host a svg{width:1rem;height:0.875rem;display:inline-block;background-size:cover;transition:margin-left 250ms ease-out;vertical-align:middle;margin-left:4px}:host a:hover,:host a:focus{color:var(--color-white)}@media only screen and (min-width: 1200px){:host a:hover::after,:host a:focus::after{border-color:var(--color-white)}}:host a:hover svg path,:host a:focus svg path{fill:var(--color-white)}:host a:focus-visible{border-radius:var(--ptc-border-radius-standard);border:2px solid white;outline:5px solid var(--keyboard-nav-outline);padding:14px 10px 16px}@media only screen and (min-width: 1200px){:host a:focus-visible{padding:14px 10px 20px}}:host ::slotted(icon-asset){margin-top:4px;margin-right:8px}:host .tracker-div{display:inline}";
 

package/dist/esm/ptc-nav-pills.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host } from './index-0bf594c4.js';
+import { r as registerInstance, h, H as Host } from './index-c83db688.js';
 
 const ptcNavPillsCss = "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;text-align:center;margin:12px 0}:host ::slotted(a){display:inline-block;padding:10px 24px;background-color:var(--color-gray-02);border-radius:var(--ptc-border-radius-pill);color:var(--color-gray-10) !important;font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-x-small);text-decoration:none !important;margin:12px;max-width:205px;vertical-align:middle;line-height:var(--ptc-line-height-densest)}:host ::slotted(a):last-child{margin-right:0}:host ::slotted(a:hover){background-color:var(--color-gray-04)}";
 

package/dist/esm/ptc-nav-skip-to-content.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host, a as getElement } from './index-0bf594c4.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-c83db688.js';
 
 const ptcNavSkipToContentCss = "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}:host .skip-link{position:fixed;top:-200px}:host .skip-link:focus{top:0;display:block;padding:8px 12px;text-align:center;margin:8px;border-radius:var(--ptc-border-radius-standard);outline:5px solid #003dd6;background:#fff;z-index:99999;box-shadow:var(--ptc-shadow-medium);text-decoration:none;color:var(--color-gray-10);font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-x-small);font-style:normal;font-weight:var(--ptc-font-weight-bold);line-height:var(--ptc-line-height-p)}:host(.appended){position:relative}:host(.appended) .skip-link:focus{position:absolute}";
 

package/dist/esm/ptc-nav-slider.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host, a as getElement } from './index-0bf594c4.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-c83db688.js';
 
 const ptcNavSliderCss = "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}}@media only screen and (min-width: 1200px){:host{max-width:730px;padding:0px 0px;display:flex;align-items:center;margin-left:-25px}:host .box-wrap{width:100%;height:auto;display:flex;flex-wrap:nowrap;overflow-x:auto;overflow-y:hidden;scroll-behavior:smooth;-webkit-overflow-scrolling:touch;-ms-overflow-style:none;scrollbar-width:none}:host .box-wrap::-webkit-scrollbar{display:none}}@media only screen and (min-width: 1440px){:host{margin-left:-58px}}:host .navArrows{cursor:pointer;display:inline-block}:host .navArrows svg{vertical-align:middle}:host .btn-wrap-left,:host .btn-wrap-right{display:none}@media only screen and (min-width: 1200px){:host .btn-wrap-left,:host .btn-wrap-right{display:inline-block;width:32px;height:32px;position:relative}}@media (max-width: 1199px){:host .btn-wrap-left,:host .btn-wrap-right{display:none !important}}:host button#prevBtn,:host button#nextBtn{background:transparent;border-radius:var(--ptc-border-radius-standard);border:none;width:32px;height:32px}:host button#prevBtn:hover,:host button#nextBtn:hover{background:var(--color-gray-12)}:host button#prevBtn:focus-visible,:host button#prevBtn:focus,:host button#nextBtn:focus-visible,:host button#nextBtn:focus{border-radius:var(--ptc-border-radius-standard);border:2px solid white;outline:5px solid var(--keyboard-nav-outline)}:host .btn-wrap-left{margin-right:0}@media (min-width: 1250px){:host .btn-wrap-left{margin-right:14px}}:host .btn-wrap-right{margin-left:14px}:host .tracker-div{display:inline}";
 

package/dist/esm/ptc-nav-submenu.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-0bf594c4.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-c83db688.js';
 
 const ptcNavSubmenuCss = "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;cursor:pointer}:host .back-btn{display:none;position:absolute;left:30px;top:22px;color:var(--color-white);font-size:var(--ptc-font-size-xx-small);line-height:var(--ptc-line-height-denser);font-weight:var(--ptc-font-weight-bold)}:host .back-btn svg{margin-right:4px;vertical-align:middle;width:12px;height:12px}@media only screen and (min-width: 1200px){:host{display:inline-block;position:initial}}:host::before,:host::after{content:\" \";width:1600px;height:1px;background-color:var(--color-gray-08);position:absolute;right:0;bottom:0}@media only screen and (min-width: 1200px){:host::before,:host::after{display:none}}:host::after{left:0;right:auto}:host .submenu-toggle{display:inline-block;color:var(--color-gray-03);font-size:var(--ptc-font-size-xx-small);line-height:var(--ptc-line-height-denser);font-weight:var(--ptc-font-weight-bold);white-space:nowrap;padding:var(--ptc-element-spacing-04) var(--ptc-element-spacing-03);margin-left:34%;position:relative;border:2px solid transparent;margin:-2px}:host .submenu-toggle::after{content:\"\";display:block;border-bottom:2px solid transparent;margin:auto;position:absolute;width:calc(100% - 20px);left:0;right:0;bottom:14px}@media only screen and (min-width: 1200px){:host .submenu-toggle::after{bottom:20px}}@media only screen and (min-width: 480px){:host .submenu-toggle{margin-left:38%}}@media only screen and (min-width: 768px){:host .submenu-toggle{margin-left:42%}}@media only screen and (min-width: 1200px){:host .submenu-toggle{padding:22px var(--ptc-element-spacing-03);margin-left:0;display:flex;align-items:center}}:host .submenu-toggle svg{margin-left:5px;margin-top:2px;vertical-align:middle;width:12px;height:12px}:host .submenu-toggle svg path{fill:var(--color-gray-04)}:host .submenu-toggle:hover{color:var(--color-white)}:host .submenu-toggle:hover::after{border-color:var(--color-white)}:host .submenu-toggle:hover svg path{fill:var(--color-white)}:host .submenu-toggle icon-asset{margin-right:8px}:host .submenu-toggle icon-asset svg{margin:0}:host .submenu-toggle:focus-visible{border-radius:var(--ptc-border-radius-standard);border:2px solid white;outline:5px solid var(--keyboard-nav-outline)}:host .submenu-container{background-color:var(--color-gray-12)}@media only screen and (min-width: 1200px){:host .submenu-container{position:absolute;width:100%;right:0;left:0;top:64px;z-index:10}}:host .submenu-container .submenu-container-lg{max-width:1200px;margin:auto}@media only screen and (min-width: 992px){:host .submenu-container .submenu-container-lg{padding:0 32px}}:host ::slotted(ptc-nav-link:last-child)::before,:host ::slotted(ptc-nav-link:last-child)::after{display:none}:host .tracker-div{display:inline}:host(.short-dropdown) .submenu-container{text-align:center}@media only screen and (min-width: 1200px){:host(.short-dropdown) .submenu-container{width:initial;right:3%;left:initial;top:56px;z-index:1000}}:host(.short-dropdown) .submenu-container .submenu-container-lg{padding:0;width:auto;min-width:348px;display:flex;justify-content:space-evenly}:host(.active){padding-bottom:0}:host(.active) .submenu-toggle{color:var(--color-white);border-color:var(--color-white)}:host(.active) .submenu-toggle svg path{fill:var(--color-white)}:host(.active)::before,:host(.active)::after{display:none}:host(.active.short-dropdown) .back-btn{display:inline-block}@media only screen and (min-width: 1200px){:host(.active.short-dropdown) .back-btn{display:none}}.custom-icon{-o-object-fit:cover;object-fit:cover;width:1.5rem;height:1.5rem}.custom-icon:hover{filter:brightness(0) invert(1)}.menu-right *{color:transparent !important}";
 

package/dist/esm/ptc-nav-tile.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host } from './index-0bf594c4.js';
+import { r as registerInstance, h, H as Host } from './index-c83db688.js';
 
 const ptcNavTileCss = "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}.nav-link-group{display:inline-block;padding:12px 16px;border-radius:var(--ptc-border-radius-standard);background:var(--color-gray-02);box-shadow:0px 2px 6px 0px rgba(0, 0, 0, 0.24)}.nav-link-group .nav-title-link{color:var(--color-gray-10);font-family:var(--ptc-font-latin);font-size:var(--ptc-font-size-x-small);font-weight:var(--ptc-font-weight-semibold);line-height:var(--ptc-line-height-densest);margin:0 16px;text-decoration:none;outline:none}.nav-link-group .nav-title-link:hover,.nav-link-group .nav-title-link:visited{color:var(--color-gray-10);text-decoration:none;outline:none}";
 

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host } from './index-0bf594c4.js';
+import { r as registerInstance, h, H as Host } from './index-c83db688.js';
 
 const ptcNewsCss = "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}:host .news-container{max-width:990px;padding:30px 0;margin:auto}:host .news-tag{color:var(--color-gray-10);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-densest);display:inline-block}:host .news-date{margin-bottom:20px;display:inline-block;font-size:var(--ptc-font-size-small)}:host .news-content{padding-top:var(--ptc-element-spacing-08)}:host ptc-sticky-icons{display:none}@media only screen and (min-width: 992px){:host ptc-sticky-icons{display:block}}ptc-news .news-date{font-size:var(--ptc-font-size-small);color:var(--color-gray-10)}";
 

package/dist/esm/ptc-office-location-card.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, c as createEvent, h, H as Host, a as getElement } from './index-0bf594c4.js';
+import { r as registerInstance, c as createEvent, h, H as Host, g as getElement } from './index-c83db688.js';
 import { s as showMapSVG } from './show-map-icon-6d9dce32.js';
 
 const phone = `

package/dist/esm/ptc-office-locations.entry.js

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host, a as getElement } from './index-0bf594c4.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-c83db688.js';
 import { s as showMapSVG } from './show-map-icon-6d9dce32.js';
 
 const filterSVG = `

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

@@ -1,4 +1,4 @@
-import { r as registerInstance, h, H as Host } from './index-0bf594c4.js';
+import { r as registerInstance, h, H as Host } from './index-c83db688.js';
 
 const ptcOverlayCss = "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:absolute;top:0;left:0;width:100%;height:100%;transition:background var(--ptc-transition-medium) var(--ptc-ease-inout)}:host(.blue){background:linear-gradient(180deg, rgba(25, 123, 192, 0.2) 0%, var(--color-blue-07) 100%)}:host(.red){background:linear-gradient(180deg, rgba(209, 44, 58, 0.2) 0%, var(--color-red-07) 100%)}:host(.orange){background:linear-gradient(180deg, rgba(195, 119, 41, 0.2) 0%, var(--color-orange-07) 100%)}:host(.green){background:linear-gradient(180deg, rgba(0, 137, 11, 0.2) 0%, var(--color-green-07) 100%)}:host(.black-1){background:linear-gradient(270deg, rgba(32, 38, 42, 0.32) 33.33%, var(--color-gray-12) 100%)}:host(.black-2){background:linear-gradient(180deg, rgba(32, 38, 42, 0) 0%, var(--color-gray-12) 100%)}:host(.black-4){background:rgba(0, 0, 0, 0.66)}:host(.black-5){background:rgba(0, 0, 0, 0.76)}@media only screen and (min-width: 768px){:host(.black-1){background:linear-gradient(270deg, rgba(32, 38, 42, 0) 33.33%, var(--color-gray-12) 100%)}:host(.black-2){background:linear-gradient(180deg, rgba(32, 38, 42, 0) 0%, var(--color-gray-12) 100%)}}:host(.black-3){background:linear-gradient(180deg, var(--color-gray-12) 0%, rgba(32, 38, 42, 0.55) 100%)}:host(.slate-grey){background:linear-gradient(180deg, rgba(97, 116, 128, 0.2) 0%, var(--color-gray-07) 100%)}:host(.bright-blue){background:linear-gradient(180deg, rgba(25, 123, 192, 0.72) 0%, rgba(25, 123, 192, 0.85) 69.27%, rgba(25, 123, 192, 0.4) 100%)}:host(.bright-red){background:linear-gradient(180deg, rgba(211, 62, 62, 0.72) 0%, rgba(211, 62, 62, 0.85) 69.27%, rgba(211, 62, 62, 0.4) 100%)}:host(.bright-orange){background:linear-gradient(180deg, rgba(195, 119, 41, 0.72) 0%, rgba(195, 119, 41, 0.85) 69.27%, rgba(195, 119, 41, 0.4) 100%)}:host(.bright-green){background:linear-gradient(180deg, rgba(0, 137, 11, 0.72) 0%, rgba(0, 137, 11, 0.85) 69.27%, rgba(0, 137, 11, 0.4) 100%)}:host(.bright-slate-grey){background:linear-gradient(180deg, rgba(97, 116, 128, 0.72) 0%, rgba(97, 116, 128, 0.85) 69.27%, rgba(97, 116, 128, 0.4) 100%)}:host(.solid-black-1){background:rgba(16, 19, 20, 0.85)}:host(.solid-black-2){background:rgba(16, 19, 20, 0.7)}:host(.hp-blue){background:linear-gradient(180deg, #197bc0 0%, #4795cd 100%)}:host(.hp-green){background:linear-gradient(180deg, #00890b 0%, #33a13c 100%)}:host(.hp-red){background:linear-gradient(180deg, #d33e3e 0%, #dc6565 100%)}:host(.hp-gray){background:linear-gradient(180deg, #617480 0%, #819099 100%)}:host(.hp-orange){background:linear-gradient(180deg, #c37729 0%, #cf9254 100%)}:host(.transparent){background:linear-gradient(180deg, transparent 0%, transparent 100%)}:host(.white-bottom){background:linear-gradient(180deg, rgba(255, 255, 255, 0.4) 0%, #fff 100%)}:host(.radius-standard){border-radius:var(--ptc-border-radius-standard)}:host(.radius-large){border-radius:var(--ptc-border-radius-large)}:host(.radius-pill){border-radius:var(--ptc-border-radius-pill)}:host(.radius-circle){border-radius:var(--ptc-border-radius-circle)}:host(.z-index-auto){z-index:auto}:host(.z-index-n-1){z-index:-1}:host(.z-index-n-2){z-index:-2}:host(.z-index-p-1){z-index:1}:host(.z-index-p-2){z-index:2}";
 

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

@@ -0,0 +1,181 @@
+import { r as registerInstance, h, H as Host, g as getElement } from './index-c83db688.js';
+import { a as ResponsivePictureVariables } from './interfaces-4caedd26.js';
+
+const ptcPictureCss = "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;overflow:hidden}:host .inline{display:inline}:host .inline-block{display:inline-block}:host .block{display:block}:host(.relative){position:relative}:host(.static){position:static}:host(.absoltue){position:absolute}img{max-width:100%}.cover{-o-object-fit:cover;object-fit:cover}.fill{-o-object-fit:fill;object-fit:fill}.contain{-o-object-fit:contain;object-fit:contain}.scale-down{-o-object-fit:scale-down;object-fit:scale-down}.none{-o-object-fit:none;object-fit:none}.initial{-o-object-fit:initial;object-fit:initial}.inherit{-o-object-fit:inherit;object-fit:inherit}.radius-standard{border-radius:var(--ptc-border-radius-standard)}.radius-large{border-radius:var(--ptc-border-radius-large)}.radius-pill{border-radius:var(--ptc-border-radius-pill)}.radius-circle{border-radius:var(--ptc-border-radius-circle)}.is-full-height{height:100%}.is-full-width{width:100%}:host(.left){text-align:left}:host(.right){text-align:right}:host(.center){text-align:center}";
+
+const PtcPicture = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.src = undefined;
+    this.alt = "image";
+    this.sizeXs = "510x340";
+    this.sizeSm = "1240x496";
+    this.sizeMd = "1366x500";
+    this.sizeLg = "1920x1080";
+    this.disableResize = false;
+    this.oldSrc = undefined;
+    this.imagePosition = "static";
+    this.borderRadius = undefined;
+    this.height = undefined;
+    this.width = undefined;
+    this.objectFit = "cover";
+    this.isFullHeight = false;
+    this.isFullWidth = false;
+    this.styles = undefined;
+    this.imageAlignment = "left";
+    this.maxWidth = undefined;
+    this.displayImage = "block";
+  }
+  WindowResize() {
+    this.addIntersectionObserver();
+  }
+  componentWillLoad() {
+    if (this.disableResize) {
+      this.sizeXs = undefined;
+      this.sizeSm = undefined;
+      this.sizeMd = undefined;
+      this.sizeLg = undefined;
+    }
+  }
+  componentDidLoad() {
+    this.addIntersectionObserver();
+  }
+  componentWillUpdate() {
+    if (this.src !== this.oldSrc) {
+      this.addIntersectionObserver();
+    }
+    this.oldSrc = this.src;
+  }
+  //lazy-loading
+  addIntersectionObserver() {
+    if (!this.src) {
+      return;
+    }
+    if ("IntersectionObserver" in window) {
+      let lazyLoadImages = new IntersectionObserver((entries) => {
+        entries.forEach((entry) => {
+          if (entry.isIntersecting) {
+            const image = this.el.shadowRoot.querySelector("img");
+            image.src = this.setResponsiveBg();
+            lazyLoadImages.unobserve(image);
+          }
+        });
+      });
+      let tempImg = this.el.shadowRoot.querySelector("img");
+      if (tempImg) {
+        lazyLoadImages.observe(tempImg);
+      }
+      this.observer = lazyLoadImages;
+    }
+    else {
+      // fall back to setTimeout for Safari and IE
+      setTimeout(() => {
+        const image = this.el.shadowRoot.querySelector("img");
+        image.src = this.setResponsiveBg();
+        image.onload = () => {
+          image.removeAttribute("data-src");
+        };
+      }, 5000);
+    }
+  }
+  //responsive image
+  setResponsiveBg() {
+    // Define local variables
+    let backgrounds = (this.el.shadowRoot || document).querySelectorAll("img"), el, elData, currentBreakpoint = this.getCurrentBreakPoints();
+    for (var i = 0, len = backgrounds.length; i < len; i++) {
+      // Set current variables
+      el = backgrounds[i];
+      elData = el.getAttribute("data-" + currentBreakpoint);
+      if (elData !== null) {
+        return elData;
+      }
+      else {
+        if (typeof console == "object") {
+          console.warn("Data attribute: data-" +
+            currentBreakpoint +
+            " not found on element:\n\n" +
+            el.outerHTML +
+            "\n\n\n");
+        }
+      }
+    }
+  }
+  //manually load image
+  async LoadImage() {
+    const image = this.el.shadowRoot.querySelector("img");
+    if (!image) {
+      return;
+    }
+    if (!image.src) {
+      image.src = this.setResponsiveBg();
+      image.onload = () => {
+        image.removeAttribute("data-src");
+      };
+    }
+    if (this.observer) {
+      this.observer.unobserve(image);
+    }
+  }
+  render() {
+    const classMap = this.getCssClassMap();
+    const classMapHost = this.getCssClassMapHost();
+    return (h(Host, { class: classMapHost }, this.styles && h("style", null, this.styles), h("img", Object.assign({ class: classMap, "data-xs": !!this.sizeXs ? `${this.src}` : `${this.src}`, "data-sm": !!this.sizeSm ? `${this.src}` : `${this.src}`, "data-md": !!this.sizeMd ? `${this.src}` : `${this.src}`, "data-lg": !!this.sizeLg ? `${this.src}` : `${this.src}` }, (!!this.width ? { width: this.width } : {}), (!!this.height ? { height: this.height } : {}), { alt: this.alt, style: Object.assign({}, (!!this.maxWidth
+        ? { maxWidth: this.maxWidth + "px" }
+        : {})) })), h("slot", null)));
+  }
+  getCurrentBreakPoints() {
+    // Define local variables
+    let doc = window.document, temp = doc.createElement("div"), env;
+    // Append test node
+    doc.body.appendChild(temp);
+    // Loop through breakpoints
+    for (let i = ResponsivePictureVariables.envs.length - 1; i >= 0; i--) {
+      env = ResponsivePictureVariables.envs[i];
+      // Add classes
+      temp.className = "hidden-" + env;
+      // Found breakpoint
+      if (temp.offsetParent === null) {
+        // Remove our test node
+        doc.body.removeChild(temp);
+        // Return current breakpoint
+        return env;
+      }
+    }
+    // Breakpoint not found, try fallback
+    doc.body.removeChild(temp);
+    return this.getFallbackBreakpoint();
+  }
+  getFallbackBreakpoint() {
+    if (window.matchMedia("(min-width: 992px)").matches) {
+      return "lg";
+    }
+    else if (window.matchMedia("(min-width: 768px)").matches) {
+      return "md";
+    }
+    else if (window.matchMedia("(min-width: 576px)").matches) {
+      return "sm";
+    }
+    else {
+      return "xs";
+    }
+  }
+  getCssClassMap() {
+    return {
+      [this.borderRadius]: this.borderRadius ? true : false,
+      [this.objectFit]: true,
+      [this.isFullHeight ? "is-full-height" : "is-normal-height"]: true,
+      [this.isFullWidth ? "is-full-width" : "is-normal-width"]: true,
+      [this.displayImage]: true,
+    };
+  }
+  getCssClassMapHost() {
+    return {
+      [this.imagePosition]: true,
+      [this.imageAlignment]: true,
+    };
+  }
+  get el() { return getElement(this); }
+};
+PtcPicture.style = ptcPictureCss;
+
+export { PtcPicture as ptc_picture };