@tycoonsystems/tycoon-modules
Version:
www.tv.tycoon.systems/documentation
1 lines • 3.37 kB
JavaScript
function _extends(){return(_extends=Object.assign?Object.assign.bind():function(e){for(var t=1;t<arguments.length;t++){var a,l=arguments[t];for(a in l)Object.prototype.hasOwnProperty.call(l,a)&&(e[a]=l[a])}return e}).apply(this,arguments)}import React from"react";import Styles from"./MarketingSlider.module.scss";import Slider from"react-slick";import presentationStyles from"../Presentation.module.scss";import{v4 as uuidv4}from"uuid";import Link from"next/link";const moduleName="MarketingSlider",Module=l=>{const[t,a]=React.useState(!1),[e,n]=React.useState(null);React.useEffect(()=>{var e;t||(e=uuidv4(),n(e),a(!0))},[t]);var r=l?.data?.items?.map?l.data:[];return React.createElement("div",null,React.createElement("div",{className:`${presentationStyles.IndexHelloContainer} glide_${e} ${moduleName}_IndexHelloContainer `+l.className,style:l?.style},l.groupLabel?React.createElement("div",{className:`${presentationStyles.GroupLabelContainer} ${Styles.GroupLabelContainer} ${moduleName}_groupLabelContainer `+l.groupLabelContainerClassName,style:{maxWidth:l?.sliderMaxWidth??"1800px"}},React.createElement("div",{className:`${presentationStyles.GroupLabel} ${Styles.GroupLabel} ${moduleName}_groupLabel `+l.groupLabelClassName},l.groupLabel)):null,React.createElement("div",{style:{marginTop:"2rem",maxWidth:l?.sliderMaxWidth??"1800px"},"data-glide-el":"track",className:presentationStyles.GlideTrack+" glide__track"},React.createElement("div",{className:moduleName+"_IndexItemsContainer "+l.IndexItemsContainerClassName},r?.items?.map((e,t)=>{a=e.length;var a={infinite:!1,speed:500,swipeToSlide:!0,arrows:!1,responsive:l?.responsive??[{breakpoint:4e3,settings:{slidesToShow:a<6?a:6,touchThreshold:120}},{breakpoint:1920,settings:{slidesToShow:a<5?a:5,touchThreshold:100}},{breakpoint:1680,settings:{slidesToShow:a<4?a:4,touchThreshold:80}},{breakpoint:1280,settings:{slidesToShow:a<3?a:3,touchThreshold:60}},{breakpoint:900,settings:{slidesToShow:a<2?a:2,touchThreshold:40}},{breakpoint:570,settings:{slidesToShow:1,touchThreshold:20}}]};return React.createElement(Slider,_extends({},a,{i:t}),e?.map?e.map((e,t)=>React.createElement("div",{style:{margin:"1rem"},key:t},React.createElement("div",{className:`${l.tall?""+presentationStyles.IndexItemsUpperContainerTall:null} ${moduleName}_Container `+e?.className,style:{margin:"1rem"}},React.createElement("div",{className:`${Styles.bgContainer} ${l.tall?""+Styles.BgContainerTall:null} ${moduleName}_BgContainer `+l.bgClassName,style:{background:e?.img?`url(${e?.img})`:e?.bg??null,backgroundSize:"cover !important",backgroundPosition:"center",height:l?.itemHeight??"22rem"}},e?.upperText?React.createElement("div",{className:Styles.upperText+" MarketingSlider_UpperText"},e.upperText):null,e?.lead?React.createElement("div",{className:Styles.lead+" MarketingSlider_Lead"},e.lead):null,e?.text?React.createElement("div",{className:Styles.text+" MarketingSlider_Text"},e.text):null,e.linkText?React.createElement(Link,{href:e.link},e.linkText):null,e?.children?.map?React.Children.map(e.children,function(e){return null!==e?"function"==typeof e.type?React.cloneElement(e,l):e:React.createElement("div")}):null),React.createElement("div",null,React.createElement("div",{className:`${presentationStyles.MetaContainer} ${moduleName}_MetaContainer `+l.metaContainerClassName}))))):null)})))))};export default Module;