@ptcwebops/ptcw-design 1.7.8 → 1.8.0

package/dist/cjs/{core-3eeb2cf1.js → core-332e5461.js}

@@ -321,6 +321,20 @@ function createElement(tag, classes = []) {
   el.classList.add(...(Array.isArray(classes) ? classes : [classes]));
   return el;
 }
+function elementOffset(el) {
+  const window = getWindow();
+  const document = getDocument();
+  const box = el.getBoundingClientRect();
+  const body = document.body;
+  const clientTop = el.clientTop || body.clientTop || 0;
+  const clientLeft = el.clientLeft || body.clientLeft || 0;
+  const scrollTop = el === window ? window.scrollY : el.scrollTop;
+  const scrollLeft = el === window ? window.scrollX : el.scrollLeft;
+  return {
+    top: box.top + scrollTop - clientTop,
+    left: box.left + scrollLeft - clientLeft
+  };
+}
 function elementPrevAll(el, selector) {
   const prevEls = [];
   while (el.previousElementSibling) {
@@ -396,7 +410,7 @@ function calcSupport() {
   const window = getWindow();
   const document = getDocument();
   return {
-    smoothScroll: document.documentElement && document.documentElement.style && 'scrollBehavior' in document.documentElement.style,
+    smoothScroll: document.documentElement && 'scrollBehavior' in document.documentElement.style,
     touch: !!('ontouchstart' in window || window.DocumentTouch && document instanceof window.DocumentTouch)
   };
 }
@@ -804,8 +818,6 @@ function updateSlides() {
   }
   if (typeof spaceBetween === 'string' && spaceBetween.indexOf('%') >= 0) {
     spaceBetween = parseFloat(spaceBetween.replace('%', '')) / 100 * swiperSize;
-  } else if (typeof spaceBetween === 'string') {
-    spaceBetween = parseFloat(spaceBetween);
   }
   swiper.virtualSize = -spaceBetween;
 
@@ -915,10 +927,10 @@ function updateSlides() {
   }
   swiper.virtualSize = Math.max(swiper.virtualSize, swiperSize) + offsetAfter;
   if (rtl && wrongRTL && (params.effect === 'slide' || params.effect === 'coverflow')) {
-    wrapperEl.style.width = `${swiper.virtualSize + spaceBetween}px`;
+    wrapperEl.style.width = `${swiper.virtualSize + params.spaceBetween}px`;
   }
   if (params.setWrapperSize) {
-    wrapperEl.style[getDirectionLabel('width')] = `${swiper.virtualSize + spaceBetween}px`;
+    wrapperEl.style[getDirectionLabel('width')] = `${swiper.virtualSize + params.spaceBetween}px`;
   }
   if (gridEnabled) {
     swiper.grid.updateWrapperSize(slideSize, snapGrid, getDirectionLabel);
@@ -957,7 +969,7 @@ function updateSlides() {
     }
   }
   if (snapGrid.length === 0) snapGrid = [0];
-  if (spaceBetween !== 0) {
+  if (params.spaceBetween !== 0) {
     const key = swiper.isHorizontal() && rtl ? 'marginLeft' : getDirectionLabel('marginRight');
     slides.filter((_, slideIndex) => {
       if (!params.cssMode || params.loop) return true;
@@ -972,9 +984,9 @@ function updateSlides() {
   if (params.centeredSlides && params.centeredSlidesBounds) {
     let allSlidesSize = 0;
     slidesSizesGrid.forEach(slideSizeValue => {
-      allSlidesSize += slideSizeValue + (spaceBetween || 0);
+      allSlidesSize += slideSizeValue + (params.spaceBetween ? params.spaceBetween : 0);
     });
-    allSlidesSize -= spaceBetween;
+    allSlidesSize -= params.spaceBetween;
     const maxSnap = allSlidesSize - swiperSize;
     snapGrid = snapGrid.map(snap => {
       if (snap < 0) return -offsetBefore;
@@ -985,9 +997,9 @@ function updateSlides() {
   if (params.centerInsufficientSlides) {
     let allSlidesSize = 0;
     slidesSizesGrid.forEach(slideSizeValue => {
-      allSlidesSize += slideSizeValue + (spaceBetween || 0);
+      allSlidesSize += slideSizeValue + (params.spaceBetween ? params.spaceBetween : 0);
     });
-    allSlidesSize -= spaceBetween;
+    allSlidesSize -= params.spaceBetween;
     if (allSlidesSize < swiperSize) {
       const allSlidesOffset = (swiperSize - allSlidesSize) / 2;
       snapGrid.forEach((snap, snapIndex) => {
@@ -1049,7 +1061,7 @@ function updateAutoHeight(speed) {
   }
   const getSlideByIndex = index => {
     if (isVirtual) {
-      return swiper.slides[swiper.getSlideIndexByData(index)];
+      return swiper.getSlideIndexByData(index);
     }
     return swiper.slides[index];
   };
@@ -1088,7 +1100,7 @@ function updateSlidesOffset() {
   // eslint-disable-next-line
   const minusOffset = swiper.isElement ? swiper.isHorizontal() ? swiper.wrapperEl.offsetLeft : swiper.wrapperEl.offsetTop : 0;
   for (let i = 0; i < slides.length; i += 1) {
-    slides[i].swiperSlideOffset = (swiper.isHorizontal() ? slides[i].offsetLeft : slides[i].offsetTop) - minusOffset - swiper.cssOverflowAdjustment();
+    slides[i].swiperSlideOffset = (swiper.isHorizontal() ? slides[i].offsetLeft : slides[i].offsetTop) - minusOffset;
   }
 }
 
@@ -1111,20 +1123,14 @@ function updateSlidesProgress(translate = this && this.translate || 0) {
   });
   swiper.visibleSlidesIndexes = [];
   swiper.visibleSlides = [];
-  let spaceBetween = params.spaceBetween;
-  if (typeof spaceBetween === 'string' && spaceBetween.indexOf('%') >= 0) {
-    spaceBetween = parseFloat(spaceBetween.replace('%', '')) / 100 * swiper.size;
-  } else if (typeof spaceBetween === 'string') {
-    spaceBetween = parseFloat(spaceBetween);
-  }
   for (let i = 0; i < slides.length; i += 1) {
     const slide = slides[i];
     let slideOffset = slide.swiperSlideOffset;
     if (params.cssMode && params.centeredSlides) {
       slideOffset -= slides[0].swiperSlideOffset;
     }
-    const slideProgress = (offsetCenter + (params.centeredSlides ? swiper.minTranslate() : 0) - slideOffset) / (slide.swiperSlideSize + spaceBetween);
-    const originalSlideProgress = (offsetCenter - snapGrid[0] + (params.centeredSlides ? swiper.minTranslate() : 0) - slideOffset) / (slide.swiperSlideSize + spaceBetween);
+    const slideProgress = (offsetCenter + (params.centeredSlides ? swiper.minTranslate() : 0) - slideOffset) / (slide.swiperSlideSize + params.spaceBetween);
+    const originalSlideProgress = (offsetCenter - snapGrid[0] + (params.centeredSlides ? swiper.minTranslate() : 0) - slideOffset) / (slide.swiperSlideSize + params.spaceBetween);
     const slideBefore = -(offsetCenter - slideOffset);
     const slideAfter = slideBefore + swiper.slidesSizesGrid[i];
     const isVisible = slideBefore >= 0 && slideBefore < swiper.size - 1 || slideAfter > 1 && slideAfter <= swiper.size || slideBefore <= 0 && slideAfter >= swiper.size;
@@ -1253,41 +1259,6 @@ function updateSlidesClasses() {
   swiper.emitSlidesClasses();
 }
 
-const processLazyPreloader = (swiper, imageEl) => {
-  if (!swiper || swiper.destroyed || !swiper.params) return;
-  const slideSelector = () => swiper.isElement ? `swiper-slide` : `.${swiper.params.slideClass}`;
-  const slideEl = imageEl.closest(slideSelector());
-  if (slideEl) {
-    const lazyEl = slideEl.querySelector(`.${swiper.params.lazyPreloaderClass}`);
-    if (lazyEl) lazyEl.remove();
-  }
-};
-const unlazy = (swiper, index) => {
-  if (!swiper.slides[index]) return;
-  const imageEl = swiper.slides[index].querySelector('[loading="lazy"]');
-  if (imageEl) imageEl.removeAttribute('loading');
-};
-const preload = swiper => {
-  if (!swiper || swiper.destroyed || !swiper.params) return;
-  let amount = swiper.params.lazyPreloadPrevNext;
-  const len = swiper.slides.length;
-  if (!len || !amount || amount < 0) return;
-  amount = Math.min(amount, len);
-  const slidesPerView = swiper.params.slidesPerView === 'auto' ? swiper.slidesPerViewDynamic() : Math.ceil(swiper.params.slidesPerView);
-  const activeIndex = swiper.activeIndex;
-  const slideIndexLastInView = activeIndex + slidesPerView - 1;
-  if (swiper.params.rewind) {
-    for (let i = activeIndex - amount; i <= slideIndexLastInView + amount; i += 1) {
-      const realIndex = (i % len + len) % len;
-      if (realIndex !== activeIndex && realIndex > slideIndexLastInView) unlazy(swiper, realIndex);
-    }
-  } else {
-    for (let i = Math.max(slideIndexLastInView - amount, 0); i <= Math.min(slideIndexLastInView + amount, len - 1); i += 1) {
-      if (i !== activeIndex && i > slideIndexLastInView) unlazy(swiper, i);
-    }
-  }
-};
-
 function getActiveIndexByTranslate(swiper) {
   const {
     slidesGrid,
@@ -1364,16 +1335,11 @@ function updateActiveIndex(newActiveIndex) {
     realIndex = activeIndex;
   }
   Object.assign(swiper, {
-    previousSnapIndex,
     snapIndex,
-    previousRealIndex,
     realIndex,
     previousIndex,
     activeIndex
   });
-  if (swiper.initialized) {
-    preload(swiper);
-  }
   swiper.emit('activeIndexChange');
   swiper.emit('snapIndexChange');
   if (previousRealIndex !== realIndex) {
@@ -1443,7 +1409,6 @@ function getSwiperTranslate(axis = this.isHorizontal() ? 'x' : 'y') {
     return translate;
   }
   let currentTranslate = getTranslate(wrapperEl, axis);
-  currentTranslate += swiper.cssOverflowAdjustment();
   if (rtl) currentTranslate = -currentTranslate;
   return currentTranslate || 0;
 }
@@ -1468,18 +1433,13 @@ function setTranslate(translate, byController) {
     x = Math.floor(x);
     y = Math.floor(y);
   }
-  swiper.previousTranslate = swiper.translate;
-  swiper.translate = swiper.isHorizontal() ? x : y;
   if (params.cssMode) {
     wrapperEl[swiper.isHorizontal() ? 'scrollLeft' : 'scrollTop'] = swiper.isHorizontal() ? -x : -y;
   } else if (!params.virtualTranslate) {
-    if (swiper.isHorizontal()) {
-      x -= swiper.cssOverflowAdjustment();
-    } else {
-      y -= swiper.cssOverflowAdjustment();
-    }
     wrapperEl.style.transform = `translate3d(${x}px, ${y}px, ${z}px)`;
   }
+  swiper.previousTranslate = swiper.translate;
+  swiper.translate = swiper.isHorizontal() ? x : y;
 
   // Check if we need to update progress
   let newProgress;
@@ -2072,22 +2032,15 @@ function loopFix({
   }
   if (isPrev) {
     prependSlidesIndexes.forEach(index => {
-      swiper.slides[index].swiperLoopMoveDOM = true;
       slidesEl.prepend(swiper.slides[index]);
-      swiper.slides[index].swiperLoopMoveDOM = false;
     });
   }
   if (isNext) {
     appendSlidesIndexes.forEach(index => {
-      swiper.slides[index].swiperLoopMoveDOM = true;
       slidesEl.append(swiper.slides[index]);
-      swiper.slides[index].swiperLoopMoveDOM = false;
     });
   }
   swiper.recalcSlides();
-  if (params.slidesPerView === 'auto') {
-    swiper.updateSlides();
-  }
   if (params.watchSlidesProgress) {
     swiper.updateSlidesOffset();
   }
@@ -2716,6 +2669,7 @@ function onTouchEnd(event) {
   }
 }
 
+let timeout;
 function onResize() {
   const swiper = this;
   const {
@@ -2754,8 +2708,8 @@ function onResize() {
     }
   }
   if (swiper.autoplay && swiper.autoplay.running && swiper.autoplay.paused) {
-    clearTimeout(swiper.autoplay.resizeTimeout);
-    swiper.autoplay.resizeTimeout = setTimeout(() => {
+    clearTimeout(timeout);
+    timeout = setTimeout(() => {
       if (swiper.autoplay && swiper.autoplay.running && swiper.autoplay.paused) {
         swiper.autoplay.resume();
       }
@@ -2812,12 +2766,19 @@ function onScroll() {
   swiper.emit('setTranslate', swiper.translate, false);
 }
 
+const processLazyPreloader = (swiper, imageEl) => {
+  if (!swiper || swiper.destroyed || !swiper.params) return;
+  const slideSelector = () => swiper.isElement ? `swiper-slide` : `.${swiper.params.slideClass}`;
+  const slideEl = imageEl.closest(slideSelector());
+  if (slideEl) {
+    const lazyEl = slideEl.querySelector(`.${swiper.params.lazyPreloaderClass}`);
+    if (lazyEl) lazyEl.remove();
+  }
+};
+
 function onLoad(e) {
   const swiper = this;
   processLazyPreloader(swiper, e.target);
-  if (swiper.params.cssMode || swiper.params.slidesPerView !== 'auto' && !swiper.params.autoHeight) {
-    return;
-  }
   swiper.update();
 }
 
@@ -3227,7 +3188,6 @@ const defaults = {
   slidePrevClass: 'swiper-slide-prev',
   wrapperClass: 'swiper-wrapper',
   lazyPreloaderClass: 'swiper-lazy-preloader',
-  lazyPreloadPrevNext: 0,
   // Callbacks
   runCallbacksOnInit: true,
   // Internals
@@ -3381,11 +3341,6 @@ class Swiper {
       progress: 0,
       velocity: 0,
       animating: false,
-      cssOverflowAdjustment() {
-        // Returns 0 unless `translate` is > 2**23
-        // Should be subtracted from css values to prevent overflow
-        return Math.trunc(this.translate / 2 ** 23) * 2 ** 23;
-      },
       // Locks
       allowSlideNext: swiper.params.allowSlideNext,
       allowSlidePrev: swiper.params.allowSlidePrev,
@@ -3402,7 +3357,7 @@ class Swiper {
         // Form elements to match
         focusableElements: swiper.params.focusableElements,
         // Last click time
-        lastClickTime: 0,
+        lastClickTime: now(),
         clickTimeout: undefined,
         // Velocities
         velocities: [],
@@ -3597,8 +3552,7 @@ class Swiper {
       }
     } else {
       if ((swiper.params.slidesPerView === 'auto' || swiper.params.slidesPerView > 1) && swiper.isEnd && !swiper.params.centeredSlides) {
-        const slides = swiper.virtual && swiper.params.virtual.enabled ? swiper.virtual.slides : swiper.slides;
-        translated = swiper.slideTo(slides.length - 1, 0, false, true);
+        translated = swiper.slideTo(swiper.slides.length - 1, 0, false, true);
       } else {
         translated = swiper.slideTo(swiper.activeIndex, 0, false, true);
       }
@@ -3750,11 +3704,9 @@ class Swiper {
         });
       }
     });
-    preload(swiper);
 
     // Init Flag
     swiper.initialized = true;
-    preload(swiper);
 
     // Emit
     swiper.emit('init');
@@ -3847,10 +3799,12 @@ exports.Swiper = Swiper;
 exports.createElement = createElement;
 exports.elementChildren = elementChildren;
 exports.elementIndex = elementIndex;
+exports.elementOffset = elementOffset;
 exports.elementOuterSize = elementOuterSize;
 exports.elementParents = elementParents;
 exports.elementTransitionEnd = elementTransitionEnd;
 exports.getDocument = getDocument;
 exports.getSlideTransformEl = getSlideTransformEl;
 exports.isObject = isObject;
+exports.nextTick = nextTick;
 exports.now = now;

package/dist/cjs/dropdown-item.cjs.entry.js

@@ -2,20 +2,20 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-266d5edd.js');
+const index = require('./index-88135a6b.js');
 
 const dropdownItemCss = ".dropdown-item{transition:background-color ease-out 250ms;max-width:240px}@media only screen and (min-width: 480px){.dropdown-item{max-width:400px}}@media only screen and (min-width: 992px){.dropdown-item{max-width:650px}}.dropdown-item:hover,.dropdown-item:active,.dropdown-item:focus,.dropdown-item:focus-visible{background-color:var(--color-gray-02)}.dropdown-item span{display:block;padding:0.75rem 1.5rem;font-family:\"Raleway\";font-style:normal;font-weight:var(--ptc-font-weight-regular);font-size:var(--ptc-font-size-x-small);line-height:var(--ptc-line-height-dense);color:var(--color-gray-12);text-decoration:none}.dropdown-item span:hover,.dropdown-item span:visited,.dropdown-item span:active,.dropdown-item span:focus,.dropdown-item span:focus-visible{color:var(--color-gray-12)}";
 
-const DropdownItem = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.linkHref = undefined;
-    this.linkTarget = '_self';
-  }
-  render() {
-    return (index.h("div", { class: "dropdown-item" }, index.h("slot", null)));
-  }
-};
+const DropdownItem = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.linkHref = undefined;
+    this.linkTarget = '_self';
+  }
+  render() {
+    return (index.h("div", { class: "dropdown-item" }, index.h("slot", null)));
+  }
+};
 DropdownItem.style = dropdownItemCss;
 
 exports.dropdown_item = DropdownItem;

package/dist/cjs/dynamic-box-bundle.cjs.entry.js

@@ -2,35 +2,35 @@
 
 Object.defineProperty(exports, '__esModule', { value: true });
 
-const index = require('./index-266d5edd.js');
+const index = require('./index-88135a6b.js');
 
 const dynamicBoxBundleCss = ":host{display:block}:host .d-box{width:100%;height:550px;position:relative}:host .d-box.hovering .top-image{background-image:linear-gradient(0deg, rgba(242, 242, 242, 0), #f3f3f3)}:host .d-box.hovering .content{height:100%}:host .top-image{position:relative;display:flex;justify-content:center;align-items:center;height:20%;z-index:99}:host .top-image img{width:405px;height:40px}@media only screen and (min-width: 992px){:host .top-image img{height:35px}}:host .content{height:80%;box-shadow:0 0 0 1px #f3f3f3;width:100%;position:absolute;bottom:0px;left:0px}:host p{font-weight:var(--ptc-font-weight-regular);font-size:var(--ptc-font-size-small);line-height:var(--ptc-line-height-p);margin:0px;padding:40px;box-sizing:border-box}@media only screen and (min-width: 1200px){:host p{padding:40px}}";
 
-const DynamicBoxBundle = class {
-  constructor(hostRef) {
-    index.registerInstance(this, hostRef);
-    this.topImgSrc = 'https://www.ptc.com/-/media/Images/new-org/logos/PTC-logo.svg';
-    this.topImgAlt = 'image';
-    this.boxHeight = undefined;
-    this.isHovering = false;
-  }
-  handleMouseOver() {
-    if (window.innerWidth >= 1200) {
-      this.isHovering = true;
-      //this.el.style.height = `${this.el.offsetHeight + 50}px`;
-    }
-  }
-  handleMouseOut() {
-    if (window.innerWidth >= 1200) {
-      this.isHovering = false;
-      //this.el.style.height = '';
-    }
-  }
-  render() {
-    return (index.h(index.Host, null, index.h("div", { class: `d-box ${this.isHovering && window.innerWidth >= 1200 ? 'hovering' : ''}` }, index.h("div", { class: "top-image" }, index.h("img", { src: this.topImgSrc, alt: this.topImgAlt })), index.h("div", { class: "content" }, index.h("slot", { name: "media" }))), index.h("p", null, index.h("slot", null))));
-  }
-  get el() { return index.getElement(this); }
-};
+const DynamicBoxBundle = class {
+  constructor(hostRef) {
+    index.registerInstance(this, hostRef);
+    this.topImgSrc = 'https://www.ptc.com/-/media/Images/new-org/logos/PTC-logo.svg';
+    this.topImgAlt = 'image';
+    this.boxHeight = undefined;
+    this.isHovering = false;
+  }
+  handleMouseOver() {
+    if (window.innerWidth >= 1200) {
+      this.isHovering = true;
+      //this.el.style.height = `${this.el.offsetHeight + 50}px`;
+    }
+  }
+  handleMouseOut() {
+    if (window.innerWidth >= 1200) {
+      this.isHovering = false;
+      //this.el.style.height = '';
+    }
+  }
+  render() {
+    return (index.h(index.Host, null, index.h("div", { class: `d-box ${this.isHovering && window.innerWidth >= 1200 ? 'hovering' : ''}` }, index.h("div", { class: "top-image" }, index.h("img", { src: this.topImgSrc, alt: this.topImgAlt })), index.h("div", { class: "content" }, index.h("slot", { name: "media" }))), index.h("p", null, index.h("slot", null))));
+  }
+  get el() { return index.getElement(this); }
+};
 DynamicBoxBundle.style = dynamicBoxBundleCss;
 
 exports.dynamic_box_bundle = DynamicBoxBundle;