https://armenia.travel/_next/static/chunks/9842.f67f8619f61db98c.js

1"use strict";(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[9842],{29842:(a,t,r)=>{r.r(t),r.d(t,{default:()=>x});var e=r(37876),i=r(14232),s=r(96941),n=r(30458),o=r(83959),d=r(34129),p=r(60295),m=r(8409),l=r(26335),b=r(23009);let c=r(21626).Ay.div.withConfig({componentId:"sc-cb9a0db3-0"})(["--tabsWrapMarginBottom:var(--sp9x);--tabIconSizes:var(--sp4x);--tabIconMarginRight:var(--sp2x);--tabItemMarginBottom:var(--sp6x);--tabPadding:var(--sp3x) var(--sp8x);--tabsWrapPadding:var(--sp2x);--tabsWrapBorderRadius:var(--sp8x);--tabsItemTextPadding:var(--sp4x) var(--sp1x);--tabsMarginLeft:0;overflow:hidden;.tabs-main-wrap{overflow:scroll hidden;display:flex;justify-content:center;margin-left:var(--tabsMarginLeft);-ms-overflow-style:none;scrollbar-width:none;&::-webkit-scrollbar{display:none;}.tabs-wrap{position:relative;display:inline-flex;white-space:nowrap;margin-bottom:var(--tabsWrapMarginBottom);background-color:var(--primaryColor3);border-radius:var(--tabsWrapBorderRadius);padding:var(--tabsWrapPadding);.active-tab{position:absolute;top:var(--tabsWrapPadding);left:0;bottom:var(--tabsWrapPadding);z-index:1;border-radius:var(--tabsWrapBorderRadius);}.tab{display:flex;align-items:center;padding:var(--tabPadding);cursor:pointer;&.active{.tab-icon{color:var(--primaryColor3);}.tab-text{color:var(--primaryColor3);}}&:last-child{margin-right:0;}.tab-icon{font-size:var(--tabIconSizes);margin-right:var(--tabIconMarginRight);z-index:2;transition:var(--trTime);}.tab-text{z-index:2;transition:var(--trTime);}}}}.main-container{display:flex;flex-direction:column;align-items:center;.tab-items-container{margin-bottom:calc(-1 * var(--tabItemMarginBottom));}}.tab-item-wrap-div{display:flex;flex-direction:column;height:100%;}.tab-item{height:100%;display:block;background-color:var(--primaryColor3);margin-bottom:var(--tabItemMarginBottom);border-radius:var(--sp2x);@media (hover:hover){&:hover{.tab-item-image{span{img{transform:scale(1.3);}}}}}.tab-item-image{padding-top:70.3%;overflow:hidden;border-radius:var(--sp2x);isolation:isolate;span{img{border-radius:var(--sp2x) var(--sp2x) 0 0;}}}.tab-item-text{text-align:center;padding:var(--tabsItemTextPadding);}}@media (min-width:",") and (max-width:","){--tabsWrapMarginBottom:var(--sp8x);--tabIconSizes:var(--sp3x);--tabIconMarginRight:var(--sp1x);

1--tabItemMarginBottom:var(--sp5x);--tabPadding:var(--sp2x) var(--sp5x);--tabsWrapPadding:var(--sp1x);--tabsItemTextPadding:var(--sp3x) var(--sp1x);}@media (min-width:",") and (max-width:","){--tabsWrapMarginBottom:var(--sp7x);--tabIconSizes:var(--sp3x);--tabIconMarginRight:var(--sp2x);--tabItemMarginBottom:var(--sp4x);--tabPadding:var(--sp2x) var(--sp4x);--tabsWrapPadding:var(--sp1x);--tabsItemTextPadding:var(--sp3x) var(--sp1x);}@media (min-width:",") and (max-width:","){--tabsWrapMarginBottom:var(--sp6x);--tabIconSizes:var(--sp3x);--tabIconMarginRight:var(--sp1x);--tabItemMarginBottom:var(--sp4x);--tabPadding:var(--sp2x) var(--sp5x);--tabsWrapPadding:var(--sp1x);--tabsItemTextPadding:var(--sp3x) var(--sp1x);}@media (min-width:",") and (max-width:","){--tabsWrapMarginBottom:var(--sp6x);--tabIconSizes:var(--sp3x);--tabIconMarginRight:var(--sp1x);--tabItemMarginBottom:var(--sp4x);--tabPadding:var(--sp2x) var(--sp4x);--tabsWrapPadding:var(--sp1x);--tabsItemTextPadding:var(--sp3x) var(--sp1x);--tabsMarginLeft:var(--sp13x);.tabs-main-wrap{justify-content:flex-start;}}@media (min-width:",") and (max-width:","){--tabsWrapMarginBottom:var(--sp4x);--tabIconSizes:var(--sp3x);--tabIconMarginRight:var(--sp1x);

1--tabItemMarginBottom:var(--sp3x);--tabPadding:var(--sp2x) var(--sp4x);--tabsWrapPadding:0;--tabsItemTextPadding:var(--sp3x) var(--sp1x);--tabsMarginLeft:var(--sp8x);.tabs-main-wrap{justify-content:flex-start;}}@media (min-width:",") and (max-width:","){--tabsWrapMarginBottom:var(--sp4x);--tabIconSizes:var(--sp3x);--tabIconMarginRight:var(--sp1x);--tabItemMarginBottom:var(--sp3x);--tabPadding:var(--sp2x) var(--sp4x);--tabsWrapPadding:0;--tabsItemTextPadding:var(--sp3x) var(--sp1x);--tabsMarginLeft:var(--sp8x);.tabs-main-wrap{justify-content:flex-start;}}@media (max-width:","){--tabsWrapMarginBottom:var(--sp3x);--tabIconSizes:var(--sp1-5x);--tabIconMarginRight:var(--sp1x);--tabItemMarginBottom:var(--sp3x);--tabPadding:var(--sp2x) var(--sp3x);--tabsWrapPadding:0;--tabsItemTextPadding:var(--sp3x) var(--sp1x);--tabsMarginLeft:var(--sp2x);.tabs-main-wrap{justify-content:flex-start;}}"],a=>{let{theme:t}=a;return t.mediaQuery.DesktopSizeL},a=>{let{theme:t}=a;return t.mediaQuery.DesktopSizeXLMin},a=>{let{theme:t}=a;return t.mediaQuery.DesktopSizeM},a=>{let{theme:t}=a;return t.mediaQuery.DesktopSizeLMin},a=>{let{theme:t}=a;return t.mediaQuery.DesktopSizeS},a=>{let{theme:t}=a;return t.mediaQuery.DesktopSizeMMin},a=>{let{theme:t}=a;return t.mediaQuery.DesktopSizeXS},a=>{let{theme:t}=a;return t.mediaQuery.DesktopSizeSMin},a=>{let{theme:t}=a;return t.mediaQuery.TabletSize},a=>{let{theme:t}=a;return t.mediaQuery.DesktopSizeXSMin},a=>{let{theme:t}=a;return t.mediaQuery.TabletSizeS},a=>{let{theme:t}=a;return t.mediaQuery.TabletSizeMin},a=>{let{theme:t}=a;return t.mediaQuery.TabletSizeSMin}),x=(0,n.c0)(a=>{let{tabs:t,winWidth:r}=a,[n,x]=(0,i.useState)(-1),v=(0,i.useRef)([]),g=(0,i.useRef)(),u=(0,i.useRef)(),f=(0,i.useRef)(-1),h=(0,i.useRef)(0),M=(0,i.useRef)([]),I=(0,i.useRef)();(0,i.useEffect)(()=>{I.current=n},[n]);let w=(0,i.useMemo)(()=>{var a,r;return M.current=[],null==(r=t[n<0?0:n])||null==(a=r.children)?void 0:a.map((a,t)=>{var r,i;return(0,e.jsx)("div",{ref:a=>M.current[t]=a,className:"col-4 col-ts-6 col-m-12",children:(0,e.jsx)("div",{className:"tab-item-wrap-div",children:(0,e.jsxs)(l.A,{url:"".concat(a.slug),className:"tab-item",children:[(0,e.jsx)(p.A,{src:null==(r=a.featured_image)?void 0:r.url,alt:null==(i=a.featured_image)?void 0:i.alt,objectFit:"cover",className:"tab-item-image"}),(0,e.jsx)(o.A,{className:"h6 tab-item-text font-soundscape-bold",text:a.name})]})})},a.id)})},[n,t]),y=(0,i.useMemo)(()=>t.map((a,t)=>(0,e.jsxs)("div",{className:"tab ".concat(n===t?"active":""),onClick:()=>{f.current=n,x(t)},ref:a=>v.current[t]=a,children:[(0,e.jsx)(d.A,{name:a.icon,className:"tab-icon"}),(0,e.jsx)(o.A,{className:"p tab-text font-ping-bold",text:a.name})]},t)),[t,n]);(0,i.useEffect)(()=>{if(n>=0){let a=Math.abs(h.current),t=u.current.getBoundingClientRect(),r=t.left,e=t.right,i=v.current[n].getBoundingClientRect(),o=i.left-r+a,d=e-i.right-a,p=f.current>n;s.Ay.to(g.current,{left:o,delay:!p&&.2}),s.Ay.to(g.current,{right:d,delay:p&&.2})}},[n,r]);let P=(0,i.useCallback)(()=>{h.current=u.current.scrollLeft},[]);(0,i.useEffect)(()=>{var a;return null==(a=u.current)||a.addEventListener("scroll",P),x(0),()=>{u.current&&u.current.removeEventListener("scroll",P)}},[]);let S=(0,i.useMemo)(()=>(0,e.jsx)(b.default,{dependency:n,stagger:.06,params:{bottomToTop:[M]}}),[n]);return(0,e.jsxs)(c,{children:[(0,e.jsx)("div",{className:"tabs-main-wrap",children:(0,e.jsxs)("div",{className:"tabs-wrap",ref:u,children:[(0,e.jsx)("div",{className:"active-tab bgCobalt active-tab-".concat(n),ref:g}),y]})}),(0,e.jsx)(m.A,{className:"main-container",section:!0,children:(0,e.jsxs)(m.A,{className:"tab-items-container",full:!0,row:!0,children:[S,w]})})]})},["winWidth"])}}]);
2//# sourceMappingURL=9842.f67f8619f61db98c.js.map