@cntrl-site/components 1.0.9 → 1.0.10

package/dist/index.js

@@ -3,7 +3,7 @@
  * Version  : 4.1.3
  * License  : MIT
  * Copyright: 2022 Naotoshi Fujita
- */const va="RichTextRenderer-module__link___BWeZ2",ba={link:va},xa=e=>{const t=e.trim();return!t||t.startsWith('"')&&t.endsWith('"')||t.startsWith("'")&&t.endsWith("'")?!1:t.split(/\s+/g).filter(Boolean).some(o=>/^\d/.test(o))},yn=e=>e&&e.split(",").map(n=>n.trim()).filter(Boolean).map(n=>xa(n)?`"${n.replace(/"/g,'\\"')}"`:n).join(", ");function ht(e){const{color:t,...n}=e;return n}function Re(e,t){var n,o,r;return{fontFamily:yn(e.fontSettings.fontFamily),fontWeight:e.fontSettings.fontWeight,fontStyle:e.fontSettings.fontStyle,letterSpacing:$.scalingValue(e.letterSpacing,t),wordSpacing:$.scalingValue(e.wordSpacing,t),fontSize:$.scalingValue(e.fontSize,t),lineHeight:e.lineHeight!==void 0?$.scalingValue(e.lineHeight,t):void 0,textTransform:(n=e.textAppearance)==null?void 0:n.textTransform,textDecoration:(o=e.textAppearance)==null?void 0:o.textDecoration,fontVariant:(r=e.textAppearance)==null?void 0:r.fontVariant,color:e.color}}const Mt=({content:e})=>{const t=n=>n.map((o,r)=>o.type==="link"?s.jsx("a",{className:ba.link,href:o.value,target:o.target,children:t(o.children)},r):s.jsx("span",{style:Sa(o),children:o.text},r));return s.jsx(s.Fragment,{children:e.map((n,o)=>{const r=n.children;return s.jsx("div",{children:t(r)},o)})})};function Sa(e){return{...e.fontFamily&&{fontFamily:yn(e.fontFamily)},...e.fontWeight&&{fontWeight:e.fontWeight},...e.fontStyle&&{fontStyle:e.fontStyle},...e.textDecoration&&{textDecoration:e.textDecoration},...e.textTransform&&{textTransform:e.textTransform},...e.fontVariant&&{fontVariant:e.fontVariant},...e.verticalAlign&&{verticalAlign:e.verticalAlign,lineHeight:"0px"}}}const Ca="SvgImage-module__svg___q3xE-",wa="SvgImage-module__img___VsTm-",vo={svg:Ca,img:wa},$a=e=>{const t=e.trim();return t.startsWith("data:image/svg+xml")?!0:(t.split(/[?#]/)[0]??t).endsWith(".svg")},Ta=e=>`url("${e.replace(/\\/g,"\\\\").replace(/"/g,'\\"')}")`,Ke=({url:e,fill:t="#000000",hoverFill:n="#CCCCCC",className:o="",style:r})=>{const[a,i]=w.useState(()=>typeof window>"u"?!0:CSS.supports("mask-image",'url("")')||CSS.supports("-webkit-mask-image",'url("")'));return w.useEffect(()=>{if(typeof window<"u"&&window.CSS){const u=CSS.supports("mask-image",'url("")')||CSS.supports("-webkit-mask-image",'url("")');i(u)}},[]),!$a(e)||!a?s.jsx("img",{src:e,alt:"",className:ye(vo.img,o),style:r}):s.jsx("span",{"data-supports-mask":a,className:ye(vo.svg,o),style:{"--svg":Ta(e),"--fill":t,"--hover-fill":n,...r??{}}})},_a={"top-left":J.topLeftAlignment,"top-center":J.topCenterAlignment,"top-right":J.topRightAlignment,"middle-left":J.middleLeftAlignment,"middle-center":J.middleCenterAlignment,"middle-right":J.middleRightAlignment,"bottom-left":J.bottomLeftAlignment,"bottom-center":J.bottomCenterAlignment,"bottom-right":J.bottomRightAlignment};function Ea({settings:e,content:t,styles:n,isEditor:o}){const[r,a]=w.useState(null),{widthSettings:i,fontSettings:u,letterSpacing:c,textAlign:m,wordSpacing:l,fontSizeLineHeight:A,textAppearance:S,color:g}=n.imageCaption,[p,d]=w.useState(void 0),[x,h]=w.useState(null),[y,_]=w.useState(0),[D,W]=w.useState(0),{direction:E,transition:b,controls:C,pagination:F,imageCaption:j,triggers:M}=e,N=w.useRef(b.type),{x:H,y:B}=e.controls.offset,U=f=>{r&&r.go(f)};return w.useEffect(()=>{if(!x)return;const f=new ResizeObserver(I=>{if(!r)return;const[k]=I;d({width:Math.round(k.contentRect.width),height:Math.round(k.contentRect.height)})});return f.observe(x),()=>f.unobserve(x)},[x]),w.useEffect(()=>{!r||N.current===b.type||(W(f=>f+1),N.current=b.type)},[b.type]),s.jsx("div",{className:ye(J.wrapper,{[J.editor]:o}),ref:h,children:s.jsxs("div",{className:J.sliderInner,style:{width:p?p.width:"100%",height:p?p.height:"100%",backgroundColor:b.backgroundColor&&b.type==="fade in"?b.backgroundColor:"transparent"},children:[e.imageCaption.isActive&&s.jsx("div",{className:ye(J.captionBlock),children:s.jsx("div",{className:J.captionTextWrapper,children:t.map((f,I)=>s.jsx("div",{className:ye(J.captionText,_a[j.alignment],{[J.withPointerEvents]:I===y&&o,[J.active]:I===y}),style:{fontFamily:yn(u.fontFamily),fontWeight:u.fontWeight,fontStyle:u.fontStyle,width:i.sizing==="auto"?"max-content":$.scalingValue(i.width,o),letterSpacing:$.scalingValue(c,o),wordSpacing:$.scalingValue(l,o),textAlign:m,fontSize:$.scalingValue(A.fontSize,o),lineHeight:$.scalingValue(A.lineHeight,o),textTransform:S.textTransform??"none",textDecoration:S.textDecoration??"none",fontVariant:S.fontVariant??"normal",color:g,transitionDuration:b.duration?`${Math.round(parseInt(b.duration)/2)}ms`:"500ms"},children:s.jsx("div",{"data-styles":"imageCaption",className:J.captionTextInner,style:{"--link-hover-color":j.linkHoverColor,"--link-color":j.linkColor,position:"relative",top:$.scalingValue(j.offset.y,o),left:$.scalingValue(j.offset.x,o)},children:s.jsx(Mt,{content:f.imageCaption})})},I))})}),s.jsx(ur,{onMove:f=>{_(f.index)},ref:a,options:{arrows:!1,speed:b.duration?parseInt(b.duration):500,autoplay:M.autoPlay!==null,...M.autoPlay!==null&&{interval:parseInt(M.autoPlay)*1e3},direction:E==="horiz"||b.type==="fade in"?"ltr":"ttb",pagination:!1,drag:M.triggersList.drag,perPage:1,width:p?p.width:"100%",height:p?p.height:"100%",type:b.type==="fade in"?"fade":"loop",rewind:!0},children:t.map((f,I)=>s.jsx(pr,{children:s.jsx("div",{className:J.sliderItem,children:s.jsx("div",{className:J.imgWrapper,children:s.jsx("img",{className:ye(J.sliderImage,{[J.contain]:f.image.objectFit==="contain",[J.cover]:f.image.objectFit==="cover"}),src:f.image.url,alt:f.image.name??""})})})},I))},D),C.isActive&&s.jsxs(s.Fragment,{children:[s.jsx("div",{className:ye(J.arrow,{[J.arrowVertical]:E==="vert",[J.hoverArrow]:C.show==="on hover"}),style:{color:C.color,"--arrow-hover-color":C.hover},children:s.jsxs("button",{onClick:()=>{U("-1")},className:J.arrowInner,style:{transform:`translate(${$.scalingValue(H,o)}, ${$.scalingValue(B*(E==="horiz"?1:-1),o)}) scale(${e.controls.scale/100}) rotate(${E==="horiz"?"0deg":"90deg"})`},children:[C.arrowsImgUrl&&s.jsx(Ke,{url:C.arrowsImgUrl,fill:C.color,hoverFill:C.hover,className:ye(J.arrowImg,J.mirror)}),!C.arrowsImgUrl&&s.jsx(bo,{color:C.color,className:ye(J.arrowIcon,J.arrowImg,J.mirror)})]})}),s.jsx("div",{className:ye(J.arrow,J.nextArrow,{[J.arrowVertical]:E==="vert",[J.hoverArrow]:C.show==="on hover"}),style:{color:C.color,"--arrow-hover-color":C.hover},children:s.jsxs("button",{className:J.arrowInner,onClick:()=>U("+1"),style:{transform:`translate(${$.scalingValue(H*(E==="horiz"?-1:1),o)}, ${$.scalingValue(B,o)}) scale(${e.controls.scale/100}) rotate(${E==="horiz"?"0deg":"90deg"})`},children:[C.arrowsImgUrl&&s.jsx(Ke,{url:C.arrowsImgUrl,fill:C.color,hoverFill:C.hover,className:J.arrowImg}),!C.arrowsImgUrl&&s.jsx(bo,{color:C.color,className:ye(J.arrowIcon,J.arrowImg)})]})})]}),M.triggersList.click&&s.jsx("div",{className:J.clickOverlay,onClick:()=>{r&&r.go("+1")}}),F.isActive&&s.jsx("div",{className:ye(J.pagination,{[J.paginationInsideBottom]:F.position==="inside-1"&&E==="horiz",[J.paginationInsideTop]:F.position==="inside-2"&&E==="horiz",[J.paginationOutsideBottom]:F.position==="outside-1"&&E==="horiz",[J.paginationOutsideTop]:F.position==="outside-2"&&E==="horiz",[J.paginationInsideLeft]:F.position==="inside-1"&&E==="vert",[J.paginationInsideRight]:F.position==="inside-2"&&E==="vert",[J.paginationOutsideLeft]:F.position==="outside-1"&&E==="vert",[J.paginationOutsideRight]:F.position==="outside-2"&&E==="vert",[J.paginationVertical]:E==="vert"}),children:s.jsx("div",{className:J.paginationInner,style:{backgroundColor:F.colors[2],transform:`scale(${F.scale/100}) translate(${$.scalingValue(F.offset.x,o)}, ${$.scalingValue(F.offset.y,o)}) rotate(${E==="horiz"?"0deg":"90deg"})`},children:t.map((f,I)=>s.jsx("button",{onClick:()=>{r&&r.go(I)},className:ye(J.paginationItem),children:s.jsx("div",{className:ye(J.dot,{[J.activeDot]:I===y}),style:{backgroundColor:I===y?F.colors[0]:F.colors[1],"--pagination-hover-color":F.hover}})},I))})})]})})}function bo({color:e,className:t}){return s.jsx("svg",{viewBox:"0 0 10 18",className:t,children:s.jsx("g",{id:"Symbols",stroke:"none",strokeWidth:"1",fillRule:"evenodd",children:s.jsx("path",{d:"M-3.70710678,4.29289322 C-3.34662282,3.93240926 -2.77939176,3.90467972 -2.38710056,4.20970461 L-2.29289322,4.29289322 L5,11.585 L12.2928932,4.29289322 C12.6533772,3.93240926 13.2206082,3.90467972 13.6128994,4.20970461 L13.7071068,4.29289322 C14.0675907,4.65337718 14.0953203,5.22060824 13.7902954,5.61289944 L13.7071068,5.70710678 L5.70710678,13.7071068 C5.34662282,14.0675907 4.77939176,14.0953203 4.38710056,13.7902954 L4.29289322,13.7071068 L-3.70710678,5.70710678 C-4.09763107,5.31658249 -4.09763107,4.68341751 -3.70710678,4.29289322 Z",id:"Shape-Copy",fill:e,transform:"translate(5, 9) rotate(-90) translate(-5, -9)"})})})}const Aa={element:Ea,id:"control-slider",name:"Slider",preview:{type:"image",url:"https://cdn.cntrl.site/component-assets/sliderImg.png"},defaultSize:{width:400,height:400},assetsPaths:{content:[{path:"image.url",placeholderEnabled:!0}],parameters:[{path:"settings.controls.arrowsImgUrl"}]},fontSettingsPaths:{content:[],parameters:[{path:"styles.imageCaption.fontSettings"}]},schema:{type:"object",properties:{settings:{type:"object",display:{type:"settings-block"},properties:{triggers:{title:"triggers",icon:"target",tooltip:"Triggers",type:"object",properties:{triggersList:{type:"object",display:{type:"toggle-ratio-group"},properties:{click:{type:"boolean"},drag:{type:"boolean"}}},autoPlay:{type:["string","null"],label:"Auto",display:{type:"step-selector"},enum:[null,"1s","2s","3s","4s","5s"]}}},direction:{icon:"horizontal-resize",tooltip:"Direction",type:"string",display:{type:"ratio-group"},enum:["horiz","vert"]},transition:{title:"transit",icon:"transition",tooltip:"Transition",type:"object",properties:{type:{type:"string",display:{type:"ratio-group"},enum:["slide","fade in"]},backgroundColor:{type:["string","null"],title:"BG Color",display:{visible:!1,type:"settings-color-picker",format:"single"}},duration:{type:"string",label:"icon:hourglass",display:{type:"step-selector"},enum:["100ms","250ms","500ms","1000ms","1500ms","2000ms"]}}},controls:{title:"controls",icon:"controls",tooltip:"Controls",type:"object",properties:{isActive:{type:"boolean",display:{type:"setting-toggle"}},arrowsImgUrl:{type:["string","null"],display:{type:"settings-image-input"}},offset:{type:"object",title:"Offset",display:{type:"group"},properties:{x:{type:"number",label:"X",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}},y:{type:"number",label:"Y",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}}}},scale:{type:"number",title:"scale",min:50,max:600,display:{type:"range-control"}},color:{title:"color",type:"string",display:{type:"settings-color-picker",format:"single"}},hover:{title:"hover",type:"string",display:{type:"settings-color-picker",format:"single"}},show:{title:"Show",type:"string",display:{type:"ratio-group"},enum:["always","on hover"]}}},pagination:{title:"nav",icon:"pagination",tooltip:"Navigation",type:"object",properties:{isActive:{type:"boolean",display:{type:"setting-toggle"}},position:{display:{type:"socket",direction:"horizontal"},type:"string",enum:["outside-1","outside-2","inside-1","inside-2"]},offset:{type:"object",title:"Offset",display:{type:"group"},properties:{x:{type:"number",label:"X",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}},y:{type:"number",label:"Y",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}}}},scale:{type:"number",title:"scale",min:10,max:400,display:{type:"range-control"}},colors:{display:{type:"settings-color-picker",format:"multiple"},title:"color",type:"array",items:{type:"string"}},hover:{title:"hover",type:"string",display:{type:"settings-color-picker",format:"single"}}}},imageCaption:{title:"Caption",icon:"text-icon",tooltip:"Caption",type:"object",properties:{isActive:{type:"boolean",display:{type:"setting-toggle"}},alignment:{type:"string",display:{type:"align-grid"},enum:["top-left","top-center","top-right","middle-left","middle-center","middle-right","bottom-left","bottom-center","bottom-right"]},offset:{type:"object",title:"Offset",display:{type:"group"},properties:{x:{type:"number",label:"X",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}},y:{type:"number",label:"Y",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}}}},linkColor:{title:"Link",type:"string",display:{type:"settings-color-picker",format:"single"}},linkHoverColor:{title:"Link Hov",type:"string",display:{type:"settings-color-picker",format:"single"}}}}},default:{triggers:{triggersList:{click:!1,drag:!0},autoPlay:null},controls:{isActive:!0,arrowsImgUrl:null,offset:{x:0,y:0},scale:100,color:"#000000",hover:"#cccccc",show:"always"},transition:{type:"slide",duration:"500ms",backgroundColor:null},pagination:{isActive:!0,scale:50,position:"outside-1",offset:{x:0,y:0},colors:["#cccccc","#cccccc","#000000"],hover:"#cccccc"},direction:"horiz",imageCaption:{offset:{x:0,y:0},isActive:!0,alignment:"middle-center",linkColor:"#cccccc",linkHoverColor:"#cccccc"}},displayRules:[{if:{name:"direction",value:"vert"},then:{name:"properties.pagination.properties.position.display.direction",value:"vertical"}},{if:{name:"transition.type",value:"fade in"},then:{name:"properties.transition.properties.backgroundColor.display.visible",value:!0}}]},content:{type:"array",settings:{addItemFromFileExplorer:!0},items:{type:"object",properties:{image:{type:"object",label:"Image",display:{type:"media-input"},properties:{url:{type:"string"},name:{type:"string"},objectFit:{type:"string",enum:["cover","contain"]}},required:["url","name"]},imageCaption:{placeholder:"Add Caption...",label:"Description",display:{type:"rich-text"}}},required:["image"]},default:[{image:{objectFit:"cover",url:"https://cdn.cntrl.site/component-assets/Control-slider-default-picture-1.png",name:"Slider-1.png"},imageCaption:[{type:"paragraph",children:[{text:""}]}]},{image:{objectFit:"cover",url:"https://cdn.cntrl.site/component-assets/Control-slider-default-picture-2.png",name:"Slider-2.png"},imageCaption:[{type:"paragraph",children:[{text:""}]}]},{image:{objectFit:"cover",url:"https://cdn.cntrl.site/component-assets/Control-slider-default-picture-3.png",name:"Slider-3.png"},imageCaption:[{type:"paragraph",children:[{text:""}]}]}]},styles:{type:"object",properties:{imageCaption:{dataName:"caption",type:"object",properties:{fontSettings:{type:"object",display:{type:"font-settings"},properties:{fontFamily:{type:"string"},fontWeight:{type:"number"},fontStyle:{type:"string"}}},widthSettings:{display:{type:"text-width-control"},type:"object",properties:{width:{type:"number"},sizing:{type:"string",enum:["auto","manual"]}}},fontSizeLineHeight:{type:"object",display:{type:"font-size-line-height"},properties:{fontSize:{type:"number"},lineHeight:{type:"number"}}},letterSpacing:{display:{type:"letter-spacing-input"},type:"number"},wordSpacing:{display:{type:"word-spacing-input"},type:"number"},textAlign:{display:{type:"text-align-control"},type:"string",enum:["left","center","right","justify"]},textAppearance:{display:{type:"text-appearance"},properties:{textTransform:{type:"string",enum:["none","uppercase","lowercase","capitalize"]},textDecoration:{type:"string",enum:["none","underline"]},fontVariant:{type:"string",enum:["normal","small-caps"]}}},color:{display:{type:"style-panel-color-picker"},type:"string"}}}},default:{imageCaption:{widthSettings:{width:.13,sizing:"auto"},fontSettings:{fontFamily:"Arial",fontWeight:400,fontStyle:"normal"},fontSizeLineHeight:{fontSize:.02,lineHeight:.02},letterSpacing:0,wordSpacing:0,textAlign:"left",textAppearance:{textTransform:"none",textDecoration:"none",fontVariant:"normal"},color:"#000000"}}}},required:["settings","content","styles"]}},ka="ImageRevealSlider-module__imageRevealSlider___UE5Ob",La="ImageRevealSlider-module__image___Qjt-e",Ia="ImageRevealSlider-module__link___N-iLG",Fa="ImageRevealSlider-module__cursor___2U03d",ut={imageRevealSlider:ka,image:La,link:Ia,cursor:Fa};function xo(e,t,n){for(const o of n){const r=new Image;r.src=o.url;const a=o.width?Number.parseFloat(o.width):r.naturalWidth,i=r.naturalHeight/r.naturalWidth*a,u=a/2,c=i/2;if(e>=o.x-u&&e<=o.x+u&&t>=o.y-c&&t<=o.y+c)return!0}return!1}function wn(e){return new Promise(t=>{const n=new Image;n.src=e,n.onload=()=>{t({width:n.naturalWidth,height:n.naturalHeight})}})}async function Pa(e,t,n,o){let r,a;if(t==="custom"){r=n;const i=await wn(e);a=i.height/i.width*r}else if(t==="random"){r=Math.random()*(o.max-o.min)+o.min;const i=await wn(e);a=i.height/i.width*r}else{const i=await wn(e);r=i.width,a=i.height}return{width:r,height:a,finalWidth:`${r}px`}}function Ma({settings:e,content:t,isEditor:n}){const[o,r]=w.useState(null),[a,i]=w.useState([]),[u,c]=w.useState(0),m=w.useRef(0),[l,A]=w.useState({x:0,y:0}),[S,g]=w.useState(1),[p,d]=w.useState("none"),x=w.useRef({x:0,y:0}),[h,y]=w.useState(!1),{sizeType:_,imageWidth:D,randomRangeImageWidth:W}=e.imageSize,{revealPosition:E,visible:b}=e.position,{cursorType:C,target:F,defaultCursorScale:j,defaultCursor:M,hoverCursorScale:N,hoverCursor:H}=e.cursor;w.useEffect(()=>{if(!o)return;const f=(L,T)=>{const R=o.getBoundingClientRect(),Z=L-R.left,ae=T-R.top;if(A({x:Z,y:ae}),C==="system"){d("none"),g(1);return}const te=Z,ce=ae,P=document.elementFromPoint(R.left+te,R.top+ce);if(P&&P.closest("a")){d("none"),g(1);return}const ee=xo(te,ce,a)||F==="area"?{img:H??"none",scale:N}:{img:M??"none",scale:j};d(ee.img),g(ee.scale)},I=L=>{L.stopPropagation(),x.current={x:L.clientX,y:L.clientY},f(L.clientX,L.clientY)},k=()=>{h&&f(x.current.x,x.current.y)};return o.addEventListener("mousemove",I),window.addEventListener("scroll",k,!0),()=>{o.removeEventListener("mousemove",I),window.removeEventListener("scroll",k,!0)}},[o,h,l,C,F,H,M,N,j,a]),w.useEffect(()=>{h||(d("none"),g(0))},[h]);const B=async(f,I,k,L={})=>{const{width:T,height:R,finalWidth:Z}=await Pa(f.image.url,_,D,W);let ae=0,te=0;E==="same"?(ae=I/2,te=k/2):(ae=L.x??Math.random()*I,te=L.y??Math.random()*k);const ce=Math.min(Math.max(ae,T/2),I-T/2),P=Math.min(Math.max(te,R/2),k-R/2);return{id:m.current++,url:f.image.url,link:f.link,name:f.image.name,x:ce,y:P,width:Z}};w.useEffect(()=>{if(!o||t.length===0)return;const f=o.getBoundingClientRect(),I=f.width,k=f.height,L=[];(async()=>{const R=t[0],Z=await B(R,I,k);L.push(Z),i(L),c(1)})()},[_,D,W,E,o]),w.useEffect(()=>{b==="last One"&&i(f=>f.length>0?[f[f.length-1]]:[])},[b]);const U=async f=>{if(!o)return;const I=o.getBoundingClientRect(),k=f.clientX-I.left,L=f.clientY-I.top;if(F==="image"&&!xo(k,L,a))return;let T=0,R=0;E==="on Click"?(T=k,R=L):E==="same"?(T=I.width/2,R=I.height/2):(T=Math.random()*I.width,R=Math.random()*I.height);const Z=t[u],ae=await B(Z,I.width,I.height,{x:T,y:R});i(te=>b==="all"?[...te,ae]:[ae]),c(te=>te>=t.length-1?0:te+1)};return s.jsxs("div",{ref:r,onClick:U,onMouseEnter:()=>y(!0),onMouseLeave:()=>y(!1),className:ut.imageRevealSlider,style:{cursor:p==="none"?"default":"none"},children:[a.map(f=>s.jsx("div",{className:ut.wrapper,style:{top:`${f.y}px`,left:`${f.x}px`,position:"absolute",transform:"translate(-50%, -50%)",width:f.width??"auto",height:"auto",cursor:p==="none"?"default":"none"},children:F==="area"&&f.link?s.jsx("a",{href:f.link,target:"_blank",className:ut.link,children:s.jsx("img",{src:f.url,alt:f.name,className:ut.image},f.id)}):s.jsx("img",{src:f.url,alt:f.name,className:ut.image},f.id)},f.id)),h&&s.jsx("div",{className:ut.cursor,style:{left:`${l.x}px`,top:`${l.y}px`,transform:`translate(-50%, -50%) scale(${S})`,backgroundImage:`url('${p}')`,backgroundSize:"cover",backgroundPosition:"center",position:"absolute",pointerEvents:"none"}})]})}const Ra={element:Ma,id:"control-image-reveal",name:"Click Gallery",preview:{type:"image",url:"https://cdn.cntrl.site/component-assets/clickGalleryImg.png"},defaultSize:{width:"100%",height:"100%"},assetsPaths:{content:[{path:"image.url",placeholderEnabled:!0}],parameters:[{path:"settings.cursor.defaultCursor"},{path:"settings.cursor.hoverCursor"}]},fontSettingsPaths:{content:[],parameters:[]},schema:{type:"object",properties:{settings:{type:"object",display:{type:"settings-block"},properties:{imageSize:{title:"IMG SIZE",icon:"size",tooltip:"IMG SIZE",type:"object",properties:{sizeType:{type:"string",display:{type:"ratio-group"},enum:["as Is","custom","random"]},imageWidth:{type:"number",label:"W",display:{type:"numeric-input",visible:!1}},randomRangeImageWidth:{type:"object",display:{type:"random-range-controls",visible:!1},properties:{min:{type:"number"},max:{type:"number"}}}}},cursor:{title:"cursor",icon:"cursor",tooltip:"cursor",type:"object",properties:{cursorType:{type:"string",display:{type:"ratio-group"},enum:["system","custom"]},target:{type:"string",title:"Target",display:{type:"ratio-group"},enum:["area","image"]},defaultCursor:{type:["string","null"],title:"Default",display:{type:"settings-image-input",visible:!1}},defaultCursorScale:{type:"number",title:"Scale",min:1,max:5,step:.1,display:{type:"range-control",visible:!1}},hoverCursor:{type:["string","null"],title:"Hover",display:{type:"settings-image-input",visible:!1}},hoverCursorScale:{type:"number",title:"Scale",min:1,max:5,step:.1,display:{type:"range-control",visible:!1}}}},position:{title:"position",icon:"transition",tooltip:"Position",type:"object",properties:{revealPosition:{type:"string",display:{type:"ratio-group"},enum:["random","same","on Click"]},visible:{type:"string",title:"Visible",display:{type:"ratio-group"},enum:["all","last One"]}}}},default:{imageSize:{sizeType:"custom",imageWidth:500,randomRangeImageWidth:{min:100,max:1e3}},cursor:{cursorType:"system",target:"area",defaultCursor:null,defaultCursorScale:2,hoverCursor:null,hoverCursorScale:2},position:{revealPosition:"random",visible:"all"}},displayRules:[{if:{name:"imageSize.sizeType",value:"custom"},then:{name:"properties.imageSize.properties.imageWidth.display.visible",value:!0}},{if:{name:"imageSize.sizeType",value:"random"},then:{name:"properties.imageSize.properties.randomRangeImageWidth.display.visible",value:!0}},{if:[{name:"cursor.target",value:"image"},{name:"cursor.cursorType",value:"custom"}],then:{name:"properties.cursor.properties.defaultCursor.display.visible",value:!0}},{if:[{name:"cursor.target",value:"image"},{name:"cursor.cursorType",value:"custom"},{name:"cursor.defaultCursor",value:null,isNotEqual:!0}],then:{name:"properties.cursor.properties.defaultCursorScale.display.visible",value:!0}},{if:{name:"cursor.cursorType",value:"custom"},then:{name:"properties.cursor.properties.hoverCursor.display.visible",value:!0}},{if:[{name:"cursor.cursorType",value:"custom"},{name:"cursor.hoverCursor",value:null,isNotEqual:!0}],then:{name:"properties.cursor.properties.hoverCursorScale.display.visible",value:!0}}]},content:{type:"array",settings:{addItemFromFileExplorer:!0},items:{type:"object",properties:{image:{type:"object",label:"Image",display:{isObjectFitEditable:!1,type:"media-input"},properties:{url:{type:"string"},name:{type:"string"},objectFit:{type:"string",enum:["cover","contain"]}},required:["url","name"]},link:{label:"URL",placeholder:"Enter link...",display:{type:"text-input"}}},required:["image"]},default:[{image:{objectFit:"cover",url:"https://cdn.cntrl.site/projects/01JJKT02AWY2FGN2QJ7A173RNZ/articles-assets/01K7ERQK9211QXBE9W284ZNKB8.png",name:"Slider-1.png"},link:""},{image:{objectFit:"cover",url:"https://cdn.cntrl.site/projects/01JJKT02AWY2FGN2QJ7A173RNZ/articles-assets/01K7ERQMFT72JD18WKP0Q2DVAT.png",name:"Slider-2.png"},link:""},{image:{objectFit:"cover",url:"https://cdn.cntrl.site/projects/01JJKT02AWY2FGN2QJ7A173RNZ/articles-assets/01K7ERQNEVRXPSRX5K1YTMJQY9.png",name:"Slider-3.png"},link:""},{image:{objectFit:"cover",url:"https://cdn.cntrl.site/projects/01JJKT02AWY2FGN2QJ7A173RNZ/articles-assets/01K7ERQP84JKRDT7WNWDQZR4Y9.png",name:"Slider-4.png"},link:""}]}}}},Wa="LightBox-module__hidden___9s-9x",Na="LightBox-module__heroImage___sTxNF",Va="LightBox-module__background___rm9ml",Ha="LightBox-module__editor___4ACaY",ja="LightBox-module__contentStyle___Bgnsq",za="LightBox-module__imageStyle___tLIlB",Oa="LightBox-module__imgWrapper___LuFUp",Ba="LightBox-module__contain___8-yaS",Da="LightBox-module__cover___hNvOG",qa="LightBox-module__caption___b6L2I",Ua="LightBox-module__captionTextInner___rCGNH",Ga="LightBox-module__lightboxSplide___XFuWC",Ya="LightBox-module__arrow___iz38X",Xa="LightBox-module__arrowVertical___Zfz81",Ka="LightBox-module__nextArrow___zkAQN",Za="LightBox-module__arrowInner___p48sW",Ja="LightBox-module__arrowIcon___3VaFf",Qa="LightBox-module__arrowImg___pNV88",es="LightBox-module__mirror___pjeXc",ts="LightBox-module__thumbsWrapper___GB-nU",ns="LightBox-module__thumbsContainerVertical___wttk5",os="LightBox-module__thumbsContainer___osSma",rs="LightBox-module__thumbsAlignStart___MO6tY",is="LightBox-module__thumbsAlignCenter___Q4sUx",as="LightBox-module__thumbsAlignEnd___p4y9R",ss="LightBox-module__thumbItem___HvnF3",ls="LightBox-module__closeButton___g2khP",cs="LightBox-module__fadeIn___0m5GW",us="LightBox-module__slideInLeft___gPYwC",ps="LightBox-module__slideInRight___S-pPp",ds="LightBox-module__slideInTop___DFdAj",ms="LightBox-module__slideInBottom___m27kZ",gs="LightBox-module__fadeOut___55qBR",fs="LightBox-module__slideOutLeft___NvU7P",hs="LightBox-module__slideOutRight___SK7eC",ys="LightBox-module__slideOutTop___Vgg0z",vs="LightBox-module__slideOutBottom___nJ0Ef",bs="LightBox-module__scaleSlide___vZriG",O={hidden:Wa,heroImage:Na,background:Va,editor:Ha,contentStyle:ja,imageStyle:za,imgWrapper:Oa,contain:Ba,cover:Da,caption:qa,captionTextInner:Ua,lightboxSplide:Ga,arrow:Ya,arrowVertical:Xa,nextArrow:Ka,arrowInner:Za,arrowIcon:Ja,arrowImg:Qa,mirror:es,thumbsWrapper:ts,thumbsContainerVertical:ns,thumbsContainer:os,thumbsAlignStart:rs,thumbsAlignCenter:is,thumbsAlignEnd:as,thumbItem:ss,closeButton:ls,fadeIn:cs,slideInLeft:us,slideInRight:ps,slideInTop:ds,slideInBottom:ms,fadeOut:gs,slideOutLeft:fs,slideOutRight:hs,slideOutTop:ys,slideOutBottom:vs,scaleSlide:bs},Ut=(e,t,n)=>{const o={},[r,a]=e.split("-");return r==="top"?(o.top="0",o.bottom="auto"):r==="middle"?(o.top="50%",o.bottom="auto"):r==="bottom"&&(o.top="auto",o.bottom="0"),a==="left"?(o.left="0",o.right="auto"):a==="center"?(o.left="50%",o.right="auto"):a==="right"&&(o.left="auto",o.right="0"),r==="middle"&&a==="center"?o.transform=`translate(calc(-50% + ${$.scalingValue(t.x,n)}), calc(-50% + ${$.scalingValue(t.y,n)}))`:r==="middle"?o.transform=`translate(${$.scalingValue(t.x,n)}, calc(-50% + ${$.scalingValue(t.y,n)}))`:a==="center"?o.transform=`translate(calc(-50% + ${$.scalingValue(t.x,n)}), ${$.scalingValue(t.y,n)})`:o.transform=`translate(${$.scalingValue(t.x,n)}, ${$.scalingValue(t.y,n)})`,o};function dr(e){const t=window.getComputedStyle(e);return{top:parseFloat(t.paddingTop)||0,right:parseFloat(t.paddingRight)||0,bottom:parseFloat(t.paddingBottom)||0,left:parseFloat(t.paddingLeft)||0}}function So(e){const t=e.getBoundingClientRect(),n=dr(e),o=Math.max(0,t.width-n.left-n.right),r=Math.max(0,t.height-n.top-n.bottom),a=e.naturalWidth,i=e.naturalHeight,u=o/r,c=a/i;let m,l;c>u?(m=o,l=o/c):(l=r,m=r*c);const A=t.left+n.left,S=t.top+n.top,g=(o-m)/2+A,p=(r-l)/2+S;return{x:g,y:p,width:m,height:l}}function Co(e){const t=e.getBoundingClientRect(),n=dr(e);return{left:t.left+n.left,right:t.right-n.right,top:t.top+n.top,bottom:t.bottom-n.bottom}}function wo(e){const t=e.match(/rgba?\(([^)]+)\)/);if(t){const o=t[1].split(",").map(r=>parseFloat(r.trim()));return o.length===4?o[3]:1}const n=e.match(/^#([0-9a-fA-F]{8})$/);if(n){const o=n[1].substring(6,8);return parseInt(o,16)/255}return e.match(/^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/),1}function xs(e,t){const n=(()=>{if(e==="fade in")return O.fadeIn;if(e==="slide in"||e==="mix")switch(t){case"left":return O.slideInLeft;case"right":return O.slideInRight;case"top":return O.slideInTop;case"bottom":return O.slideInBottom;default:return O.slideInRight}return O.fadeIn})(),o=(()=>{if(e==="fade in"||e==="mix")return O.fadeIn;if(e==="slide in")switch(t){case"left":return O.slideInLeft;case"right":return O.slideInRight;case"top":return O.slideInTop;case"bottom":return O.slideInBottom;default:return O.slideInRight}return O.fadeIn})(),r=(()=>{if(e==="fade in"||e==="mix")return O.fadeOut;if(e==="slide in")switch(t){case"left":return O.slideOutLeft;case"right":return O.slideOutRight;case"top":return O.slideOutTop;case"bottom":return O.slideOutBottom;default:return O.slideOutRight}return O.fadeOut})(),a=(()=>{if(e==="fade in")return O.fadeOut;if(e==="slide in"||e==="mix")switch(t){case"left":return O.slideOutLeft;case"right":return O.slideOutRight;case"top":return O.slideOutTop;case"bottom":return O.slideOutBottom;default:return O.slideOutRight}return O.fadeOut})();return{appearClass:n,backdropAppearClass:o,backdropDisappearClass:r,disappearClass:a}}const Ss=({settings:e,content:t,styles:n,portalId:o,activeEvent:r,isEditor:a})=>{const[i,u]=w.useState(!1),{url:c}=e.thumbnailBlock.cover;return w.useEffect(()=>{r==="close"&&u(!1),r==="open"&&u(!0)},[r]),s.jsxs(s.Fragment,{children:[s.jsx("img",{src:c,alt:"Cover",className:O.heroImage,onClick:()=>u(!0)}),s.jsx(Cs,{isOpen:i,onClose:()=>u(!1),content:t,settings:e,lightboxStyles:n,portalId:o,isEditor:a})]})},Cs=({isOpen:e,onClose:t,content:n,lightboxStyles:o,settings:r,portalId:a,isEditor:i,metadata:u})=>{var V;const[c,m]=w.useState(0),[l,A]=w.useState(0),[S,g]=w.useState(!1),[p,d]=w.useState(!1),[x,h]=w.useState({}),y=w.useRef(null),_=w.useRef(null),D=w.useRef(null),W=w.useRef(!1),E=w.useRef(null),b=w.useRef(null),C=w.useRef(null),F=w.useRef(null),j=w.useRef(!1),M=w.useRef(null),[N,H]=w.useState(!1),{appear:B,triggers:U,slider:f,thumbnail:I,controls:k,area:L,caption:T,layout:R}=r.lightboxBlock,{appearClass:Z,backdropAppearClass:ae,backdropDisappearClass:te,disappearClass:ce}=xs(B.type,B.direction),P=(u==null?void 0:u.itemId)??null;w.useEffect(()=>{const v=()=>{setTimeout(()=>{var K,Q;(Q=(K=y.current)==null?void 0:K.splide)==null||Q.refresh()},16)},q=()=>{A(K=>K+1)};return window.addEventListener("ArticleEditor.Layout:change",v),window.addEventListener("ArticleEditor.ComponentContent:change",q),()=>{window.removeEventListener("ArticleEditor.Layout:change",v),window.removeEventListener("ArticleEditor.ComponentContent:change",q)}},[]),w.useEffect(()=>{if(!e||!I.isActive){H(!1);return}const v=M.current;if(!v)return;const q=()=>{f.direction==="horiz"?H(v.scrollWidth>v.clientWidth):H(v.scrollHeight>v.clientHeight)};q();const K=new ResizeObserver(q);return K.observe(v),()=>K.disconnect()},[e,I.isActive,n.length,x,f.direction]);const ee=w.useCallback(()=>{const v=window.matchMedia("(max-width: 768px)").matches,q=wo(L.color);v&&!i&&q>.9&&(document.body.style.backgroundColor=""),g(!0),W.current=!0;const K=Q=>{Q.target===E.current&&Q.animationName&&(E.current&&b.current&&E.current.removeEventListener("animationend",b.current),b.current=null,W.current&&(W.current=!1,t()),g(!1))};E.current&&(b.current=K,E.current.addEventListener("animationend",K))},[t,L.color,i]),fe=(v,q,K)=>{var Q,ie;if(v){if(U.type==="click"&&U.switch==="image")U.repeat==="close"&&c===n.length-1?ee():(Q=y.current)==null||Q.go("+1");else if(U.type==="click"&&U.switch==="50/50"){const re=v.getBoundingClientRect(),ne=q-re.left,ue=K-re.top,z=re.width,X=re.height;let Y;f.direction==="horiz"?Y=ne<z/2?"-1":"+1":Y=ue<X/2?"-1":"+1",(ie=y.current)==null||ie.go(Y)}}},de=v=>{if(j.current){j.current=!1;return}const q=n[c],K=(q==null?void 0:q.image.objectFit)==="cover";let Q,ie;if("changedTouches"in v&&v.changedTouches.length>0)Q=v.changedTouches[0].clientX,ie=v.changedTouches[0].clientY;else if("clientX"in v)Q=v.clientX,ie=v.clientY;else return;let re;if(K&&D.current){const ne=Co(D.current);re=Q>=ne.left&&Q<=ne.right&&ie>=ne.top&&ie<=ne.bottom}else{const ne=D.current?So(D.current):null;if(!ne){v.target===v.currentTarget&&ee();return}re=Q>=ne.x&&Q<=ne.x+ne.width&&ie>=ne.y&&ie<=ne.y+ne.height}re?fe(D.current,Q,ie):ee()},ge=v=>{const q=v.target;(q.classList.contains(O.thumbsWrapper)||q.classList.contains(O.thumbsContainer))&&de(v)};w.useEffect(()=>{if(!e)return;const v=q=>{var K,Q;if(q.key==="Escape"){ee();return}if(q.key==="ArrowRight"){m(ie=>(ie+1)%Math.max(n.length,1)),(K=y.current)==null||K.go("+1");return}q.key==="ArrowLeft"&&(m(ie=>(ie-1+Math.max(n.length,1))%Math.max(n.length,1)),(Q=y.current)==null||Q.go("-1"))};return window.addEventListener("keydown",v),()=>{window.removeEventListener("keydown",v)}},[e,ee,n.length]),w.useEffect(()=>{if(e){if(m(0),A(q=>q+1),W.current=!1,g(!1),d(!1),h({}),!P)return;const v=new CustomEvent("page-overlay",{detail:{itemId:P}});window.dispatchEvent(v)}return()=>{E.current&&b.current&&(E.current.removeEventListener("animationend",b.current),b.current=null),d(!1)}},[e,P]),w.useEffect(()=>{_.current!==null&&_.current!==f.type&&A(v=>v+1),_.current=f.type},[f.type]),w.useEffect(()=>{if(!e)return;const v=document.body.style.overflow,q=window.matchMedia("(max-width: 768px)").matches,K=wo(L.color);document.body.style.overflow="hidden",d(!1);const Q=re=>{re.target===E.current&&!W.current&&re.animationName&&(q&&!i&&K>.9&&(document.body.style.backgroundColor=L.color),d(!0),E.current&&C.current&&E.current.removeEventListener("animationend",C.current),C.current=null)};E.current&&(C.current=Q,E.current.addEventListener("animationend",Q));const ie=re=>{const ne=re.target;ne&&(ne.closest(`.${O.thumbsWrapper}`)||ne.closest(`.${O.thumbsContainer}`))||f.type!=="slide"&&re.preventDefault()};return document.addEventListener("touchmove",ie,{passive:!1}),()=>{document.body.style.overflow=v,document.removeEventListener("touchmove",ie),E.current&&C.current&&(E.current.removeEventListener("animationend",C.current),C.current=null),d(!1)}},[e,i,L.color,f.type]),w.useEffect(()=>{if(!e)return;const v=q=>{var Q,ie;if(W.current){q.stopPropagation();return}if(j.current){j.current=!1;return}const K=q.target;if(!(K&&(K.closest(`.${O.thumbsContainer}`)||K.closest(`.${O.thumbItem}`)||K.closest(`.${O.arrow}`)||K.closest(`.${O.closeButton}`)||K.closest(`.${O.caption}`)))){if(f.type==="slide"&&U.type==="drag"&&((ie=(Q=y.current)==null?void 0:Q.splide)!=null&&ie.root)){const re=y.current.splide.root;if(K&&(re.contains(K)||re===K))return}if(q.touches.length===0&&q.changedTouches.length>0){const re=n[c],ne=(re==null?void 0:re.image.objectFit)==="cover",ue=q.changedTouches[0];let z;if(ne&&D.current){const X=Co(D.current);z=ue.clientX>=X.left&&ue.clientX<=X.right&&ue.clientY>=X.top&&ue.clientY<=X.bottom}else{const X=D.current?So(D.current):null;if(!X)return;z=ue.clientX>=X.x&&ue.clientX<=X.x+X.width&&ue.clientY>=X.y&&ue.clientY<=X.y+X.height}if(!z){q.stopPropagation(),W.current=!0;const X=Y=>{Y.stopPropagation(),Y.preventDefault(),document.removeEventListener("click",X,!0)};document.addEventListener("click",X,!0),ee()}}}};return document.addEventListener("touchend",v,{passive:!0}),()=>{document.removeEventListener("touchend",v)}},[e,ee,c,n]);const G=(f.type==="scale"||f.type==="fade")&&f.direction==="vert"&&U.type==="drag";w.useEffect(()=>{var Y,se;if(!e||!G||!((se=(Y=y.current)==null?void 0:Y.splide)!=null&&se.root))return;const v=y.current.splide.root,q=30,K=(oe,pe)=>{if(F.current){const we=Math.abs(oe-F.current.x),$e=Math.abs(pe-F.current.y);(we>0||$e>0)&&(j.current=!0)}},Q=oe=>{F.current&&(oe.preventDefault(),K(oe.clientX,oe.clientY))},ie=oe=>{F.current&&oe.touches.length>0&&(oe.preventDefault(),K(oe.touches[0].clientX,oe.touches[0].clientY))},re=(oe,pe)=>{if(!F.current||!y.current){F.current=null;return}const we=Math.abs(oe-F.current.x),$e=Math.abs(pe-F.current.y);$e>q&&$e>we&&y.current.go(pe<F.current.y?"+1":"-1"),F.current=null},ne=oe=>{F.current&&re(oe.clientX,oe.clientY),document.removeEventListener("pointerup",ne),document.removeEventListener("pointercancel",ne),document.removeEventListener("pointermove",Q)},ue=oe=>{if(F.current){if(oe.changedTouches.length>0){const pe=oe.changedTouches[0];re(pe.clientX,pe.clientY)}document.removeEventListener("touchend",ue),document.removeEventListener("touchcancel",ue),document.removeEventListener("touchmove",ie)}},z=oe=>{F.current={x:oe.clientX,y:oe.clientY},j.current=!1,document.addEventListener("pointermove",Q,{passive:!1}),document.addEventListener("pointerup",ne),document.addEventListener("pointercancel",ne)},X=oe=>{oe.touches.length>0&&(F.current={x:oe.touches[0].clientX,y:oe.touches[0].clientY},j.current=!1,document.addEventListener("touchmove",ie,{passive:!1}),document.addEventListener("touchend",ue),document.addEventListener("touchcancel",ue))};return v.addEventListener("pointerdown",z),v.addEventListener("touchstart",X),()=>{v.removeEventListener("pointerdown",z),v.removeEventListener("touchstart",X),document.removeEventListener("pointermove",Q),document.removeEventListener("pointerup",ne),document.removeEventListener("pointercancel",ne),document.removeEventListener("touchmove",ie),document.removeEventListener("touchend",ue),document.removeEventListener("touchcancel",ue),F.current=null,j.current=!1}},[e,G,l]);const me={backgroundColor:L.color,backdropFilter:`blur(${L.blur}px)`,animationDuration:`${parseInt(B.duration)}ms`,animationTimingFunction:"ease",animationFillMode:"both"};return typeof document>"u"||!document.getElementById(a)?null:vr.createPortal(s.jsxs(s.Fragment,{children:[s.jsx("div",{ref:i?null:E,className:ye(O.background,S?te:ae,{[O.editor]:i},{[O.hidden]:!e}),style:{...me,...p&&!i&&!S?{position:"absolute"}:{}}}),s.jsxs("div",{ref:i?E:null,className:ye(O.contentStyle,S?ce:Z,{[O.editor]:i},{[O.hidden]:!e}),style:{animationDuration:`${parseInt(B.duration)}ms`,animationTimingFunction:"ease",animationFillMode:"both"},children:[s.jsx(ur,{onMove:v=>m(v.index),ref:y,className:O.lightboxSplide,options:{arrows:!1,speed:f.duration?parseInt(f.duration):500,direction:f.direction==="horiz"||f.type==="fade"||f.type==="scale"?"ltr":"ttb",pagination:!1,drag:U.type==="drag"&&!G,perPage:1,width:"100%",height:"100%",type:f.type==="fade"||f.type==="scale"?"fade":"loop",padding:0,rewind:U.repeat!=="close",start:0},style:{"--splide-speed":f.duration},children:n.map((v,q)=>{const K=Ut(R.position,R.offset,i),Q=`${$.scalingValue(R.padding.top,i)} ${$.scalingValue(R.padding.right,i)} ${$.scalingValue(R.padding.bottom,i)} ${$.scalingValue(R.padding.left,i)}`,ie=f.type==="scale"?(()=>{const{transform:re,...ne}=K;return{...ne,position:"absolute",padding:Q,boxSizing:"border-box","--position-transform":re||"none"}})():{...K,position:"absolute",padding:Q,boxSizing:"border-box"};return s.jsx(pr,{children:s.jsx("div",{className:O.imgWrapper,onClick:de,children:s.jsx("img",{ref:q===c?D:null,className:ye(O.imageStyle,{[O.contain]:v.image.objectFit==="contain",[O.cover]:v.image.objectFit==="cover",[O.scaleSlide]:f.type==="scale"}),src:v.image.url,alt:v.image.name??"",style:{...ie,pointerEvents:v.image.objectFit==="contain"?"none":"auto"}})})},q)})},l),k.isActive&&s.jsxs(s.Fragment,{children:[s.jsx("div",{className:ye(O.arrow,{[O.arrowVertical]:f.direction==="vert"}),style:{color:k.color,"--arrow-hover-color":k.hover},children:s.jsxs("button",{className:O.arrowInner,style:{transform:`translate(${$.scalingValue(k.offset.x,i)}, ${$.scalingValue(k.offset.y*(f.direction==="horiz"?1:-1),i)}) scale(${k.scale}) rotate(${f.direction==="horiz"?"0deg":"90deg"})`},onClick:()=>{var v;return(v=y.current)==null?void 0:v.go("-1")},"aria-label":"Previous",children:[k.arrowsImgUrl&&s.jsx(Ke,{url:k.arrowsImgUrl,fill:k.color,hoverFill:k.hover,className:ye(O.arrowImg,O.mirror)}),!k.arrowsImgUrl&&s.jsx($o,{color:k.color,className:ye(O.arrowIcon,O.arrowImg,O.mirror)})]})}),s.jsx("div",{className:ye(O.arrow,O.nextArrow,{[O.arrowVertical]:f.direction==="vert"}),style:{color:k.color,"--arrow-hover-color":k.hover},children:s.jsxs("button",{className:O.arrowInner,style:{transform:`translate(${$.scalingValue(k.offset.x*(f.direction==="horiz"?-1:1),i)}, ${$.scalingValue(k.offset.y,i)}) scale(${k.scale}) rotate(${f.direction==="horiz"?"0deg":"90deg"})`},onClick:()=>{var v;return(v=y.current)==null?void 0:v.go("+1")},"aria-label":"Next",children:[k.arrowsImgUrl&&s.jsx(Ke,{url:k.arrowsImgUrl,fill:k.color,hoverFill:k.hover,className:O.arrowImg}),!k.arrowsImgUrl&&s.jsx($o,{color:k.color,className:ye(O.arrowIcon,O.arrowImg)})]})})]}),L.closeIconUrl&&(()=>{const v=Ut(L.closeIconAlign,L.closeIconOffset,i),q=`scale(${L.closeIconScale})`,K=v.transform?`${v.transform} ${q}`:q;return s.jsx("button",{className:O.closeButton,style:{...v,transform:K},onClick:ee,"aria-label":"Close lightbox",children:s.jsx(Ke,{url:L.closeIconUrl,fill:L.closeIconColor??"#000000",hoverFill:L.closeIconHover??"#cccccc"})})})(),T&&T.isActive&&o.imageCaption&&((V=n[c])==null?void 0:V.imageCaption)&&(()=>{const{widthSettings:v,fontSettings:q,letterSpacing:K,textAlign:Q,wordSpacing:ie,fontSizeLineHeight:re,textAppearance:ne,color:ue}=o.imageCaption;return s.jsx("div",{className:O.caption,style:{...Ut(T.alignment,T.offset,i),fontFamily:yn(q.fontFamily),fontWeight:q.fontWeight,fontStyle:q.fontStyle,width:v.sizing==="auto"?"max-content":$.scalingValue(v.width,i),letterSpacing:$.scalingValue(K,i),wordSpacing:$.scalingValue(ie,i),textAlign:Q,fontSize:$.scalingValue(re.fontSize,i),lineHeight:$.scalingValue(re.lineHeight,i),textTransform:ne.textTransform??"none",textDecoration:ne.textDecoration??"none",fontVariant:ne.fontVariant??"normal",color:ue},onClick:z=>z.stopPropagation(),children:s.jsx("div",{"data-styles":"imageCaption",className:O.captionTextInner,style:{"--link-color":T.linkColor,"--link-hover-color":T.linkHoverColor},children:s.jsx(Mt,{content:n[c].imageCaption})})})})(),I.isActive&&(()=>{const[v,q]=I.position.split("-"),K=f.direction==="horiz"?`${v}-left`:I.position,Q=Ut(K,I.offset,i),ie=()=>{if(f.direction==="horiz"){if(q==="left")return"flex-start";if(q==="center")return"center";if(q==="right")return"flex-end"}else{if(v==="top")return"flex-start";if(v==="middle")return"center";if(v==="bottom")return"flex-end"}return"flex-start"};return s.jsx("div",{ref:M,className:O.thumbsWrapper,onClick:re=>ge(re),style:{position:i?"absolute":"fixed",...Q,...f.direction==="horiz"?{maxWidth:"100vw",width:"100%",overflowX:"auto",overflowY:"hidden"}:{maxHeight:"100vh",overflowY:"auto",overflowX:"hidden"}},children:s.jsx("div",{className:ye(O.thumbsContainer,{[O.thumbsContainerVertical]:f.direction==="vert",[O.thumbsAlignStart]:I.align==="start",[O.thumbsAlignCenter]:I.align==="center",[O.thumbsAlignEnd]:I.align==="end"}),style:{gap:$.scalingValue(I.grid.gap,i),justifyContent:N?"flex-start":ie()},children:n.map((re,ne)=>{const ue=ne===c,z=x[ne],Y=I.grid.size*(ue?I.activeState.scale:1),se=()=>{if(I.fit!=="fit")return{};if(!z)return f.direction==="horiz"?{height:$.scalingValue(Y,i)}:{width:$.scalingValue(Y,i)};const oe=z.width/z.height;if(f.direction==="horiz"){const pe=Y,we=pe*oe;return{width:$.scalingValue(we,i),height:$.scalingValue(pe,i)}}else{const pe=Y,we=pe/oe;return{width:$.scalingValue(pe,i),height:$.scalingValue(we,i)}}};return s.jsx("button",{className:O.thumbItem,style:{...f.direction==="horiz"&&I.fit!=="fit"?{height:$.scalingValue(Y,i)}:{},...f.direction==="vert"&&I.fit!=="fit"?{width:$.scalingValue(Y,i)}:{},...I.fit==="cover"?{width:$.scalingValue(Y,i),height:$.scalingValue(Y,i)}:{},...se(),transition:ue?"all 0.25s ease-out":"none",opacity:ue?I.activeState.opacity/100:I.opacity/100,"--thumb-hover":I.activeState.opacity/100},onClick:oe=>{var pe;oe.stopPropagation(),m(ne),(pe=y.current)==null||pe.go(ne)},onMouseEnter:()=>{var oe;I.triggers==="hov"&&((oe=y.current)==null||oe.go(ne))},children:s.jsx("img",{src:re.image.url,alt:re.image.name??"",onLoad:oe=>{const pe=oe.currentTarget;pe.naturalWidth&&pe.naturalHeight&&h(we=>({...we,[ne]:{width:pe.naturalWidth,height:pe.naturalHeight}}))},style:{objectFit:I.fit==="cover"?"cover":"contain",...I.fit==="fit"?{maxWidth:"100%",maxHeight:"100%",objectFit:"contain"}:{},...I.fit==="cover"?{width:"100%",height:"100%"}:{}}})},`${re.image.name}-${ne}`)})})})})()]})]}),document.getElementById(a))};function $o({color:e,className:t}){return s.jsx("svg",{viewBox:"0 0 10 18",className:t,children:s.jsx("g",{id:"Symbols",stroke:"none",strokeWidth:"1",fillRule:"evenodd",children:s.jsx("path",{d:"M-3.70710678,4.29289322 C-3.34662282,3.93240926 -2.77939176,3.90467972 -2.38710056,4.20970461 L-2.29289322,4.29289322 L5,11.585 L12.2928932,4.29289322 C12.6533772,3.93240926 13.2206082,3.90467972 13.6128994,4.20970461 L13.7071068,4.29289322 C14.0675907,4.65337718 14.0953203,5.22060824 13.7902954,5.61289944 L13.7071068,5.70710678 L5.70710678,13.7071068 C5.34662282,14.0675907 4.77939176,14.0953203 4.38710056,13.7902954 L4.29289322,13.7071068 L-3.70710678,5.70710678 C-4.09763107,5.31658249 -4.09763107,4.68341751 -3.70710678,4.29289322 Z",id:"Shape-Copy",fill:e,transform:"translate(5, 9) rotate(-90) translate(-5, -9)"})})})}const ws={element:Ss,id:"lightbox",name:"Lightbox",preview:{type:"image",url:"https://cdn.cntrl.site/component-assets/lightboxImg.png"},defaultSize:{width:440,height:550},fontSettingsPaths:{content:[],parameters:[{path:"styles.imageCaption.fontSettings"}]},assetsPaths:{content:[{path:"image.url",placeholderEnabled:!0}],parameters:[{path:"settings.thumbnailBlock.cover.url",placeholderEnabled:!0},{path:"settings.controls.arrowsImgUrl"},{path:"settings.area.closeIconUrl"}]},schema:{type:"object",properties:{settings:{type:"object",properties:{thumbnailBlock:{display:{type:"settings-block",triggerEvent:"close"},type:"object",properties:{cover:{title:"COVER",icon:"cover",tooltip:"Cover Image",type:"object",properties:{url:{type:"string",display:{type:"cover-image-input"}}}}}},lightboxBlock:{display:{type:"settings-block",triggerEvent:"open"},type:"object",properties:{appear:{title:"APPEAR",icon:"transition",tooltip:"Appearance",type:"object",properties:{type:{type:"string",display:{type:"ratio-group"},enum:["slide in","fade in","mix"]},duration:{type:"string",label:"T",display:{type:"step-selector"},enum:["100ms","250ms","500ms","1000ms","1500ms","2000ms"]},direction:{type:"string",title:"From",display:{type:"direction-control"},enum:["top","left","right","bottom"]}}},triggers:{title:"TRIGGERS",icon:"target",tooltip:"Triggers",type:"object",properties:{type:{type:"string",display:{type:"ratio-group"},enum:["click","drag"]},switch:{type:"string",display:{type:"ratio-group"},enum:["image","50/50"]},repeat:{type:"string",title:"Repeat",display:{visible:!1,type:"ratio-group"},enum:["close","loop"]}}},slider:{title:"SLIDER",icon:"horizontal-resize",tooltip:"Slider",type:"object",properties:{type:{type:"string",display:{type:"ratio-group"},enum:["slide","fade","scale"]},direction:{type:"string",display:{type:"ratio-group"},enum:["horiz","vert"]},duration:{type:"string",label:"T",display:{type:"step-selector"},enum:["100ms","250ms","500ms","1000ms","1500ms","2000ms"]}}},thumbnail:{title:"THUMB",icon:"thumbnail",tooltip:"Thumbnail",type:"object",properties:{isActive:{type:"boolean",display:{type:"setting-toggle"}},position:{display:{type:"align-grid"},type:"string",enum:["top-left","top-center","top-right","middle-left","middle-center","middle-right","bottom-left","bottom-center","bottom-right"]},fit:{type:"string",display:{type:"ratio-group"},enum:["cover","fit"]},align:{type:"string",title:"Align",display:{type:"align-group",direction:"horizontal"},enum:["start","center","end"]},triggers:{type:"string",title:"Triggers",display:{type:"ratio-group",direction:"horizontal"},enum:["clk","hov"]},grid:{type:"object",title:"Grid",display:{type:"group"},properties:{size:{type:"number",label:"Box",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}},gap:{type:"number",label:"Gap",scalingEnabled:!0,min:0,display:{type:"numeric-input"}}}},offset:{type:"object",title:"Offset",display:{type:"group"},properties:{x:{type:"number",label:"X",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}},y:{type:"number",label:"Y",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}}}},opacity:{type:"number",title:"Opacity",label:"icon:opacity",min:0,max:100,step:1,display:{type:"numeric-input"}},activeState:{type:"object",title:"ACTIVE",display:{type:"group"},properties:{scale:{type:"number",title:"Scale",min:1,max:5,step:.1,display:{type:"range-control"}},opacity:{type:"number",title:"Opacity",label:"icon:opacity",min:0,max:100,step:1,display:{type:"numeric-input"}}}}}},layout:{title:"LAYOUT",icon:"layout",tooltip:"Layout",type:"object",properties:{position:{display:{type:"align-grid"},type:"string",enum:["top-left","top-center","top-right","middle-left","middle-center","middle-right","bottom-left","bottom-center","bottom-right"]},offset:{type:"object",title:"Offset",display:{type:"group"},properties:{x:{type:"number",label:"X",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}},y:{type:"number",label:"Y",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}}}},padding:{type:"object",title:"Padding",display:{type:"padding-controls"},properties:{top:{min:0,step:1,type:"number"},left:{min:0,step:1,type:"number"},right:{min:0,step:1,type:"number"},bottom:{min:0,step:1,type:"number"}}}}},controls:{title:"CONTROLS",icon:"controls",tooltip:"Controls",type:"object",properties:{isActive:{type:"boolean",display:{type:"setting-toggle"}},arrowsImgUrl:{type:["string","null"],display:{type:"settings-image-input"}},offset:{title:"Offset",type:"object",display:{type:"group"},properties:{x:{type:"number",label:"X",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}},y:{type:"number",label:"Y",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}}}},scale:{type:"number",title:"Scale",min:.5,max:5,step:.1,display:{type:"range-control"}},color:{title:"Color",type:"string",display:{type:"settings-color-picker",format:"single"}},hover:{title:"Hover",type:"string",display:{type:"settings-color-picker",format:"single"}}}},area:{title:"AREA",icon:"area",tooltip:"Area",type:"object",properties:{color:{type:"string",display:{type:"settings-color-picker",format:"single"}},blur:{type:"number",label:"icon:blur",display:{type:"numeric-input"}},closeIconUrl:{type:["string","null"],title:"Close Icon",display:{type:"settings-image-input"}},closeIconAlign:{display:{type:"align-grid",direction:"horizontal"},type:"string",enum:["top-left","top-center","top-right","middle-left","middle-center","middle-right","bottom-left","bottom-center","bottom-right"]},closeIconScale:{type:"number",title:"Scale",min:.5,max:5,step:.1,display:{type:"range-control"}},closeIconOffset:{type:"object",title:"Offset",display:{type:"group"},properties:{x:{type:"number",label:"X",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}},y:{type:"number",label:"Y",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}}}},closeIconColor:{title:"Color",type:"string",display:{type:"settings-color-picker",format:"single"}},closeIconHover:{title:"Hover",type:"string",display:{type:"settings-color-picker",format:"single"}}}},caption:{title:"DESC",icon:"text-icon",tooltip:"Description",type:"object",properties:{isActive:{type:"boolean",display:{type:"setting-toggle"}},alignment:{type:"string",display:{type:"align-grid"},enum:["top-left","top-center","top-right","middle-left","middle-center","middle-right","bottom-left","bottom-center","bottom-right"]},offset:{title:"Offset",type:"object",display:{type:"group"},properties:{x:{type:"number",label:"X",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}},y:{type:"number",label:"Y",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}}}},linkColor:{title:"Link",type:"string",display:{type:"settings-color-picker",format:"single"}},linkHoverColor:{title:"Link Hov",type:"string",display:{type:"settings-color-picker",format:"single"}}}}}}},default:{d:{thumbnailBlock:{cover:{url:"https://cdn.cntrl.site/component-assets/Cover.jpg"}},lightboxBlock:{appear:{type:"slide in",duration:"1000ms",direction:"bottom"},triggers:{type:"click",switch:"image",repeat:"loop"},slider:{type:"slide",direction:"vert",duration:"1000ms"},thumbnail:{isActive:!0,position:"middle-left",fit:"fit",align:"start",triggers:"hov",grid:{size:.05,gap:.01},offset:{x:.01,y:0},opacity:50,activeState:{scale:1,opacity:100}},layout:{position:"middle-center",offset:{x:0,y:0},padding:{top:.06,right:0,bottom:.06,left:0}},controls:{isActive:!1,arrowsImgUrl:null,offset:{x:0,y:0},scale:1,color:"#000000",hover:"#cccccc"},area:{color:"rgba(28,31,34,0.9)",blur:0,closeIconUrl:null,closeIconColor:"#000000",closeIconHover:"#cccccc",closeIconAlign:"top-right",closeIconOffset:{x:0,y:0},closeIconScale:1},caption:{isActive:!0,alignment:"middle-center",offset:{x:0,y:0},linkColor:"#cccccc",linkHoverColor:"#cccccc"}}},m:{thumbnailBlock:{cover:{url:"https://cdn.cntrl.site/component-assets/Cover.jpg"}},lightboxBlock:{appear:{type:"fade in",duration:"500ms",direction:"bottom"},triggers:{type:"click",switch:"image",repeat:"loop"},slider:{type:"slide",direction:"horiz",duration:"1000ms"},thumbnail:{isActive:!0,position:"bottom-center",fit:"fit",align:"start",triggers:"hov",grid:{size:.1,gap:.05},offset:{x:.01,y:-.05},opacity:50,activeState:{scale:1,opacity:100}},layout:{position:"middle-center",offset:{x:0,y:0},padding:{top:.06,right:.05,bottom:.06,left:.05}},controls:{isActive:!1,arrowsImgUrl:null,offset:{x:0,y:0},scale:1,color:"#000000",hover:"#cccccc"},area:{color:"rgba(28,31,34,0.9)",blur:0,closeIconUrl:null,closeIconColor:"#000000",closeIconHover:"#cccccc",closeIconAlign:"top-right",closeIconOffset:{x:0,y:0},closeIconScale:1},caption:{isActive:!0,alignment:"middle-center",offset:{x:0,y:0},hover:"#cccccc"}}},t:{thumbnailBlock:{cover:{url:"https://cdn.cntrl.site/component-assets/Cover.jpg"}},lightboxBlock:{appear:{type:"fade in",duration:"500ms",direction:"bottom"},triggers:{type:"click",switch:"image",repeat:"loop"},slider:{type:"slide",direction:"vert",duration:"1000ms"},thumbnail:{isActive:!0,position:"middle-left",fit:"fit",align:"start",triggers:"hov",grid:{size:.05,gap:.01},offset:{x:.03,y:0},opacity:50,activeState:{scale:1,opacity:100}},layout:{position:"middle-center",offset:{x:0,y:0},padding:{top:.06,right:.1,bottom:.06,left:.1}},controls:{isActive:!1,arrowsImgUrl:null,offset:{x:0,y:0},scale:1,color:"#000000",hover:"#cccccc"},area:{color:"rgba(28,31,34,0.9)",blur:0,closeIconUrl:null,closeIconColor:"#000000",closeIconHover:"#cccccc",closeIconAlign:"top-right",closeIconOffset:{x:0,y:0},closeIconScale:1},caption:{isActive:!0,alignment:"middle-center",offset:{x:0,y:0},hover:"#cccccc"}}}},displayRules:[{if:{name:"lightboxBlock.appear.type",value:"slide in"},then:{name:"properties.lightboxBlock.properties.appear.properties.direction.display.visible",value:!0}},{if:{name:"lightboxBlock.slider.direction",value:"vert"},then:{name:"properties.lightboxBlock.properties.thumbnail.properties.align.display.direction",value:"vertical"}},{if:{name:"lightboxBlock.appear.type",value:"mix"},then:{name:"properties.lightboxBlock.properties.appear.properties.direction.display.visible",value:!0}},{if:{name:"lightboxBlock.appear.type",value:"fade in"},then:{name:"properties.lightboxBlock.properties.appear.properties.direction.display.visible",value:!1}},{if:[{name:"lightboxBlock.triggers.type",value:"click"},{name:"lightboxBlock.triggers.switch",value:"image"}],then:{name:"properties.lightboxBlock.properties.triggers.properties.repeat.display.visible",value:!0}}]},content:{type:"array",settings:{addItemFromFileExplorer:!0},items:{type:"object",properties:{image:{type:"object",label:"Image",display:{type:"media-input"},properties:{url:{type:"string"},name:{type:"string"},objectFit:{type:"string",enum:["cover","contain"]}},required:["url","name"]},imageCaption:{label:"Description",placeholder:"Add Caption...",display:{type:"rich-text"}}},required:["image"]},default:[{image:{objectFit:"contain",url:"https://cdn.cntrl.site/component-assets/2.jpg",name:"Slider-1.png"},imageCaption:[{type:"paragraph",children:[{text:""}]}]},{image:{objectFit:"contain",url:"https://cdn.cntrl.site/component-assets/3.jpg",name:"Slider-2.png"},imageCaption:[{type:"paragraph",children:[{text:""}]}]},{image:{objectFit:"contain",url:"https://cdn.cntrl.site/component-assets/4.jpg",name:"Slider-3.png"},imageCaption:[{type:"paragraph",children:[{text:""}]}]}]},styles:{type:"object",properties:{imageCaption:{dataName:"caption",type:"object",properties:{fontSettings:{type:"object",display:{type:"font-settings"},properties:{fontFamily:{type:"string"},fontWeight:{type:"number"},fontStyle:{type:"string"}}},widthSettings:{display:{type:"text-width-control"},type:"object",properties:{width:{type:"number"},sizing:{type:"string",enum:["auto","manual"]}}},fontSizeLineHeight:{type:"object",display:{type:"font-size-line-height"},properties:{fontSize:{type:"number"},lineHeight:{type:"number"}}},letterSpacing:{display:{type:"letter-spacing-input"},type:"number"},wordSpacing:{display:{type:"word-spacing-input"},type:"number"},textAlign:{display:{type:"text-align-control"},type:"string",enum:["left","center","right","justify"]},textAppearance:{display:{type:"text-appearance"},properties:{textTransform:{type:"string",enum:["none","uppercase","lowercase","capitalize"]},textDecoration:{type:"string",enum:["none","underline"]},fontVariant:{type:"string",enum:["normal","small-caps"]}}},color:{display:{type:"style-panel-color-picker"},type:"string"}}}},default:{imageCaption:{widthSettings:{width:.13,sizing:"auto"},fontSettings:{fontFamily:"Arial",fontWeight:400,fontStyle:"normal"},fontSizeLineHeight:{fontSize:.02,lineHeight:.02},letterSpacing:0,wordSpacing:0,textAlign:"left",textAppearance:{textTransform:"none",textDecoration:"none",fontVariant:"normal"},color:"#000000"}}}},required:["settings","content","styles"]}};function Gt(e){return`calc(var(--cntrl-article-width, 100vw) * ${e/1440})`}function $s(e){return`
+ */const va="RichTextRenderer-module__link___BWeZ2",ba={link:va},xa=e=>{const t=e.trim();return!t||t.startsWith('"')&&t.endsWith('"')||t.startsWith("'")&&t.endsWith("'")?!1:t.split(/\s+/g).filter(Boolean).some(o=>/^\d/.test(o))},yn=e=>e&&e.split(",").map(n=>n.trim()).filter(Boolean).map(n=>xa(n)?`"${n.replace(/"/g,'\\"')}"`:n).join(", ");function ht(e){const{color:t,...n}=e;return n}function Re(e,t){var n,o,r;return{fontFamily:yn(e.fontSettings.fontFamily),fontWeight:e.fontSettings.fontWeight,fontStyle:e.fontSettings.fontStyle,letterSpacing:$.scalingValue(e.letterSpacing,t),wordSpacing:$.scalingValue(e.wordSpacing,t),fontSize:$.scalingValue(e.fontSize,t),lineHeight:e.lineHeight!==void 0?$.scalingValue(e.lineHeight,t):void 0,textTransform:(n=e.textAppearance)==null?void 0:n.textTransform,textDecoration:(o=e.textAppearance)==null?void 0:o.textDecoration,fontVariant:(r=e.textAppearance)==null?void 0:r.fontVariant,color:e.color}}const Mt=({content:e})=>{const t=n=>n.map((o,r)=>o.type==="link"?s.jsx("a",{className:ba.link,href:o.value,target:o.target,children:t(o.children)},r):s.jsx("span",{style:Sa(o),children:o.text},r));return s.jsx(s.Fragment,{children:e.map((n,o)=>{const r=n.children;return s.jsx("div",{children:t(r)},o)})})};function Sa(e){return{...e.fontFamily&&{fontFamily:yn(e.fontFamily)},...e.fontWeight&&{fontWeight:e.fontWeight},...e.fontStyle&&{fontStyle:e.fontStyle},...e.textDecoration&&{textDecoration:e.textDecoration},...e.textTransform&&{textTransform:e.textTransform},...e.fontVariant&&{fontVariant:e.fontVariant},...e.verticalAlign&&{verticalAlign:e.verticalAlign,lineHeight:"0px"}}}const Ca="SvgImage-module__svg___q3xE-",wa="SvgImage-module__img___VsTm-",vo={svg:Ca,img:wa},$a=e=>{const t=e.trim();return t.startsWith("data:image/svg+xml")?!0:(t.split(/[?#]/)[0]??t).endsWith(".svg")},Ta=e=>`url("${e.replace(/\\/g,"\\\\").replace(/"/g,'\\"')}")`,Ke=({url:e,fill:t="#000000",hoverFill:n="#CCCCCC",className:o="",style:r})=>{const[a,i]=w.useState(()=>typeof window>"u"?!0:CSS.supports("mask-image",'url("")')||CSS.supports("-webkit-mask-image",'url("")'));return w.useEffect(()=>{if(typeof window<"u"&&window.CSS){const u=CSS.supports("mask-image",'url("")')||CSS.supports("-webkit-mask-image",'url("")');i(u)}},[]),!$a(e)||!a?s.jsx("img",{src:e,alt:"",className:ye(vo.img,o),style:r}):s.jsx("span",{"data-supports-mask":a,className:ye(vo.svg,o),style:{"--svg":Ta(e),"--fill":t,"--hover-fill":n,...r??{}}})},_a={"top-left":J.topLeftAlignment,"top-center":J.topCenterAlignment,"top-right":J.topRightAlignment,"middle-left":J.middleLeftAlignment,"middle-center":J.middleCenterAlignment,"middle-right":J.middleRightAlignment,"bottom-left":J.bottomLeftAlignment,"bottom-center":J.bottomCenterAlignment,"bottom-right":J.bottomRightAlignment};function Ea({settings:e,content:t,styles:n,isEditor:o}){const[r,a]=w.useState(null),{widthSettings:i,fontSettings:u,letterSpacing:c,textAlign:m,wordSpacing:l,fontSizeLineHeight:A,textAppearance:S,color:g}=n.imageCaption,[p,d]=w.useState(void 0),[x,h]=w.useState(null),[y,_]=w.useState(0),[D,W]=w.useState(0),{direction:E,transition:b,controls:C,pagination:F,imageCaption:j,triggers:M}=e,N=w.useRef(b.type),{x:H,y:B}=e.controls.offset,U=f=>{r&&r.go(f)};return w.useEffect(()=>{if(!x)return;const f=new ResizeObserver(I=>{if(!r)return;const[k]=I;d({width:Math.round(k.contentRect.width),height:Math.round(k.contentRect.height)})});return f.observe(x),()=>f.unobserve(x)},[x]),w.useEffect(()=>{!r||N.current===b.type||(W(f=>f+1),N.current=b.type)},[b.type]),s.jsx("div",{className:ye(J.wrapper,{[J.editor]:o}),ref:h,children:s.jsxs("div",{className:J.sliderInner,style:{width:p?p.width:"100%",height:p?p.height:"100%",backgroundColor:b.backgroundColor&&b.type==="fade in"?b.backgroundColor:"transparent"},children:[e.imageCaption.isActive&&s.jsx("div",{className:ye(J.captionBlock),children:s.jsx("div",{className:J.captionTextWrapper,children:t.map((f,I)=>s.jsx("div",{className:ye(J.captionText,_a[j.alignment],{[J.withPointerEvents]:I===y&&o,[J.active]:I===y}),style:{fontFamily:yn(u.fontFamily),fontWeight:u.fontWeight,fontStyle:u.fontStyle,width:i.sizing==="auto"?"max-content":$.scalingValue(i.width,o),letterSpacing:$.scalingValue(c,o),wordSpacing:$.scalingValue(l,o),textAlign:m,fontSize:$.scalingValue(A.fontSize,o),lineHeight:$.scalingValue(A.lineHeight,o),textTransform:S.textTransform??"none",textDecoration:S.textDecoration??"none",fontVariant:S.fontVariant??"normal",color:g,transitionDuration:b.duration?`${Math.round(parseInt(b.duration)/2)}ms`:"500ms"},children:s.jsx("div",{"data-styles":"imageCaption",className:J.captionTextInner,style:{"--link-hover-color":j.linkHoverColor,"--link-color":j.linkColor,position:"relative",top:$.scalingValue(j.offset.y,o),left:$.scalingValue(j.offset.x,o)},children:s.jsx(Mt,{content:f.imageCaption})})},I))})}),s.jsx(ur,{onMove:f=>{_(f.index)},ref:a,options:{arrows:!1,speed:b.duration?parseInt(b.duration):500,autoplay:M.autoPlay!==null,...M.autoPlay!==null&&{interval:parseInt(M.autoPlay)*1e3},direction:E==="horiz"||b.type==="fade in"?"ltr":"ttb",pagination:!1,drag:M.triggersList.drag,perPage:1,width:p?p.width:"100%",height:p?p.height:"100%",type:b.type==="fade in"?"fade":"loop",rewind:!0},children:t.map((f,I)=>s.jsx(pr,{children:s.jsx("div",{className:J.sliderItem,children:s.jsx("div",{className:J.imgWrapper,children:s.jsx("img",{className:ye(J.sliderImage,{[J.contain]:f.image.objectFit==="contain",[J.cover]:f.image.objectFit==="cover"}),src:f.image.url,alt:f.image.name??""})})})},I))},D),C.isActive&&s.jsxs(s.Fragment,{children:[s.jsx("div",{className:ye(J.arrow,{[J.arrowVertical]:E==="vert",[J.hoverArrow]:C.show==="on hover"}),style:{color:C.color,"--arrow-hover-color":C.hover},children:s.jsxs("button",{onClick:()=>{U("-1")},className:J.arrowInner,style:{transform:`translate(${$.scalingValue(H,o)}, ${$.scalingValue(B*(E==="horiz"?1:-1),o)}) scale(${e.controls.scale/100}) rotate(${E==="horiz"?"0deg":"90deg"})`},children:[C.arrowsImgUrl&&s.jsx(Ke,{url:C.arrowsImgUrl,fill:C.color,hoverFill:C.hover,className:ye(J.arrowImg,J.mirror)}),!C.arrowsImgUrl&&s.jsx(bo,{color:C.color,className:ye(J.arrowIcon,J.arrowImg,J.mirror)})]})}),s.jsx("div",{className:ye(J.arrow,J.nextArrow,{[J.arrowVertical]:E==="vert",[J.hoverArrow]:C.show==="on hover"}),style:{color:C.color,"--arrow-hover-color":C.hover},children:s.jsxs("button",{className:J.arrowInner,onClick:()=>U("+1"),style:{transform:`translate(${$.scalingValue(H*(E==="horiz"?-1:1),o)}, ${$.scalingValue(B,o)}) scale(${e.controls.scale/100}) rotate(${E==="horiz"?"0deg":"90deg"})`},children:[C.arrowsImgUrl&&s.jsx(Ke,{url:C.arrowsImgUrl,fill:C.color,hoverFill:C.hover,className:J.arrowImg}),!C.arrowsImgUrl&&s.jsx(bo,{color:C.color,className:ye(J.arrowIcon,J.arrowImg)})]})})]}),M.triggersList.click&&s.jsx("div",{className:J.clickOverlay,onClick:()=>{r&&r.go("+1")}}),F.isActive&&s.jsx("div",{className:ye(J.pagination,{[J.paginationInsideBottom]:F.position==="inside-1"&&E==="horiz",[J.paginationInsideTop]:F.position==="inside-2"&&E==="horiz",[J.paginationOutsideBottom]:F.position==="outside-1"&&E==="horiz",[J.paginationOutsideTop]:F.position==="outside-2"&&E==="horiz",[J.paginationInsideLeft]:F.position==="inside-1"&&E==="vert",[J.paginationInsideRight]:F.position==="inside-2"&&E==="vert",[J.paginationOutsideLeft]:F.position==="outside-1"&&E==="vert",[J.paginationOutsideRight]:F.position==="outside-2"&&E==="vert",[J.paginationVertical]:E==="vert"}),children:s.jsx("div",{className:J.paginationInner,style:{backgroundColor:F.colors[2],transform:`scale(${F.scale/100}) translate(${$.scalingValue(F.offset.x,o)}, ${$.scalingValue(F.offset.y,o)}) rotate(${E==="horiz"?"0deg":"90deg"})`},children:t.map((f,I)=>s.jsx("button",{onClick:()=>{r&&r.go(I)},className:ye(J.paginationItem),children:s.jsx("div",{className:ye(J.dot,{[J.activeDot]:I===y}),style:{backgroundColor:I===y?F.colors[0]:F.colors[1],"--pagination-hover-color":F.hover}})},I))})})]})})}function bo({color:e,className:t}){return s.jsx("svg",{viewBox:"0 0 10 18",className:t,children:s.jsx("g",{id:"Symbols",stroke:"none",strokeWidth:"1",fillRule:"evenodd",children:s.jsx("path",{d:"M-3.70710678,4.29289322 C-3.34662282,3.93240926 -2.77939176,3.90467972 -2.38710056,4.20970461 L-2.29289322,4.29289322 L5,11.585 L12.2928932,4.29289322 C12.6533772,3.93240926 13.2206082,3.90467972 13.6128994,4.20970461 L13.7071068,4.29289322 C14.0675907,4.65337718 14.0953203,5.22060824 13.7902954,5.61289944 L13.7071068,5.70710678 L5.70710678,13.7071068 C5.34662282,14.0675907 4.77939176,14.0953203 4.38710056,13.7902954 L4.29289322,13.7071068 L-3.70710678,5.70710678 C-4.09763107,5.31658249 -4.09763107,4.68341751 -3.70710678,4.29289322 Z",id:"Shape-Copy",fill:e,transform:"translate(5, 9) rotate(-90) translate(-5, -9)"})})})}const Aa={element:Ea,id:"control-slider",name:"Slider",preview:{type:"image",url:"https://cdn.cntrl.site/component-assets/sliderImg.png"},defaultSize:{width:400,height:400},assetsPaths:{content:[{path:"image.url",placeholderEnabled:!0}],parameters:[{path:"settings.controls.arrowsImgUrl"}]},fontSettingsPaths:{content:[],parameters:[{path:"styles.imageCaption.fontSettings"}]},schema:{type:"object",properties:{settings:{type:"object",display:{type:"settings-block"},properties:{triggers:{title:"triggers",icon:"target",tooltip:"Triggers",type:"object",properties:{triggersList:{type:"object",display:{type:"toggle-ratio-group"},properties:{click:{type:"boolean"},drag:{type:"boolean"}}},autoPlay:{type:["string","null"],label:"Auto",display:{type:"step-selector"},enum:[null,"1s","2s","3s","4s","5s"]}}},direction:{icon:"horizontal-resize",tooltip:"Direction",type:"string",display:{type:"ratio-group"},enum:["horiz","vert"]},transition:{title:"transit",icon:"transition",tooltip:"Transition",type:"object",properties:{type:{type:"string",display:{type:"ratio-group"},enum:["slide","fade in"]},backgroundColor:{type:["string","null"],title:"BG Color",display:{visible:!1,type:"settings-color-picker",format:"single"}},duration:{type:"string",label:"icon:hourglass",display:{type:"step-selector"},enum:["100ms","250ms","500ms","1000ms","1500ms","2000ms"]}}},controls:{title:"controls",icon:"controls",tooltip:"Controls",type:"object",properties:{isActive:{type:"boolean",display:{type:"setting-toggle"}},arrowsImgUrl:{type:["string","null"],display:{type:"settings-image-input"}},offset:{type:"object",title:"Offset",display:{type:"group"},properties:{x:{type:"number",label:"X",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}},y:{type:"number",label:"Y",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}}}},scale:{type:"number",title:"scale",min:50,max:600,display:{type:"range-control"}},color:{title:"color",type:"string",display:{type:"settings-color-picker",format:"single"}},hover:{title:"hover",type:"string",display:{type:"settings-color-picker",format:"single"}},show:{title:"Show",type:"string",display:{type:"ratio-group"},enum:["always","on hover"]}}},pagination:{title:"nav",icon:"pagination",tooltip:"Navigation",type:"object",properties:{isActive:{type:"boolean",display:{type:"setting-toggle"}},position:{display:{type:"socket",direction:"horizontal"},type:"string",enum:["outside-1","outside-2","inside-1","inside-2"]},offset:{type:"object",title:"Offset",display:{type:"group"},properties:{x:{type:"number",label:"X",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}},y:{type:"number",label:"Y",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}}}},scale:{type:"number",title:"scale",min:10,max:400,display:{type:"range-control"}},colors:{display:{type:"settings-color-picker",format:"multiple"},title:"color",type:"array",items:{type:"string"}},hover:{title:"hover",type:"string",display:{type:"settings-color-picker",format:"single"}}}},imageCaption:{title:"Caption",icon:"text-icon",tooltip:"Caption",type:"object",properties:{isActive:{type:"boolean",display:{type:"setting-toggle"}},alignment:{type:"string",display:{type:"align-grid"},enum:["top-left","top-center","top-right","middle-left","middle-center","middle-right","bottom-left","bottom-center","bottom-right"]},offset:{type:"object",title:"Offset",display:{type:"group"},properties:{x:{type:"number",label:"X",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}},y:{type:"number",label:"Y",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}}}},linkColor:{title:"Link",type:"string",display:{type:"settings-color-picker",format:"single"}},linkHoverColor:{title:"Link Hov",type:"string",display:{type:"settings-color-picker",format:"single"}}}}},default:{triggers:{triggersList:{click:!1,drag:!0},autoPlay:null},controls:{isActive:!0,arrowsImgUrl:null,offset:{x:0,y:0},scale:100,color:"#000000",hover:"#cccccc",show:"always"},transition:{type:"slide",duration:"500ms",backgroundColor:null},pagination:{isActive:!0,scale:50,position:"inside-1",offset:{x:0,y:0},colors:["#cccccc","#cccccc","#000000"],hover:"#cccccc"},direction:"horiz",imageCaption:{offset:{x:0,y:0},isActive:!0,alignment:"middle-center",linkColor:"#cccccc",linkHoverColor:"#cccccc"}},displayRules:[{if:{name:"direction",value:"vert"},then:{name:"properties.pagination.properties.position.display.direction",value:"vertical"}},{if:{name:"transition.type",value:"fade in"},then:{name:"properties.transition.properties.backgroundColor.display.visible",value:!0}}]},content:{type:"array",settings:{addItemFromFileExplorer:!0},items:{type:"object",properties:{image:{type:"object",label:"Image",display:{type:"media-input"},properties:{url:{type:"string"},name:{type:"string"},objectFit:{type:"string",enum:["cover","contain"]}},required:["url","name"]},imageCaption:{placeholder:"Add Caption...",label:"Description",display:{type:"rich-text"}}},required:["image"]},default:[{image:{objectFit:"cover",url:"https://cdn.cntrl.site/component-assets/Control-slider-default-picture-1.png",name:"Slider-1.png"},imageCaption:[{type:"paragraph",children:[{text:""}]}]},{image:{objectFit:"cover",url:"https://cdn.cntrl.site/component-assets/Control-slider-default-picture-2.png",name:"Slider-2.png"},imageCaption:[{type:"paragraph",children:[{text:""}]}]},{image:{objectFit:"cover",url:"https://cdn.cntrl.site/component-assets/Control-slider-default-picture-3.png",name:"Slider-3.png"},imageCaption:[{type:"paragraph",children:[{text:""}]}]}]},styles:{type:"object",properties:{imageCaption:{dataName:"caption",type:"object",properties:{fontSettings:{type:"object",display:{type:"font-settings"},properties:{fontFamily:{type:"string"},fontWeight:{type:"number"},fontStyle:{type:"string"}}},widthSettings:{display:{type:"text-width-control"},type:"object",properties:{width:{type:"number"},sizing:{type:"string",enum:["auto","manual"]}}},fontSizeLineHeight:{type:"object",display:{type:"font-size-line-height"},properties:{fontSize:{type:"number"},lineHeight:{type:"number"}}},letterSpacing:{display:{type:"letter-spacing-input"},type:"number"},wordSpacing:{display:{type:"word-spacing-input"},type:"number"},textAlign:{display:{type:"text-align-control"},type:"string",enum:["left","center","right","justify"]},textAppearance:{display:{type:"text-appearance"},properties:{textTransform:{type:"string",enum:["none","uppercase","lowercase","capitalize"]},textDecoration:{type:"string",enum:["none","underline"]},fontVariant:{type:"string",enum:["normal","small-caps"]}}},color:{display:{type:"style-panel-color-picker"},type:"string"}}}},default:{imageCaption:{widthSettings:{width:.13,sizing:"auto"},fontSettings:{fontFamily:"Arial",fontWeight:400,fontStyle:"normal"},fontSizeLineHeight:{fontSize:.02,lineHeight:.02},letterSpacing:0,wordSpacing:0,textAlign:"left",textAppearance:{textTransform:"none",textDecoration:"none",fontVariant:"normal"},color:"#000000"}}}},required:["settings","content","styles"]}},ka="ImageRevealSlider-module__imageRevealSlider___UE5Ob",La="ImageRevealSlider-module__image___Qjt-e",Ia="ImageRevealSlider-module__link___N-iLG",Fa="ImageRevealSlider-module__cursor___2U03d",ut={imageRevealSlider:ka,image:La,link:Ia,cursor:Fa};function xo(e,t,n){for(const o of n){const r=new Image;r.src=o.url;const a=o.width?Number.parseFloat(o.width):r.naturalWidth,i=r.naturalHeight/r.naturalWidth*a,u=a/2,c=i/2;if(e>=o.x-u&&e<=o.x+u&&t>=o.y-c&&t<=o.y+c)return!0}return!1}function wn(e){return new Promise(t=>{const n=new Image;n.src=e,n.onload=()=>{t({width:n.naturalWidth,height:n.naturalHeight})}})}async function Pa(e,t,n,o){let r,a;if(t==="custom"){r=n;const i=await wn(e);a=i.height/i.width*r}else if(t==="random"){r=Math.random()*(o.max-o.min)+o.min;const i=await wn(e);a=i.height/i.width*r}else{const i=await wn(e);r=i.width,a=i.height}return{width:r,height:a,finalWidth:`${r}px`}}function Ma({settings:e,content:t,isEditor:n}){const[o,r]=w.useState(null),[a,i]=w.useState([]),[u,c]=w.useState(0),m=w.useRef(0),[l,A]=w.useState({x:0,y:0}),[S,g]=w.useState(1),[p,d]=w.useState("none"),x=w.useRef({x:0,y:0}),[h,y]=w.useState(!1),{sizeType:_,imageWidth:D,randomRangeImageWidth:W}=e.imageSize,{revealPosition:E,visible:b}=e.position,{cursorType:C,target:F,defaultCursorScale:j,defaultCursor:M,hoverCursorScale:N,hoverCursor:H}=e.cursor;w.useEffect(()=>{if(!o)return;const f=(L,T)=>{const R=o.getBoundingClientRect(),Z=L-R.left,ae=T-R.top;if(A({x:Z,y:ae}),C==="system"){d("none"),g(1);return}const te=Z,ce=ae,P=document.elementFromPoint(R.left+te,R.top+ce);if(P&&P.closest("a")){d("none"),g(1);return}const ee=xo(te,ce,a)||F==="area"?{img:H??"none",scale:N}:{img:M??"none",scale:j};d(ee.img),g(ee.scale)},I=L=>{L.stopPropagation(),x.current={x:L.clientX,y:L.clientY},f(L.clientX,L.clientY)},k=()=>{h&&f(x.current.x,x.current.y)};return o.addEventListener("mousemove",I),window.addEventListener("scroll",k,!0),()=>{o.removeEventListener("mousemove",I),window.removeEventListener("scroll",k,!0)}},[o,h,l,C,F,H,M,N,j,a]),w.useEffect(()=>{h||(d("none"),g(0))},[h]);const B=async(f,I,k,L={})=>{const{width:T,height:R,finalWidth:Z}=await Pa(f.image.url,_,D,W);let ae=0,te=0;E==="same"?(ae=I/2,te=k/2):(ae=L.x??Math.random()*I,te=L.y??Math.random()*k);const ce=Math.min(Math.max(ae,T/2),I-T/2),P=Math.min(Math.max(te,R/2),k-R/2);return{id:m.current++,url:f.image.url,link:f.link,name:f.image.name,x:ce,y:P,width:Z}};w.useEffect(()=>{if(!o||t.length===0)return;const f=o.getBoundingClientRect(),I=f.width,k=f.height,L=[];(async()=>{const R=t[0],Z=await B(R,I,k);L.push(Z),i(L),c(1)})()},[_,D,W,E,o]),w.useEffect(()=>{b==="last One"&&i(f=>f.length>0?[f[f.length-1]]:[])},[b]);const U=async f=>{if(!o)return;const I=o.getBoundingClientRect(),k=f.clientX-I.left,L=f.clientY-I.top;if(F==="image"&&!xo(k,L,a))return;let T=0,R=0;E==="on Click"?(T=k,R=L):E==="same"?(T=I.width/2,R=I.height/2):(T=Math.random()*I.width,R=Math.random()*I.height);const Z=t[u],ae=await B(Z,I.width,I.height,{x:T,y:R});i(te=>b==="all"?[...te,ae]:[ae]),c(te=>te>=t.length-1?0:te+1)};return s.jsxs("div",{ref:r,onClick:U,onMouseEnter:()=>y(!0),onMouseLeave:()=>y(!1),className:ut.imageRevealSlider,style:{cursor:p==="none"?"default":"none"},children:[a.map(f=>s.jsx("div",{className:ut.wrapper,style:{top:`${f.y}px`,left:`${f.x}px`,position:"absolute",transform:"translate(-50%, -50%)",width:f.width??"auto",height:"auto",cursor:p==="none"?"default":"none"},children:F==="area"&&f.link?s.jsx("a",{href:f.link,target:"_blank",className:ut.link,children:s.jsx("img",{src:f.url,alt:f.name,className:ut.image},f.id)}):s.jsx("img",{src:f.url,alt:f.name,className:ut.image},f.id)},f.id)),h&&s.jsx("div",{className:ut.cursor,style:{left:`${l.x}px`,top:`${l.y}px`,transform:`translate(-50%, -50%) scale(${S})`,backgroundImage:`url('${p}')`,backgroundSize:"cover",backgroundPosition:"center",position:"absolute",pointerEvents:"none"}})]})}const Ra={element:Ma,id:"control-image-reveal",name:"Click Gallery",preview:{type:"image",url:"https://cdn.cntrl.site/component-assets/clickGalleryImg.png"},defaultSize:{width:"100%",height:"100%"},assetsPaths:{content:[{path:"image.url",placeholderEnabled:!0}],parameters:[{path:"settings.cursor.defaultCursor"},{path:"settings.cursor.hoverCursor"}]},fontSettingsPaths:{content:[],parameters:[]},schema:{type:"object",properties:{settings:{type:"object",display:{type:"settings-block"},properties:{imageSize:{title:"IMG SIZE",icon:"size",tooltip:"IMG SIZE",type:"object",properties:{sizeType:{type:"string",display:{type:"ratio-group"},enum:["as Is","custom","random"]},imageWidth:{type:"number",label:"W",display:{type:"numeric-input",visible:!1}},randomRangeImageWidth:{type:"object",display:{type:"random-range-controls",visible:!1},properties:{min:{type:"number"},max:{type:"number"}}}}},cursor:{title:"cursor",icon:"cursor",tooltip:"cursor",type:"object",properties:{cursorType:{type:"string",display:{type:"ratio-group"},enum:["system","custom"]},target:{type:"string",title:"Target",display:{type:"ratio-group"},enum:["area","image"]},defaultCursor:{type:["string","null"],title:"Default",display:{type:"settings-image-input",visible:!1}},defaultCursorScale:{type:"number",title:"Scale",min:1,max:5,step:.1,display:{type:"range-control",visible:!1}},hoverCursor:{type:["string","null"],title:"Hover",display:{type:"settings-image-input",visible:!1}},hoverCursorScale:{type:"number",title:"Scale",min:1,max:5,step:.1,display:{type:"range-control",visible:!1}}}},position:{title:"position",icon:"transition",tooltip:"Position",type:"object",properties:{revealPosition:{type:"string",display:{type:"ratio-group"},enum:["random","same","on Click"]},visible:{type:"string",title:"Visible",display:{type:"ratio-group"},enum:["all","last One"]}}}},default:{imageSize:{sizeType:"custom",imageWidth:500,randomRangeImageWidth:{min:100,max:1e3}},cursor:{cursorType:"system",target:"area",defaultCursor:null,defaultCursorScale:2,hoverCursor:null,hoverCursorScale:2},position:{revealPosition:"random",visible:"all"}},displayRules:[{if:{name:"imageSize.sizeType",value:"custom"},then:{name:"properties.imageSize.properties.imageWidth.display.visible",value:!0}},{if:{name:"imageSize.sizeType",value:"random"},then:{name:"properties.imageSize.properties.randomRangeImageWidth.display.visible",value:!0}},{if:[{name:"cursor.target",value:"image"},{name:"cursor.cursorType",value:"custom"}],then:{name:"properties.cursor.properties.defaultCursor.display.visible",value:!0}},{if:[{name:"cursor.target",value:"image"},{name:"cursor.cursorType",value:"custom"},{name:"cursor.defaultCursor",value:null,isNotEqual:!0}],then:{name:"properties.cursor.properties.defaultCursorScale.display.visible",value:!0}},{if:{name:"cursor.cursorType",value:"custom"},then:{name:"properties.cursor.properties.hoverCursor.display.visible",value:!0}},{if:[{name:"cursor.cursorType",value:"custom"},{name:"cursor.hoverCursor",value:null,isNotEqual:!0}],then:{name:"properties.cursor.properties.hoverCursorScale.display.visible",value:!0}}]},content:{type:"array",settings:{addItemFromFileExplorer:!0},items:{type:"object",properties:{image:{type:"object",label:"Image",display:{isObjectFitEditable:!1,type:"media-input"},properties:{url:{type:"string"},name:{type:"string"},objectFit:{type:"string",enum:["cover","contain"]}},required:["url","name"]},link:{label:"URL",placeholder:"Enter link...",display:{type:"text-input"}}},required:["image"]},default:[{image:{objectFit:"cover",url:"https://cdn.cntrl.site/projects/01JJKT02AWY2FGN2QJ7A173RNZ/articles-assets/01K7ERQK9211QXBE9W284ZNKB8.png",name:"Slider-1.png"},link:""},{image:{objectFit:"cover",url:"https://cdn.cntrl.site/projects/01JJKT02AWY2FGN2QJ7A173RNZ/articles-assets/01K7ERQMFT72JD18WKP0Q2DVAT.png",name:"Slider-2.png"},link:""},{image:{objectFit:"cover",url:"https://cdn.cntrl.site/projects/01JJKT02AWY2FGN2QJ7A173RNZ/articles-assets/01K7ERQNEVRXPSRX5K1YTMJQY9.png",name:"Slider-3.png"},link:""},{image:{objectFit:"cover",url:"https://cdn.cntrl.site/projects/01JJKT02AWY2FGN2QJ7A173RNZ/articles-assets/01K7ERQP84JKRDT7WNWDQZR4Y9.png",name:"Slider-4.png"},link:""}]}}}},Wa="LightBox-module__hidden___9s-9x",Na="LightBox-module__heroImage___sTxNF",Va="LightBox-module__background___rm9ml",Ha="LightBox-module__editor___4ACaY",ja="LightBox-module__contentStyle___Bgnsq",za="LightBox-module__imageStyle___tLIlB",Oa="LightBox-module__imgWrapper___LuFUp",Ba="LightBox-module__contain___8-yaS",Da="LightBox-module__cover___hNvOG",qa="LightBox-module__caption___b6L2I",Ua="LightBox-module__captionTextInner___rCGNH",Ga="LightBox-module__lightboxSplide___XFuWC",Ya="LightBox-module__arrow___iz38X",Xa="LightBox-module__arrowVertical___Zfz81",Ka="LightBox-module__nextArrow___zkAQN",Za="LightBox-module__arrowInner___p48sW",Ja="LightBox-module__arrowIcon___3VaFf",Qa="LightBox-module__arrowImg___pNV88",es="LightBox-module__mirror___pjeXc",ts="LightBox-module__thumbsWrapper___GB-nU",ns="LightBox-module__thumbsContainerVertical___wttk5",os="LightBox-module__thumbsContainer___osSma",rs="LightBox-module__thumbsAlignStart___MO6tY",is="LightBox-module__thumbsAlignCenter___Q4sUx",as="LightBox-module__thumbsAlignEnd___p4y9R",ss="LightBox-module__thumbItem___HvnF3",ls="LightBox-module__closeButton___g2khP",cs="LightBox-module__fadeIn___0m5GW",us="LightBox-module__slideInLeft___gPYwC",ps="LightBox-module__slideInRight___S-pPp",ds="LightBox-module__slideInTop___DFdAj",ms="LightBox-module__slideInBottom___m27kZ",gs="LightBox-module__fadeOut___55qBR",fs="LightBox-module__slideOutLeft___NvU7P",hs="LightBox-module__slideOutRight___SK7eC",ys="LightBox-module__slideOutTop___Vgg0z",vs="LightBox-module__slideOutBottom___nJ0Ef",bs="LightBox-module__scaleSlide___vZriG",O={hidden:Wa,heroImage:Na,background:Va,editor:Ha,contentStyle:ja,imageStyle:za,imgWrapper:Oa,contain:Ba,cover:Da,caption:qa,captionTextInner:Ua,lightboxSplide:Ga,arrow:Ya,arrowVertical:Xa,nextArrow:Ka,arrowInner:Za,arrowIcon:Ja,arrowImg:Qa,mirror:es,thumbsWrapper:ts,thumbsContainerVertical:ns,thumbsContainer:os,thumbsAlignStart:rs,thumbsAlignCenter:is,thumbsAlignEnd:as,thumbItem:ss,closeButton:ls,fadeIn:cs,slideInLeft:us,slideInRight:ps,slideInTop:ds,slideInBottom:ms,fadeOut:gs,slideOutLeft:fs,slideOutRight:hs,slideOutTop:ys,slideOutBottom:vs,scaleSlide:bs},Ut=(e,t,n)=>{const o={},[r,a]=e.split("-");return r==="top"?(o.top="0",o.bottom="auto"):r==="middle"?(o.top="50%",o.bottom="auto"):r==="bottom"&&(o.top="auto",o.bottom="0"),a==="left"?(o.left="0",o.right="auto"):a==="center"?(o.left="50%",o.right="auto"):a==="right"&&(o.left="auto",o.right="0"),r==="middle"&&a==="center"?o.transform=`translate(calc(-50% + ${$.scalingValue(t.x,n)}), calc(-50% + ${$.scalingValue(t.y,n)}))`:r==="middle"?o.transform=`translate(${$.scalingValue(t.x,n)}, calc(-50% + ${$.scalingValue(t.y,n)}))`:a==="center"?o.transform=`translate(calc(-50% + ${$.scalingValue(t.x,n)}), ${$.scalingValue(t.y,n)})`:o.transform=`translate(${$.scalingValue(t.x,n)}, ${$.scalingValue(t.y,n)})`,o};function dr(e){const t=window.getComputedStyle(e);return{top:parseFloat(t.paddingTop)||0,right:parseFloat(t.paddingRight)||0,bottom:parseFloat(t.paddingBottom)||0,left:parseFloat(t.paddingLeft)||0}}function So(e){const t=e.getBoundingClientRect(),n=dr(e),o=Math.max(0,t.width-n.left-n.right),r=Math.max(0,t.height-n.top-n.bottom),a=e.naturalWidth,i=e.naturalHeight,u=o/r,c=a/i;let m,l;c>u?(m=o,l=o/c):(l=r,m=r*c);const A=t.left+n.left,S=t.top+n.top,g=(o-m)/2+A,p=(r-l)/2+S;return{x:g,y:p,width:m,height:l}}function Co(e){const t=e.getBoundingClientRect(),n=dr(e);return{left:t.left+n.left,right:t.right-n.right,top:t.top+n.top,bottom:t.bottom-n.bottom}}function wo(e){const t=e.match(/rgba?\(([^)]+)\)/);if(t){const o=t[1].split(",").map(r=>parseFloat(r.trim()));return o.length===4?o[3]:1}const n=e.match(/^#([0-9a-fA-F]{8})$/);if(n){const o=n[1].substring(6,8);return parseInt(o,16)/255}return e.match(/^#([0-9a-fA-F]{3}|[0-9a-fA-F]{6})$/),1}function xs(e,t){const n=(()=>{if(e==="fade in")return O.fadeIn;if(e==="slide in"||e==="mix")switch(t){case"left":return O.slideInLeft;case"right":return O.slideInRight;case"top":return O.slideInTop;case"bottom":return O.slideInBottom;default:return O.slideInRight}return O.fadeIn})(),o=(()=>{if(e==="fade in"||e==="mix")return O.fadeIn;if(e==="slide in")switch(t){case"left":return O.slideInLeft;case"right":return O.slideInRight;case"top":return O.slideInTop;case"bottom":return O.slideInBottom;default:return O.slideInRight}return O.fadeIn})(),r=(()=>{if(e==="fade in"||e==="mix")return O.fadeOut;if(e==="slide in")switch(t){case"left":return O.slideOutLeft;case"right":return O.slideOutRight;case"top":return O.slideOutTop;case"bottom":return O.slideOutBottom;default:return O.slideOutRight}return O.fadeOut})(),a=(()=>{if(e==="fade in")return O.fadeOut;if(e==="slide in"||e==="mix")switch(t){case"left":return O.slideOutLeft;case"right":return O.slideOutRight;case"top":return O.slideOutTop;case"bottom":return O.slideOutBottom;default:return O.slideOutRight}return O.fadeOut})();return{appearClass:n,backdropAppearClass:o,backdropDisappearClass:r,disappearClass:a}}const Ss=({settings:e,content:t,styles:n,portalId:o,activeEvent:r,isEditor:a})=>{const[i,u]=w.useState(!1),{url:c}=e.thumbnailBlock.cover;return w.useEffect(()=>{r==="close"&&u(!1),r==="open"&&u(!0)},[r]),s.jsxs(s.Fragment,{children:[s.jsx("img",{src:c,alt:"Cover",className:O.heroImage,onClick:()=>u(!0)}),s.jsx(Cs,{isOpen:i,onClose:()=>u(!1),content:t,settings:e,lightboxStyles:n,portalId:o,isEditor:a})]})},Cs=({isOpen:e,onClose:t,content:n,lightboxStyles:o,settings:r,portalId:a,isEditor:i,metadata:u})=>{var V;const[c,m]=w.useState(0),[l,A]=w.useState(0),[S,g]=w.useState(!1),[p,d]=w.useState(!1),[x,h]=w.useState({}),y=w.useRef(null),_=w.useRef(null),D=w.useRef(null),W=w.useRef(!1),E=w.useRef(null),b=w.useRef(null),C=w.useRef(null),F=w.useRef(null),j=w.useRef(!1),M=w.useRef(null),[N,H]=w.useState(!1),{appear:B,triggers:U,slider:f,thumbnail:I,controls:k,area:L,caption:T,layout:R}=r.lightboxBlock,{appearClass:Z,backdropAppearClass:ae,backdropDisappearClass:te,disappearClass:ce}=xs(B.type,B.direction),P=(u==null?void 0:u.itemId)??null;w.useEffect(()=>{const v=()=>{setTimeout(()=>{var K,Q;(Q=(K=y.current)==null?void 0:K.splide)==null||Q.refresh()},16)},q=()=>{A(K=>K+1)};return window.addEventListener("ArticleEditor.Layout:change",v),window.addEventListener("ArticleEditor.ComponentContent:change",q),()=>{window.removeEventListener("ArticleEditor.Layout:change",v),window.removeEventListener("ArticleEditor.ComponentContent:change",q)}},[]),w.useEffect(()=>{if(!e||!I.isActive){H(!1);return}const v=M.current;if(!v)return;const q=()=>{f.direction==="horiz"?H(v.scrollWidth>v.clientWidth):H(v.scrollHeight>v.clientHeight)};q();const K=new ResizeObserver(q);return K.observe(v),()=>K.disconnect()},[e,I.isActive,n.length,x,f.direction]);const ee=w.useCallback(()=>{const v=window.matchMedia("(max-width: 768px)").matches,q=wo(L.color);v&&!i&&q>.9&&(document.body.style.backgroundColor=""),g(!0),W.current=!0;const K=Q=>{Q.target===E.current&&Q.animationName&&(E.current&&b.current&&E.current.removeEventListener("animationend",b.current),b.current=null,W.current&&(W.current=!1,t()),g(!1))};E.current&&(b.current=K,E.current.addEventListener("animationend",K))},[t,L.color,i]),fe=(v,q,K)=>{var Q,ie;if(v){if(U.type==="click"&&U.switch==="image")U.repeat==="close"&&c===n.length-1?ee():(Q=y.current)==null||Q.go("+1");else if(U.type==="click"&&U.switch==="50/50"){const re=v.getBoundingClientRect(),ne=q-re.left,ue=K-re.top,z=re.width,X=re.height;let Y;f.direction==="horiz"?Y=ne<z/2?"-1":"+1":Y=ue<X/2?"-1":"+1",(ie=y.current)==null||ie.go(Y)}}},de=v=>{if(j.current){j.current=!1;return}const q=n[c],K=(q==null?void 0:q.image.objectFit)==="cover";let Q,ie;if("changedTouches"in v&&v.changedTouches.length>0)Q=v.changedTouches[0].clientX,ie=v.changedTouches[0].clientY;else if("clientX"in v)Q=v.clientX,ie=v.clientY;else return;let re;if(K&&D.current){const ne=Co(D.current);re=Q>=ne.left&&Q<=ne.right&&ie>=ne.top&&ie<=ne.bottom}else{const ne=D.current?So(D.current):null;if(!ne){v.target===v.currentTarget&&ee();return}re=Q>=ne.x&&Q<=ne.x+ne.width&&ie>=ne.y&&ie<=ne.y+ne.height}re?fe(D.current,Q,ie):ee()},ge=v=>{const q=v.target;(q.classList.contains(O.thumbsWrapper)||q.classList.contains(O.thumbsContainer))&&de(v)};w.useEffect(()=>{if(!e)return;const v=q=>{var K,Q;if(q.key==="Escape"){ee();return}if(q.key==="ArrowRight"){m(ie=>(ie+1)%Math.max(n.length,1)),(K=y.current)==null||K.go("+1");return}q.key==="ArrowLeft"&&(m(ie=>(ie-1+Math.max(n.length,1))%Math.max(n.length,1)),(Q=y.current)==null||Q.go("-1"))};return window.addEventListener("keydown",v),()=>{window.removeEventListener("keydown",v)}},[e,ee,n.length]),w.useEffect(()=>{if(e){if(m(0),A(q=>q+1),W.current=!1,g(!1),d(!1),h({}),!P)return;const v=new CustomEvent("page-overlay",{detail:{itemId:P}});window.dispatchEvent(v)}return()=>{E.current&&b.current&&(E.current.removeEventListener("animationend",b.current),b.current=null),d(!1)}},[e,P]),w.useEffect(()=>{_.current!==null&&_.current!==f.type&&A(v=>v+1),_.current=f.type},[f.type]),w.useEffect(()=>{if(!e)return;const v=document.body.style.overflow,q=window.matchMedia("(max-width: 768px)").matches,K=wo(L.color);document.body.style.overflow="hidden",d(!1);const Q=re=>{re.target===E.current&&!W.current&&re.animationName&&(q&&!i&&K>.9&&(document.body.style.backgroundColor=L.color),d(!0),E.current&&C.current&&E.current.removeEventListener("animationend",C.current),C.current=null)};E.current&&(C.current=Q,E.current.addEventListener("animationend",Q));const ie=re=>{const ne=re.target;ne&&(ne.closest(`.${O.thumbsWrapper}`)||ne.closest(`.${O.thumbsContainer}`))||f.type!=="slide"&&re.preventDefault()};return document.addEventListener("touchmove",ie,{passive:!1}),()=>{document.body.style.overflow=v,document.removeEventListener("touchmove",ie),E.current&&C.current&&(E.current.removeEventListener("animationend",C.current),C.current=null),d(!1)}},[e,i,L.color,f.type]),w.useEffect(()=>{if(!e)return;const v=q=>{var Q,ie;if(W.current){q.stopPropagation();return}if(j.current){j.current=!1;return}const K=q.target;if(!(K&&(K.closest(`.${O.thumbsContainer}`)||K.closest(`.${O.thumbItem}`)||K.closest(`.${O.arrow}`)||K.closest(`.${O.closeButton}`)||K.closest(`.${O.caption}`)))){if(f.type==="slide"&&U.type==="drag"&&((ie=(Q=y.current)==null?void 0:Q.splide)!=null&&ie.root)){const re=y.current.splide.root;if(K&&(re.contains(K)||re===K))return}if(q.touches.length===0&&q.changedTouches.length>0){const re=n[c],ne=(re==null?void 0:re.image.objectFit)==="cover",ue=q.changedTouches[0];let z;if(ne&&D.current){const X=Co(D.current);z=ue.clientX>=X.left&&ue.clientX<=X.right&&ue.clientY>=X.top&&ue.clientY<=X.bottom}else{const X=D.current?So(D.current):null;if(!X)return;z=ue.clientX>=X.x&&ue.clientX<=X.x+X.width&&ue.clientY>=X.y&&ue.clientY<=X.y+X.height}if(!z){q.stopPropagation(),W.current=!0;const X=Y=>{Y.stopPropagation(),Y.preventDefault(),document.removeEventListener("click",X,!0)};document.addEventListener("click",X,!0),ee()}}}};return document.addEventListener("touchend",v,{passive:!0}),()=>{document.removeEventListener("touchend",v)}},[e,ee,c,n]);const G=(f.type==="scale"||f.type==="fade")&&f.direction==="vert"&&U.type==="drag";w.useEffect(()=>{var Y,se;if(!e||!G||!((se=(Y=y.current)==null?void 0:Y.splide)!=null&&se.root))return;const v=y.current.splide.root,q=30,K=(oe,pe)=>{if(F.current){const we=Math.abs(oe-F.current.x),$e=Math.abs(pe-F.current.y);(we>0||$e>0)&&(j.current=!0)}},Q=oe=>{F.current&&(oe.preventDefault(),K(oe.clientX,oe.clientY))},ie=oe=>{F.current&&oe.touches.length>0&&(oe.preventDefault(),K(oe.touches[0].clientX,oe.touches[0].clientY))},re=(oe,pe)=>{if(!F.current||!y.current){F.current=null;return}const we=Math.abs(oe-F.current.x),$e=Math.abs(pe-F.current.y);$e>q&&$e>we&&y.current.go(pe<F.current.y?"+1":"-1"),F.current=null},ne=oe=>{F.current&&re(oe.clientX,oe.clientY),document.removeEventListener("pointerup",ne),document.removeEventListener("pointercancel",ne),document.removeEventListener("pointermove",Q)},ue=oe=>{if(F.current){if(oe.changedTouches.length>0){const pe=oe.changedTouches[0];re(pe.clientX,pe.clientY)}document.removeEventListener("touchend",ue),document.removeEventListener("touchcancel",ue),document.removeEventListener("touchmove",ie)}},z=oe=>{F.current={x:oe.clientX,y:oe.clientY},j.current=!1,document.addEventListener("pointermove",Q,{passive:!1}),document.addEventListener("pointerup",ne),document.addEventListener("pointercancel",ne)},X=oe=>{oe.touches.length>0&&(F.current={x:oe.touches[0].clientX,y:oe.touches[0].clientY},j.current=!1,document.addEventListener("touchmove",ie,{passive:!1}),document.addEventListener("touchend",ue),document.addEventListener("touchcancel",ue))};return v.addEventListener("pointerdown",z),v.addEventListener("touchstart",X),()=>{v.removeEventListener("pointerdown",z),v.removeEventListener("touchstart",X),document.removeEventListener("pointermove",Q),document.removeEventListener("pointerup",ne),document.removeEventListener("pointercancel",ne),document.removeEventListener("touchmove",ie),document.removeEventListener("touchend",ue),document.removeEventListener("touchcancel",ue),F.current=null,j.current=!1}},[e,G,l]);const me={backgroundColor:L.color,backdropFilter:`blur(${L.blur}px)`,animationDuration:`${parseInt(B.duration)}ms`,animationTimingFunction:"ease",animationFillMode:"both"};return typeof document>"u"||!document.getElementById(a)?null:vr.createPortal(s.jsxs(s.Fragment,{children:[s.jsx("div",{ref:i?null:E,className:ye(O.background,S?te:ae,{[O.editor]:i},{[O.hidden]:!e}),style:{...me,...p&&!i&&!S?{position:"absolute"}:{}}}),s.jsxs("div",{ref:i?E:null,className:ye(O.contentStyle,S?ce:Z,{[O.editor]:i},{[O.hidden]:!e}),style:{animationDuration:`${parseInt(B.duration)}ms`,animationTimingFunction:"ease",animationFillMode:"both"},children:[s.jsx(ur,{onMove:v=>m(v.index),ref:y,className:O.lightboxSplide,options:{arrows:!1,speed:f.duration?parseInt(f.duration):500,direction:f.direction==="horiz"||f.type==="fade"||f.type==="scale"?"ltr":"ttb",pagination:!1,drag:U.type==="drag"&&!G,perPage:1,width:"100%",height:"100%",type:f.type==="fade"||f.type==="scale"?"fade":"loop",padding:0,rewind:U.repeat!=="close",start:0},style:{"--splide-speed":f.duration},children:n.map((v,q)=>{const K=Ut(R.position,R.offset,i),Q=`${$.scalingValue(R.padding.top,i)} ${$.scalingValue(R.padding.right,i)} ${$.scalingValue(R.padding.bottom,i)} ${$.scalingValue(R.padding.left,i)}`,ie=f.type==="scale"?(()=>{const{transform:re,...ne}=K;return{...ne,position:"absolute",padding:Q,boxSizing:"border-box","--position-transform":re||"none"}})():{...K,position:"absolute",padding:Q,boxSizing:"border-box"};return s.jsx(pr,{children:s.jsx("div",{className:O.imgWrapper,onClick:de,children:s.jsx("img",{ref:q===c?D:null,className:ye(O.imageStyle,{[O.contain]:v.image.objectFit==="contain",[O.cover]:v.image.objectFit==="cover",[O.scaleSlide]:f.type==="scale"}),src:v.image.url,alt:v.image.name??"",style:{...ie,pointerEvents:v.image.objectFit==="contain"?"none":"auto"}})})},q)})},l),k.isActive&&s.jsxs(s.Fragment,{children:[s.jsx("div",{className:ye(O.arrow,{[O.arrowVertical]:f.direction==="vert"}),style:{color:k.color,"--arrow-hover-color":k.hover},children:s.jsxs("button",{className:O.arrowInner,style:{transform:`translate(${$.scalingValue(k.offset.x,i)}, ${$.scalingValue(k.offset.y*(f.direction==="horiz"?1:-1),i)}) scale(${k.scale}) rotate(${f.direction==="horiz"?"0deg":"90deg"})`},onClick:()=>{var v;return(v=y.current)==null?void 0:v.go("-1")},"aria-label":"Previous",children:[k.arrowsImgUrl&&s.jsx(Ke,{url:k.arrowsImgUrl,fill:k.color,hoverFill:k.hover,className:ye(O.arrowImg,O.mirror)}),!k.arrowsImgUrl&&s.jsx($o,{color:k.color,className:ye(O.arrowIcon,O.arrowImg,O.mirror)})]})}),s.jsx("div",{className:ye(O.arrow,O.nextArrow,{[O.arrowVertical]:f.direction==="vert"}),style:{color:k.color,"--arrow-hover-color":k.hover},children:s.jsxs("button",{className:O.arrowInner,style:{transform:`translate(${$.scalingValue(k.offset.x*(f.direction==="horiz"?-1:1),i)}, ${$.scalingValue(k.offset.y,i)}) scale(${k.scale}) rotate(${f.direction==="horiz"?"0deg":"90deg"})`},onClick:()=>{var v;return(v=y.current)==null?void 0:v.go("+1")},"aria-label":"Next",children:[k.arrowsImgUrl&&s.jsx(Ke,{url:k.arrowsImgUrl,fill:k.color,hoverFill:k.hover,className:O.arrowImg}),!k.arrowsImgUrl&&s.jsx($o,{color:k.color,className:ye(O.arrowIcon,O.arrowImg)})]})})]}),L.closeIconUrl&&(()=>{const v=Ut(L.closeIconAlign,L.closeIconOffset,i),q=`scale(${L.closeIconScale})`,K=v.transform?`${v.transform} ${q}`:q;return s.jsx("button",{className:O.closeButton,style:{...v,transform:K},onClick:ee,"aria-label":"Close lightbox",children:s.jsx(Ke,{url:L.closeIconUrl,fill:L.closeIconColor??"#000000",hoverFill:L.closeIconHover??"#cccccc"})})})(),T&&T.isActive&&o.imageCaption&&((V=n[c])==null?void 0:V.imageCaption)&&(()=>{const{widthSettings:v,fontSettings:q,letterSpacing:K,textAlign:Q,wordSpacing:ie,fontSizeLineHeight:re,textAppearance:ne,color:ue}=o.imageCaption;return s.jsx("div",{className:O.caption,style:{...Ut(T.alignment,T.offset,i),fontFamily:yn(q.fontFamily),fontWeight:q.fontWeight,fontStyle:q.fontStyle,width:v.sizing==="auto"?"max-content":$.scalingValue(v.width,i),letterSpacing:$.scalingValue(K,i),wordSpacing:$.scalingValue(ie,i),textAlign:Q,fontSize:$.scalingValue(re.fontSize,i),lineHeight:$.scalingValue(re.lineHeight,i),textTransform:ne.textTransform??"none",textDecoration:ne.textDecoration??"none",fontVariant:ne.fontVariant??"normal",color:ue},onClick:z=>z.stopPropagation(),children:s.jsx("div",{"data-styles":"imageCaption",className:O.captionTextInner,style:{"--link-color":T.linkColor,"--link-hover-color":T.linkHoverColor},children:s.jsx(Mt,{content:n[c].imageCaption})})})})(),I.isActive&&(()=>{const[v,q]=I.position.split("-"),K=f.direction==="horiz"?`${v}-left`:I.position,Q=Ut(K,I.offset,i),ie=()=>{if(f.direction==="horiz"){if(q==="left")return"flex-start";if(q==="center")return"center";if(q==="right")return"flex-end"}else{if(v==="top")return"flex-start";if(v==="middle")return"center";if(v==="bottom")return"flex-end"}return"flex-start"};return s.jsx("div",{ref:M,className:O.thumbsWrapper,onClick:re=>ge(re),style:{position:i?"absolute":"fixed",...Q,...f.direction==="horiz"?{maxWidth:"100vw",width:"100%",overflowX:"auto",overflowY:"hidden"}:{maxHeight:"100vh",overflowY:"auto",overflowX:"hidden"}},children:s.jsx("div",{className:ye(O.thumbsContainer,{[O.thumbsContainerVertical]:f.direction==="vert",[O.thumbsAlignStart]:I.align==="start",[O.thumbsAlignCenter]:I.align==="center",[O.thumbsAlignEnd]:I.align==="end"}),style:{gap:$.scalingValue(I.grid.gap,i),justifyContent:N?"flex-start":ie()},children:n.map((re,ne)=>{const ue=ne===c,z=x[ne],Y=I.grid.size*(ue?I.activeState.scale:1),se=()=>{if(I.fit!=="fit")return{};if(!z)return f.direction==="horiz"?{height:$.scalingValue(Y,i)}:{width:$.scalingValue(Y,i)};const oe=z.width/z.height;if(f.direction==="horiz"){const pe=Y,we=pe*oe;return{width:$.scalingValue(we,i),height:$.scalingValue(pe,i)}}else{const pe=Y,we=pe/oe;return{width:$.scalingValue(pe,i),height:$.scalingValue(we,i)}}};return s.jsx("button",{className:O.thumbItem,style:{...f.direction==="horiz"&&I.fit!=="fit"?{height:$.scalingValue(Y,i)}:{},...f.direction==="vert"&&I.fit!=="fit"?{width:$.scalingValue(Y,i)}:{},...I.fit==="cover"?{width:$.scalingValue(Y,i),height:$.scalingValue(Y,i)}:{},...se(),transition:ue?"all 0.25s ease-out":"none",opacity:ue?I.activeState.opacity/100:I.opacity/100,"--thumb-hover":I.activeState.opacity/100},onClick:oe=>{var pe;oe.stopPropagation(),m(ne),(pe=y.current)==null||pe.go(ne)},onMouseEnter:()=>{var oe;I.triggers==="hov"&&((oe=y.current)==null||oe.go(ne))},children:s.jsx("img",{src:re.image.url,alt:re.image.name??"",onLoad:oe=>{const pe=oe.currentTarget;pe.naturalWidth&&pe.naturalHeight&&h(we=>({...we,[ne]:{width:pe.naturalWidth,height:pe.naturalHeight}}))},style:{objectFit:I.fit==="cover"?"cover":"contain",...I.fit==="fit"?{maxWidth:"100%",maxHeight:"100%",objectFit:"contain"}:{},...I.fit==="cover"?{width:"100%",height:"100%"}:{}}})},`${re.image.name}-${ne}`)})})})})()]})]}),document.getElementById(a))};function $o({color:e,className:t}){return s.jsx("svg",{viewBox:"0 0 10 18",className:t,children:s.jsx("g",{id:"Symbols",stroke:"none",strokeWidth:"1",fillRule:"evenodd",children:s.jsx("path",{d:"M-3.70710678,4.29289322 C-3.34662282,3.93240926 -2.77939176,3.90467972 -2.38710056,4.20970461 L-2.29289322,4.29289322 L5,11.585 L12.2928932,4.29289322 C12.6533772,3.93240926 13.2206082,3.90467972 13.6128994,4.20970461 L13.7071068,4.29289322 C14.0675907,4.65337718 14.0953203,5.22060824 13.7902954,5.61289944 L13.7071068,5.70710678 L5.70710678,13.7071068 C5.34662282,14.0675907 4.77939176,14.0953203 4.38710056,13.7902954 L4.29289322,13.7071068 L-3.70710678,5.70710678 C-4.09763107,5.31658249 -4.09763107,4.68341751 -3.70710678,4.29289322 Z",id:"Shape-Copy",fill:e,transform:"translate(5, 9) rotate(-90) translate(-5, -9)"})})})}const ws={element:Ss,id:"lightbox",name:"Lightbox",preview:{type:"image",url:"https://cdn.cntrl.site/component-assets/lightboxImg.png"},defaultSize:{width:440,height:550},fontSettingsPaths:{content:[],parameters:[{path:"styles.imageCaption.fontSettings"}]},assetsPaths:{content:[{path:"image.url",placeholderEnabled:!0}],parameters:[{path:"settings.thumbnailBlock.cover.url",placeholderEnabled:!0},{path:"settings.controls.arrowsImgUrl"},{path:"settings.area.closeIconUrl"}]},schema:{type:"object",properties:{settings:{type:"object",properties:{thumbnailBlock:{display:{type:"settings-block",triggerEvent:"close"},type:"object",properties:{cover:{title:"COVER",icon:"cover",tooltip:"Cover Image",type:"object",properties:{url:{type:"string",display:{type:"cover-image-input"}}}}}},lightboxBlock:{display:{type:"settings-block",triggerEvent:"open"},type:"object",properties:{appear:{title:"APPEAR",icon:"transition",tooltip:"Appearance",type:"object",properties:{type:{type:"string",display:{type:"ratio-group"},enum:["slide in","fade in","mix"]},duration:{type:"string",label:"T",display:{type:"step-selector"},enum:["100ms","250ms","500ms","1000ms","1500ms","2000ms"]},direction:{type:"string",title:"From",display:{type:"direction-control"},enum:["top","left","right","bottom"]}}},triggers:{title:"TRIGGERS",icon:"target",tooltip:"Triggers",type:"object",properties:{type:{type:"string",display:{type:"ratio-group"},enum:["click","drag"]},switch:{type:"string",display:{type:"ratio-group"},enum:["image","50/50"]},repeat:{type:"string",title:"Repeat",display:{visible:!1,type:"ratio-group"},enum:["close","loop"]}}},slider:{title:"SLIDER",icon:"horizontal-resize",tooltip:"Slider",type:"object",properties:{type:{type:"string",display:{type:"ratio-group"},enum:["slide","fade","scale"]},direction:{type:"string",display:{type:"ratio-group"},enum:["horiz","vert"]},duration:{type:"string",label:"T",display:{type:"step-selector"},enum:["100ms","250ms","500ms","1000ms","1500ms","2000ms"]}}},thumbnail:{title:"THUMB",icon:"thumbnail",tooltip:"Thumbnail",type:"object",properties:{isActive:{type:"boolean",display:{type:"setting-toggle"}},position:{display:{type:"align-grid"},type:"string",enum:["top-left","top-center","top-right","middle-left","middle-center","middle-right","bottom-left","bottom-center","bottom-right"]},fit:{type:"string",display:{type:"ratio-group"},enum:["cover","fit"]},align:{type:"string",title:"Align",display:{type:"align-group",direction:"horizontal"},enum:["start","center","end"]},triggers:{type:"string",title:"Triggers",display:{type:"ratio-group",direction:"horizontal"},enum:["clk","hov"]},grid:{type:"object",title:"Grid",display:{type:"group"},properties:{size:{type:"number",label:"Box",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}},gap:{type:"number",label:"Gap",scalingEnabled:!0,min:0,display:{type:"numeric-input"}}}},offset:{type:"object",title:"Offset",display:{type:"group"},properties:{x:{type:"number",label:"X",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}},y:{type:"number",label:"Y",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}}}},opacity:{type:"number",title:"Opacity",label:"icon:opacity",min:0,max:100,step:1,display:{type:"numeric-input"}},activeState:{type:"object",title:"ACTIVE",display:{type:"group"},properties:{scale:{type:"number",title:"Scale",min:1,max:5,step:.1,display:{type:"range-control"}},opacity:{type:"number",title:"Opacity",label:"icon:opacity",min:0,max:100,step:1,display:{type:"numeric-input"}}}}}},layout:{title:"LAYOUT",icon:"layout",tooltip:"Layout",type:"object",properties:{position:{display:{type:"align-grid"},type:"string",enum:["top-left","top-center","top-right","middle-left","middle-center","middle-right","bottom-left","bottom-center","bottom-right"]},offset:{type:"object",title:"Offset",display:{type:"group"},properties:{x:{type:"number",label:"X",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}},y:{type:"number",label:"Y",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}}}},padding:{type:"object",title:"Padding",display:{type:"padding-controls"},properties:{top:{min:0,step:1,type:"number"},left:{min:0,step:1,type:"number"},right:{min:0,step:1,type:"number"},bottom:{min:0,step:1,type:"number"}}}}},controls:{title:"CONTROLS",icon:"controls",tooltip:"Controls",type:"object",properties:{isActive:{type:"boolean",display:{type:"setting-toggle"}},arrowsImgUrl:{type:["string","null"],display:{type:"settings-image-input"}},offset:{title:"Offset",type:"object",display:{type:"group"},properties:{x:{type:"number",label:"X",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}},y:{type:"number",label:"Y",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}}}},scale:{type:"number",title:"Scale",min:.5,max:5,step:.1,display:{type:"range-control"}},color:{title:"Color",type:"string",display:{type:"settings-color-picker",format:"single"}},hover:{title:"Hover",type:"string",display:{type:"settings-color-picker",format:"single"}}}},area:{title:"AREA",icon:"area",tooltip:"Area",type:"object",properties:{color:{type:"string",display:{type:"settings-color-picker",format:"single"}},blur:{type:"number",label:"icon:blur",display:{type:"numeric-input"}},closeIconUrl:{type:["string","null"],title:"Close Icon",display:{type:"settings-image-input"}},closeIconAlign:{display:{type:"align-grid",direction:"horizontal"},type:"string",enum:["top-left","top-center","top-right","middle-left","middle-center","middle-right","bottom-left","bottom-center","bottom-right"]},closeIconScale:{type:"number",title:"Scale",min:.5,max:5,step:.1,display:{type:"range-control"}},closeIconOffset:{type:"object",title:"Offset",display:{type:"group"},properties:{x:{type:"number",label:"X",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}},y:{type:"number",label:"Y",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}}}},closeIconColor:{title:"Color",type:"string",display:{type:"settings-color-picker",format:"single"}},closeIconHover:{title:"Hover",type:"string",display:{type:"settings-color-picker",format:"single"}}}},caption:{title:"DESC",icon:"text-icon",tooltip:"Description",type:"object",properties:{isActive:{type:"boolean",display:{type:"setting-toggle"}},alignment:{type:"string",display:{type:"align-grid"},enum:["top-left","top-center","top-right","middle-left","middle-center","middle-right","bottom-left","bottom-center","bottom-right"]},offset:{title:"Offset",type:"object",display:{type:"group"},properties:{x:{type:"number",label:"X",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}},y:{type:"number",label:"Y",scalingEnabled:!0,display:{type:"numeric-input",visible:!0}}}},linkColor:{title:"Link",type:"string",display:{type:"settings-color-picker",format:"single"}},linkHoverColor:{title:"Link Hov",type:"string",display:{type:"settings-color-picker",format:"single"}}}}}}},default:{d:{thumbnailBlock:{cover:{url:"https://cdn.cntrl.site/component-assets/Cover.jpg"}},lightboxBlock:{appear:{type:"slide in",duration:"1000ms",direction:"bottom"},triggers:{type:"click",switch:"image",repeat:"loop"},slider:{type:"slide",direction:"vert",duration:"1000ms"},thumbnail:{isActive:!0,position:"middle-left",fit:"fit",align:"start",triggers:"hov",grid:{size:.05,gap:.01},offset:{x:.01,y:0},opacity:50,activeState:{scale:1,opacity:100}},layout:{position:"middle-center",offset:{x:0,y:0},padding:{top:.06,right:0,bottom:.06,left:0}},controls:{isActive:!1,arrowsImgUrl:null,offset:{x:0,y:0},scale:1,color:"#000000",hover:"#cccccc"},area:{color:"rgba(28,31,34,0.9)",blur:0,closeIconUrl:null,closeIconColor:"#000000",closeIconHover:"#cccccc",closeIconAlign:"top-right",closeIconOffset:{x:0,y:0},closeIconScale:1},caption:{isActive:!0,alignment:"middle-center",offset:{x:0,y:0},linkColor:"#cccccc",linkHoverColor:"#cccccc"}}},m:{thumbnailBlock:{cover:{url:"https://cdn.cntrl.site/component-assets/Cover.jpg"}},lightboxBlock:{appear:{type:"fade in",duration:"500ms",direction:"bottom"},triggers:{type:"click",switch:"image",repeat:"loop"},slider:{type:"slide",direction:"horiz",duration:"1000ms"},thumbnail:{isActive:!0,position:"bottom-center",fit:"fit",align:"start",triggers:"hov",grid:{size:.1,gap:.05},offset:{x:.01,y:-.05},opacity:50,activeState:{scale:1,opacity:100}},layout:{position:"middle-center",offset:{x:0,y:0},padding:{top:.06,right:.05,bottom:.06,left:.05}},controls:{isActive:!1,arrowsImgUrl:null,offset:{x:0,y:0},scale:1,color:"#000000",hover:"#cccccc"},area:{color:"rgba(28,31,34,0.9)",blur:0,closeIconUrl:null,closeIconColor:"#000000",closeIconHover:"#cccccc",closeIconAlign:"top-right",closeIconOffset:{x:0,y:0},closeIconScale:1},caption:{isActive:!0,alignment:"middle-center",offset:{x:0,y:0},hover:"#cccccc"}}},t:{thumbnailBlock:{cover:{url:"https://cdn.cntrl.site/component-assets/Cover.jpg"}},lightboxBlock:{appear:{type:"fade in",duration:"500ms",direction:"bottom"},triggers:{type:"click",switch:"image",repeat:"loop"},slider:{type:"slide",direction:"vert",duration:"1000ms"},thumbnail:{isActive:!0,position:"middle-left",fit:"fit",align:"start",triggers:"hov",grid:{size:.05,gap:.01},offset:{x:.03,y:0},opacity:50,activeState:{scale:1,opacity:100}},layout:{position:"middle-center",offset:{x:0,y:0},padding:{top:.06,right:.1,bottom:.06,left:.1}},controls:{isActive:!1,arrowsImgUrl:null,offset:{x:0,y:0},scale:1,color:"#000000",hover:"#cccccc"},area:{color:"rgba(28,31,34,0.9)",blur:0,closeIconUrl:null,closeIconColor:"#000000",closeIconHover:"#cccccc",closeIconAlign:"top-right",closeIconOffset:{x:0,y:0},closeIconScale:1},caption:{isActive:!0,alignment:"middle-center",offset:{x:0,y:0},hover:"#cccccc"}}}},displayRules:[{if:{name:"lightboxBlock.appear.type",value:"slide in"},then:{name:"properties.lightboxBlock.properties.appear.properties.direction.display.visible",value:!0}},{if:{name:"lightboxBlock.slider.direction",value:"vert"},then:{name:"properties.lightboxBlock.properties.thumbnail.properties.align.display.direction",value:"vertical"}},{if:{name:"lightboxBlock.appear.type",value:"mix"},then:{name:"properties.lightboxBlock.properties.appear.properties.direction.display.visible",value:!0}},{if:{name:"lightboxBlock.appear.type",value:"fade in"},then:{name:"properties.lightboxBlock.properties.appear.properties.direction.display.visible",value:!1}},{if:[{name:"lightboxBlock.triggers.type",value:"click"},{name:"lightboxBlock.triggers.switch",value:"image"}],then:{name:"properties.lightboxBlock.properties.triggers.properties.repeat.display.visible",value:!0}}]},content:{type:"array",settings:{addItemFromFileExplorer:!0},items:{type:"object",properties:{image:{type:"object",label:"Image",display:{type:"media-input"},properties:{url:{type:"string"},name:{type:"string"},objectFit:{type:"string",enum:["cover","contain"]}},required:["url","name"]},imageCaption:{label:"Description",placeholder:"Add Caption...",display:{type:"rich-text"}}},required:["image"]},default:[{image:{objectFit:"contain",url:"https://cdn.cntrl.site/component-assets/2.jpg",name:"Slider-1.png"},imageCaption:[{type:"paragraph",children:[{text:""}]}]},{image:{objectFit:"contain",url:"https://cdn.cntrl.site/component-assets/3.jpg",name:"Slider-2.png"},imageCaption:[{type:"paragraph",children:[{text:""}]}]},{image:{objectFit:"contain",url:"https://cdn.cntrl.site/component-assets/4.jpg",name:"Slider-3.png"},imageCaption:[{type:"paragraph",children:[{text:""}]}]}]},styles:{type:"object",properties:{imageCaption:{dataName:"caption",type:"object",properties:{fontSettings:{type:"object",display:{type:"font-settings"},properties:{fontFamily:{type:"string"},fontWeight:{type:"number"},fontStyle:{type:"string"}}},widthSettings:{display:{type:"text-width-control"},type:"object",properties:{width:{type:"number"},sizing:{type:"string",enum:["auto","manual"]}}},fontSizeLineHeight:{type:"object",display:{type:"font-size-line-height"},properties:{fontSize:{type:"number"},lineHeight:{type:"number"}}},letterSpacing:{display:{type:"letter-spacing-input"},type:"number"},wordSpacing:{display:{type:"word-spacing-input"},type:"number"},textAlign:{display:{type:"text-align-control"},type:"string",enum:["left","center","right","justify"]},textAppearance:{display:{type:"text-appearance"},properties:{textTransform:{type:"string",enum:["none","uppercase","lowercase","capitalize"]},textDecoration:{type:"string",enum:["none","underline"]},fontVariant:{type:"string",enum:["normal","small-caps"]}}},color:{display:{type:"style-panel-color-picker"},type:"string"}}}},default:{imageCaption:{widthSettings:{width:.13,sizing:"auto"},fontSettings:{fontFamily:"Arial",fontWeight:400,fontStyle:"normal"},fontSizeLineHeight:{fontSize:.02,lineHeight:.02},letterSpacing:0,wordSpacing:0,textAlign:"left",textAppearance:{textTransform:"none",textDecoration:"none",fontVariant:"normal"},color:"#000000"}}}},required:["settings","content","styles"]}};function Gt(e){return`calc(var(--cntrl-article-width, 100vw) * ${e/1440})`}function $s(e){return`
 .${e}-wrapper {
   display: flex;
   flex-direction: column;

package/dist/index.mjs

@@ -2497,7 +2497,7 @@ const za = {
           pagination: {
             isActive: !0,
             scale: 50,
-            position: "outside-1",
+            position: "inside-1",
             offset: {
               x: 0,
               y: 0

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cntrl-site/components",
-  "version": "1.0.9",
+  "version": "1.0.10",
   "description": "Custom components for control editor and public websites.",
   "main": "dist/index.js",
   "module": "dist/index.mjs",