component---src-pages-templates-services-tsx-aa50220878541cdcb458.js

"use strict";(self.webpackChunkcode_cave=self.webpackChunkcode_cave||[]).push([[997],{5780:function(e,s,l){l.r(s),l.d(s,{Head:function(){return h},default:function(){return g}});var a=l(6540),t=l(3609),n=l(5471),r=l(6696),i=l(4716),c=l(6674),o=l(7437);var m=e=>{let{service:s,className:l,imgClassName:a}=e;const{html:t,frontmatter:{title:n,keywords:r,image:{publicURL:i}}}=s;return(0,o.Y)("div",{className:`service-preview origin-[5%_50%] break-inside-avoid flex flex-col gap-5 sm:px-8 py-8 text-secondary-100 cursor-pointer ${l}`,itemScope:!0,itemType:"https://schema.org/Service"},(0,o.Y)("div",{className:"flex items-center gap-5"},(0,o.Y)("div",{className:`masked-icon h-10 w-10 ${null!=a?a:""}`,style:{maskImage:`url(${i})`,WebkitMaskImage:`url(${i})`}}),(0,o.Y)("h2",{className:"font-bold text-2xl",itemProp:"serviceType"},n)),(0,o.Y)("div",{className:"text-lg text-secondary-70",dangerouslySetInnerHTML:{__html:t},itemProp:"description"}),r?(0,o.Y)("div",{className:"flex gap-2 flex-wrap w-full"},r.map(e=>(0,o.Y)("p",{key:e,className:"h-8 flex items-center whitespace-nowrap px-4 bg-main-70 text-secondary-70 rounded-lg border-primary-70 border border-solid"},e))):null)},d=l(8168);const p=e=>{let{service:s,className:l,imgClassName:a,...t}=e;const{frontmatter:{title:n,image:{publicURL:r}}}=s;return(0,o.Y)("button",(0,d.A)({"aria-label":"view service",className:`flex gap-5 min-h-10 items-center ${l}`,type:"button"},t),(0,o.Y)("div",{className:`masked-icon py-1.5 h-7 w-7 ${null!=a?a:""}`,style:{maskImage:`url(${r})`,WebkitMaskImage:`url(${r})`}}),(0,o.Y)("h2",{className:"hidden lg:block font-semibold text-lg text-secondary-100 text-start"},n))};var u=e=>{let{services:s}=e;const[l,t]=(0,c.A)({axis:"y",loop:!0,skipSnaps:!0,align:"center"}),n=(0,a.useRef)(0),r=(0,a.useRef)([]),{selectedIndex:i,onServiceButtonClick:d}=((e,s)=>{const{0:l,1:t}=(0,a.useState)(0),n=(0,a.useCallback)(l=>{e&&(e.scrollTo(l),s&&s(e))},[e,s]),r=(0,a.useCallback)(e=>{t(e.selectedScrollSnap())},[]);return(0,a.useEffect)(()=>{e&&(r(e),e.on("reInit",r).on("select",r))},[e,r]),{selectedIndex:l,onServiceButtonClick:n}})(t),u=(0,a.useCallback)(e=>{r.current=e.slideNodes().map(e=>e.querySelector(".service-preview"))},[]),g=(0,a.useCallback)(e=>{n.current=.2*e.scrollSnapList().length},[]),h=(0,a.useCallback)((e,s)=>{const l=e.internalEngine(),a=e.scrollProgress(),t=e.slidesInView(),i="scroll"===s;e.scrollSnapList().forEach((e,s)=>{let c=e-a;l.slideRegistry[s].forEach(s=>{if(i&&!t.includes(s))return;l.options.loop&&l.slideLooper.loopPoints.forEach(l=>{const t=l.target();if(s===l.index&&0!==t){const s=Math.sign(t);-1===s&&(c=e-(1+a)),1===s&&(c=e+(1-a))}});const o=1-Math.abs(c*n.current),m=(d=o,p=0,u=1,Math.min(Math.max(d,p),u));var d,p,u;r.current[s].style.transform=`scale(${m})`})})},[]);return(0,a.useEffect)(()=>{t&&(u(t),g(t),h(t),t.on("reInit",u).on("reInit",g).on("reInit",h).on("scroll",h).on("slideFocus",h))},[t,h]),(0,o.Y)(a.Fragment,null,(0,o.Y)("div",{className:"hidden sm:flex flex-col gap-5 p-8 lg:basis-[410px] shrink-0"},s?s.map((e,s)=>(0,o.Y)(p,{key:`dot-${e.id}`,service:e,onClick:()=>d(s),className:""+(s===i?"":"brightness-[0.7] hover:brightness-100"),imgClassName:""+(s===i?"bg-primary-70":"bg-secondary-100")})):null),(0,o.Y)("div",{ref:l,className:"hidden sm:block overflow-hidden basis-full"},(0,o.Y)("div",{style:{backfaceVisibility:"hidden"},className:"flex flex-col touch-pan-x h-[1000px] sm:h-[900px] md:h-[750px]"},s?s.map((e,s)=>(0,o.Y)("div",{key:e.id,onClick:()=>d(s),className:"grow-0 shrink-0 basis-1/3 min-h-0 select-none flex items-center"},(0,o.Y)(m,{service:e,className:"select-none "+(s===i?"":"brightness-[0.7]"),imgClassName:"select-none "+(s===i?"bg-primary-70":"bg-secondary-100")}))):null)))};var g=e=>{var s;let{data:l,pageContext:{markupData:r,lang:c}}=e;const d=null===(s=l.allMarkdownRemark)||void 0===s?void 0:s.nodes;return(0,o.Y)(a.Fragment,null,(0,o.Y)(t.A,{heightClass:"lg:h-32",titleBlockClassName:"w-full",title:r.bannerTitle}),(0,o.Y)("div",null,(0,o.Y)(n.A,{maxWidthClass:"max-w-[1280px]",className:"flex flex-col sm:flex-row items-start sm:justify-end py-6 sm:py-10 lg:!px-20 gap-0 sm:gap-5 lg:gap-[48px]"},d?(0,o.Y)(u,{services:d}):null,d?d.map((e,s)=>(0,o.Y)(m,{key:e.id,service:e,className:"sm:hidden select-none",imgClassName:"bg-secondary-100"})):null)),(0,o.Y)(i.A,{lang:c}))};const h=e=>{let{pageContext:{markupData:s,site:l,lang:t},location:n}=e;return(0,o.Y)(a.Fragment,null,(0,o.Y)(r.c,{title:`${s.head} | ${s.bannerTitle.toUpperCase()}`,description:l.description,siteUrl:l.siteUrl,path:n.pathname,lang:t}))}}}]);
//# sourceMappingURL=component---src-pages-templates-services-tsx-aa50220878541cdcb458.js.map