'use client';
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var jsxRuntime=require("react/jsx-runtime"),React=require("react"),core=require("@gem-sdk/core"),Row=require("../../grid/components/row/Row.js"),system=require("@gem-sdk/system"),AdaptiveImage=require("../../image/components/AdaptiveImage.js"),HTML5Embed=require("../../video/components/HTML5Embed.js"),styles=require("../common/styles.js"),classes=require("../common/classes.js"),helpers=require("../common/helpers.js"),LiteYouTubeEmbed=require("../../video/components/LiteYouTubeEmbed.js"),helpers$1=require("../../video/common/helpers.js"),useHeroBannerItem=require("../hooks/useHeroBannerItem.js"),classes$1=require("../../video/common/classes.js");const HeroBannerItem=e=>{core.useEditorMode();let{setting:s,styles:t,children:l,elementRef:a,transform:r,dataVideo:o,bgRef:i,isShowVideoHtml5:m,layoutResponsive:u,heroBannerWrapperRef:c}=e,{layout:n,verticalAlign:d,enableParallax:y,alt:p,title:g}=s??{},{background:v,overlayColor:C,verticalGutter:j,sizeSetting:b,contentWidth:h,hoverEffect:f,contentPosition1Col:x,contentPosition2Col:R,videoObjectFit:S}=t??{},I=system.createStyle({...styles.getContainerStyle(t)}),B=system.createClass({...classes.getContainerClasses(s,t)}),H=system.createStyle({...styles.getOverlayStyle(t)}),T=system.createClass({...classes.getOverlayClasses(t)}),q=system.createStyle({...styles.getRowStyle(t)}),k=system.createClass({...classes.getRowClasses(t,s)}),w=system.createStyle({...styles.getAdaptiveStyle(t)}),Y=system.createClass({...classes.getAdaptivePictureClasses()}),V=system.createClass({...classes.getAdaptiveClasses()}),A=system.createClass({...classes.getBackgroundClasses(f,!1)}),L=system.createStyle({...helpers.getBackgroundImageHeroBanner(v,!1,!0),...styles.getBackgroundStyle(t,y,r)}),M=system.createClass({...classes.getContainBackgroundClasses()}),N=system.createStyle({...styles.getContainBackgroundStyle(t)}),E=system.createClass({...classes.getHtml5VideoClasses(!m)}),{youtubeIframeWrapperRef:$,resolvedAspectRatio:z,youtubeAspectRatio:O}=useHeroBannerItem.default({videoType:o?.videoType,sizeSetting:b,background:v,videoObjectFit:S,heroBannerWrapperRef:c,isYoutubeVideoMigrated:s?.isYoutubeVideoMigrated}),P=system.createStyle({...styles.getYoutubeIframeStyle(O,S)}),W=system.createStyle({...styles.getHtml5VideoStyle(z,S,v)}),_=system.createClass({...classes.getWrapperYoutubeClasses(s?.isYoutubeVideoMigrated)}),G=system.createClass({...classes.getIframeYoutubeClasses()}),D=system.createClass({...classes$1.getYoutubeContentClasses()}),F=React.useMemo(()=>{if(!helpers.showVideoType(v))return;if(o?.videoType==="html5"&&!o.videoHtml5||o?.videoType==="youtube"&&!o.video)return null;if(o?.type==="video"&&o?.videoType==="html5"&&o?.videoHtml5)return jsxRuntime.jsx(HTML5Embed.default,{muted:!0,loop:o?.loop,controls:!1,autoplay:!0,src:o?.videoHtml5||"",title:"Video",style:W,className:E});let e=o?.video??"",s=helpers$1.getYoutubeVideoId(e),t=o?.loop?1:0,l=`&loop=${t}&playlist=${s}&showinfo=0&rel=0&fs=0&enablejsapi=1`;if(o?.type==="video"&&o?.videoType==="youtube"&&s&&helpers$1.youtubeVideoRegex.test(e))return jsxRuntime.jsx("div",{className:D,ref:$,children:jsxRuntime.jsx(LiteYouTubeEmbed.default,{id:s,isHeroBanner:!0,autoplay:!0,title:"Video",controls:!1,params:l,adNetwork:!1,noCookie:!0,muted:!0,lazy:o?.lazyLoad??!0,style:P,wrapperClass:_,iframeClass:G})})},[o,v,E,G,_,P,W,$]);return jsxRuntime.jsxs("div",{className:B,style:I,children:[jsxRuntime.jsxs("div",{ref:a,className:M,style:N,children:[jsxRuntime.jsx("div",{ref:i,className:A,style:L,children:F}),!!C&&jsxRuntime.jsx("div",{"aria-label":"Overlay",className:T,style:H})]}),jsxRuntime.jsx(Row.default,{className:k,style:q,setting:{layout:n,horizontalAlign:helpers.horizontalAlign(n,x,R),verticalAlign:d},styles:{verticalGutter:j,width:helpers.getWidth(h),fullWidth:{desktop:!1,tablet:!1,mobile:!1}},hiddenEmptyCol:u?.cols?.length===1,onBlur:e=>helpers.scrollToContentBanner(e),children:core.filterToolbarPreview(l)}),jsxRuntime.jsx(AdaptiveImage.default,{pictureClass:Y,srcSet:helpers.getBgImage(v),className:V,aspectRatio:core.getAspectRatioGlobalSize(b),style:w,alt:p,title:g,enableLazyLoadImage:!1,fallbackImg:helpers.fallbackImg})]})};exports.default=HeroBannerItem;
