https://www.chesterzoo.org/_next/static/chunks/5697.bdb3c6374c439907.js

1(self.webpackChunk_N_E=self.webpackChunk_N_E||[]).push([[5697,3939,6173],{25697:function(e,t,a){"use strict";a.r(t),a.d(t,{NonStacked:function(){return n},Reserve:function(){return l},Stacked:function(){return i}});let r={title:"Components/Card Section",component:a(73939).default,parameters:{layout:"fullscreen",backgrounds:{default:"dark"}}};t.default=r;let i={args:{heading:{heading:"Explore the UK’s favourite zoo",headingLevel:"h2",headingCategory:{name:"Parent Tag",link:{path:"/",title:"Parent Tag",target:"_self"}},showTag:!0},text:{markup:"<p>Chester Zoo is home to 37,000 animals and 523 incredible species. At eget netus tellus sodales nulla. Consequat felis lacus sapien lectus.</p>"},cardSectionItems:[{theme:"Green",heading:"Animals & Habitats",image:{url:"/media/hihbg1ye/card-media-image-2.jpeg",name:"Card Media Image 2",width:1280,height:854,altText:"Card Media Image 2"},link:{path:"/",title:"Explore",target:"_self"}},{theme:"Pink",heading:"Daily animal talks",image:{url:"/media/hihbg1ye/card-media-image-2.jpeg",name:"Card Media Image 2",width:1280,height:854,altText:"Card Media Image 2"},link:{path:"/",title:"Explore",target:"_self"}},{theme:"Orange",heading:"Feature 3",image:{url:"/media/hihbg1ye/card-media-image-2.jpeg",name:"Card Media Image 2",width:1280,height:854,altText:"Card Media Image 2"},link:{path:"/",title:"Explore",target:"_self"}},{theme:"Blue",heading:"Feature 4",image:{url:"/media/hihbg1ye/card-media-image-2.jpeg",name:"Card Media Image 2",width:1280,height:854,altText:"Card Media Image 2"},link:{path:"/",title:"Explore",target:"_self"}},{theme:"Khaki",heading:"Feature 5",image:{url:"/media/hihbg1ye/card-media-image-2.jpeg",name:"Card Media Image 2",width:1280,height:854,altText:"Card Media Image 2"},link:{path:"/",title:"Explore",target:"_self"}}],links:[{path:"/visit/day-tickets/",text:"Day tickets",theme:"Primary",title:"Day tickets"}],stackCards:!0}},n={args:{...i.args,cardSectionItems:[{theme:"Green",category:{name:"Category Tag"},heading:"Zoo 1-day ticket",image:{url:"/media/hihbg1ye/card-media-image-2.jpeg",name:"Card Media Image 2",width:1280,height:854,altText:"Card Media Image 2"},list:["Entry to &lsquo;Native: The Incredible World of British Wildlife&rsquo; immersive experience","Islands Lazy River boat ride","Carers and under 12 months go free","Free Parking"],link:{path:"/",title:"Explore",target:"_self"}},{theme:"Pink",category:{name:"Category Tag"},heading:"Zoo 1-day ticket",image:{url:"/media/hihbg1ye/card-media-image-2.jpeg",name:"Card Media Image 2",width:1280,height:854,altText:"Card Media Image 2"},list:["Entry to &lsquo;Native: The Incredible World of British Wildlife&rsquo; immersive experience","Islands Lazy River boat ride","Carers and under 12 months go free","Free Parking"],link:{path:"/",title:"Explore",target:"_self"}},{theme:"Orange",category:{name:"Category Tag"},heading:"Zoo 1-day ticket",image:{url:"/media/hihbg1ye/card-media-image-2.jpeg",name:"Card Media Image 2",width:1280,height:854,altText:"Card Media Image 2"},list:["Entry to &lsquo;Native: The Incredible World of British Wildlife&rsquo; immersive experience","Islands Lazy River boat ride","Carers and under 12 months go free","Free Parking"],link:{path:"/",title:"Explore",target:"_self"}},{theme:"Blue",category:{name:"Category Tag"},heading:"Zoo 1-day ticket",image:{url:"/media/hihbg1ye/card-media-image-2.jpeg",name:"Card Media Image 2",width:1280,height:854,altText:"Card Media Image 2"},list:["Entry to &lsquo;Native: The Incredible World of British Wildlife&rsquo; immersive experience","Islands Lazy River boat ride","Carers and under 12 months go free","Free Parking"],link:{path:"/",title:"Explore",target:"_self"}},{theme:"Khaki",category:{name:"Category Tag"},heading:"Zoo 1-day ticket",image:{url:"/media/hihbg1ye/card-media-image-2.jpeg",name:"Card Media Image 2",width:1280,height:854,altText:"Card Media Image 2"},list:["Entry to &lsquo;Native: The Incredible World of British Wildlife&rsquo; immersive experience","Islands Lazy River boat ride","Carers and under 12 months go free","Free Parking"],link:{path:"/",title:"Explore",target:"_self"}}],stackCards:!1}},l={args:{...n.args,isReserveTheme:!0},parameters:{backgrounds:{default:"reserve"}}}},73939:function(e,t,a){"use strict";a.r(t),a.d(t,{default:function(){return p}});var r=a(57437),i=a(44839),n=a(37776),l=a(66648),s=a(34833),o=a(71686),d=a(54477),c=a(22375),u=a(77220);function g(e){let{theme:t="Green",category:a,heading:n,image:g,list:m,link:h,isStacked:p,isReserveTheme:f=!1}=e;return(0,r.jsxs)("div",{className:(0,i.Z)("card-ticket flex flex-col w-full overflow-hidden",f?"card-ticket--reserve rounded":"card-ticket--".concat(t.toLowerCase()," rounded-3xl")),children:[(0,r.jsxs)("div",{className:"card-ticket__header py-6 px-4",children:[a&&(0,r.jsx)("div",{className:"card-ticket__tag flex mb-2",children:(0,r.jsx)(s.Z,{type:"primary",name:a.name})}),(0,r.jsx)(d.Z,{className:"tracking-[-0.02em]",level:"h4",size:"heading-4",margin:"mb-0",children:n})]}),(0,r.jsxs)("div",{className:"card-ticket__content flex flex-col flex-1 pb-6 px-4",children:[(0,r.jsxs)("div",{className:"grow pt-6",children:[(null==g?void 0:g.url)&&(0,r.jsx)("div",{className:(0,i.Z)("aspect-[23/19] md:aspect-[31/25] lg:aspect-3/2 mb-3 overflow-hidden",p&&"hidden xl:block",f?"rounded":"rounded-lg"),children:(0,r.jsx)(l.default,{className:"w-full h-full object-fit object-cover",src:g.url+"?width=520",alt:g.altText,width:g.width,height:g.height,loading:"lazy"})}),m&&m.length>0&&(0,r.jsx)("ul",{children:m.map((e,t)=>(0,r.jsxs)("li",{className:(0,i.Z)("flex items-center py-3 px-2 border-b border-black/15 last:border-b-0",f?"text-reserve-dark":"text-primary-dark-1"),children:[(0,r.jsx)("span",{className:"grow-0 shrink-0 basis-4",children:(0,r.jsx)(c.Z,{name:"checkmark-1",color:f?"rgb(var(--color-reserve-dark":"rgb(var(--color-primary-dark-1))",size:16})}),(0,r.jsx)("span",{className:"body-sm pl-6",dangerouslySetInnerHTML:{__html:e}})]},t))})]}),h&&(0,r.jsx)("div",{className:"pt-3",children:(0,r.jsx)(o.default,{type:"custom",text:h.title||"Find out more",link:{href:(0,u.n)(h),target:null==h?void 0:h.target}})})]})]})}a(16265);var m=a(83015);a(86173);var h=a(1921);function p(e){var t;let{heading:a,text:l,cardSectionItems:s,stackCards:c,links:p,isReserveTheme:f=!1}=e;return(0,r.jsxs)(h.Z,{className:(0,i.Z)("card-section",c&&"card-section--stacked"),headingExcluded:!(null==a?void 0:a.heading),children:[((null==a?void 0:a.headingCategory)&&a.showTag||(null==a?void 0:a.heading)||(null==l?void 0:l.markup))&&(0,r.jsxs)("header",{className:"container text-center text-balance mb-10 lg:mb-16",children:[(null==a?void 0:a.headingCategory)&&a.showTag&&(0,r.jsx)("div",{className:"flex justify-center mb-2 lg:mb-4",children:(0,r.jsx)(m.Z,{name:a.headingCategory.name,link:a.headingCategory.link,target:null===(t=a.headingCategory.link)||void 0===t?void 0:t.target})}),(null==a?void 0:a.heading)&&(0,r.jsx)(d.Z,{level:null==a?void 0:a.headingLevel,size:"heading-2",margin:"mb-3 lg:mb-4",children:a.heading}),(null==l?void 0:l.markup)&&(0,r.jsx)("div",{className:"body-base max-w-prose mx-auto",dangerouslySetInnerHTML:{__html:l.markup}})]}),s.length>0&&(0,r.jsx)("div",{className:(0,i.Z)(c?"container":"lg:container"),children:c?(0,r.jsx)("div",{className:"flex flex-wrap gap-y-6 md:gap-y-4 justify-center md:-mx-2",children:s.map((e,t)=>(0,r.jsx)("div",{className:"flex w-full md:w-1/2 lg:w-1/3 px-2 md:px-2",children:(0,r.jsx)(g,{theme:e.theme,heading:e.heading,image:e.image,list:e.list,link:e.link,category:e.category,isStacked:c,isReserveTheme:f})},t))}):(0,r.jsx)(n.EmblaCarousel,{options:{active:!c,align:"start",slidesToScroll:1,breakpoints:{"(min-width: 1024px)":{active:!1}}},children:s.map((e,t)=>(0,r.jsx)(n.EmblaCarouselSlide,{children:(0,r.jsx)(g,{theme:e.theme,heading:e.heading,image:e.image,list:e.list,link:e.link,category:e.category,isStacked:c,isReserveTheme:f})},t))})}),p&&(0,r.jsx)("footer",{className:"card-section__footer container flex flex-wrap justify-center gap-2 lg:gap-3 pt-10 lg:pt-16",children:p.map((e,t)=>(0,r.jsx)(o.default,{type:"Primary"===e.theme?"primary/light":f?"secondary/dark":"secondary/light",text:(null==e?void 0:e.text)||e.title,link:{href:(0,u.n)(e),target:null==e?void 0:e.target}},t))})]})}},37776:function(e,t,a){"use strict";a.r(t),a.d(t,{EmblaCarousel:function(){return h},EmblaCarouselSlide:function(){return m}});var r=a(57437),i=a(2265),n=a(74300),l=a(19281),s=a(95243),o=a(30286),d=a(44839);let c=e=>

1{let[t,a]=(0,i.useState)(!0),[r,n]=(0,i.useState)(!0),l=(0,i.useCallback)(()=>{e&&e.scrollPrev()},[e]),s=(0,i.useCallback)(()=>{e&&e.scrollNext()},[e]),o=(0,i.useCallback)(e=>{a(!e.canScrollPrev()),n(!e.canScrollNext())},[]);return(0,i.useEffect)(()=>{e&&(o(e),e.on("reInit",o).on("select",o))},[e,o]),{prevBtnDisabled:t,nextBtnDisabled:r,onPrevButtonClick:l,onNextButtonClick:s}},u=e=>{let{children:t,...a}=e,[n,l]=(0,i.useState)(!1);return(0,r.jsxs)("button",{className:(0,d.Z)("embla__button embla__button--next flex items-center justify-center w-12 h-12 bg-primary-light/75 rounded-full outline-none cursor-pointer pointer-events-auto transition-colors hover:bg-primary-light active:bg-primary-accent disabled:bg-primary-light/50 disabled:pointer-events-none",n&&"!bg-primary-accent"),type:"button",onMouseDown:()=>l(!0),onMouseUp:()=>setTimeout(()=>l(!1),150),onMouseLeave:()=>l(!1),...a,children:[(0,r.jsx)("div",{className:"mr-1",children:(0,r.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"15",height:"24",viewBox:"0 0 15 24",children:(0,r.jsx)("path",{d:"M-1.84048e-06 8.42105L15 0L15 3.53684C15 6.69474 14.3852 6.57895 12.2459 7.74737L4.92787 11.9789L12.3639 16.2526C14.3852 17.3684 15 17.2632 15 20.5895L15 24L-3.39338e-06 15.5263L-1.84048e-06 8.42105Z",fill:"#002526"})})}),t]})},g=e=>{let{children:t,...a}=e,[n,l]=(0,i.useState)(!1);return(0,r.jsxs)("button",{className:(0,d.Z)("embla__button embla__button--next flex items-center justify-center w-12 h-12 bg-primary-light/75 rounded-full outline-none cursor-pointer pointer-events-auto transition-colors hover:bg-primary-light active:bg-primary-accent disabled:bg-primary-light/50 disabled:pointer-events-none",n&&"!bg-primary-accent"),type:"button",onMouseDown:()=>l(!0),onMouseUp:()=>setTimeout(()=>l(!1),150),onMouseLeave:()=>l(!1),...a,children:[(0,r.jsx)("div",{className:"ml-1",children:(0,r.jsx)("svg",{xmlns:"http://www.w3.org/2000/svg",width:"15",height:"24",viewBox:"0 0 15 24",children:(0,r.jsx)("path",{d:"M15 15.5789L0 24L4.22846e-08 20.4632C8.00386e-08 17.3053 0.614754 17.4211 2.7541 16.2526L10.0721 12.0211L2.63606 7.74737C0.614754 6.63158 2.06228e-07 6.73684 2.45996e-07 3.41052L2.8677e-07 0L15 8.47368L15 15.5789Z",fill:"#002526"})})}),t]})};a(31375);let m=(0,i.forwardRef)((e,t)=>(0,r.jsx)("div",{ref:t,className:"embla__slide",...e,children:e.children}));m.displayName="EmblaCarouselSlide";let h=e=>{let{children:t,arrowButtons:a=!1,dotButtons:d=!1,autoScroll:m=null,handleSlideInView:h,onBlur:p,onMouseEnter:f,onArrowButtonClick:x,onPointerDown:v,onPointerUp:b,setApi:y,options:k={}}=e,[j,C]=(0,n.Z)(k,(()=>{let e=[(0,s.Z)()];return m&&e.push((0,l.Z)(m)),e})());(0,i.useEffect)(()=>{C&&y&&y(C)},[C,y]);let{selectedIndex:w,scrollSnaps:N,onDotButtonClick:_}=(0,o.Y)(C),{prevBtnDisabled:I,nextBtnDisabled:E,onPrevButtonClick:T,onNextButtonClick:L}=c(C),S=(0,i.useCallback)(()=>{C&&x&&x(C),T()},[C,x,T]),M=(0,i.useCallback)(()=>{C&&x&&x(C),L()},[C,x,L]),[Z,P]=(0,i.useState)(!1),{isIntersecting:z,ref:R}=function(){var e;let{threshold:t=0,root:a=null,rootMargin:r="0%",freezeOnceVisible:n=!1,initialIsIntersecting:l=!1,onChange:s}=arguments.length>0&&void 0!==arguments[0]?arguments[0]:{},[o,d]=(0,i.useState)(null),[c,u]=(0,i.useState)(()=>({isIntersecting:l,entry:void 0})),g=(0,i.useRef)();g.current=s;let m=(null===(e=c.entry)||void 0===e?void 0:e.isIntersecting)&&n;(0,i.useEffect)(()=>{let e;if(!o||!("IntersectionObserver"in window)||m)return;let i=new IntersectionObserver(t=>{let a=Array.isArray(i.thresholds)?i.thresholds:[i.thresholds];t.forEach(t=>{let r=t.isIntersecting&&a.some(e=>t.intersectionRatio>=e);u({isIntersecting:r,entry:t}),g.current&&g.current(r,t),r&&n&&e&&(e(),e=void 0)})},{threshold:t,root:a,rootMargin:r});return i.observe(o),()=>{i.disconnect()}},[o,JSON.stringify(t),a,r,m,n]);let h=(0,i.useRef)(null);(0,i.useEffect)(()=>{var e;o||null===(e=c.entry)||void 0===e||!e.target||n||m||h.current===c.entry.target||(h.current=c.entry.target,u({isIntersecting:l,entry:void 0}))},[o,c.entry,n,m,l]);let p=[d,!!c.isIntersecting,c.entry];return p.ref=p[0],p.isIntersecting=p[1],p.entry=p[2],p}();return(0,i.useEffect)(()=>{var e;if(!m)return;let t=null==C?void 0:null===(e=C.plugins())||void 0===e?void 0:e.autoScroll;t&&(z?(P(!0),t.play()):(P(!1),t.stop()))},[m,C,z]),(0,i.useEffect)(()=>{var e;let t=null==C?void 0:null===(e=C.plugins())||void 0===e?void 0:e.autoScroll;t&&(P(t.isPlaying()),C.on("autoScroll:play",()=>P(!0)).on("autoScroll:stop",()=>P(!1)).on("reInit",()=>P(t.isPlaying())))},[C]),(0,i.useEffect)(()=>{h&&C&&C.on("slidesInView",()=>{h(C.slidesInView())})},[h,C]),(0,i.useEffect)(()=>

1{if(!p||!C)return;let e=C.rootNode(),t=()=>p(C),a=t=>{e.contains(t.relatedTarget)||p(C)};return e.addEventListener("mouseleave",t),e.addEventListener("focusout",a),()=>{e.removeEventListener("mouseleave",t),e.removeEventListener("focusout",a)}},[p,C]),(0,i.useEffect)(()=>{if(!f||!C)return;let e=C.rootNode(),t=()=>f(C);return e.addEventListener("mouseenter",t),()=>{e.removeEventListener("mouseenter",t)}},[f,C]),(0,i.useEffect)(()=>{if(!v||!C)return;let e=()=>v(C);return C.on("pointerDown",e),()=>{C.off("pointerDown",e)}},[v,C]),(0,i.useEffect)(()=>{if(!b||!C)return;let e=()=>b(C);return C.on("pointerUp",e),()=>{C.off("pointerUp",e)}},[b,C]),(0,r.jsxs)("div",{className:"embla",ref:R,children:[(0,r.jsx)("div",{className:"embla__viewport",ref:j,children:(0,r.jsx)("div",{className:"embla__container",children:t})}),(d||a)&&(0,r.jsxs)("div",{className:"embla__controls",children:[a&&(0,r.jsxs)("div",{className:"embla__buttons absolute top-1/2 left-0 max-w-container justify-between w-full px-10 pointer-events-none -translate-y-1/2",children:[(0,r.jsx)(u,{onClick:S,disabled:I}),(0,r.jsx)(g,{onClick:M,disabled:E})]}),d&&(0,r.jsx)("div",{className:"embla__dots",children:N.map((e,t)=>(0,r.jsx)(o.H,{className:"embla__dot".concat(t===w?" embla__dot--selected":""),onClick:()=>_(t)},t))})]})]})}},30286:function(e,t,a){"use strict";a.d(t,{H:function(){return l},Y:function(){return n}});var r=a(57437),i=a(2265);let n=e=>{let[t,a]=(0,i.useState)(0),[r,n]=(0,i.useState)([]),l=(0,i.useCallback)(t=>{e&&e.scrollTo(t)},[e]),s=(0,i.useCallback)(e=>{n(e.scrollSnapList())},[]),o=(0,i.useCallback)(e=>{a(e.selectedScrollSnap())},[]);return(0,i.useEffect)(()=>{e&&(s(e),o(e),e.on("reInit",s).on("reInit",o).on("select",o))},[e,s,o]),{selectedIndex:t,scrollSnaps:r,onDotButtonClick:l}},l=e=>{let{children:t,...a}=e;return(0,r.jsx)("button",{type:"button",...a,children:t})}},1921:function(e,t,a){"use strict";var r=a(57437),i=a(44839);t.Z=e=>{let{children:t,className:a,headingExcluded:n,style:l,hidePaddingOnMobile:s}=e;return(0,r.jsx)("div",{className:(0,i.Z)("component-section",n&&"heading-excluded",s&&"hide-padding-on-mobile",a),style:l,children:t})}},34833:function(e,t,a){"use strict";a.d(t,{Z:function(){return i}});var r=a(57437);function i(e){let{type:t="primary",name:a}=e;return(0,r.jsx)("div",{className:"category-tag category-tag--".concat(t," relative flex items-center py-[2px] px-1 rounded"),children:(0,r.jsx)("span",{className:"category-tag-text font-czoo-sharp-grotesk text-sm leading-[0.875rem] uppercase tracking-wider",children:a})})}a(25592)},83015:function(e,t,a){"use strict";a.d(t,{Z:function(){return s}});var r=a(57437),i=a(87138),n=a(44839),l=a(77220);function s(e){let{name:t,link:a,target:s="_self"}=e,o=(0,n.Z)("parent-tag relative flex items-center py-1",a&&"pl-6 pr-2",!a&&"px-2","rounded transition-colors focus:outline focus:outline-1 focus:outline-offset-2");return(0,r.jsx)(r.Fragment,{children:a?(0,r.jsxs)(i.default,{className:o,href:(0,l.n)(a),target:s,children:[(0,r.jsx)("span",{className:"parent-tag-icon absolute top-1/2 left-2 w-[11px] h-3 bg-center bg-cover bg-no-repeat -translate-y-2/4"}),(0,r.jsx)("span",{className:"parent-tag-text font-czoo-sharp-grotesk text-base leading-4 uppercase tracking-wider",children:t})]}):(0,r.jsx)("div",{className:o,children:(0,r.jsx)("span",{className:"parent-tag-text font-czoo-sharp-grotesk text-base leading-4 uppercase tracking-wider",children:t})})})}a(99033)},86173:function(){},31375:function(){},16265:function(){},25592:function(){},99033:function(){}}]);