@designcrowd/library.brand-page 5.18.9 → 5.19.1-error-html2canvas-1

package/lib/src/brand-page/components/testimonial-section/TestimonialSection.mixin.js

@@ -1,112 +0,0 @@
-import { defineComponent } from 'vue';
-import ComponentCommonMixin from '../mixins/component-common.mixin';
-import { getRenderText } from '@brand-page/utils';
-import debounce from 'lodash.debounce';
-import { DEVICE_CSS_TRANSITION_DELAY } from '@brand-page-maker/constants';
-const DEBOUNCE_WAIT_MS = 100;
-export default defineComponent({
-    mixins: [ComponentCommonMixin],
-    props: {
-        viewModel: {
-            type: Object,
-            required: true,
-        },
-        isPreview: {
-            type: Boolean,
-            required: false,
-            default: false,
-        },
-        context: {
-            type: Object,
-            required: true,
-        },
-        contentIndex: {
-            type: Number,
-            required: false,
-            default: undefined,
-        },
-    },
-    data() {
-        return {
-            debouncedForceCarouselUpdate: undefined,
-            carouselRef: 'testimonial-carousel',
-        };
-    },
-    created() {
-        this.debouncedForceCarouselUpdate = debounce(() => {
-            this.forceCarouselUpdate();
-        }, DEBOUNCE_WAIT_MS);
-    },
-    computed: {
-        textAlignClass() {
-            return {
-                'c_testimonial-big-image-text-item': this.viewModel.displayStyle === 'big-image',
-                'tw-mb-2': this.viewModel.displayStyle !== 'big-image',
-            };
-        },
-        navigationUniqueIndexer() {
-            return `testimonial-${this.viewModel.id}`;
-        },
-        swiperOptions() {
-            return {
-                autoHeight: true,
-                navigation: {
-                    prevEl: `.carousel__button-prev--${this.navigationUniqueIndexer}`,
-                    nextEl: `.carousel__button-next--${this.navigationUniqueIndexer}`,
-                },
-                pagination: {
-                    el: `.pagination--${this.navigationUniqueIndexer}`,
-                    clickable: true,
-                },
-            };
-        },
-    },
-    methods: {
-        renderText(val) {
-            if (val) {
-                return getRenderText(val);
-            }
-            return '';
-        },
-        forceCarouselUpdate() {
-            const shouldUpdateCarousel = Boolean(this.isPreview &&
-                (this.viewModel.items.length > 1 ||
-                    this.viewModel.displayStyle === 'big-image') &&
-                this.$refs[this.carouselRef]);
-            if (shouldUpdateCarousel) {
-                this.$refs[this.carouselRef].update();
-                return true;
-            }
-            return false;
-        },
-        forceCarouselUpdateSlideWidth() {
-            if (this.forceCarouselUpdate()) {
-                try {
-                    const width = this.$refs[this.carouselRef].swiper.slidesEl.scrollWidth;
-                    this.$refs[this.carouselRef].swiper.slidesEl.children.forEach((slide) => {
-                        const slideWidth = parseFloat(slide.style.width);
-                        if (slideWidth !== width) {
-                            slide.style.width = width + 'px';
-                        }
-                    });
-                }
-                catch (error) {
-                    console.warn('Testimonial: Unable to auto update slide width');
-                }
-            }
-        },
-    },
-    watch: {
-        viewModel: {
-            handler() {
-                this.debouncedForceCarouselUpdate();
-            },
-            deep: true,
-        },
-        isMobileDevice(next, old) {
-            if (next !== old) {
-                setTimeout(this.forceCarouselUpdateSlideWidth, DEVICE_CSS_TRANSITION_DELAY + 1);
-            }
-        },
-    },
-});

package/src/brand-page/components/testimonial-section/TestimonialSection.mixin.ts

@@ -1,132 +0,0 @@
-import { defineComponent } from 'vue';
-import type { PropType } from 'vue';
-import ComponentCommonMixin from '../mixins/component-common.mixin';
-import type { TestimonialSectionViewModel } from '@brand-page/view-models';
-import type { BrandPageContext } from '@brand-page/models';
-import { getRenderText } from '@brand-page/utils';
-import type { DebounceHandle } from 'lodash.debounce';
-import debounce from 'lodash.debounce';
-import { DEVICE_CSS_TRANSITION_DELAY } from '@brand-page-maker/constants';
-
-const DEBOUNCE_WAIT_MS = 100;
-
-export default defineComponent({
-  mixins: [ComponentCommonMixin],
-  props: {
-    viewModel: {
-      type: Object as PropType<TestimonialSectionViewModel>,
-      required: true,
-    },
-    isPreview: {
-      type: Boolean,
-      required: false,
-      default: false,
-    },
-    context: {
-      type: Object as PropType<BrandPageContext>,
-      required: true,
-    },
-    contentIndex: {
-      type: Number,
-      required: false,
-      default: undefined,
-    },
-  },
-  data() {
-    return {
-      debouncedForceCarouselUpdate: undefined as DebounceHandle | undefined,
-      carouselRef: 'testimonial-carousel',
-    };
-  },
-  created() {
-    this.debouncedForceCarouselUpdate = debounce(() => {
-      this.forceCarouselUpdate();
-    }, DEBOUNCE_WAIT_MS);
-  },
-  computed: {
-    textAlignClass() {
-      return {
-        'c_testimonial-big-image-text-item':
-          this.viewModel.displayStyle === 'big-image',
-        'tw-mb-2': this.viewModel.displayStyle !== 'big-image',
-      };
-    },
-    navigationUniqueIndexer() {
-      return `testimonial-${this.viewModel.id}`;
-    },
-    swiperOptions() {
-      return {
-        autoHeight: true,
-        navigation: {
-          prevEl: `.carousel__button-prev--${this.navigationUniqueIndexer}`,
-          nextEl: `.carousel__button-next--${this.navigationUniqueIndexer}`,
-        },
-        pagination: {
-          el: `.pagination--${this.navigationUniqueIndexer}`,
-          clickable: true,
-        },
-      };
-    },
-  },
-  methods: {
-    renderText(val: string): string {
-      if (val) {
-        return getRenderText(val);
-      }
-
-      return '';
-    },
-    forceCarouselUpdate() {
-      const shouldUpdateCarousel = Boolean(
-        this.isPreview &&
-          (this.viewModel.items.length > 1 ||
-            this.viewModel.displayStyle === 'big-image') &&
-          this.$refs[this.carouselRef],
-      );
-
-      if (shouldUpdateCarousel) {
-        this.$refs[this.carouselRef].update();
-
-        return true;
-      }
-
-      return false;
-    },
-    forceCarouselUpdateSlideWidth() {
-      if (this.forceCarouselUpdate()) {
-        try {
-          const width =
-            this.$refs[this.carouselRef].swiper.slidesEl.scrollWidth;
-
-          this.$refs[this.carouselRef].swiper.slidesEl.children.forEach(
-            (slide: HTMLElement) => {
-              const slideWidth = parseFloat(slide.style.width);
-
-              if (slideWidth !== width) {
-                slide.style.width = width + 'px';
-              }
-            },
-          );
-        } catch (error) {
-          console.warn('Testimonial: Unable to auto update slide width');
-        }
-      }
-    },
-  },
-  watch: {
-    viewModel: {
-      handler() {
-        this.debouncedForceCarouselUpdate();
-      },
-      deep: true,
-    },
-    isMobileDevice(next, old) {
-      if (next !== old) {
-        setTimeout(
-          this.forceCarouselUpdateSlideWidth,
-          DEVICE_CSS_TRANSITION_DELAY + 1,
-        );
-      }
-    },
-  },
-});