@ptcwebops/ptcw-design 2.7.7 → 2.7.9

package/dist/esm/ptc-image-download-strip.entry.js

@@ -1,25 +1,25 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-22a84644.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-62587d0b.js';
 
 const ptcImageDownloadStripCss = ":host{display:block;position:relative;font-family:var(--ptc-font-secondary-latin)}:host .strip{position:absolute;bottom:0;backdrop-filter:blur(15.2px);background:white;background:rgba(255, 255, 255, 0.3);width:100%;padding:15px;box-sizing:border-box;text-align:right}:host .strip .dl-btn{width:54px;height:40px;background-image:-o-linear-gradient(162deg, #74c34d, #00783e);background-image:linear-gradient(288deg, #74c34d, #00783e);border:1px solid #fff;color:#fff;cursor:pointer;display:flex;flex-direction:column;justify-content:center;margin-left:auto;align-items:center;text-decoration:none}:host .strip .dl-btn .dl-text{font-size:10px;text-transform:uppercase;font-weight:600;line-height:1.25;margin-bottom:1px;display:none}:host .strip .dl-btn:hover{box-shadow:0 3px 20px 0 #74c34d}:host .strip .dl-btn:hover .dl-text{display:block}:host .strip .dl-btn img{max-height:18px;width:12px}";
 
-const PtcImageDownloadStrip = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.downloadUrl = undefined;
-  }
-  render() {
-    return (h(Host, null, h("slot", null), h("div", { class: "strip" }, h("a", { class: "dl-btn", href: "javascript:void()", onClick: () => { this.openModal(); } }, h("span", { class: "dl-text" }, "Download"), h("img", { src: "https://www.ptc.com/dist/ptc/images/download-arrow.svg", alt: "Down Arrow" }))), h("ptc-modal", { id: "strip-download-modal", show: false, size: "lg", fixed: true, "is-bio-modal": true }, h("ptc-title", { type: 'h2', "text-align": 'center', "title-weight": "w-5", upperline: "no-upperline" }, "Thanks For Downloading"))));
-  }
-  openModal() {
-    let modal = this.el.shadowRoot.querySelector('#strip-download-modal');
-    modal.setAttribute('show', 'true');
-    setTimeout(() => {
-      modal.setAttribute('show', 'false');
-      window.open(`${this.downloadUrl}`, "_self");
-    }, 1000);
-  }
-  get el() { return getElement(this); }
-};
+const PtcImageDownloadStrip = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.downloadUrl = undefined;
+  }
+  render() {
+    return (h(Host, null, h("slot", null), h("div", { class: "strip" }, h("a", { class: "dl-btn", href: "javascript:void()", onClick: () => { this.openModal(); } }, h("span", { class: "dl-text" }, "Download"), h("img", { src: "https://www.ptc.com/dist/ptc/images/download-arrow.svg", alt: "Down Arrow" }))), h("ptc-modal", { id: "strip-download-modal", show: false, size: "lg", fixed: true, "is-bio-modal": true }, h("ptc-title", { type: 'h2', "text-align": 'center', "title-weight": "w-5", upperline: "no-upperline" }, "Thanks For Downloading"))));
+  }
+  openModal() {
+    let modal = this.el.shadowRoot.querySelector('#strip-download-modal');
+    modal.setAttribute('show', 'true');
+    setTimeout(() => {
+      modal.setAttribute('show', 'false');
+      window.open(`${this.downloadUrl}`, "_self");
+    }, 1000);
+  }
+  get el() { return getElement(this); }
+};
 PtcImageDownloadStrip.style = ptcImageDownloadStripCss;
 
 export { PtcImageDownloadStrip as ptc_image_download_strip };

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

@@ -1,129 +1,129 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-22a84644.js';
-import { R as ResponsiveBgVariables } from './interfaces-3cb94654.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-62587d0b.js';
+import { R as ResponsiveBgVariables } from './interfaces-4caedd26.js';
 
 const ptcImgCss = ".smart-bg{width:100%;height:100%;background-size:cover;background-repeat:no-repeat;background-position:50% 50%}.smart-img{position:absolute;display:block;width:100%;height:100%;top:0;left:0;background-size:cover;background-repeat:no-repeat;background-position:50% 50%}.radius-standard{border-radius:var(--ptc-border-radius-standard)}.radius-standard-top{border-top-left-radius:var(--ptc-border-radius-standard);border-top-right-radius:var(--ptc-border-radius-standard)}.radius-large{border-radius:var(--ptc-border-radius-large)}.radius-large-top{border-top-left-radius:var(--ptc-border-radius-large);border-top-right-radius:var(--ptc-border-radius-large)}.lazy-bg{background-image:none !important;background-color:var(--color-gray-03)}@media only screen and (min-width: 768px){.hidden-xs{display:none !important}}@media (min-width: 768px) and (max-width: 991px){.hidden-sm{display:none !important}}@media (min-width: 992px) and (max-width: 1199px){.hidden-md{display:none !important}}@media only screen and (min-width: 768px){.hidden-lg{display:none !important}}";
 
-const PtcImg = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.sizeXs = '510x340';
-    this.sizeSm = '1240x496';
-    this.sizeMd = '1366x500';
-    this.sizeLg = '1920x1080';
-    this.imgUrl = undefined;
-    this.imageType = 'smart-bg';
-    this.borderRadius = '';
-    this.loadMode = 'lazy-bg';
-    this.styles = undefined;
-  }
-  /**
-   * Image Z Index
-   */
-  // @Prop() imageZIndex: 'z-index-auto' | 'z-index-n-2' | 'z-index-n-1' | 'z-index-p-1' | 'z-index-p-2' = 'z-index-auto';
-  WindowResize() {
-    this.setResponsiveBg();
-  }
-  render() {
-    const classMap = this.getCssClassMap();
-    return (h(Host, null, this.styles && h("style", null, this.styles), h("div", { class: classMap, "data-xs": `${this.imgUrl}:${this.sizeXs}`, "data-sm": `${this.imgUrl}:${this.sizeSm}`, "data-md": `${this.imgUrl}:${this.sizeMd}`, "data-lg": `${this.imgUrl}:${this.sizeLg}` }, this.imageType == 'smart-bg' ? h("slot", null) : null)));
-  }
-  componentDidLoad() {
-    this.addIntersectionObserver();
-    this.setResponsiveBg();
-  }
-  componentWillUpdate() {
-    this.addIntersectionObserver();
-    this.setResponsiveBg();
-  }
-  //responsive image
-  setResponsiveBg() {
-    // Define local variables
-    let backgrounds = (this.el || document).querySelectorAll(ResponsiveBgVariables.selector), el, elData, currentBreakpoint = this.getCurrentBreakPoints();
-    // Loop through all target elements
-    for (var i = 0, len = backgrounds.length; i < len; i++) {
-      // Set current variables
-      el = backgrounds[i];
-      elData = el.getAttribute('data-' + currentBreakpoint);
-      // If the data attribute exists, set the background
-      if (elData !== null) {
-        el.style.backgroundImage = "url('" + elData + "')";
-      }
-      else {
-        if (typeof console == 'object') {
-          console.warn('Data attribute: data-' + currentBreakpoint + ' not found on element:\n\n' + el.outerHTML + '\n\n\n');
-        }
-      }
-    }
-  }
-  //lazy loading
-  addIntersectionObserver() {
-    if (!this.imgUrl) {
-      console.log('no image!');
-      return;
-    }
-    if ('IntersectionObserver' in window) {
-      let lazyLoadBgs = (this.el || document).querySelectorAll('.lazy-bg');
-      let bgObserver = new IntersectionObserver(entries => {
-        entries.forEach(entry => {
-          if (entry.isIntersecting) {
-            const image = entry.target;
-            image.classList.remove('lazy-bg');
-            bgObserver.unobserve(image);
-          }
-        });
-      });
-      lazyLoadBgs.forEach(image => {
-        bgObserver.observe(image);
-      });
-    }
-  }
-  getCssClassMap() {
-    return {
-      [this.imageType]: true,
-      'ptc-img': true,
-      [this.borderRadius]: true,
-      [this.loadMode]: true,
-      // [this.imageZIndex] : true
-    };
-  }
-  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 = ResponsiveBgVariables.envs.length - 1; i >= 0; i--) {
-      env = ResponsiveBgVariables.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';
-    }
-  }
-  get el() { return getElement(this); }
-};
+const PtcImg = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.sizeXs = '510x340';
+    this.sizeSm = '1240x496';
+    this.sizeMd = '1366x500';
+    this.sizeLg = '1920x1080';
+    this.imgUrl = undefined;
+    this.imageType = 'smart-bg';
+    this.borderRadius = '';
+    this.loadMode = 'lazy-bg';
+    this.styles = undefined;
+  }
+  /**
+   * Image Z Index
+   */
+  // @Prop() imageZIndex: 'z-index-auto' | 'z-index-n-2' | 'z-index-n-1' | 'z-index-p-1' | 'z-index-p-2' = 'z-index-auto';
+  WindowResize() {
+    this.setResponsiveBg();
+  }
+  render() {
+    const classMap = this.getCssClassMap();
+    return (h(Host, null, this.styles && h("style", null, this.styles), h("div", { class: classMap, "data-xs": `${this.imgUrl}:${this.sizeXs}`, "data-sm": `${this.imgUrl}:${this.sizeSm}`, "data-md": `${this.imgUrl}:${this.sizeMd}`, "data-lg": `${this.imgUrl}:${this.sizeLg}` }, this.imageType == 'smart-bg' ? h("slot", null) : null)));
+  }
+  componentDidLoad() {
+    this.addIntersectionObserver();
+    this.setResponsiveBg();
+  }
+  componentWillUpdate() {
+    this.addIntersectionObserver();
+    this.setResponsiveBg();
+  }
+  //responsive image
+  setResponsiveBg() {
+    // Define local variables
+    let backgrounds = (this.el || document).querySelectorAll(ResponsiveBgVariables.selector), el, elData, currentBreakpoint = this.getCurrentBreakPoints();
+    // Loop through all target elements
+    for (var i = 0, len = backgrounds.length; i < len; i++) {
+      // Set current variables
+      el = backgrounds[i];
+      elData = el.getAttribute('data-' + currentBreakpoint);
+      // If the data attribute exists, set the background
+      if (elData !== null) {
+        el.style.backgroundImage = "url('" + elData + "')";
+      }
+      else {
+        if (typeof console == 'object') {
+          console.warn('Data attribute: data-' + currentBreakpoint + ' not found on element:\n\n' + el.outerHTML + '\n\n\n');
+        }
+      }
+    }
+  }
+  //lazy loading
+  addIntersectionObserver() {
+    if (!this.imgUrl) {
+      console.log('no image!');
+      return;
+    }
+    if ('IntersectionObserver' in window) {
+      let lazyLoadBgs = (this.el || document).querySelectorAll('.lazy-bg');
+      let bgObserver = new IntersectionObserver(entries => {
+        entries.forEach(entry => {
+          if (entry.isIntersecting) {
+            const image = entry.target;
+            image.classList.remove('lazy-bg');
+            bgObserver.unobserve(image);
+          }
+        });
+      });
+      lazyLoadBgs.forEach(image => {
+        bgObserver.observe(image);
+      });
+    }
+  }
+  getCssClassMap() {
+    return {
+      [this.imageType]: true,
+      'ptc-img': true,
+      [this.borderRadius]: true,
+      [this.loadMode]: true,
+      // [this.imageZIndex] : true
+    };
+  }
+  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 = ResponsiveBgVariables.envs.length - 1; i >= 0; i--) {
+      env = ResponsiveBgVariables.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';
+    }
+  }
+  get el() { return getElement(this); }
+};
 PtcImg.style = ptcImgCss;
 
 export { PtcImg as ptc_img };

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

@@ -1,55 +1,55 @@
-import { r as registerInstance, h, H as Host } from './index-22a84644.js';
+import { r as registerInstance, h, H as Host } from './index-62587d0b.js';
 
 const ptcLinkCss = ":host{display:block}.disabled{pointer-events:none;cursor:default;text-decoration:none}.ptc-link{display:inline-block;color:var(--color-gray-10);font-weight:var(--ptc-font-weight-extrabold);position:relative;line-height:var(--ptc-line-height-densest);outline:none;text-decoration:none;transition:color var(--ptc-transition-fast) var(--ptc-ease-inout)}.simple{text-decoration:underline;text-underline-offset:5px;text-decoration-color:var(--color-green-06);text-decoration-thickness:2px;transition:text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.simple:hover{color:var(--color-green-06);transition:text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.global{font-style:var(--ptc-letter-spacing-normal);font-weight:var(--ptc-font-weight-bold);font-size:var(--ptc-font-size-x-small);text-decoration-line:underline;color:var(--color-blue-07);transition:color var(--ptc-transition-medium) var(--ptc-ease-out)}.global:visited{color:var(--color-blue-10)}.global:active,.global:visited:active{color:var(--color-blue-09)}.global:hover,.global:visited:hover{color:var(--color-blue-08)}.global.disabled{color:var(--color-gray-04) !important;cursor:not-allowed}.product-link{font-weight:var(--ptc-font-weight-extrabold);text-decoration:underline;text-underline-offset:5px;text-decoration-color:var(--color-green-06);text-decoration-thickness:2px;transition:text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.product-link:hover{color:var(--color-green-06);transition:text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.underline{border-bottom:2px solid var(--color-green-06)}.underline:hover{color:#00890B;border-bottom:2px solid #00890B}.small{font-size:var(--ptc-font-size-xx-small)}.medium{font-size:var(--ptc-font-size-x-small)}.medium-large{font-size:var(--ptc-font-size-small)}.large{font-size:var(--ptc-font-size-medium)}.nav-title:focus,.nav-title-link:focus,.nav-card-link:focus,.primary-nav-link:focus,.secondary-nav-link:focus,.footer-nav-link:focus,.copyright-link:focus{outline:3px solid var(--color-blue-07);outline-offset:2px}.nav-title{box-sizing:border-box;color:var(--color-white);display:inline-block;font-size:var(--ptc-font-size-x-small);font-stretch:100%;font-weight:var(--ptc-font-weight-extrabold);letter-spacing:var(--ptc-letter-spacing-normal);line-height:var(--ptc-line-height-dense);list-style:none;margin-bottom:var(--ptc-element-spacing-02);text-align:left}.primary-nav-link{background-color:transparent;box-sizing:border-box;color:var(--color-gray-01);display:inline-block;font-size:var(--ptc-font-size-x-small);font-stretch:100%;font-weight:var(--ptc-font-weight-extrabold);letter-spacing:var(--ptc-letter-spacing-normal);line-height:var(--ptc-line-height-dense);list-style:none;margin:var(--ptc-element-spacing-01) var(--ptc-element-spacing-03);padding:var(--ptc-element-spacing-02) var(--ptc-element-spacing-06);position:relative;text-decoration:none;transition:background-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.primary-nav-link:hover{border-radius:var(--ptc-border-radius-standard);background-color:var(--color-gray-12);text-decoration:none;outline:none}.nav-title-link{background-color:transparent;box-sizing:border-box;color:var(--color-white);font-size:var(--ptc-font-size-xxx-small);font-stretch:100%;font-weight:var(--ptc-font-weight-extrabold);line-height:var(--ptc-line-height-densest);list-style:none;text-align:left;text-decoration-color:var(--color-white);text-decoration:none;transition:border-color var(--ptc-transition-medium) var(--ptc-ease-inout);border-bottom:1.5px solid transparent;display:inline-block}.nav-title-link:hover{color:var(--color-white);border-bottom:1.5px solid var(--color-green-06)}.nav-card-link{background-color:transparent;box-sizing:border-box;color:var(--color-white);font-stretch:100%;font-weight:var(--ptc-font-weight-extrabold);line-height:var(--ptc-line-height-densest);list-style:none;text-align:left;text-decoration:none;text-decoration-color:var(--color-white);transition:border-color var(--ptc-transition-medium) var(--ptc-ease-inout);display:inline-block;font-size:var(--ptc-font-size-small)}@media only screen and (min-width: 1200px){.nav-card-link{font-size:var(--ptc-font-size-xxx-small)}}.nav-card-link:hover{color:var(--color-white);text-decoration:underline var(--color-green-06) solid 1px;text-underline-offset:2px}.secondary-nav-link{display:inline-block;background-color:transparent;box-sizing:border-box;color:var(--color-white);font-size:var(--ptc-font-size-xxx-small);font-stretch:100%;font-style:normal;font-weight:var(--ptc-font-weight-semibold);letter-spacing:var(--ptc-letter-spacing-normal);line-height:var(--ptc-line-height-densest);list-style:none;margin-bottom:var(--ptc-element-spacing-03);text-align:left;text-decoration:none;transition:border-color var(--ptc-transition-medium) var(--ptc-ease-inout);border-bottom:1.5px solid transparent;white-space:nowrap}.secondary-nav-link:hover{color:var(--color-white);border-bottom:1.5px solid var(--color-green-06);border-radius:0;text-decoration:none}.footer-nav-link{color:var(--color-white);transition:border var(--ptc-transition-medium) var(--ptc-ease-inout), color var(--ptc-transition-medium) var(--ptc-ease-inout);border-bottom:1px solid transparent;outline:none;text-decoration:none;font-weight:var(--ptc-font-weight-semibold);letter-spacing:var(--ptc-letter-spacing-normal);line-height:var(--ptc-line-height-densest);text-align:left;font-size:var(--ptc-font-size-x-small)}.footer-nav-link:hover{outline:none;text-decoration:none;border-bottom:0.1rem solid var(--color-green-06);color:var(--color-green-06)}.copyright-link{color:var(--color-white);font-size:var(--ptc-font-size-xx-small);font-weight:var(--ptc-font-weight-normal);line-height:var(--ptc-line-height-loose);display:inline-block}.d-green-underline{color:var(--color-white);font-weight:var(--ptc-font-weight-extrabold);line-height:var(--ptc-line-height-densest);text-decoration:underline;text-decoration-thickness:2px;text-decoration-color:var(--color-green-06);text-underline-offset:5px;transition:text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.d-green-underline:hover{color:var(--color-green-06)}.d-white-underline{color:var(--color-white);font-weight:var(--ptc-font-weight-extrabold);line-height:var(--ptc-line-height-densest);text-decoration:underline;text-decoration-thickness:2px;text-decoration-color:var(--color-white);text-underline-offset:5px}.link-area-cover-parent{position:static}.link-area-cover-parent::after{content:\"\";position:absolute;width:100%;height:100%;inset:0;z-index:2}.standard-link,.blog-link{font-weight:800;line-height:1;display:flex;align-items:center;color:var(--color-gray-10);text-decoration:underline;text-decoration-thickness:2px;text-decoration-color:var(--color-green-06);text-underline-offset:5px;transition:text-decoration-color var(--ptc-transition-medium) var(--ptc-ease-inout)}.standard-link:hover,.blog-link:hover{color:var(--color-green-06)}.w-thin{font-weight:var(--ptc-font-weight-thin)}.w-regular{font-weight:var(--ptc-font-weight-regular)}.w-medium{font-weight:var(--ptc-font-weight-medium)}.w-semibold{font-weight:var(--ptc-font-weight-semibold)}.w-bold{font-weight:var(--ptc-font-weight-bold)}.w-extrabold{font-weight:var(--ptc-font-weight-extrabold)}.w-black{font-weight:var(--ptc-font-weight-black)}";
 
-const PtcLink = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.disabled = false;
-    this.external = false;
-    this.href = undefined;
-    this.target = '_self';
-    this.linkTitle = undefined;
-    this.theme = 'simple';
-    this.fontSize = 'medium';
-    this.fontWeight = undefined;
-    this.linkArea = undefined;
-    this.styles = undefined;
-  }
-  render() {
-    const classMap = this.getCssClassMap();
-    return (h(Host, null, this.styles && h("style", null, this.styles), h("a", { class: classMap, href: this.href, target: this.external ? '_blank' : this.target, title: this.linkTitle }, h("slot", null))));
-  }
-  getCssClassMap() {
-    const classOptions = [
-      'simple',
-      'underline',
-      'nav-title',
-      'primary-nav-link',
-      'nav-title-link',
-      'nav-card-link',
-      'secondary-nav-link',
-      'footer-nav-link',
-      'copyright-link',
-      'product-link',
-      'd-green-underline',
-      'd-white-underline',
-      'global',
-    ];
-    let mainClass = this.theme;
-    if (classOptions.indexOf(mainClass) < 0) {
-      mainClass = 'simple'; // fallback to simple class if theme is unavailable
-    }
-    return {
-      ['ptc-link']: true,
-      [mainClass]: true,
-      ['disabled']: this.disabled,
-      [this.fontSize]: true,
-      [this.linkArea]: this.linkArea ? true : false,
-      [this.fontWeight]: this.fontWeight ? true : false,
-    };
-  }
-};
+const PtcLink = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.disabled = false;
+    this.external = false;
+    this.href = undefined;
+    this.target = '_self';
+    this.linkTitle = undefined;
+    this.theme = 'simple';
+    this.fontSize = 'medium';
+    this.fontWeight = undefined;
+    this.linkArea = undefined;
+    this.styles = undefined;
+  }
+  render() {
+    const classMap = this.getCssClassMap();
+    return (h(Host, null, this.styles && h("style", null, this.styles), h("a", { class: classMap, href: this.href, target: this.external ? '_blank' : this.target, title: this.linkTitle }, h("slot", null))));
+  }
+  getCssClassMap() {
+    const classOptions = [
+      'simple',
+      'underline',
+      'nav-title',
+      'primary-nav-link',
+      'nav-title-link',
+      'nav-card-link',
+      'secondary-nav-link',
+      'footer-nav-link',
+      'copyright-link',
+      'product-link',
+      'd-green-underline',
+      'd-white-underline',
+      'global',
+    ];
+    let mainClass = this.theme;
+    if (classOptions.indexOf(mainClass) < 0) {
+      mainClass = 'simple'; // fallback to simple class if theme is unavailable
+    }
+    return {
+      ['ptc-link']: true,
+      [mainClass]: true,
+      ['disabled']: this.disabled,
+      [this.fontSize]: true,
+      [this.linkArea]: this.linkArea ? true : false,
+      [this.fontWeight]: this.fontWeight ? true : false,
+    };
+  }
+};
 PtcLink.style = ptcLinkCss;
 
 export { PtcLink as ptc_link };

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

@@ -1,56 +1,56 @@
-import { r as registerInstance, h, H as Host, g as getElement } from './index-22a84644.js';
+import { r as registerInstance, h, H as Host, g as getElement } from './index-62587d0b.js';
 
 const ptcListCss = ":host{display:block}:host(.list-primary) li{font-size:var(--ptc-font-size-x-small);line-height:var(--ptc-line-height-normal);letter-spacing:var(--ptc-letter-spacing-normal);list-style:none}:host(.list-primary) li:not(:last-child){margin-bottom:0.625rem}:host(.list-primary) li a{color:var(--color-white);outline:none;text-decoration:none;font-family:Rajdhani;font-size:var(--ptc-font-size-x-small);font-weight:var(--ptc-font-weight-bold);line-height:var(--ptc-line-height-normal);text-transform:uppercase;letter-spacing:var(--ptc-letter-spacing-normal)}:host(.list-primary) li a:hover{color:var(--color-white);border-bottom:1.5px solid var(--color-green-07)}";
 
-class ListItem {
-}
-const PtcList = class {
-  constructor(hostRef) {
-    registerInstance(this, hostRef);
-    this.listType = 'list-primary';
-    this.listItems = [];
-  }
-  render() {
-    const classMap = this.getCssClassMap();
-    const listItems = this.getListItems();
-    if (!listItems || listItems.length === 0) {
-      return null;
-    }
-    return (h(Host, { class: classMap }, h("ul", null, listItems.map(listItem => {
-      return (h("list-item", { "link-type": listItem.type, "link-href": listItem.href, "link-target": listItem.target, "flush-before": listItem.flushBefore }, listItem.value));
-    }))));
-  }
-  getListItems() {
-    let result = new Array();
-    if (this.listItems && this.listItems.length > 0) {
-      this.listItems.map(listItem => {
-        let i = new ListItem();
-        i.value = listItem;
-        result.push(i);
-      });
-    }
-    else {
-      let items = Array.from(this.el.querySelectorAll('list-item'));
-      items.map(el => {
-        let i = new ListItem();
-        let item = el;
-        i.value = item.innerText;
-        i.href = item.getAttribute('link-href');
-        i.target = item.getAttribute('link-target');
-        i.flushBefore = item.getAttribute('flush-before') == 'true';
-        i.type = item.getAttribute('link-type');
-        result.push(i);
-      });
-    }
-    return result;
-  }
-  getCssClassMap() {
-    return {
-      [this.listType]: this.listItems ? true : false,
-    };
-  }
-  get el() { return getElement(this); }
-};
+class ListItem {
+}
+const PtcList = class {
+  constructor(hostRef) {
+    registerInstance(this, hostRef);
+    this.listType = 'list-primary';
+    this.listItems = [];
+  }
+  render() {
+    const classMap = this.getCssClassMap();
+    const listItems = this.getListItems();
+    if (!listItems || listItems.length === 0) {
+      return null;
+    }
+    return (h(Host, { class: classMap }, h("ul", null, listItems.map(listItem => {
+      return (h("list-item", { "link-type": listItem.type, "link-href": listItem.href, "link-target": listItem.target, "flush-before": listItem.flushBefore }, listItem.value));
+    }))));
+  }
+  getListItems() {
+    let result = new Array();
+    if (this.listItems && this.listItems.length > 0) {
+      this.listItems.map(listItem => {
+        let i = new ListItem();
+        i.value = listItem;
+        result.push(i);
+      });
+    }
+    else {
+      let items = Array.from(this.el.querySelectorAll('list-item'));
+      items.map(el => {
+        let i = new ListItem();
+        let item = el;
+        i.value = item.innerText;
+        i.href = item.getAttribute('link-href');
+        i.target = item.getAttribute('link-target');
+        i.flushBefore = item.getAttribute('flush-before') == 'true';
+        i.type = item.getAttribute('link-type');
+        result.push(i);
+      });
+    }
+    return result;
+  }
+  getCssClassMap() {
+    return {
+      [this.listType]: this.listItems ? true : false,
+    };
+  }
+  get el() { return getElement(this); }
+};
 PtcList.style = ptcListCss;
 
 export { PtcList as ptc_list };