@ptcwebops/ptcw-design 6.3.11 → 6.3.12-beta

package/dist/collection/components/organism-bundles/ptc-icon-card-slider-example/ptc-icon-card-slider-example.js

@@ -1,77 +0,0 @@
-import { Host, h } from '@stencil/core';
-import Swiper, { Navigation, Pagination, Scrollbar, Mousewheel } from 'swiper';
-export class PtcIconCardSliderExample {
-  componentDidLoad() {
-    setTimeout(() => {
-      let list = this.el.querySelector('.ptc-icon-slider-cards');
-      // let slides = list.querySelectorAll('.swiper-wrapper .swiper-slide');
-      // const marginRight = 40; // Margin-right in pixels
-      // const totalMargins = (slides.length) * marginRight; // Total margin space for all slides
-      // const containerWidth = list.clientWidth - totalMargins; // Available width after margins
-      // if (slides.length < 4) {
-      //     console.log('Less than 4 slides detected. Adjusting widths...');
-      //     slides.forEach((slide) => {
-      //         (slide as HTMLElement).style.flex = `1 0 ${containerWidth / Math.min(3, slides.length)}px`;
-      //     });
-      // }
-      this.listSwp = new Swiper(list, {
-        modules: [Navigation, Pagination, Scrollbar, Mousewheel],
-        slidesPerView: 'auto',
-        spaceBetween: 24,
-        centeredSlidesBounds: true,
-        initialSlide: 0,
-        centerInsufficientSlides: false,
-        freeMode: true,
-        scrollbar: {
-          el: this.swiperPaginationRef,
-          draggable: true,
-        },
-        navigation: {
-          nextEl: this.swiperButtonNextRef,
-          prevEl: this.swiperButtonPrevRef,
-        },
-        mousewheel: {
-          forceToAxis: true,
-          sensitivity: 100,
-        },
-        breakpoints: {
-          992: {
-            slidesPerView: 4,
-            spaceBetween: 24,
-          },
-          1200: {
-            spaceBetween: 32,
-          },
-          1440: {
-            spaceBetween: 40,
-          },
-        },
-        // on: {
-        //     reachEnd: () => {
-        //         setTimeout(() => {
-        //             if (this.listSwp) {
-        //                 const currentTranslate = this.listSwp.translate;
-        //                 this.listSwp.setTranslate(currentTranslate - 16);
-        //             }
-        //         }, 100);
-        //     },
-        // }
-      });
-    }, 100);
-  }
-  render() {
-    return (h(Host, null, h("div", { class: "ptc-icon-slider-cards swiper-container" }, h("div", { class: "swiper-wrapper" }, h("slot", null)), h("div", { class: "swiper-scrollbar", ref: el => (this.swiperPaginationRef = el) }), h("div", { class: "swiper-button-next", ref: el => (this.swiperButtonNextRef = el) }, h("svg", { width: "14", height: "20", viewBox: "0 0 14 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M0.75 17.25L8 10L0.75 2.75L3.375 0.125L13.25 10L3.375 19.875L0.75 17.25Z", fill: "#323B42" }))), h("div", { class: "swiper-button-prev", ref: el => (this.swiperButtonPrevRef = el) }, h("svg", { width: "14", height: "20", viewBox: "0 0 14 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M13.25 2.75L6 10L13.25 17.25L10.625 19.875L0.749999 10L10.625 0.125L13.25 2.75Z", fill: "#323B42" }))))));
-  }
-  static get is() { return "ptc-icon-card-slider-example"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["ptc-icon-card-slider-example.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["ptc-icon-card-slider-example.css"]
-    };
-  }
-  static get elementRef() { return "el"; }
-}

package/dist/collection/components/organism-bundles/storefront-enhanced-product-list-example/storefront-enhanced-product-list-alt-example.js

@@ -1,63 +0,0 @@
-import { Host, h } from '@stencil/core';
-import Swiper, { Navigation, Pagination, Scrollbar, Mousewheel } from 'swiper';
-export class StorefrontEnhancedProductListAltExample {
-  constructor() {
-    this.componentDidLoad = () => {
-      setTimeout(() => {
-        let swiperContainer = this.el.querySelector('.enhanced-product-listing-cards');
-        this.swiper = new Swiper(swiperContainer, {
-          modules: [Navigation, Pagination, Scrollbar, Mousewheel],
-          slidesPerView: 'auto',
-          spaceBetween: 24,
-          initialSlide: 0,
-          centerInsufficientSlides: false,
-          scrollbar: {
-            el: this.swiperPaginationRef,
-            draggable: true,
-          },
-          navigation: {
-            nextEl: this.swiperButtonNextRef,
-            prevEl: this.swiperButtonPrevRef,
-          },
-          mousewheel: {
-            forceToAxis: true,
-            sensitivity: 100,
-          },
-          breakpoints: {
-            992: {
-              slidesPerView: 3,
-              spaceBetween: 24,
-            },
-            1200: {
-              slidesPerView: 3,
-              spaceBetween: 32,
-            },
-            1440: {
-              slidesPerView: 3,
-              spaceBetween: 40,
-            },
-          },
-        });
-        swiperContainer.addEventListener('ctaFocussed', (e) => {
-          let focusIndex = e.detail['card-index'];
-          this.swiper.slideTo(focusIndex);
-        });
-      }, 100);
-    };
-  }
-  render() {
-    return (h(Host, null, h("div", { class: "swiper-container enhanced-product-listing-cards" }, h("div", { class: "swiper-wrapper" }, h("slot", null)), h("div", { class: "swiper-scrollbar", ref: el => (this.swiperPaginationRef = el) }), h("div", { class: "swiper-button-next", ref: el => (this.swiperButtonNextRef = el) }, h("svg", { width: "14", height: "20", viewBox: "0 0 14 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M0.75 17.25L8 10L0.75 2.75L3.375 0.125L13.25 10L3.375 19.875L0.75 17.25Z", fill: "#323B42" }))), h("div", { class: "swiper-button-prev", ref: el => (this.swiperButtonPrevRef = el) }, h("svg", { width: "14", height: "20", viewBox: "0 0 14 20", fill: "none", xmlns: "http://www.w3.org/2000/svg" }, h("path", { d: "M13.25 2.75L6 10L13.25 17.25L10.625 19.875L0.749999 10L10.625 0.125L13.25 2.75Z", fill: "#323B42" }))))));
-  }
-  static get is() { return "storefront-enhanced-product-list-alt-example"; }
-  static get originalStyleUrls() {
-    return {
-      "$": ["storefront-enhanced-product-list-example.scss"]
-    };
-  }
-  static get styleUrls() {
-    return {
-      "$": ["storefront-enhanced-product-list-example.css"]
-    };
-  }
-  static get elementRef() { return "el"; }
-}