'use client';
"use strict";Object.defineProperty(exports,"__esModule",{value:!0});var e=require("react/jsx-runtime"),t=require("@gem-sdk/core"),s=require("../../image/components/NextImage.js"),a=require("../hooks/useLiteHtml5Embed.js"),l=require("@gem-sdk/system"),r=require("../common/classes.js"),i=require("../common/styles.js"),o=require("../common/attrs.js");exports.default=c=>{let m=t.useEditorMode(),u="edit"!==m,{thumbnail:n,muted:d,autoplay:g,loop:p,controls:x,src:j,style:y,title:C,className:b,lazy:h,poster:q,pageContext:v}=c,{playVideoAndTurnOffThumbnail:f,videoRef:N,showThumbnail:T}=a.default(g,d,j),k=!u&&g&&d&&!!n,I=!h&&c.isVideoComponent&&u,P=!n||!T,w=j||void 0,A=l.createAttr({...o.getHtml5Attr({title:C,autoplay:g,preloadThumbnail:k,offLazyLoad:I,src:j,thumbnail:n})}),M=l.createClass({...r.getWrapThumbnailClasses(P)}),S=l.createStyle({...i.getPreloadImageStyle()}),V=l.createClass({...r.getButtonThumbnailClasses()}),B=l.createClass({...r.getImageThumbnailClasses()}),E=l.createClass({...r.getVideoYoutubeClasses(b,I)});return e.jsxs(e.Fragment,{children:[k?e.jsx(s.default,{src:n,alt:C,priority:!0,style:S}):"",e.jsx("video",{ref:N,...A,style:y,className:E,controls:x,loop:p,muted:d,autoPlay:g,playsInline:!0,src:w}),!P&&e.jsxs("div",{role:"presentation",style:y,className:M,onClick:f,children:[e.jsx(s.default,{id:"video-thumbnail",src:n??"",alt:q?.altText,title:q?.imageTitle,priority:q?.preload&&u,className:B,isDisableAspectStyle:!0,pageContext:v}),e.jsx("button",{type:"button",className:V,"aria-label":"Play",children:e.jsx("svg",{className:"gp-w-5 gp-text-white",viewBox:"0 0 24 24",children:e.jsx("path",{fill:"currentColor",d:"M5 5.274c0-1.707 1.826-2.792 3.325-1.977l12.362 6.726c1.566.853 1.566 3.101 0 3.953L8.325 20.702C6.826 21.518 5 20.432 5 18.726V5.274Z"})})})]})]})};
