@total_onion/onion-library 2.0.145 → 2.0.147

package/createDynamicBlockScss-v3.js

@@ -2,27 +2,22 @@ require('dotenv').config();
 const fs = require('fs');
 const {globSync} = require('glob');
 const path = require('path');
-const themePath =
-	process.env.THEME_PATH || 'web/wp-content/themes/global-theme';
 
-// Create the directory path for the target file
-const scssModulePath = path.join(
-	'./node_modules/@total_onion/onion-library/public'
-);
+const scssModulePath = path.join('./public');
 const scssFilePath = path.join(scssModulePath, 'dynamicBlockScss-v3.scss');
 
-// Create directories if they don't exist
 fs.mkdirSync(scssModulePath, {recursive: true});
 
 // Write the initial content to the target file
 fs.writeFileSync(scssFilePath, '// This file is auto-generated.\n');
 
-const dynamicEntryPoints = globSync(
-	`${themePath}/node_modules/@total_onion/onion-library/components/block-*/*-v3.scss`
-).map((path) => {
-	const assetPath = path.replace('node_modules', 'NodeModules');
-	return assetPath;
-});
+const dynamicEntryPoints = globSync(`./components/block-*/*-v3.scss`).map(
+	(path) => {
+		console.log('🚀 ~ path:', path);
+		const assetPath = path.replace('components/', '../components/');
+		return assetPath;
+	}
+);
 
 const stream = fs.createWriteStream(scssFilePath, {flags: 'a'});
 dynamicEntryPoints.forEach((entry) => {

package/esbuild.mjs

@@ -5,6 +5,20 @@ import postcss from "postcss";
 import autoprefixer from "autoprefixer";
 import postcssPresetEnv from "postcss-preset-env";
 
+// Normalize entry points so anything under a leading "public/" doesn't
+// get mirrored as a nested "public/public" in the output. We do this by
+// using esbuild's object form of entryPoints to control the output paths.
+const entries = assets.reduce((acc, src) => {
+	// Remove a leading ./public/ (or public\\) from the output key only
+	// and trim any leading ./ so keys are clean relative paths.
+	let key = src.replace(/^[.\/\\]*public[\/\\]/, "").replace(/^[.\/\\]+/, "");
+	// If the source is an SCSS file, strip the .scss so esbuild doesn't output
+	// files like name.scss.css — it will append .css automatically for CSS entries.
+	key = key.replace(/\.scss$/i, "");
+	acc[key] = src;
+	return acc;
+}, {});
+
 await esbuild.build({
 	plugins: [
 		sassPlugin({
@@ -17,7 +31,7 @@ await esbuild.build({
 			},
 		}),
 	],
-	entryPoints: assets,
+	entryPoints: entries,
 	bundle: false,
 	outdir: "./public/",
 });

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "@total_onion/onion-library",
-	"version": "2.0.145",
+	"version": "2.0.147",
 	"description": "Component library",
 	"main": "index.js",
 	"scripts": {

package/public/assetList.mjs

@@ -1,37 +1,3 @@
-const dynamicAssets = [
-	"./components/block-video-content-v3/video-content-v3.scss",
-	"./components/block-sub-group-container-v3/sub-group-container-v3.scss",
-	"./components/block-sticky-buy-cta-v3/sticky-buy-cta-v3.scss",
-	"./components/block-standard-content-v3/standard-content-v3.scss",
-	"./components/block-spotify-embed-v3/spotify-embed-v3.scss",
-	"./components/block-spacer-v3/spacer-v3.scss",
-	"./components/block-social-networks-v3/social-networks-v3.scss",
-	"./components/block-smash-balloon-social-media-v3/smash-balloon-social-media-v3.scss",
-	"./components/block-site-title-and-tagline-v3/site-title-and-tagline-v3.scss",
-	"./components/block-site-logo-container-v3/site-logo-container-v3.scss",
-	"./components/block-site-copyright-notice-v3/site-copyright-notice-v3.scss",
-	"./components/block-single-responsive-image-v3/single-responsive-image-v3.scss",
-	"./components/block-single-column-container-v3/single-column-container-v3.scss",
-	"./components/block-section-separator-v3/section-separator-v3.scss",
-	"./components/block-scrolling-banner-v3/scrolling-banner-v3.scss",
-	"./components/block-responsive-table-v3/responsive-table-v3.scss",
-	"./components/block-product-info-v3/product-info-v3.scss",
-	"./components/block-post-type-filter-grid-v3/post-type-filter-grid-v3.scss",
-	"./components/block-post-info-v3/post-info-v3.scss",
-	"./components/block-nav-menu-container-v3/nav-menu-container-v3.scss",
-	"./components/block-modal-form-v3/modal-form-v3.scss",
-	"./components/block-market-selector-v3/market-selector-v3.scss",
-	"./components/block-lottie-content-v3/lottie-content-v3.scss",
-	"./components/block-group-container-v3/group-container-v3.scss",
-	"./components/block-gradient-layer-v3/gradient-layer-v3.scss",
-	"./components/block-form-selection-v3/form-selection-v3.scss",
-	"./components/block-featured-image-gallery-v3/featured-image-gallery-v3.scss",
-	"./components/block-divider-v3/divider-v3.scss",
-	"./components/block-cover-link-v3/cover-link-v3.scss",
-	"./components/block-carousel-multi-layout-v3/carousel-multi-layout-v3.scss",
-	"./components/block-block-interactions-v3/block-interactions-v3.scss",
-	"./components/block-betterreviews-display-v3/betterreviews-display-v3.scss",
-	"./components/block-accordion-v3/accordion-v3.scss",
-	"./components/block-accent-image-v3/accent-image-v3.scss",
-];
+
+const dynamicAssets = ["./components/block-video-content-v3/video-content-v3.scss","./components/block-sub-group-container-v3/sub-group-container-v3.scss","./components/block-sticky-buy-cta-v3/sticky-buy-cta-v3.scss","./components/block-standard-content-v3/standard-content-v3.scss","./components/block-spotify-embed-v3/spotify-embed-v3.scss","./components/block-spacer-v3/spacer-v3.scss","./components/block-social-networks-v3/social-networks-v3.scss","./components/block-smash-balloon-social-media-v3/smash-balloon-social-media-v3.scss","./components/block-site-title-and-tagline-v3/site-title-and-tagline-v3.scss","./components/block-site-logo-container-v3/site-logo-container-v3.scss","./components/block-site-copyright-notice-v3/site-copyright-notice-v3.scss","./components/block-single-responsive-image-v3/single-responsive-image-v3.scss","./components/block-single-column-container-v3/single-column-container-v3.scss","./components/block-section-separator-v3/section-separator-v3.scss","./components/block-scrolling-banner-v3/scrolling-banner-v3.scss","./components/block-responsive-table-v3/responsive-table-v3.scss","./components/block-product-info-v3/product-info-v3.scss","./components/block-post-type-filter-grid-v3/post-type-filter-grid-v3.scss","./components/block-post-info-v3/post-info-v3.scss","./components/block-nav-menu-container-v3/nav-menu-container-v3.scss","./components/block-modal-form-v3/modal-form-v3.scss","./components/block-market-selector-v3/market-selector-v3.scss","./components/block-lottie-content-v3/lottie-content-v3.scss","./components/block-group-container-v3/group-container-v3.scss","./components/block-gradient-layer-v3/gradient-layer-v3.scss","./components/block-form-selection-v3/form-selection-v3.scss","./components/block-featured-image-gallery-v3/featured-image-gallery-v3.scss","./components/block-divider-v3/divider-v3.scss","./components/block-cover-link-v3/cover-link-v3.scss","./components/block-cocktail-recipe-v3/cocktail-recipe-v3.scss","./components/block-carousel-multi-layout-v3/carousel-multi-layout-v3.scss","./components/block-block-interactions-v3/block-interactions-v3.scss","./components/block-betterreviews-display-v3/betterreviews-display-v3.scss","./components/block-back-to-top-button-v3/back-to-top-button-v3.scss","./components/block-accordion-v3/accordion-v3.scss","./components/block-accent-image-v3/accent-image-v3.scss","./components/block-video-content-v3/video-content-v3.js","./components/block-sub-group-container-v3/sub-group-container-v3.js","./components/block-sticky-buy-cta-v3/sticky-buy-cta-v3.js","./components/block-standard-content-v3/standard-content-v3.js","./components/block-spotify-embed-v3/spotify-embed-v3.js","./components/block-spacer-v3/spacer-v3.js","./components/block-social-networks-v3/social-networks-v3.js","./components/block-smash-balloon-social-media-v3/smash-balloon-social-media-v3.js","./components/block-site-title-and-tagline-v3/site-title-and-tagline-v3.js","./components/block-site-logo-container-v3/site-logo-container-v3.js","./components/block-site-copyright-notice-v3/site-copyright-notice-v3.js","./components/block-single-responsive-image-v3/single-responsive-image-v3.js","./components/block-single-column-container-v3/single-column-container-v3.js","./components/block-section-separator-v3/section-separator-v3.js","./components/block-scrolling-banner-v3/scrolling-banner-v3.js","./components/block-responsive-table-v3/responsive-table-v3.js","./components/block-product-info-v3/product-info-v3.js","./components/block-post-type-filter-grid-v3/post-type-filter-grid-v3.js","./components/block-post-info-v3/post-info-v3.js","./components/block-nav-menu-container-v3/nav-menu-container-v3.js","./components/block-modal-form-v3/modal-form-v3.js","./components/block-market-selector-v3/market-selector-v3.js","./components/block-lottie-content-v3/lottie-content-v3.js","./components/block-group-container-v3/group-container-v3.js","./components/block-gradient-layer-v3/gradient-layer-v3.js","./components/block-form-selection-v3/form-selection-v3.js","./components/block-featured-image-gallery-v3/featured-image-gallery-v3.js","./components/block-divider-v3/divider-v3.js","./components/block-cover-link-v3/cover-link-v3.js","./components/block-cocktail-recipe-v3/cocktail-recipe-v3.js","./components/block-carousel-multi-layout-v3/carousel-multi-layout-v3.js","./components/block-block-interactions-v3/block-interactions-v3.js","./components/block-betterreviews-display-v3/betterreviews-display-v3.js","./components/block-back-to-top-button-v3/back-to-top-button-v3.js","./components/block-accordion-v3/accordion-v3.js","./components/block-accent-image-v3/accent-image-v3.js","./public/dynamicBlockScss-v3.scss","./public/publicBundle.scss"];
 export default dynamicAssets;

package/public/block-accent-image-v3/accent-image-v3.js

@@ -0,0 +1,7 @@
+export default function accentimagev3Js(options = {}) {
+  try {
+    const { block } = options;
+  } catch (error) {
+    console.error(error);
+  }
+}

package/public/block-accordion-v3/accordion-v3.js

@@ -0,0 +1,117 @@
+export default function accordionv3Js(options = {}) {
+  try {
+    const { block } = options;
+    const blockClassName = block.dataset.assetkey;
+    const sections = block.querySelectorAll(
+      `.${blockClassName}-content`
+    );
+    const closeAccordionSections = () => {
+      sections.forEach((section) => {
+        if (section.classList.contains("active")) {
+          const question = section.querySelector(
+            `.${blockClassName}-question-wrapper`
+          );
+          const answer = section.querySelector(
+            `.${blockClassName}-answer-wrapper`
+          );
+          const svg = section.querySelector(
+            `.${blockClassName}-icon`
+          );
+          const iconImage = section.querySelector(
+            `.${blockClassName}-image-wrapper`
+          );
+          const sectionHeight = answer.scrollHeight;
+          answer.animate(
+            [
+              {
+                height: sectionHeight + "px"
+              },
+              { height: "0px" }
+            ],
+            {
+              fill: "forwards",
+              duration: 200,
+              easing: "ease-out"
+            }
+          );
+          answer.setAttribute("aria-hidden", "true");
+          question.classList.remove("active");
+          section.classList.remove("active");
+          if (svg) {
+            svg.classList.remove("active");
+          }
+          if (iconImage) {
+            iconImage.classList.remove("image-icon-active");
+          }
+        }
+      });
+    };
+    sections.forEach((section) => {
+      const question = section.querySelector(
+        `.${blockClassName}-question-wrapper`
+      );
+      const answer = section.querySelector(
+        `.${blockClassName}-answer-wrapper`
+      );
+      const svg = section.querySelector(`.${blockClassName}-icon`);
+      const iconImage = section.querySelector(
+        `.${blockClassName}-image-wrapper`
+      );
+      question.addEventListener("click", () => {
+        const isCollapsed = answer.getAttribute("aria-hidden") === "true";
+        closeAccordionSections();
+        if (isCollapsed) {
+          const sectionHeight = answer.scrollHeight;
+          answer.animate(
+            [
+              { height: "0px" },
+              {
+                height: sectionHeight + "px"
+              }
+            ],
+            {
+              fill: "forwards",
+              duration: 200,
+              easing: "ease-out"
+            }
+          );
+          section.classList.add("active");
+          answer.classList.add("active");
+          answer.setAttribute("aria-hidden", "false");
+          if (svg) {
+            svg.classList.add("active");
+          }
+          if (iconImage) {
+            iconImage.classList.add("image-icon-active");
+          }
+        } else {
+          const sectionHeight = answer.scrollHeight;
+          section.classList.remove("active");
+          answer.animate(
+            [
+              {
+                height: sectionHeight + "px"
+              },
+              { height: "0px" }
+            ],
+            {
+              fill: "forwards",
+              duration: 200,
+              easing: "ease-out"
+            }
+          );
+          answer.classList.remove("active");
+          answer.setAttribute("aria-hidden", "true");
+          if (svg) {
+            svg.classList.remove("active");
+          }
+          if (iconImage) {
+            iconImage.classList.remove("image-icon-active");
+          }
+        }
+      });
+    });
+  } catch (error) {
+    console.error(error);
+  }
+}

package/public/block-back-to-top-button-v3/back-to-top-button-v3.css

@@ -0,0 +1,62 @@
+.back-to-top-button {
+  position: relative;
+  width: 100%;
+  z-index: 50;
+  overflow: visible;
+  overflow: initial;
+}
+.back-to-top-button__arrow {
+  --arrow-colour: black;
+  position: absolute;
+  border-style: solid;
+  border-color: black;
+  border-color: var(--arrow-colour);
+  border-width: 0 2px 2px 0;
+  display: inline-block;
+  transform: rotate(-135deg);
+  height: 20%;
+  width: 20%;
+}
+.back-to-top-button__button {
+  --bg-colour: white;
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  position: fixed;
+  cursor: pointer;
+  height: calc(50 / var(--desktop-design-reference) * var(--screen-width-static));
+  width: calc(50 / var(--desktop-design-reference) * var(--screen-width-static));
+  border: none;
+  border-radius: 50px;
+  padding: calc(18 / var(--desktop-design-reference) * var(--screen-width-static));
+  background-color: white;
+  background-color: var(--bg-colour);
+  right: calc(10 / var(--design-reference) * var(--screen-width));
+  border-radius: var(--button-border-radius);
+}
+@media screen and (min-width: 768px) {
+  .back-to-top-button__button {
+    right: calc(30 / var(--design-reference) * var(--screen-width));
+  }
+}
+@media screen and (min-width: 1024px) {
+  .back-to-top-button__button {
+    right: calc(60 / var(--design-reference) * var(--screen-width));
+  }
+}
+.back-to-top-button__button--fixed {
+  position: fixed;
+  bottom: calc(60 / var(--desktop-design-reference) * var(--screen-width-static));
+}
+.back-to-top-button__button--absolute {
+  position: absolute;
+  translate: 0 -50%;
+}
+.wp-admin .back-to-top-button__button {
+  position: absolute;
+  translate: 0 0;
+  bottom: 0;
+}
+.back-to-top-button__image {
+  width: calc(var(--image-size) / var(--desktop-design-reference) * var(--screen-width-static));
+}

package/public/block-back-to-top-button-v3/back-to-top-button-v3.js

@@ -0,0 +1,12 @@
+export default function backtotopbuttonJs(options = {}) {
+  try {
+    const { block } = options;
+    const button = block.querySelector(".back-to-top-button__button");
+    button.addEventListener(
+      "click",
+      () => window.scrollTo({ top: 0, behavior: "smooth" })
+    );
+  } catch (error) {
+    console.error(error);
+  }
+}

package/public/block-betterreviews-display-v3/betterreviews-display-v3.js

@@ -0,0 +1,7 @@
+export default function betterreviewsdisplay3Js(options = {}) {
+  try {
+    const { block } = options;
+  } catch (error) {
+    console.error(error);
+  }
+}

package/public/block-block-interactions-v3/block-interactions-v3.js

@@ -0,0 +1,44 @@
+export default function blockinteractionsv3Js(options = {}) {
+  try {
+    let setCookie = function(name, value, days) {
+      const expires = new Date(Date.now() + days * 864e5).toUTCString();
+      document.cookie = `${name}=${encodeURIComponent(value)}; expires=${expires}; path=/`;
+    }, getCookie = function(name) {
+      return document.cookie.split("; ").reduce((result, cookieString) => {
+        const [key, val] = cookieString.split("=");
+        return key === name ? decodeURIComponent(val) : result;
+      }, "");
+    };
+    const { block } = options;
+    const blockId = block.dataset.blockid;
+    const parentBlockId = block.dataset.parentblockid;
+    const blockCloseButtons = block.querySelectorAll(".block-interactions-v3__block-close-button");
+    if (!blockCloseButtons.length) {
+      return;
+    }
+    blockCloseButtons.forEach((button) => {
+      const shouldStoreCookie = button?.dataset?.storeCookie === "true";
+      const cookieKey = `blockClosed_${parentBlockId}`;
+      const wrappingSection = document.querySelector(`[data-blockid="${parentBlockId}"]`);
+      if (getCookie(cookieKey) === "true") {
+        wrappingSection.style.animation = "none";
+        wrappingSection.style.display = "none";
+        return;
+      }
+      button.addEventListener("click", (e) => {
+        console.log(e.currentTarget.dataset);
+        wrappingSection.style.animation = "none";
+        wrappingSection.offsetHeight;
+        wrappingSection.style.animation = `${e.currentTarget.dataset.animationname} ${e.currentTarget.dataset.animationduration}s forwards reverse`;
+        setTimeout(() => {
+          wrappingSection.style.display = "none";
+        }, e.currentTarget.dataset.animationduration * 1e3);
+        if (shouldStoreCookie) {
+          setCookie(cookieKey, "true", 7);
+        }
+      });
+    });
+  } catch (error) {
+    console.error("Error in blockinteractionsv3Js:", error);
+  }
+}

package/public/block-carousel-multi-layout-v3/carousel-multi-layout-v3.js

@@ -0,0 +1,169 @@
+import { getSwiperAssetsV2 } from "@total_onion/onion-utils/onion-utils.mjs";
+import { Navigation, Pagination, Autoplay, EffectFade } from "swiper/modules";
+export default function carouselmultilayoutv3Js(options = {}) {
+  try {
+    const { block } = options;
+    const totalSlides = block.querySelectorAll(".swiper-slide").length || 1;
+    Promise.all([getSwiperAssetsV2()]).then((values) => {
+      const { Swiper } = values[0][0];
+      const dataAttributes = block.dataset;
+      const slidesDesktop = Number(dataAttributes.desktopslides);
+      const slidesDesktopFull = Number(dataAttributes.desktopslidesfull) || slidesDesktop;
+      const slidesTablet = Number(dataAttributes.tabletslides);
+      const slidesMobile = Number(dataAttributes.mobileslides);
+      const slidesOffsetDesktopBefore = Number(
+        dataAttributes.desktopslidesoffsetbefore
+      );
+      const slidesOffsetTabletBefore = Number(
+        dataAttributes.tabletslidesoffsetbefore
+      );
+      const slidesOffsetMobileBefore = Number(
+        dataAttributes.mobileslidesoffsetbefore
+      );
+      const slidesOffsetDesktopAfter = Number(
+        dataAttributes.desktopslidesoffsetafter
+      );
+      const slidesOffsetTabletAfter = Number(
+        dataAttributes.tabletslidesoffsetafter
+      );
+      const slidesOffsetMobileAfter = Number(
+        dataAttributes.mobileslidesoffsetafter
+      );
+      const loopSlides = Number(dataAttributes.loopslides) === 1;
+      const loopSlidesPortrait = Number(dataAttributes.loopslidesportrait) === 1;
+      const loopSlidesMobile = Number(dataAttributes.loopslidesmobile) === 1;
+      console.log(totalSlides > 1 ? loopSlides : false);
+      const spaceBetweenSlidesDesktop = Number(
+        dataAttributes.desktopspacebetweenslides
+      );
+      const spaceBetweenSlidesDesktopFull = Number(dataAttributes.desktopfullspacebetweenslides) || spaceBetweenSlidesDesktop;
+      const spaceBetweenSlidesMobile = Number(
+        dataAttributes.mobilespacebetweenslides
+      );
+      const spaceBetweenSlidesTablet = Number(
+        dataAttributes.tabletspacebetweenslides
+      );
+      const autoplayCarousel = Number(dataAttributes.autoplay) === 1;
+      const centerActiveSlide = Number(dataAttributes.centeractiveslide) === 1;
+      const centerActiveSlidePortrait = Number(dataAttributes.centeractiveslideportrait) === 1;
+      const centerActiveSlideMobile = Number(dataAttributes.centeractiveslidemobile) === 1;
+      const centerInsufficientSlidesDesktop = Number(dataAttributes.centerinsufficientslidesdesktop) === 1;
+      const centerInsufficientSlidesPortrait = Number(dataAttributes.centerinsufficientslidesportrait) === 1;
+      const centerInsufficientSlidesMobile = Number(dataAttributes.centerinsufficientslidesmobile) === 1;
+      const carouselEnableFreeMode = Number(dataAttributes.enablefreemode) === 1;
+      const carouselEnableMousewheel = Number(dataAttributes.enablemousewheel) === 1;
+      const delay = Number(dataAttributes.transitiondelay);
+      const speed = Number(dataAttributes.transitionspeed);
+      const transitionStyle = dataAttributes.transitionstyle === "default" ? "" : dataAttributes.transitionstyle;
+      const paginationStyle = dataAttributes.paginationstyle === "customnumber" ? "bullets" : dataAttributes.paginationstyle;
+      const fractionStyle = dataAttributes.fractionstyle;
+      const fractionString = dataAttributes.fractionstring;
+      const fractionSetting = fractionStyle === "text" ? function(currentClass, totalClass) {
+        return '<span class="' + currentClass + '"></span> ' + fractionString + ' <span class="' + totalClass + '"></span>';
+      } : false;
+      const customNumber = dataAttributes.paginationstyle === "customnumber" ? function(index, className) {
+        return '<div class="' + className + '"><span class="pagination-number">0' + (index + 1) + "</span></div>";
+      } : false;
+      const carouselmultilayoutv3Swiper = new Swiper(
+        block.querySelector(".swiper"),
+        {
+          modules: [
+            Navigation,
+            Pagination,
+            Autoplay,
+            EffectFade
+            // EffectCoverflow,
+            // EffectCreative,
+            // FreeMode,
+            // Mousewheel
+          ],
+          slidesPerView: slidesMobile,
+          spaceBetween: spaceBetweenSlidesMobile,
+          loop: totalSlides > 1 ? loopSlidesMobile : false,
+          preloadImages: true,
+          watchSlidesVisibility: true,
+          effect: transitionStyle,
+          creativeEffect: {
+            prev: {
+              shadow: true,
+              translate: [0, 0, -400]
+            },
+            next: {
+              translate: ["100%", 0, 0]
+            }
+          },
+          coverflowEffect: {
+            rotate: 20,
+            depth: 50,
+            scale: 0.9,
+            modifier: 1,
+            slideShadows: true
+          },
+          fadeEffect: {
+            crossFade: true
+          },
+          lazy: {
+            loadPrevNext: true
+          },
+          speed,
+          autoplay: autoplayCarousel ? {
+            delay
+          } : "",
+          watchOverflow: true,
+          centeredSlides: centerActiveSlideMobile,
+          centerInsufficientSlides: centerInsufficientSlidesMobile,
+          freeMode: {
+            enabled: carouselEnableFreeMode,
+            sticky: carouselEnableFreeMode
+          },
+          mousewheel: carouselEnableMousewheel,
+          slidesOffsetBefore: slidesOffsetMobileBefore,
+          slidesOffsetAfter: slidesOffsetMobileAfter,
+          breakpoints: {
+            744: {
+              spaceBetween: spaceBetweenSlidesTablet,
+              slidesPerView: slidesTablet,
+              centeredSlides: centerActiveSlidePortrait,
+              centerInsufficientSlides: centerInsufficientSlidesPortrait,
+              slidesOffsetBefore: slidesOffsetTabletBefore,
+              slidesOffsetAfter: slidesOffsetTabletAfter,
+              loop: totalSlides > 1 ? loopSlidesPortrait : false
+            },
+            1024: {
+              slidesPerView: slidesDesktop,
+              spaceBetween: spaceBetweenSlidesDesktop,
+              centeredSlides: centerActiveSlide,
+              centerInsufficientSlides: centerInsufficientSlidesDesktop,
+              slidesOffsetBefore: slidesOffsetDesktopBefore,
+              slidesOffsetAfter: slidesOffsetDesktopAfter,
+              loop: totalSlides > 1 ? loopSlides : false
+            },
+            1440: {
+              slidesPerView: slidesDesktopFull,
+              spaceBetween: spaceBetweenSlidesDesktopFull,
+              loop: totalSlides > 1 ? loopSlides : false
+            }
+          },
+          navigation: {
+            nextEl: block.querySelector(".swiper-button-next"),
+            prevEl: block.querySelector(".swiper-button-prev")
+          },
+          pagination: {
+            el: block.querySelector(".swiper-pagination"),
+            type: paginationStyle,
+            renderFraction: fractionSetting,
+            clickable: true,
+            renderBullet: customNumber
+          }
+        }
+      );
+      if (false) {
+        null.then((result) => {
+          result.default();
+        });
+      }
+    });
+  } catch (error) {
+    console.error(error);
+  }
+}